Ark/bulma
1
0
Fork 0
mirror of https://github.com/jgthms/bulma synced 2026-03-18 11:24:29 -07:00
Code Issues Packages Projects Releases Wiki Activity

Add show code

Browse Source
This commit is contained in:
Jeremy Thomas
2017-10-09 12:27:08 +01:00
parent 2c15a21f41
commit 8d6a0a43dc
4 changed files with 252 additions and 2 deletions
Download Patch File Download Diff File Expand all files Collapse all files

177
docs/css/bulma-docs.css
View File

@@ -8972,12 +8972,15 @@ label.panel-block:hover {
<<<<<<< HEAD
<<<<<<< HEAD
<<<<<<< HEAD
<<<<<<< HEAD
=======
>>>>>>> Update expo
=======
>>>>>>> Use link instead of primary
=======
>>>>>>> Add love data
=======
>>>>>>> Add show code
=======
box-shadow: 0 1px 0 rgba(219, 219, 219, 0.3);
>>>>>>> Use link instead of primary
@@ -9031,7 +9034,12 @@ label.panel-block:hover {
=======
box-shadow: 0 1px 0 rgba(219, 219, 219, 0.3);
>>>>>>> Add love data
<<<<<<< HEAD
>>>>>>> Add love data
=======
=======
>>>>>>> Add show code
>>>>>>> Add show code
}
.hero .tabs ul {
@@ -9066,6 +9074,7 @@ label.panel-block:hover {
<<<<<<< HEAD
<<<<<<< HEAD
<<<<<<< HEAD
<<<<<<< HEAD
=======
>>>>>>> Update expo
@media screen and (max-width: 1023px) {
@@ -9090,6 +9099,8 @@ label.panel-block:hover {
@media screen and (max-width: 1023px) {
.hero.is-white .navbar-menu {
=======
=======
>>>>>>> Add show code
@media screen and (max-width: 1023px) {
.hero.is-white .navbar-menu {
=======
@@ -9100,7 +9111,14 @@ label.panel-block:hover {
@media screen and (max-width: 768px) {
.hero.is-white .nav-menu {
>>>>>>> Use link instead of primary
<<<<<<< HEAD
>>>>>>> Use link instead of primary
=======
=======
@media screen and (max-width: 1023px) {
.hero.is-white .navbar-menu {
>>>>>>> Add show code
>>>>>>> Add show code
background-color: white;
}
}
@@ -9182,10 +9200,13 @@ label.panel-block:hover {
<<<<<<< HEAD
<<<<<<< HEAD
<<<<<<< HEAD
<<<<<<< HEAD
=======
>>>>>>> Update expo
=======
>>>>>>> Use link instead of primary
=======
>>>>>>> Add show code
@media screen and (max-width: 1023px) {
.hero.is-black .navbar-menu {
=======
@@ -9211,6 +9232,10 @@ label.panel-block:hover {
=======
>>>>>>> Use link instead of primary
>>>>>>> Use link instead of primary
=======
@media screen and (max-width: 1023px) {
.hero.is-black .navbar-menu {
>>>>>>> Add show code
background-color: #0a0a0a;
}
}
@@ -9292,6 +9317,7 @@ label.panel-block:hover {
<<<<<<< HEAD
<<<<<<< HEAD
<<<<<<< HEAD
<<<<<<< HEAD
=======
>>>>>>> Update expo
@media screen and (max-width: 1023px) {
@@ -9316,6 +9342,8 @@ label.panel-block:hover {
@media screen and (max-width: 1023px) {
.hero.is-light .navbar-menu {
=======
=======
>>>>>>> Add show code
@media screen and (max-width: 1023px) {
.hero.is-light .navbar-menu {
=======
@@ -9326,7 +9354,14 @@ label.panel-block:hover {
@media screen and (max-width: 768px) {
.hero.is-light .nav-menu {
>>>>>>> Use link instead of primary
<<<<<<< HEAD
>>>>>>> Use link instead of primary
=======
=======
@media screen and (max-width: 1023px) {
.hero.is-light .navbar-menu {
>>>>>>> Add show code
>>>>>>> Add show code
background-color: whitesmoke;
}
}
@@ -9408,6 +9443,7 @@ label.panel-block:hover {
<<<<<<< HEAD
<<<<<<< HEAD
<<<<<<< HEAD
<<<<<<< HEAD
@media screen and (max-width: 1023px) {
.hero.is-dark .navbar-menu {
=======
@@ -9438,6 +9474,8 @@ label.panel-block:hover {
@media screen and (max-width: 1023px) {
.hero.is-dark .navbar-menu {
=======
=======
>>>>>>> Add show code
@media screen and (max-width: 1023px) {
.hero.is-dark .navbar-menu {
=======
@@ -9448,7 +9486,14 @@ label.panel-block:hover {
@media screen and (max-width: 768px) {
.hero.is-dark .nav-menu {
>>>>>>> Use link instead of primary
<<<<<<< HEAD
>>>>>>> Use link instead of primary
=======
=======
@media screen and (max-width: 1023px) {
.hero.is-dark .navbar-menu {
>>>>>>> Add show code
>>>>>>> Add show code
background-color: #363636;
}
}
@@ -9530,6 +9575,9 @@ label.panel-block:hover {
<<<<<<< HEAD
<<<<<<< HEAD
<<<<<<< HEAD
<<<<<<< HEAD
=======
>>>>>>> Add show code
@media screen and (max-width: 1023px) {
.hero.is-primary .navbar-menu {
=======
@@ -9544,6 +9592,7 @@ label.panel-block:hover {
@media screen and (max-width: 1023px) {
.hero.is-primary .navbar-menu {
>>>>>>> Add show code
<<<<<<< HEAD
=======
@media screen and (max-width: 1023px) {
.hero.is-primary .navbar-menu {
@@ -9571,6 +9620,8 @@ label.panel-block:hover {
.hero.is-primary .nav-menu {
>>>>>>> Use link instead of primary
>>>>>>> Use link instead of primary
=======
>>>>>>> Add show code
background-color: #00d1b2;
}
}
@@ -9628,6 +9679,7 @@ label.panel-block:hover {
<<<<<<< HEAD
<<<<<<< HEAD
<<<<<<< HEAD
<<<<<<< HEAD
.hero.is-info {
=======
@media screen and (max-width: 768px) {
@@ -9652,6 +9704,8 @@ label.panel-block:hover {
=======
=======
>>>>>>> Add link color
=======
>>>>>>> Add show code
.hero.is-link {
=======
.hero.is-info {
@@ -9660,6 +9714,8 @@ label.panel-block:hover {
>>>>>>> Add show code
=======
=======
=======
>>>>>>> Add show code
.hero.is-info {
=======
@media screen and (max-width: 768px) {
@@ -9677,6 +9733,8 @@ label.panel-block:hover {
}
}
=======
>>>>>>> Add show code
.hero.is-link {
>>>>>>> Add link color
>>>>>>> Add link color
@@ -9703,6 +9761,7 @@ label.panel-block:hover {
color: #fff;
}
<<<<<<< HEAD
<<<<<<< HEAD
@media screen and (max-width: 1023px) {
<<<<<<< HEAD
@@ -9741,19 +9800,30 @@ label.panel-block:hover {
@media screen and (max-width: 768px) {
.hero.is-link .nav-menu {
=======
@media screen and (max-width: 1023px) {
.hero.is-link .navbar-menu {
>>>>>>> Add show code
background-color: #3273dc;
}
}
.hero.is-link a.nav-item,
.hero.is-link .nav-item a:not(.button) {
.hero.is-link .navbar-item,
.hero.is-link .navbar-link {
color: rgba(255, 255, 255, 0.7);
}
<<<<<<< HEAD
.hero.is-link a.nav-item:hover, .hero.is-link a.nav-item.is-active,
.hero.is-link .nav-item a:not(.button):hover,
.hero.is-link .nav-item a:not(.button).is-active {
>>>>>>> Add link color
=======
.hero.is-link a.navbar-item:hover, .hero.is-link a.navbar-item.is-active,
.hero.is-link .navbar-link:hover,
.hero.is-link .navbar-link.is-active {
background-color: #2366d1;
>>>>>>> Add show code
color: #fff;
}
@@ -9790,6 +9860,7 @@ label.panel-block:hover {
@media screen and (max-width: 768px) {
<<<<<<< HEAD
<<<<<<< HEAD
<<<<<<< HEAD
.hero.is-link.is-bold .navbar-menu {
=======
@@ -9798,10 +9869,14 @@ label.panel-block:hover {
=======
.hero.is-link.is-bold .nav-menu {
>>>>>>> Add link color
=======
.hero.is-link.is-bold .navbar-menu {
>>>>>>> Add show code
background-image: linear-gradient(141deg, #1577c6 0%, #3273dc 71%, #4366e5 100%);
}
}
<<<<<<< HEAD
<<<<<<< HEAD
<<<<<<< HEAD
=======
@@ -9821,6 +9896,8 @@ label.panel-block:hover {
}
>>>>>>> Add link color
=======
>>>>>>> Add show code
.hero.is-info {
background-color: #209cee;
color: #fff;
@@ -9849,6 +9926,7 @@ label.panel-block:hover {
<<<<<<< HEAD
<<<<<<< HEAD
<<<<<<< HEAD
<<<<<<< HEAD
@media screen and (max-width: 1023px) {
.hero.is-info .navbar-menu {
=======
@@ -9885,6 +9963,8 @@ label.panel-block:hover {
background-color: #209cee;
>>>>>>> Add link color
=======
=======
>>>>>>> Add show code
@media screen and (max-width: 1023px) {
.hero.is-info .navbar-menu {
<<<<<<< HEAD
@@ -9907,6 +9987,10 @@ label.panel-block:hover {
=======
=======
=======
=======
@media screen and (max-width: 1023px) {
.hero.is-info .navbar-menu {
>>>>>>> Add show code
background-color: #209cee;
>>>>>>> Add link color
>>>>>>> Add link color
@@ -9923,9 +10007,19 @@ label.panel-block:hover {
.hero.is-info .navbar-link:hover,
.hero.is-info .navbar-link.is-active {
<<<<<<< HEAD
<<<<<<< HEAD
=======
background-color: #118fe4;
=======
<<<<<<< HEAD
>>>>>>> Add show code
background-color: #2366d1;
=======
background-color: #118fe4;
>>>>>>> Add show code
<<<<<<< HEAD
=======
>>>>>>> Add show code
>>>>>>> Add show code
color: #fff;
}
@@ -9964,6 +10058,7 @@ label.panel-block:hover {
@media screen and (max-width: 768px) {
<<<<<<< HEAD
<<<<<<< HEAD
<<<<<<< HEAD
<<<<<<< HEAD
.hero.is-info.is-bold .navbar-menu {
background-image: linear-gradient(141deg, #1577c6 0%, #3273dc 71%, #4366e5 100%);
@@ -9974,6 +10069,8 @@ label.panel-block:hover {
=======
=======
>>>>>>> Add link color
=======
>>>>>>> Add show code
.hero.is-info.is-bold .navbar-menu {
<<<<<<< HEAD
background-image: linear-gradient(141deg, #04a6d7 0%, #209cee 71%, #3287f5 100%);
@@ -9987,7 +10084,14 @@ label.panel-block:hover {
=======
>>>>>>> Add link color
>>>>>>> Add link color
<<<<<<< HEAD
>>>>>>> Add link color
=======
=======
.hero.is-info.is-bold .navbar-menu {
background-image: linear-gradient(141deg, #04a6d7 0%, #209cee 71%, #3287f5 100%);
>>>>>>> Add show code
>>>>>>> Add show code
}
}
@@ -10021,8 +10125,11 @@ label.panel-block:hover {
<<<<<<< HEAD
<<<<<<< HEAD
<<<<<<< HEAD
<<<<<<< HEAD
=======
>>>>>>> Update expo
=======
>>>>>>> Add show code
@media screen and (max-width: 1023px) {
.hero.is-success .navbar-menu {
=======
@@ -10056,6 +10163,10 @@ label.panel-block:hover {
.hero.is-success .nav-menu {
>>>>>>> Use link instead of primary
>>>>>>> Use link instead of primary
=======
@media screen and (max-width: 1023px) {
.hero.is-success .navbar-menu {
>>>>>>> Add show code
background-color: #23d160;
}
}
@@ -10137,6 +10248,9 @@ label.panel-block:hover {
<<<<<<< HEAD
<<<<<<< HEAD
<<<<<<< HEAD
<<<<<<< HEAD
=======
>>>>>>> Add show code
@media screen and (max-width: 1023px) {
.hero.is-warning .navbar-menu {
=======
@@ -10151,6 +10265,7 @@ label.panel-block:hover {
@media screen and (max-width: 1023px) {
.hero.is-warning .navbar-menu {
>>>>>>> Add show code
<<<<<<< HEAD
=======
@media screen and (max-width: 1023px) {
.hero.is-warning .navbar-menu {
@@ -10178,6 +10293,8 @@ label.panel-block:hover {
.hero.is-warning .nav-menu {
>>>>>>> Use link instead of primary
>>>>>>> Use link instead of primary
=======
>>>>>>> Add show code
background-color: #ffdd57;
}
}
@@ -10259,10 +10376,13 @@ label.panel-block:hover {
<<<<<<< HEAD
<<<<<<< HEAD
<<<<<<< HEAD
<<<<<<< HEAD
=======
>>>>>>> Update expo
=======
>>>>>>> Use link instead of primary
=======
>>>>>>> Add show code
@media screen and (max-width: 1023px) {
.hero.is-danger .navbar-menu {
=======
@@ -10288,6 +10408,10 @@ label.panel-block:hover {
=======
>>>>>>> Use link instead of primary
>>>>>>> Use link instead of primary
=======
@media screen and (max-width: 1023px) {
.hero.is-danger .navbar-menu {
>>>>>>> Add show code
background-color: #ff3860;
}
}
@@ -11513,6 +11637,14 @@ html.route-index #carbon {
margin-bottom: 1.5rem;
}
.bd-example + .bd-highlight-clipped {
margin-top: -1.5rem;
}
.bd-example + .bd-highlight-clipped:not(:last-child) {
margin-bottom: 1.5rem;
}
.bd-snippet {
border: 1px solid #ffdd57;
margin-top: 2rem;
@@ -12162,6 +12294,47 @@ html.route-index #carbon {
}
}
.bd-highlight-clipped .bd-show {
bottom: 0;
left: 0;
position: absolute;
right: 0;
top: 0;
align-items: center;
background-color: rgba(0, 0, 0, 0.9);
background-image: linear-gradient(transparent, transparent 90%, black);
border: none;
color: white;
cursor: pointer;
display: none;
font-size: 1rem;
justify-content: center;
opacity: 0.7;
width: 100%;
}
.bd-highlight-clipped .bd-show strong {
color: currentColor;
font-weight: 600;
}
.bd-highlight-clipped .bd-show:hover {
opacity: 0.8;
}
.bd-highlight-clipped .highlight.bd-is-clipped {
height: 4em;
overflow: hidden;
}
.bd-highlight-clipped .highlight.bd-is-clipped pre {
overflow: hidden;
}
.bd-highlight-clipped .highlight.bd-is-clipped .bd-show {
display: flex;
}
@media screen and (min-width: 769px), print {
.section:not(.is-fullwidth) > .bd-example:not(.is-fullwidth) {
margin-left: 1.5rem;