open-consul/ui/styles/_buttons.scss

123 lines
2.4 KiB
SCSS
Raw Normal View History

2014-04-22 18:11:54 +00:00
.btn {
text-transform: uppercase;
font-weight: 600;
font-size: 12px;
2014-04-25 19:12:21 +00:00
border-width: 2px;
2014-04-22 18:11:54 +00:00
color: $gray;
@include transition(background-color .2s ease-in-out);
@include transition(border-color .2s ease-in-out);
@include transition(color .2s ease-in-out);
2014-04-25 20:24:36 +00:00
outline: none;
2014-05-01 03:02:25 +00:00
outline-color: white;
2014-04-22 18:11:54 +00:00
&:hover {
color: darken($gray, 10%);
background-color: lighten($gray-background, 5%);
}
2014-05-01 03:02:25 +00:00
&:focus {
outline: none;
outline-color: white;
outline: none;
box-shadow: none;
2014-04-22 18:11:54 +00:00
}
&.active {
2014-05-01 03:02:25 +00:00
outline-color: white;
outline: none;
box-shadow: none;
}
2014-08-23 00:00:26 +00:00
&.btn-primary {
color: $purple-dark;
background-color: transparent;
border: 2px solid $purple;
&:hover {
background-color: $light-purple;
color: darken($purple, 10%);
}
}
2014-04-22 18:11:54 +00:00
&.btn-warning {
color: $orange-faded;
background-color: transparent;
border: 2px solid $orange-faded;
&:hover {
background-color: lighten($orange-faded, 29%);
color: darken($orange-faded, 10%);
}
}
&.btn-success {
color: $green-dark;
background-color: transparent;
border: 2px solid $green-dark;
&:hover {
background-color: lighten($green-faded, 24%);
color: darken($green-dark, 10%);
}
}
2014-04-30 14:16:50 +00:00
&.btn-danger {
color: $red;
background-color: transparent;
border: 2px solid $red;
&:hover {
background-color: lighten($red, 38%);
color: darken($red, 10%);
}
}
2014-04-30 14:16:50 +00:00
&.active {
color: $purple-dark;
background-color: transparent;
border: 2px solid $purple;
&:hover {
background-color: $light-purple;
color: darken($purple, 10%);
}
2014-08-23 00:00:26 +00:00
&.btn-noactive {
color: inherit;
background-color: inherit;
border: 2px solid #ccc;
}
2014-04-30 14:16:50 +00:00
}
&.btn-mini {
font-size: 10px;
padding: 8px;
}
2014-04-30 14:16:50 +00:00
&.btn-list {
font-size: 10px;
padding: 3px 5px 3px 5px;
margin-right: 5px;
border-radius: 3px;
}
2014-04-22 18:11:54 +00:00
}
2014-08-23 00:14:26 +00:00
.topbar {
.btn.icon {
min-width: 50px;
font-size: 30px;
height: 33px;
padding: 0;
.wrap {
position: absolute;
top: -8px;
left: 14px;
}
}
}