Fix before and after selectors
This commit is contained in:
Jeremy Thomas
parent
292fd8ac4f
commit
8baa6cc6dc
8 changed files with 60 additions and 60 deletions
|
|
@ -49,7 +49,7 @@
|
|||
color: $text-strong
|
||||
display: inline
|
||||
font-weight: $weight-bold
|
||||
&:after
|
||||
&::after
|
||||
content: " — "
|
||||
.default-description
|
||||
display: inline
|
||||
|
|
|
|||
|
|
@ -3,7 +3,7 @@
|
|||
.bd-snippet
|
||||
border: 1px solid $yellow
|
||||
position: relative
|
||||
&:before
|
||||
&::before
|
||||
background: $yellow
|
||||
border-radius: $radius $radius 0 0
|
||||
bottom: 100%
|
||||
|
|
@ -150,14 +150,14 @@ $structure-invert: $danger-invert
|
|||
border-color: $structure
|
||||
border-radius: $radius
|
||||
padding: 1.5rem
|
||||
&:before
|
||||
&::before
|
||||
background: $structure
|
||||
color: $structure-invert
|
||||
content: "Structure"
|
||||
|
||||
.bd-structure-item
|
||||
position: relative
|
||||
&:before
|
||||
&::before
|
||||
+overlay
|
||||
background: rgba($black, 0.7)
|
||||
background: $background
|
||||
|
|
@ -165,7 +165,7 @@ $structure-invert: $danger-invert
|
|||
content: ""
|
||||
display: block
|
||||
z-index: 1
|
||||
&:after
|
||||
&::after
|
||||
+overlay
|
||||
align-items: center
|
||||
content: attr(title)
|
||||
|
|
@ -177,7 +177,7 @@ $structure-invert: $danger-invert
|
|||
z-index: 2
|
||||
&.bd-is-structure-container
|
||||
padding: 1.5rem 0.75rem 0.75rem
|
||||
&:after
|
||||
&::after
|
||||
align-items: flex-start
|
||||
justify-content: flex-start
|
||||
padding: 0.5rem 0.75rem
|
||||
|
|
|
|||
|
|
@ -61,7 +61,7 @@
|
|||
width: 20px;
|
||||
}
|
||||
|
||||
.delete:before, .modal-close:before, .delete:after, .modal-close:after {
|
||||
.delete::before, .modal-close::before, .delete::after, .modal-close::after {
|
||||
background-color: white;
|
||||
content: "";
|
||||
display: block;
|
||||
|
|
@ -72,12 +72,12 @@
|
|||
transform-origin: center center;
|
||||
}
|
||||
|
||||
.delete:before, .modal-close:before {
|
||||
.delete::before, .modal-close::before {
|
||||
height: 2px;
|
||||
width: 50%;
|
||||
}
|
||||
|
||||
.delete:after, .modal-close:after {
|
||||
.delete::after, .modal-close::after {
|
||||
height: 50%;
|
||||
width: 2px;
|
||||
}
|
||||
|
|
@ -117,7 +117,7 @@
|
|||
width: 32px;
|
||||
}
|
||||
|
||||
.button.is-loading:after, .select.is-loading::after, .control.is-loading::after, .loader, .intro-spinner::before {
|
||||
.button.is-loading::after, .select.is-loading::after, .control.is-loading::after, .loader, .intro-spinner::before {
|
||||
animation: spinAround 500ms infinite linear;
|
||||
border: 2px solid #dbdbdb;
|
||||
border-radius: 290486px;
|
||||
|
|
@ -131,7 +131,7 @@
|
|||
}
|
||||
|
||||
.is-overlay, .image.is-square img, .image.is-1by1 img, .image.is-5by4 img, .image.is-4by3 img, .image.is-3by2 img, .image.is-5by3 img, .image.is-16by9 img, .image.is-2by1 img, .image.is-3by1 img, .image.is-4by5 img, .image.is-3by4 img, .image.is-2by3 img, .image.is-3by5 img, .image.is-9by16 img, .image.is-1by2 img, .image.is-1by3 img, .modal, .modal-background, .hero-video, .intro-spinner, .intro-shadow, .bd-article-overlay, .bd-article-icon,
|
||||
.bd-article-info, .bd-structure-item:before, .bd-structure-item:after, .highlight .bd-show, .bd-banner-background, .bd-book-pattern::before,
|
||||
.bd-article-info, .bd-structure-item::before, .bd-structure-item::after, .highlight .bd-show, .bd-banner-background, .bd-book-pattern::before,
|
||||
.bd-book-modal-column.bd-is-cover::before, .bd-book-pattern, .bd-book-modal-background {
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
|
|
@ -251,7 +251,7 @@ html {
|
|||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
*, *:before, *:after {
|
||||
*, *::before, *::after {
|
||||
box-sizing: inherit;
|
||||
}
|
||||
|
||||
|
|
@ -406,7 +406,7 @@ table th {
|
|||
color: #363636;
|
||||
}
|
||||
|
||||
.is-clearfix:after {
|
||||
.is-clearfix::after {
|
||||
clear: both;
|
||||
content: " ";
|
||||
display: table;
|
||||
|
|
@ -1582,7 +1582,7 @@ a.box:active {
|
|||
color: white;
|
||||
}
|
||||
|
||||
.button.is-white.is-loading:after {
|
||||
.button.is-white.is-loading::after {
|
||||
border-color: transparent transparent #0a0a0a #0a0a0a !important;
|
||||
}
|
||||
|
||||
|
|
@ -1598,7 +1598,7 @@ a.box:active {
|
|||
color: #0a0a0a;
|
||||
}
|
||||
|
||||
.button.is-white.is-outlined.is-loading:after {
|
||||
.button.is-white.is-outlined.is-loading::after {
|
||||
border-color: transparent transparent white white !important;
|
||||
}
|
||||
|
||||
|
|
@ -1676,7 +1676,7 @@ a.box:active {
|
|||
color: #0a0a0a;
|
||||
}
|
||||
|
||||
.button.is-black.is-loading:after {
|
||||
.button.is-black.is-loading::after {
|
||||
border-color: transparent transparent white white !important;
|
||||
}
|
||||
|
||||
|
|
@ -1692,7 +1692,7 @@ a.box:active {
|
|||
color: white;
|
||||
}
|
||||
|
||||
.button.is-black.is-outlined.is-loading:after {
|
||||
.button.is-black.is-outlined.is-loading::after {
|
||||
border-color: transparent transparent #0a0a0a #0a0a0a !important;
|
||||
}
|
||||
|
||||
|
|
@ -1770,7 +1770,7 @@ a.box:active {
|
|||
color: whitesmoke;
|
||||
}
|
||||
|
||||
.button.is-light.is-loading:after {
|
||||
.button.is-light.is-loading::after {
|
||||
border-color: transparent transparent #363636 #363636 !important;
|
||||
}
|
||||
|
||||
|
|
@ -1786,7 +1786,7 @@ a.box:active {
|
|||
color: #363636;
|
||||
}
|
||||
|
||||
.button.is-light.is-outlined.is-loading:after {
|
||||
.button.is-light.is-outlined.is-loading::after {
|
||||
border-color: transparent transparent whitesmoke whitesmoke !important;
|
||||
}
|
||||
|
||||
|
|
@ -1864,7 +1864,7 @@ a.box:active {
|
|||
color: #363636;
|
||||
}
|
||||
|
||||
.button.is-dark.is-loading:after {
|
||||
.button.is-dark.is-loading::after {
|
||||
border-color: transparent transparent whitesmoke whitesmoke !important;
|
||||
}
|
||||
|
||||
|
|
@ -1880,7 +1880,7 @@ a.box:active {
|
|||
color: whitesmoke;
|
||||
}
|
||||
|
||||
.button.is-dark.is-outlined.is-loading:after {
|
||||
.button.is-dark.is-outlined.is-loading::after {
|
||||
border-color: transparent transparent #363636 #363636 !important;
|
||||
}
|
||||
|
||||
|
|
@ -1958,7 +1958,7 @@ a.box:active {
|
|||
color: #00d1b2;
|
||||
}
|
||||
|
||||
.button.is-primary.is-loading:after {
|
||||
.button.is-primary.is-loading::after {
|
||||
border-color: transparent transparent #fff #fff !important;
|
||||
}
|
||||
|
||||
|
|
@ -1974,7 +1974,7 @@ a.box:active {
|
|||
color: #fff;
|
||||
}
|
||||
|
||||
.button.is-primary.is-outlined.is-loading:after {
|
||||
.button.is-primary.is-outlined.is-loading::after {
|
||||
border-color: transparent transparent #00d1b2 #00d1b2 !important;
|
||||
}
|
||||
|
||||
|
|
@ -2052,7 +2052,7 @@ a.box:active {
|
|||
color: #3273dc;
|
||||
}
|
||||
|
||||
.button.is-link.is-loading:after {
|
||||
.button.is-link.is-loading::after {
|
||||
border-color: transparent transparent #fff #fff !important;
|
||||
}
|
||||
|
||||
|
|
@ -2068,7 +2068,7 @@ a.box:active {
|
|||
color: #fff;
|
||||
}
|
||||
|
||||
.button.is-link.is-outlined.is-loading:after {
|
||||
.button.is-link.is-outlined.is-loading::after {
|
||||
border-color: transparent transparent #3273dc #3273dc !important;
|
||||
}
|
||||
|
||||
|
|
@ -2146,7 +2146,7 @@ a.box:active {
|
|||
color: #209cee;
|
||||
}
|
||||
|
||||
.button.is-info.is-loading:after {
|
||||
.button.is-info.is-loading::after {
|
||||
border-color: transparent transparent #fff #fff !important;
|
||||
}
|
||||
|
||||
|
|
@ -2162,7 +2162,7 @@ a.box:active {
|
|||
color: #fff;
|
||||
}
|
||||
|
||||
.button.is-info.is-outlined.is-loading:after {
|
||||
.button.is-info.is-outlined.is-loading::after {
|
||||
border-color: transparent transparent #209cee #209cee !important;
|
||||
}
|
||||
|
||||
|
|
@ -2240,7 +2240,7 @@ a.box:active {
|
|||
color: #23d160;
|
||||
}
|
||||
|
||||
.button.is-success.is-loading:after {
|
||||
.button.is-success.is-loading::after {
|
||||
border-color: transparent transparent #fff #fff !important;
|
||||
}
|
||||
|
||||
|
|
@ -2256,7 +2256,7 @@ a.box:active {
|
|||
color: #fff;
|
||||
}
|
||||
|
||||
.button.is-success.is-outlined.is-loading:after {
|
||||
.button.is-success.is-outlined.is-loading::after {
|
||||
border-color: transparent transparent #23d160 #23d160 !important;
|
||||
}
|
||||
|
||||
|
|
@ -2334,7 +2334,7 @@ a.box:active {
|
|||
color: #ffdd57;
|
||||
}
|
||||
|
||||
.button.is-warning.is-loading:after {
|
||||
.button.is-warning.is-loading::after {
|
||||
border-color: transparent transparent rgba(0, 0, 0, 0.7) rgba(0, 0, 0, 0.7) !important;
|
||||
}
|
||||
|
||||
|
|
@ -2350,7 +2350,7 @@ a.box:active {
|
|||
color: rgba(0, 0, 0, 0.7);
|
||||
}
|
||||
|
||||
.button.is-warning.is-outlined.is-loading:after {
|
||||
.button.is-warning.is-outlined.is-loading::after {
|
||||
border-color: transparent transparent #ffdd57 #ffdd57 !important;
|
||||
}
|
||||
|
||||
|
|
@ -2428,7 +2428,7 @@ a.box:active {
|
|||
color: #ff3860;
|
||||
}
|
||||
|
||||
.button.is-danger.is-loading:after {
|
||||
.button.is-danger.is-loading::after {
|
||||
border-color: transparent transparent #fff #fff !important;
|
||||
}
|
||||
|
||||
|
|
@ -2444,7 +2444,7 @@ a.box:active {
|
|||
color: #fff;
|
||||
}
|
||||
|
||||
.button.is-danger.is-outlined.is-loading:after {
|
||||
.button.is-danger.is-outlined.is-loading::after {
|
||||
border-color: transparent transparent #ff3860 #ff3860 !important;
|
||||
}
|
||||
|
||||
|
|
@ -2503,7 +2503,7 @@ a.box:active {
|
|||
pointer-events: none;
|
||||
}
|
||||
|
||||
.button.is-loading:after {
|
||||
.button.is-loading::after {
|
||||
position: absolute;
|
||||
left: calc(50% - (1em / 2));
|
||||
top: calc(50% - (1em / 2));
|
||||
|
|
@ -4876,7 +4876,7 @@ a.box:active {
|
|||
width: 2em;
|
||||
}
|
||||
|
||||
.tag:not(body).is-delete:before, .tag:not(body).is-delete:after {
|
||||
.tag:not(body).is-delete::before, .tag:not(body).is-delete::after {
|
||||
background-color: currentColor;
|
||||
content: "";
|
||||
display: block;
|
||||
|
|
@ -4887,12 +4887,12 @@ a.box:active {
|
|||
transform-origin: center center;
|
||||
}
|
||||
|
||||
.tag:not(body).is-delete:before {
|
||||
.tag:not(body).is-delete::before {
|
||||
height: 1px;
|
||||
width: 50%;
|
||||
}
|
||||
|
||||
.tag:not(body).is-delete:after {
|
||||
.tag:not(body).is-delete::after {
|
||||
height: 50%;
|
||||
width: 1px;
|
||||
}
|
||||
|
|
@ -10599,9 +10599,9 @@ svg {
|
|||
position: relative;
|
||||
}
|
||||
|
||||
.bd-example:before,
|
||||
.bd-structure:before,
|
||||
.bd-snippet:before {
|
||||
.bd-example::before,
|
||||
.bd-structure::before,
|
||||
.bd-snippet::before {
|
||||
background: #ffdd57;
|
||||
border-radius: 3px 3px 0 0;
|
||||
bottom: 100%;
|
||||
|
|
@ -10784,7 +10784,7 @@ svg {
|
|||
padding: 1.5rem;
|
||||
}
|
||||
|
||||
.bd-structure:before {
|
||||
.bd-structure::before {
|
||||
background: #ff3860;
|
||||
color: #fff;
|
||||
content: "Structure";
|
||||
|
|
@ -10794,7 +10794,7 @@ svg {
|
|||
position: relative;
|
||||
}
|
||||
|
||||
.bd-structure-item:before {
|
||||
.bd-structure-item::before {
|
||||
background: rgba(10, 10, 10, 0.7);
|
||||
background: whitesmoke;
|
||||
border: 1px solid #dbdbdb;
|
||||
|
|
@ -10803,7 +10803,7 @@ svg {
|
|||
z-index: 1;
|
||||
}
|
||||
|
||||
.bd-structure-item:after {
|
||||
.bd-structure-item::after {
|
||||
align-items: center;
|
||||
content: attr(title);
|
||||
display: flex;
|
||||
|
|
@ -10818,7 +10818,7 @@ svg {
|
|||
padding: 1.5rem 0.75rem 0.75rem;
|
||||
}
|
||||
|
||||
.bd-structure-item.bd-is-structure-container:after {
|
||||
.bd-structure-item.bd-is-structure-container::after {
|
||||
align-items: flex-start;
|
||||
justify-content: flex-start;
|
||||
padding: 0.5rem 0.75rem;
|
||||
|
|
@ -11045,7 +11045,7 @@ svg {
|
|||
font-weight: 700;
|
||||
}
|
||||
|
||||
#_default_ > a .default-title:after {
|
||||
#_default_ > a .default-title::after {
|
||||
content: " — ";
|
||||
}
|
||||
|
||||
|
|
|
|||
2
docs/css/bulma-docs.min.css
vendored
2
docs/css/bulma-docs.min.css
vendored
File diff suppressed because one or more lines are too long
|
|
@ -53,8 +53,8 @@ html
|
|||
|
||||
*
|
||||
&,
|
||||
&:before,
|
||||
&:after
|
||||
&::before,
|
||||
&::after
|
||||
box-sizing: inherit
|
||||
|
||||
// Media
|
||||
|
|
|
|||
|
|
@ -138,7 +138,7 @@ $button-static-border-color: $grey-lighter !default
|
|||
box-shadow: none
|
||||
color: $color
|
||||
&.is-loading
|
||||
&:after
|
||||
&::after
|
||||
border-color: transparent transparent $color-invert $color-invert !important
|
||||
&.is-outlined
|
||||
background-color: transparent
|
||||
|
|
@ -150,7 +150,7 @@ $button-static-border-color: $grey-lighter !default
|
|||
border-color: $color
|
||||
color: $color-invert
|
||||
&.is-loading
|
||||
&:after
|
||||
&::after
|
||||
border-color: transparent transparent $color $color !important
|
||||
&[disabled]
|
||||
background-color: transparent
|
||||
|
|
@ -189,7 +189,7 @@ $button-static-border-color: $grey-lighter !default
|
|||
&.is-loading
|
||||
color: transparent !important
|
||||
pointer-events: none
|
||||
&:after
|
||||
&::after
|
||||
+loader
|
||||
+center(1em)
|
||||
position: absolute !important
|
||||
|
|
|
|||
|
|
@ -82,8 +82,8 @@ $tag-delete-margin: 1px !default
|
|||
padding: 0
|
||||
position: relative
|
||||
width: 2em
|
||||
&:before,
|
||||
&:after
|
||||
&::before,
|
||||
&::after
|
||||
background-color: currentColor
|
||||
content: ""
|
||||
display: block
|
||||
|
|
@ -92,10 +92,10 @@ $tag-delete-margin: 1px !default
|
|||
top: 50%
|
||||
transform: translateX(-50%) translateY(-50%) rotate(45deg)
|
||||
transform-origin: center center
|
||||
&:before
|
||||
&::before
|
||||
height: 1px
|
||||
width: 50%
|
||||
&:after
|
||||
&::after
|
||||
height: 50%
|
||||
width: 1px
|
||||
&:hover,
|
||||
|
|
|
|||
|
|
@ -1,7 +1,7 @@
|
|||
@import "initial-variables"
|
||||
|
||||
=clearfix
|
||||
&:after
|
||||
&::after
|
||||
clear: both
|
||||
content: " "
|
||||
display: table
|
||||
|
|
@ -171,8 +171,8 @@
|
|||
position: relative
|
||||
vertical-align: top
|
||||
width: 20px
|
||||
&:before,
|
||||
&:after
|
||||
&::before,
|
||||
&::after
|
||||
background-color: $white
|
||||
content: ""
|
||||
display: block
|
||||
|
|
@ -181,10 +181,10 @@
|
|||
top: 50%
|
||||
transform: translateX(-50%) translateY(-50%) rotate(45deg)
|
||||
transform-origin: center center
|
||||
&:before
|
||||
&::before
|
||||
height: 2px
|
||||
width: 50%
|
||||
&:after
|
||||
&::after
|
||||
height: 50%
|
||||
width: 2px
|
||||
&:hover,
|
||||
|
|
|
|||
Loading…
Add table
Reference in a new issue