summaryrefslogtreecommitdiffstats
path: root/debian/missing-sources/wyrm/sass/wyrm_core/_button.sass
diff options
context:
space:
mode:
Diffstat (limited to 'debian/missing-sources/wyrm/sass/wyrm_core/_button.sass')
-rw-r--r--debian/missing-sources/wyrm/sass/wyrm_core/_button.sass172
1 files changed, 172 insertions, 0 deletions
diff --git a/debian/missing-sources/wyrm/sass/wyrm_core/_button.sass b/debian/missing-sources/wyrm/sass/wyrm_core/_button.sass
new file mode 100644
index 0000000..2e85353
--- /dev/null
+++ b/debian/missing-sources/wyrm/sass/wyrm_core/_button.sass
@@ -0,0 +1,172 @@
+// Buttons
+//
+// Located in `wyrm_core/_button.sass`. You can also add font icons to any
+// button as shown in the third example. Wyrm by default uses the FontAwesome
+// library, but any icon set can be substituted.
+//
+// Markup:
+// <a href="#" class="btn {$modifiers}"> Link</a>
+// <button class="btn {$modifiers}"> Button</button>
+// <input type="submit" class="btn {$modifiers}">
+// <button class="btn fa fa-check-circle {$modifiers}"> With icon</button>
+//
+// :hover - Highlight the button when hovered.
+// :visited - Visited link
+// :disabled - For disabled buttons.
+// .btn-disabled - Class version of disabled.
+// :active - Press the button down.
+// :focus - Focus
+// .btn-neutral - Neutral looking button.
+// .btn-info - For imformative, or alternate actions.
+// .btn-success - For positive actions.
+// .btn-danger - Usually used for delete actions.
+// .btn-warning - Beware, you might not want to click me.
+// .btn-invert - Dark button to contrast the background.
+// .btn-link - Unstyled, link looking button. Useful for secondary actions next to another button.
+// .btn-small - Smaller button.
+//
+// Styleguide 1
+
+button
+ font-size: 100%
+ margin: 0
+ vertical-align: baseline
+ *vertical-align: middle
+ cursor: pointer
+ line-height: normal
+ -webkit-appearance: button
+ *overflow: visible
+button::-moz-focus-inner, input::-moz-focus-inner
+ border: 0
+ padding: 0
+button[disabled]
+ cursor: default
+
+.btn
+ /* Structure
+ display: inline-block
+ border-radius: 2px
+ line-height: normal
+ white-space: nowrap
+ text-align: center
+ cursor: pointer
+ font-size: 100%
+ padding: $base-line-height / 4 $base-line-height / 2 ($base-line-height / 4 + 2) $base-line-height / 2
+ color: $white
+ border: 1px solid rgba(0,0,0,0.1)
+ background-color: $button-background-color
+ text-decoration: none
+ font-weight: normal
+ font-family: $base-font-family
+ box-shadow: 0px 1px 2px -1px rgba(255, 255, 255, .5) inset, 0px -2px 0px 0px rgba(0,0,0,.1) inset
+ outline-none: false
+ vertical-align: middle
+ *display: inline
+ zoom: 1
+ -webkit-user-drag: none
+ +user-select(none)
+ +font-smooth
+ +transition(all 0.1s linear)
+
+.btn-hover
+ background: lighten($link-color, 5%)
+ color: $white
+
+.btn
+ &:hover
+ background: lighten($button-background-color, 5%)
+ color: $white
+ &:focus
+ background: lighten($button-background-color, 5%)
+ outline: 0
+ &:active
+ box-shadow: 0px -1px 0px 0px rgba(0, 0, 0, .05) inset, 0px 2px 0px 0px rgba(0,0,0,.1) inset
+ padding: ($base-line-height / 4 + 2) $base-line-height / 2 $base-line-height / 4 $base-line-height / 2
+ &:visited
+ color: $white
+ &:disabled
+ background-image: none
+ filter: progid:DXImageTransform.Microsoft.gradient(enabled = false)
+ filter: alpha(opacity = 40)
+ opacity: 0.4
+ cursor: not-allowed
+ box-shadow: none
+
+.btn-disabled
+ background-image: none
+ filter: progid:DXImageTransform.Microsoft.gradient(enabled = false)
+ filter: alpha(opacity = 40)
+ opacity: 0.4
+ cursor: not-allowed
+ box-shadow: none
+ &:hover, &:focus, &:active
+ background-image: none
+ filter: progid:DXImageTransform.Microsoft.gradient(enabled = false)
+ filter: alpha(opacity = 40)
+ opacity: 0.40
+ cursor: not-allowed
+ box-shadow: none
+
+// Firefox: Get rid of the inner focus border
+.btn::-moz-focus-inner
+ padding: 0
+ border: 0
+
+.btn-small
+ font-size: 80%
+
+.btn-info
+ background-color: $blue !important
+ &:hover
+ background-color: lighten($blue, 5%) !important
+
+.btn-neutral
+ background-color: $button-neutral-background-color !important
+ color: $text-color !important
+ &:hover
+ background-color: darken($button-neutral-background-color, 5%) !important
+ color: $text-color
+ &:visited
+ color: $text-color !important
+
+.btn-success
+ background-color: $green !important
+ &:hover
+ background-color: darken($green, 5%) !important
+
+.btn-danger
+ background-color: $red !important
+ &:hover
+ background-color: lighten($red, 5%) !important
+
+.btn-warning
+ background-color: $orange !important
+ &:hover
+ background-color: lighten($orange, 5%) !important
+.btn-invert
+ background-color: $gray-darker
+ &:hover
+ background-color: lighten($gray-darker, 5%) !important
+
+.btn-link
+ background-color: transparent !important
+ color: $link-color
+ box-shadow: none
+ border-color: transparent !important
+ &:hover
+ background-color: transparent !important
+ color: lighten($link-color, 10%) !important
+ box-shadow: none
+ &:active
+ background-color: transparent !important
+ color: lighten($link-color, 10%) !important
+ box-shadow: none
+ &:visited
+ color: $link-color-visited
+
+.wy-btn-group .btn, .wy-control .btn
+ vertical-align: middle
+
+.wy-btn-group
+ margin-bottom: $base-line-height
+ +clearfix