Skip to content
This repository has been archived by the owner on Jun 11, 2024. It is now read-only.

Commit

Permalink
feat: Show checkbox border for block style
Browse files Browse the repository at this point in the history
  • Loading branch information
@bodograumann
bodograumann committed Mar 29, 2019
1 parent 396cef7 commit 85bac65
Show file tree
Hide file tree
Showing 4 changed files with 65 additions and 31 deletions.
2 changes: 1 addition & 1 deletion dist/css/bulma-checkradio.min.css
View file

Large diffs are not rendered by default.

35 changes: 29 additions & 6 deletions dist/css/bulma-checkradio.sass
View file
Original file line number Diff line number Diff line change
Expand Up @@ -27,10 +27,16 @@ $checkradio-top-offset: 0rem !default

&.is-block
+ label
&::before,
&:before
width: 1.25 * $size
height: 1.25 * $size
left: .175rem
top: .175rem
&::after,
&:after
top: ( ( ( $newSize / 2 ) - ( $height / 2 ) ) * 1.3 )
left: $height * 1.3
top: .2rem + $size * 0.125
left: .2rem + $size * 0.45

&.is-rtl
+ label
Expand Down Expand Up @@ -179,9 +185,10 @@ $checkradio-top-offset: 0rem !default
background: $checkbox-block-background
color: findColorInvert( $checkbox-block-background )
padding-right: .75em
&::before,
&:before
border: none !important
&:hover:not([disabled])
+ label
background: darken($checkbox-block-background, 5%);


.is-checkradio[type="checkbox"]
+ label
Expand Down Expand Up @@ -243,14 +250,30 @@ $checkradio-top-offset: 0rem !default
&:after
border-color: $color-invert !important
background-color: $color !important
&.is-block
&.is-block
&:hover:not([disabled])
+ label
&::after,
&:after,
&::before,
&:before
border-color: $color !important
&:checked
+ label
color: $color-invert
border-color: $color !important
background: $color
&::after,
&:after
border-color: $color-invert !important
&:hover:not([disabled])
+ label
background: darken($color, 5%)
&::after,
&:after,
&::before,
&:before
border-color: darken($color-invert, 5%) !important

&:indeterminate
+ label
Expand Down
24 changes: 6 additions & 18 deletions package-lock.json
View file

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

35 changes: 29 additions & 6 deletions src/sass/index.sass
View file
Original file line number Diff line number Diff line change
Expand Up @@ -27,10 +27,16 @@ $checkradio-top-offset: 0rem !default

&.is-block
+ label
&::before,
&:before
width: 1.25 * $size
height: 1.25 * $size
left: .175rem
top: .175rem
&::after,
&:after
top: ( ( ( $newSize / 2 ) - ( $height / 2 ) ) * 1.3 )
left: $height * 1.3
top: .2rem + $size * 0.125
left: .2rem + $size * 0.45

&.is-rtl
+ label
Expand Down Expand Up @@ -179,9 +185,10 @@ $checkradio-top-offset: 0rem !default
background: $checkbox-block-background
color: findColorInvert( $checkbox-block-background )
padding-right: .75em
&::before,
&:before
border: none !important
&:hover:not([disabled])
+ label
background: darken($checkbox-block-background, 5%);


.is-checkradio[type="checkbox"]
+ label
Expand Down Expand Up @@ -243,14 +250,30 @@ $checkradio-top-offset: 0rem !default
&:after
border-color: $color-invert !important
background-color: $color !important
&.is-block
&.is-block
&:hover:not([disabled])
+ label
&::after,
&:after,
&::before,
&:before
border-color: $color !important
&:checked
+ label
color: $color-invert
border-color: $color !important
background: $color
&::after,
&:after
border-color: $color-invert !important
&:hover:not([disabled])
+ label
background: darken($color, 5%)
&::after,
&:after,
&::before,
&:before
border-color: darken($color-invert, 5%) !important

&:indeterminate
+ label
Expand Down

0 comments on commit 85bac65

Please sign in to comment.