github.com/outbrain/consul@v1.4.5/website/source/assets/stylesheets/consul-connect/components/_button.scss (about)

     1  .g-btn {
     2    background-color: $consul-red;
     3    border: 2px solid $consul-red;
     4    border-radius: 3px;
     5    box-sizing: border-box;
     6    color: $white;
     7    display: inline-block;
     8    font-size: 1.4rem;
     9    font-weight: 600;
    10    letter-spacing: 0;
    11    line-height: 24px;
    12    min-width: 129px;
    13    outline: 0;
    14    padding: 6px 5px;
    15    position: relative;
    16    text-align: center;
    17    transition: all 0.25s ease;
    18  
    19    @media (min-width: 768px) {
    20      font-size: 1.6rem;
    21      min-width: 144px;
    22      padding: 10px 28px;
    23    }
    24  
    25    &:focus,
    26    &:hover {
    27      background-color: #ce4a86;
    28      border-color: #ce4a86;
    29      color: $white;
    30      text-decoration: none;
    31      transform: translateY(-1px);
    32    }
    33  
    34    path {
    35      fill: $white;
    36    }
    37  
    38    &.white {
    39      background: $white;
    40      border: 2px solid $white;
    41      color: $consul-black;
    42  
    43      &:hover {
    44        background: $consul-black;
    45        border-color: $consul-black;
    46        color: $white;
    47  
    48        path {
    49          fill: $white;
    50        }
    51      }
    52  
    53      path {
    54        fill: $consul-black;
    55      }
    56    }
    57  
    58    &.dark-outline {
    59      background: none;
    60      border: 2px solid $consul-black;
    61      color: $consul-black;
    62  
    63      &:hover {
    64        background: $consul-black;
    65        color: $white;
    66      }
    67    }
    68  
    69    &.white-outline {
    70      background: none;
    71      border: 2px solid $white;
    72      color: $white;
    73  
    74      &:hover {
    75        background-color: $white;
    76        color: $consul-black;
    77      }
    78    }
    79  
    80    &.download {
    81      svg {
    82        margin: 0 4px -4px 0;
    83  
    84        path {
    85          transition: fill 0.25s ease;
    86        }
    87      }
    88    }
    89  }