| /* |
| * Licensed to the Apache Software Foundation (ASF) under one or more |
| * contributor license agreements. See the NOTICE file distributed with |
| * this work for additional information regarding copyright ownership. |
| * The ASF licenses this file to You under the Apache License, Version 2.0 |
| * (the "License"); you may not use this file except in compliance with |
| * the License. You may obtain a copy of the License at |
| * |
| * http://www.apache.org/licenses/LICENSE-2.0 |
| * |
| * Unless required by applicable law or agreed to in writing, software |
| * distributed under the License is distributed on an "AS IS" BASIS, |
| * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. |
| * See the License for the specific language governing permissions and |
| * limitations under the License. |
| */ |
| |
| @mixin custom-button($fg, $bg) { |
| border-color: $bg !important; |
| background-color: $bg !important; |
| color: $fg !important; |
| font-weight: 400; |
| |
| &:focus { |
| border-color: $bg !important; |
| background-color: $bg !important; |
| color: $fg !important; |
| } |
| |
| &:hover { |
| color: $fg !important; |
| border-color: $bg !important; |
| background-color: darken($bg, 3%) !important; |
| } |
| } |
| |
| .btn { |
| letter-spacing: 0.02em; |
| box-shadow: none !important; |
| } |
| |
| .btn-default:hover, .btn-default:active, .btn-default:visited { |
| background-color: #efefef !important; |
| border-color: #ddd !important; |
| } |
| |
| .btn-creme { @include custom-button(#8a6d3b, #fcf8e3) } |
| .btn-beta { @include custom-button(#fff, $color-beta) } |
| .btn-black { @include custom-button(#fff, #555) } |
| .btn-white { @include custom-button(#333, #fff) } |
| .btn-milk { @include custom-button(#333, #f9f9f3) } |
| .btn-turquoise { @include custom-button(#fff, $color-turquoise) } |
| .btn-emerald { @include custom-button(#fff, $color-emerald) } |
| .btn-river { @include custom-button(#fff, $color-river) } |
| .btn-amethyst { @include custom-button(#fff, $color-amethyst) } |
| .btn-asphalt { @include custom-button(#fff, $color-asphalt) } |
| .btn-sea { @include custom-button(#fff, $color-sea) } |
| .btn-nephritis { @include custom-button(#fff, $color-nephritis) } |
| .btn-belize { @include custom-button(#fff, $color-belize) } |
| .btn-wisteria { @include custom-button(#fff, $color-wisteria) } |
| .btn-midnight { @include custom-button(#fff, $color-midnight) } |
| .btn-orange { @include custom-button(#fff, $color-orange) } |
| .btn-carrot { @include custom-button(#fff, $color-carrot) } |
| .btn-pumpkin { @include custom-button(#fff, $color-pumpkin) } |
| .btn-alizarin { @include custom-button(#fff, $color-alizarin) } |
| .btn-pomegranate { @include custom-button(#fff, $color-pomegranate) } |
| .btn-cloud { @include custom-button($color-grey-blue, $color-cloud) } |
| .btn-white-river { @include custom-button($color-river, #fff) } |
| .btn-silver { @include custom-button(#fff, $color-silver) } |
| .btn-concrete { @include custom-button(#fff, $color-concrete) } |
| .btn-asbestos { @include custom-button(#fff, $color-asbestos) } |
| .btn-pink { @include custom-button(#fff, $color-pink) } |
| .btn-mustard { @include custom-button(#000, $color-mustard) } |
| .btn-mustard2 { @include custom-button(#fff, $color-mustard) } |
| .btn-blue { @include custom-button(#fff, $color-blue) } |
| .btn-slack { @include custom-button(#fff, $color-slack) } |
| .btn-slack2 { @include custom-button(#fff, $color-slack2) } |
| .btn-slack3 { @include custom-button(#fff, $color-slack3) } |
| .btn-slack4 { @include custom-button(#fff, $color-slack4) } |
| .btn-slack5 { @include custom-button(#fff, $color-slack5) } |
| .btn-primary { @include custom-button(#fff, $brand-primary) } |
| .btn-danger { @include custom-button(#fff, $brand-danger) } |
| .btn-beta { @include custom-button(#fff, $color-beta) } |
| .btn-success { @include custom-button(#fff, $brand-success) } |
| .btn-beige { @include custom-button(#fff, $color-beige) } |
| .btn-sunflower { @include custom-button($color-slack, $color-sunflower) } |
| .btn-peach { @include custom-button(#fff, $color-peach) } |
| .btn-sunflower2 { @include custom-button($color-slack2, $color-sunflower) } |
| |
| .one-letter-btn-xs { |
| padding: 1px 7px; |
| } |
| |