| @mixin base-button($primaryStyleName : v-button) { |
| |
| /* |
| * Default button (more customizable) |
| * -------------------------------------- */ |
| .#{$primaryStyleName} { |
| display: inline-block; |
| zoom: 1; |
| text-align: center !important; |
| text-decoration: none; |
| border: 2px outset #ddd; |
| background: #eee; |
| cursor: pointer; |
| white-space: nowrap; |
| margin: 0; |
| padding: .2em 1em; |
| color: inherit; |
| font: inherit; |
| font-size: $font-size; |
| line-height: normal; |
| -webkit-touch-callout: none; |
| -webkit-user-select: none; |
| -khtml-user-select: none; |
| -moz-user-select: none; |
| -ms-user-select: none; |
| user-select: none; |
| -webkit-box-sizing: border-box; |
| -moz-box-sizing: border-box; |
| box-sizing: border-box; |
| } |
| |
| .#{$primaryStyleName}.v-disabled { |
| cursor: default; |
| } |
| |
| .#{$primaryStyleName}-wrap, |
| .#{$primaryStyleName}-caption { |
| vertical-align: baseline; |
| white-space: nowrap; |
| font: inherit; |
| color: inherit; |
| line-height: normal; |
| } |
| |
| .#{$primaryStyleName} .v-icon { |
| vertical-align: middle; |
| margin-right: 3px; |
| border: none; |
| } |
| |
| .#{$primaryStyleName} .v-errorindicator { |
| display: inline-block; |
| zoom: 1; |
| vertical-align: middle; |
| float: none; |
| } |
| |
| /* Link style (we really should deprecate this) */ |
| .#{$primaryStyleName}-link { |
| border: none; |
| text-align: left !important; |
| background: transparent; |
| padding: 0; |
| color: inherit; |
| -khtml-user-select: text; |
| -moz-user-select: text; |
| -ie-user-select: text; |
| user-select: text; |
| } |
| |
| /* Inset Safari focus outline a bit */ |
| .v-sa & .#{$primaryStyleName}-link:focus{ |
| outline-offset: -3px; |
| } |
| |
| .#{$primaryStyleName}-link .#{$primaryStyleName}-caption { |
| text-decoration: underline; |
| color: inherit; |
| text-align: left; |
| } |
| |
| } |