Ark/bulma
1
0
Fork 0
mirror of https://github.com/jgthms/bulma synced 2026-03-21 04:34:30 -07:00
Code Issues Packages Projects Releases Wiki Activity

Add placeholders

Browse Source
This commit is contained in:
Jeremy Thomas
2016-09-22 22:03:22 +01:00
parent 14e01a1358
commit 7634faba6a
21 changed files with 1508 additions and 2925 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
sass/elements/box.sass
View File

@@ -1,8 +1,8 @@
@import "../base/classes.sass"
@import "../base/placeholders.sass"
@import "../utilities/variables.sass"
.box
@extend .block
@extend %block
background-color: $white
border-radius: $radius-large
box-shadow: 0 2px 3px rgba($black, 0.1), 0 0 0 1px rgba($black, 0.1)

6
sass/elements/button.sass
View File

@@ -1,4 +1,4 @@
@import "../elements/other.sass"
@import "../base/placeholders.sass"
@import "../utilities/controls.sass"
@import "../utilities/variables.sass"
@@ -22,7 +22,7 @@
.button
+control
@extend .unselectable
@extend %unselectable
justify-content: center
padding-left: 10px
padding-right: 10px
@@ -109,6 +109,6 @@
color: transparent !important
pointer-events: none
&:after
@extend .loader
@extend %loader
+center(16px)
position: absolute !important

4
sass/elements/content.sass
View File

@@ -1,8 +1,8 @@
@import "../base/classes.sass"
@import "../base/placeholders.sass"
@import "../utilities/variables.sass"
.content
@extend .block
@extend %block
color: $text
// Inline
a:not(.button)

8
sass/elements/form.sass
View File

@@ -1,4 +1,4 @@
@import "../elements/other.sass"
@import "../base/placeholders.sass"
@import "../utilities/controls.sass"
@import "../utilities/mixins.sass"
@@ -9,7 +9,8 @@
&.is-#{$name}
border-color: $color
.input
.input,
.textarea
+form-control
box-shadow: inset 0 1px 2px rgba($black, 0.1)
max-width: 100%
@@ -32,7 +33,6 @@
width: auto
.textarea
@extend .input
display: block
line-height: 1.2
max-height: 600px
@@ -257,7 +257,7 @@
flex-shrink: 1
&.is-loading
&:after
@extend .loader
@extend %loader
position: absolute !important
right: 8px
top: 8px

4
sass/elements/notification.sass
View File

@@ -1,9 +1,9 @@
@import "../base/classes.sass"
@import "../base/placeholders.sass"
@import "../utilities/mixins.sass"
@import "../utilities/variables.sass"
.notification
@extend .block
@extend %block
+clearfix
background-color: $background
border-radius: $radius

117
sass/elements/other.sass
View File

@@ -1,48 +1,23 @@
@import "../base/classes.sass"
@import "../base/placeholders.sass"
@import "../utilities/mixins.sass"
@import "../utilities/variables.sass"
.delete
@extend .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
.container
position: relative
+desktop
margin: 0 auto
max-width: 960px
// Modifiers
&.is-fluid
margin: 0 20px
max-width: none
+widescreen
max-width: 1200px
.fa
font-size: 21px
text-align: center
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
.icon
+fa(21px, 24px)
@@ -57,46 +32,6 @@
&.is-large
+fa(42px, 48px)
.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
.heading
display: block
font-size: 11px
@@ -105,7 +40,7 @@
text-transform: uppercase
.highlight
@extend .block
@extend %block
font-size: 12px
font-weight: normal
max-width: 100%
@@ -115,18 +50,6 @@
overflow: auto
max-width: 100%
.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
.number
background-color: $background
border-radius: 290486px
@@ -178,11 +101,3 @@
.delete
margin-left: 4px
margin-right: -8px
.unselectable
-webkit-touch-callout: none
-webkit-user-select: none
-moz-user-select: none
-ms-user-select: none
user-select: none

4
sass/elements/progress.sass
View File

@@ -1,8 +1,8 @@
@import "../base/classes.sass"
@import "../base/placeholders.sass"
@import "../utilities/variables.sass"
.progress
@extend .block
@extend %block
-moz-appearance: none
-webkit-appearance: none
border: none

4
sass/elements/title.sass
View File

@@ -1,10 +1,10 @@
@import "../base/classes.sass"
@import "../base/placeholders.sass"
@import "../utilities/mixins.sass"
@import "../utilities/variables.sass"
.title,
.subtitle
@extend .block
@extend %block
font-weight: $weight-title-normal
word-break: break-word
em,