Files
awx/awx/ui/client/lib/theme/_mixins.less
2017-07-25 16:44:34 -04:00

99 lines
2.0 KiB
Plaintext

.at-mixin-Placeholder (@color) {
&:-moz-placeholder {
color: @color;
}
&:-ms-input-placeholder {
color: @color;
}
&::-webkit-input-placeholder {
color: @color;
}
}
.at-mixin-Heading (@size) {
color: @at-color-body-text;
font-size: @size;
font-weight: @at-font-weight-heading;
line-height: @at-line-height-short;
text-transform: uppercase;
margin: 0;
padding: 0;
}
.at-mixin-Button () {
height: @at-height-input;
padding: @at-padding-button-vertical @at-padding-button-horizontal;
font-size: @at-font-size-body;
line-height: 1;
}
.at-mixin-InputButton () {
height: @at-height-button;
padding: 0 @at-padding-button-horizontal;
&, &:active, &:hover, &:focus {
color: @at-color-button-text-default;
border-color: @at-color-input-border;
background-color: @at-gray-light-2x;
cursor: pointer;
}
}
.at-mixin-ButtonColor (@background, @color, @hover: '@{background}-hover') {
background-color: @@background;
&, &:hover, &:focus {
color: @@color;
}
&:hover, &:focus {
background-color: @@hover;
}
&[disabled] {
background-color: fade(@@background, 60%);
}
}
.at-mixin-ButtonHollow (@bg, @border, @text) {
@hover: '@{bg}-hover';
background-color: @@bg;
color: @@text;
border-color: @@border;
&:hover, &:active {
color: @@text;
background-color: @@hover;
box-shadow: none;
}
&:focus {
color: @@text;
background-color: @@hover;
border-color: @@border;
cursor: default;
}
&[disabled] {
opacity: 0.65;
}
}
.at-mixin-ButtonIcon () {
line-height: @at-line-height-short;
& > i {
cursor: pointer;
transition: color @at-transition-icon-button;
}
& > i:hover {
color: @at-color-icon-hover
}
}
.at-mixin-FontFixedWidth () {
font-family: Menlo, Monaco, Consolas, "Courier New", monospace;
}