mirror of
https://github.com/jgthms/bulma
synced 2026-03-25 06:19:36 -07:00
Add minireset, Fix color luminance
This commit is contained in:
@@ -1,3 +1,6 @@
|
||||
@import "./animations.sass"
|
||||
@import "./variables.sass"
|
||||
|
||||
=arrow($color)
|
||||
border: 1px solid $color
|
||||
border-right: 0
|
||||
@@ -10,6 +13,10 @@
|
||||
transform: rotate(-45deg)
|
||||
width: 7px
|
||||
|
||||
=block
|
||||
&:not(:last-child)
|
||||
margin-bottom: 20px
|
||||
|
||||
=clearfix
|
||||
&:after
|
||||
clear: both
|
||||
@@ -23,6 +30,48 @@
|
||||
position: absolute
|
||||
top: 50%
|
||||
|
||||
=delete
|
||||
+unselectable
|
||||
-moz-appearance: none
|
||||
-webkit-appearance: none
|
||||
background-color: rgba($black, 0.2)
|
||||
border: none
|
||||
border-radius: 290486px
|
||||
cursor: pointer
|
||||
display: inline-block
|
||||
height: 24px
|
||||
position: relative
|
||||
vertical-align: top
|
||||
width: 24px
|
||||
&:before,
|
||||
&:after
|
||||
background-color: $white
|
||||
content: ""
|
||||
display: block
|
||||
height: 2px
|
||||
left: 50%
|
||||
margin-left: -25%
|
||||
margin-top: -1px
|
||||
position: absolute
|
||||
top: 50%
|
||||
width: 50%
|
||||
&:before
|
||||
transform: rotate(45deg)
|
||||
&:after
|
||||
transform: rotate(-45deg)
|
||||
&:hover
|
||||
background-color: rgba($black, 0.5)
|
||||
// Sizes
|
||||
&.is-small
|
||||
height: 16px
|
||||
width: 16px
|
||||
&.is-medium
|
||||
height: 32px
|
||||
width: 32px
|
||||
&.is-large
|
||||
height: 40px
|
||||
width: 40px
|
||||
|
||||
=fa($size, $dimensions)
|
||||
display: inline-block
|
||||
font-size: $size
|
||||
@@ -32,6 +81,58 @@
|
||||
vertical-align: top
|
||||
width: $dimensions
|
||||
|
||||
=hamburger
|
||||
cursor: pointer
|
||||
display: block
|
||||
height: $nav-height
|
||||
position: relative
|
||||
width: $nav-height
|
||||
span
|
||||
background-color: $text
|
||||
display: block
|
||||
height: 1px
|
||||
left: 50%
|
||||
margin-left: -7px
|
||||
position: absolute
|
||||
top: 50%
|
||||
transition: none $speed $easing
|
||||
transition-property: background, left, opacity, transform
|
||||
width: 15px
|
||||
&:nth-child(1)
|
||||
margin-top: -6px
|
||||
&:nth-child(2)
|
||||
margin-top: -1px
|
||||
&:nth-child(3)
|
||||
margin-top: 4px
|
||||
&:hover
|
||||
background-color: $background
|
||||
// Modifers
|
||||
&.is-active
|
||||
span
|
||||
background-color: $link
|
||||
&:nth-child(1)
|
||||
margin-left: -5px
|
||||
transform: rotate(45deg)
|
||||
transform-origin: left top
|
||||
&:nth-child(2)
|
||||
opacity: 0
|
||||
&:nth-child(3)
|
||||
margin-left: -5px
|
||||
transform: rotate(-45deg)
|
||||
transform-origin: left bottom
|
||||
|
||||
=loader
|
||||
animation: spin-around 500ms infinite linear
|
||||
border: 2px solid $border
|
||||
border-radius: 290486px
|
||||
border-right-color: transparent
|
||||
border-top-color: transparent
|
||||
content: ""
|
||||
display: block
|
||||
height: 16px
|
||||
position: relative
|
||||
width: 16px
|
||||
|
||||
=overlay($offset: 0)
|
||||
bottom: $offset
|
||||
left: $offset
|
||||
@@ -57,6 +158,13 @@
|
||||
text-indent: -290486px
|
||||
width: $width
|
||||
|
||||
=unselectable
|
||||
-webkit-touch-callout: none
|
||||
-webkit-user-select: none
|
||||
-moz-user-select: none
|
||||
-ms-user-select: none
|
||||
user-select: none
|
||||
|
||||
// Responsiveness
|
||||
|
||||
$tablet: 769px !default
|
||||
|
||||
Reference in New Issue
Block a user