123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196 |
- $defaultColor = #8FB1DD
- $aquaColor = #91D6DF
- $blueColor = #BAD0EF
- $greenColor = #9BDD89
- $tealColor = #97BEAD
- $purpleColor = #B6B4EB
- $brownColor = #DABB9E
- $redColor = #DD9DAC
- $chocolateColor = #BB906F
- // Sample colors
- $color1 = #9EDFB5
- $color2 = #DFA57C
- $color3 = #E6BC7E
- $color4 = #D5D298
- $color5 = #98D5A7
- $color6 = #98D5BA
- $color7 = #91D6DF
- $color8 = #8FB1DD
- $color9 = #A8B5E7
- $color10 = #AF9EDA
- $color11 = #DA9EC7
- $color12 = #DA9EAF
- $color13 = #DA9EA1
- $color14 = #DAA39E
- $color15 = #DAAF9E
- $color16 = #DABB9E
- $color17 = #DAC79E
- $color18 = #A5DA9E
- $color19 = #9EDAB1
- $color20 = #9EC4DA
- $color21 = #B6B4EB
- $color22 = #DD9DAC
- $color23 = #BAA8E6
- $color24 = #9BDD89
- $color25 = #E6D4A8
- $color26 = #E6CBA8
- $color27 = #E6B7A8
- $color28 = #97BEAD
- $primaryColor = $defaultColor
- $lightGrey = #A0A0A0
- $faintGrey = #F0F0F0
- $linkColor = darken($primaryColor, 20%)
- $textColor = #606060
- $textDarkColor = darken($textColor, 4%)
- $alertColor = #D3A924
- $normalFont = 300
- $boldFont = 400
- $heavyFont = 700
- border-radius()
- -moz-border-radius: arguments
- -webkit-border-radius: arguments
- border-radius: arguments
- /* Vertical Background Gradient */
- vbg-gradient(fc = #FFF, tc = #FFF)
- background: fc
- background: -webkit-gradient(linear, left top, left bottom, from(fc), to(tc))
- background: -moz-linear-gradient(top, fc, tc)
- background: linear-gradient(top, fc, tc)
- /* Horizontal Background Gradient */
- hbg-gradient(fc = #FFF, tc = #FFF)
- background: fc
- background: -webkit-gradient(linear, left top, right top, from(fc), to(tc))
- background: -moz-linear-gradient(left, fc, tc)
- background: linear-gradient(left, fc, tc)
- box-shadow()
- -moz-box-shadow: arguments
- -webkit-box-shadow: arguments
- box-shadow: arguments
- inset-box-shadow()
- -moz-box-shadow: inset arguments
- -webkit-box-shadow: inset arguments
- box-shadow: inset arguments
- box-flex(s = 0)
- -webkit-box-flex: s
- -moz-box-flex: s
- box-flex: s
- hbox()
- display: -webkit-box
- -webkit-box-orient: horizontal
- -webkit-box-align: stretch
- -webkit-box-pack: start
-
- display: -moz-box
- -moz-box-orient: horizontal
- -moz-box-align: stretch
- -moz-box-pack: start
- vbox()
- display: -webkit-box
- -webkit-box-orient: vertical
- -webkit-box-align: stretch
- display: -moz-box
- -moz-box-orient: vertical
- -moz-box-align: stretch
- border-box()
- -webkit-box-sizing: border-box
- -moz-box-sizing: border-box
- box-sizing: border-box
- content-box()
- -webkit-box-sizing: content-box
- -moz-box-sizing: content-box
- box-sizing: content-box
- transition(s = 0.3s, o = opacity, t = linear)
- -webkit-transition: s o t
- -moz-transition: s o t
- transition: s o t
- ellipsis()
- text-overflow: ellipsis
- overflow: hidden
- white-space:nowrap
- inset-line(opacity = 0.4, size = 1px)
- inset-box-shadow(0, size, 0, rgba(255, 255, 255, opacity))
- outset-line(opacity = 0.4, size = 1px)
- box-shadow(0, size, 0, rgba(255, 255, 255, opacity))
- box-pack(type = center)
- -webkit-box-pack: type
- -moz-box-pack: type
- box-pack: type
-
- transform(tr)
- -webkit-transform: tr
- -moz-transform: tr
- -ms-transform: tr
- -o-transform: tr
- transform: tr
-
- hacel()
- transform(translate3d(0,0,0))
- arrow(direction = 'right', size = 10px, color = #666, width = 0.53em, length = 1em)
- /*
- * In Internet Explorer, The"border-style: dashed" will never be
- * rendered unless "(width * 5) >= border-width" is true.
- * Since "width" is set to "0", the "dashed-border" remains
- * invisible to the user, which renders the border just like how
- * "border-color: transparent" renders.
- */
- border-style: dashed
- border-color: transparent
- border-width: width
- display: -moz-inline-box
- display: inline-block
- /* Use font-size to control the size of the arrow. */
- font-size: size
- height: 0
- line-height: 0
- position: relative
- vertical-align: middle
- width: 0
-
- border-{direction}-width: length;
- border-{direction}-style: solid;
- border-{direction}-color: color;
- {direction}: 0.25em;
- iconic(content = '\67', color = $textColor, pos = 'before')
- &:{pos}
- content: content
- font-family: 'fontello-kleks'
- font-style: normal
- font-weight: normal
- speak: none
- display: inline-block
- text-decoration: none
- width: 1em
- text-align: center
- line-height: 1em
- font-size: 1em
- color: color
- -webkit-font-smoothing: antialiased
- clearfix()
- *zoom: 1
- &:before, &:after
- display: table
- content: ""
- &:after
- clear: both
|