Improve snippet

This commit is contained in:
Jeremy Thomas
2017-10-09 15:38:12 +01:00
parent 02f7b216f1
commit 1f5f9dc54b
5 changed files with 53 additions and 73 deletions

View File

@@ -10565,14 +10565,6 @@ 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;
@@ -10607,8 +10599,11 @@ html.route-index #carbon {
}
.bd-snippet-code.bd-is-more.bd-is-more-clipped .highlight .bd-show {
<<<<<<< HEAD
display: -webkit-box;
display: -ms-flexbox;
=======
>>>>>>> Improve snippet
display: flex;
}
@@ -10661,7 +10656,12 @@ html.route-index #carbon {
>>>>>>> Use link instead of primary
=======
align-items: stretch;
<<<<<<< HEAD
>>>>>>> Add love data
=======
border-radius: 5px;
border-top-left-radius: 0;
>>>>>>> Improve snippet
display: flex;
justify-content: center;
}
@@ -10685,6 +10685,7 @@ html.route-index #carbon {
display: -ms-flexbox;
=======
align-items: stretch;
<<<<<<< HEAD
>>>>>>> Use link instead of primary
=======
-webkit-box-align: stretch;
@@ -10706,6 +10707,9 @@ html.route-index #carbon {
=======
align-items: stretch;
>>>>>>> Add love data
=======
border-radius: 0 5px 5px 0;
>>>>>>> Improve snippet
display: flex;
flex-direction: column;
}
@@ -10837,6 +10841,7 @@ html.route-index #carbon {
}
.highlight .bd-show {
<<<<<<< HEAD
bottom: 0;
left: 0;
position: absolute;
@@ -10874,44 +10879,38 @@ html.route-index #carbon {
}
.bd-highlight-clipped .bd-show {
=======
>>>>>>> Improve snippet
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);
background-color: rgba(245, 245, 245, 0.7);
border: none;
color: white;
color: rgba(0, 0, 0, 0.5);
cursor: pointer;
display: none;
font-size: 1rem;
font-size: 0.75rem;
justify-content: center;
opacity: 0.7;
width: 100%;
}
.bd-highlight-clipped .bd-show strong {
.highlight .bd-show strong {
color: currentColor;
font-weight: 600;
}
.bd-highlight-clipped .bd-show:hover {
opacity: 0.8;
.highlight .bd-show:hover {
background-color: rgba(255, 221, 87, 0.8);
color: rgba(0, 0, 0, 0.7);
}
.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 {
.highlight pre {
white-space: pre-wrap;
}
}
@media screen and (min-width: 769px), print {