| | 1 | @import "ui-variables"; |
| | 2 | @import "ui-mixins"; |
| | 3 | |
| | 4 | .btn-background (@color, @hover-color, @selected-color, @border-color, @text-color, @text-color-hover) { |
| | 5 | @active-shadow: inset 0 3px 5px rgba(0, 0, 0, .125); |
| | 6 | color: @text-color; |
| | 7 | background-color: transparent; |
| | 8 | &:active, |
| | 9 | &.selected:hover:active { |
| | 10 | } |
| | 11 | &.selected, |
| | 12 | &.selected:hover { |
| | 13 | color: @text-color-selected; |
| | 14 | text-shadow: 0 0 2px rgba(0, 0, 0, 0.3); |
| | 15 | } |
| | 16 | &.selected:hover { |
| | 17 | } |
| | 18 | } |
| | 19 | |
| | 20 | .btn-variant (@color) { |
| | 21 | @bg: darken(@color, 10%); |
| | 22 | @hover: @color; |
| | 23 | @selected: @color; |
| | 24 | @border: fadeout(darken(@color, 20%), 50%); |
| | 25 | .btn-background(@bg, @hover, @selected, @border, @text-color-selected, @text-color-selected); |
| | 26 | } |
| | 27 | |
| | 28 | .btn { |
| | 29 | position: relative; |
| | 30 | &::after { |
| | 31 | content: ''; |
| | 32 | display: block; |
| | 33 | position: absolute; |
| | 34 | top: 3px; right: 4px; bottom: 4px; left: 3px; |
| | 35 | pointer-events: none; |
| | 36 | } |
| | 37 | &:focus::after { |
| | 38 | outline: 1px dotted black; |
| | 39 | } |
| | 40 | .ui-raised-shadow; |
| | 41 | &:focus { |
| | 42 | .ui-raised-shadow-active; |
| | 43 | outline: none; |
| | 44 | } |
| | 45 | &:active { |
| | 46 | .ui-inset-shadow-active; |
| | 47 | } |
| | 48 | .btn-background(@button-background-color, @button-background-color-hover, @button-background-color-selected, @button-border-color, @text-color, @text-color-highlight); |
| | 49 | } |
| | 50 | |
| | 51 | .btn.btn-primary { |
| | 52 | .btn-variant(@background-color-info); |
| | 53 | } |
| | 54 | .btn.btn-info { |
| | 55 | .btn-variant(@background-color-info); |
| | 56 | } |
| | 57 | .btn.btn-success { |
| | 58 | .btn-variant(@background-color-success); |
| | 59 | } |
| | 60 | .btn.btn-warning { |
| | 61 | .btn-variant(@background-color-warning); |
| | 62 | } |
| | 63 | .btn.btn-error { |
| | 64 | .btn-variant(@background-color-error); |
| | 65 | } |
| | 66 | |
| | 67 | .btn-group > .btn { |
| | 68 | border: none; |
| | 69 | } |
git.r.bdr.sh / rbdr / dotfiles / blame_incremental