buttons.styl in flammarion-0.3.0

- old
+ new
@@ -1,139 +1,139 @@
-@import 'colors.styl'
-@import 'mixins.styl'
-
-buttony(raised = false)
-  background-color lighten($bg-color, 0%)
-  color darken($fg-color, 0%)
-  font-family $main-font
-  border $normal-border
-  padding 1em
-  text-decoration none
-  display block
-  text-align center
-  margin-top 0.5em
-  margin-bottom 0.5em
-  user-select none
-  if raised and $enable-gradients
-    button-gradient $bg-color
-
-  &:hover
-    color darken($fg-color, 0%)
-    background-color $highlight
-    if raised and $enable-gradients
-      button-gradient $highlight
-  &:active
-    background-color $active-highlight
-    if raised and $enable-gradients
-      button-gradient $highlight, true
-
-  & > .label-icon-left
-    float left
-  & > .label-icon-right
-    float right
-
-.full-button
-  buttony(true)
-
-.inline-text-input, .inline-dropdown
-  buttony()
-  text-align left
-  box-sizing border-box
-  width 100%
-  box-shadow-inset()
-  &.unclicked
-    color darken($fg-color, 50%)
-  textarea&
-    height 25em
-
-input::-webkit-input-placeholder
-    color darken($fg-color, 50%)
-
-input:focus::-webkit-input-placeholder
-      opacity 0
-
-.inline-checkbox
-  padding 0.2em
-  -webkit-user-select none
-  user-select none
-  font-family $main-font
-  min-height 1.4em
-  display inline-block
-  & > span
-    vertical-align middle
-  & input[type=checkbox]
-    display: none
-  &:before
-    display inline-block
-    vertical-align middle
-    content " "
-    width 1em
-    height 1em
-    border $normal-border
-    margin-right 0.5em
-    button-gradient $bg-color
-  &.checked:before
-    content "X"
-    font-weight 900
-    color activate($bg-color, 40%)
-    text-align center
-    button-gradient $highlight, true
-  &:hover
-    background-color $highlight
-
-#toolbar
-  background-color #000
-  margin 0px
-  font-family $main-font
-  height calc(2% + 15px)
-
-.tool-button
-  float left
-  padding 0.5em
-  margin 0
-  text-decoration none
-  color $fg-color
-  border-right 1px solid
-  border-left 1px solid
-  margin-right 0.0em
-  &:hover
-    background-color #333
-
-.button-box
-  position: absolute
-  top: 0.5em
-  right: 0.5em
-  margin-right: 1.0em
-  background-color: rgba(0, 0, 0, 0.5)
-  drop-shadow()
-  padding: 0
-  z-index: 3
-
-  & .full-button, .inline-text-input, .inline-checkbox
-    float: left
-    margin: 0
-    padding: 0.2em
-  & .full-button:active, .inline-checkbox:active
-    margin-top: 0.1em
-    margin-bottom: -0.1em
-  & .inline-text-input
-    width auto
-  & .inline-checkbox
-    border $normal-border
-    &:before
-      border 1px solid darken($fg-color, 70%)
-      height 50%
-  & .label-icon-left, & .label-icon-right
-    margin 0px 5px
-
-.inline-button
-  buttony()
-  display inline-block
-
-.floating-button
-  buttony()
-  float: left
-  margin: 0
-  padding: 0.2em
-  &:active
-    margin-top: 0.1em
-    margin-bottom: -0.1em
+@import 'colors.styl'
+@import 'mixins.styl'
+
+buttony(raised = false)
+  background-color lighten($bg-color, 0%)
+  color darken($fg-color, 0%)
+  font-family $main-font
+  border $normal-border
+  padding 1em
+  text-decoration none
+  display block
+  text-align center
+  margin-top 0.5em
+  margin-bottom 0.5em
+  user-select none
+  if raised and $enable-gradients
+    button-gradient $bg-color
+
+  &:hover
+    color darken($fg-color, 0%)
+    background-color $highlight
+    if raised and $enable-gradients
+      button-gradient $highlight
+  &:active
+    background-color $active-highlight
+    if raised and $enable-gradients
+      button-gradient $highlight, true
+
+  & > .label-icon-left
+    float left
+  & > .label-icon-right
+    float right
+
+.full-button
+  buttony(true)
+
+.inline-text-input, .inline-dropdown
+  buttony()
+  text-align left
+  box-sizing border-box
+  width 100%
+  box-shadow-inset()
+  &.unclicked
+    color darken($fg-color, 50%)
+  textarea&
+    height 25em
+
+input::-webkit-input-placeholder
+    color darken($fg-color, 50%)
+
+input:focus::-webkit-input-placeholder
+      opacity 0
+
+.inline-checkbox
+  padding 0.2em
+  -webkit-user-select none
+  user-select none
+  font-family $main-font
+  min-height 1.4em
+  display inline-block
+  & > span
+    vertical-align middle
+  & input[type=checkbox]
+    display: none
+  &:before
+    display inline-block
+    vertical-align middle
+    content " "
+    width 1em
+    height 1em
+    border $normal-border
+    margin-right 0.5em
+    button-gradient $bg-color
+  &.checked:before
+    content "X"
+    font-weight 900
+    color activate($bg-color, 40%)
+    text-align center
+    button-gradient $highlight, true
+  &:hover
+    background-color $highlight
+
+#toolbar
+  background-color #000
+  margin 0px
+  font-family $main-font
+  height calc(2% + 15px)
+
+.tool-button
+  float left
+  padding 0.5em
+  margin 0
+  text-decoration none
+  color $fg-color
+  border-right 1px solid
+  border-left 1px solid
+  margin-right 0.0em
+  &:hover
+    background-color #333
+
+.button-box
+  position: absolute
+  top: 0.5em
+  right: 0.5em
+  margin-right: 1.0em
+  background-color: rgba(0, 0, 0, 0.5)
+  drop-shadow()
+  padding: 0
+  z-index: 3
+
+  & .full-button, .inline-text-input, .inline-checkbox
+    float: left
+    margin: 0
+    padding: 0.2em
+  & .full-button:active, .inline-checkbox:active
+    margin-top: 0.1em
+    margin-bottom: -0.1em
+  & .inline-text-input
+    width auto
+  & .inline-checkbox
+    border $normal-border
+    &:before
+      border 1px solid darken($fg-color, 70%)
+      height 50%
+  & .label-icon-left, & .label-icon-right
+    margin 0px 5px
+
+.inline-button
+  buttony()
+  display inline-block
+
+.floating-button
+  buttony()
+  float: left
+  margin: 0
+  padding: 0.2em
+  &:active
+    margin-top: 0.1em
+    margin-bottom: -0.1em