vitess.io/vitess@v0.16.2/web/vtadmin/src/components/tabs/Tab.module.scss (about)

     1  /**
     2   * Copyright 2021 The Vitess Authors.
     3   *
     4   * Licensed under the Apache License, Version 2.0 (the "License");
     5   * you may not use this file except in compliance with the License.
     6   * You may obtain a copy of the License at
     7   *
     8   *     http://www.apache.org/licenses/LICENSE-2.0
     9   *
    10   * Unless required by applicable law or agreed to in writing, software
    11   * distributed under the License is distributed on an "AS IS" BASIS,
    12   * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
    13   * See the License for the specific language governing permissions and
    14   * limitations under the License.
    15   */
    16  a.tab {
    17      background: var(--backgroundPrimary);
    18      border: solid 1px transparent;
    19      border-top-left-radius: 6px;
    20      border-top-right-radius: 6px;
    21      color: var(--textColorSecondary);
    22      display: block;
    23      flex: 0 0 auto;
    24      font-weight: 500;
    25      line-height: 1.6em;
    26      margin: 0 0.2em 0 0;
    27      min-width: 7.2rem;
    28      padding: 0.8em 1.2em 0.5em 1.2em;
    29      position: relative;
    30      white-space: nowrap;
    31  
    32      &.active {
    33          border-color: var(--colorScaffoldingHighlight);
    34          border-bottom-color: var(--backgroundPrimary);
    35          color: var(--textColorPrimary);
    36          z-index: var(--zIndexLow);
    37      }
    38  
    39      .count {
    40          background-color: var(--backgroundSecondaryHighlight);
    41          border-radius: 20px;
    42          color: var(--textColorSecondary);
    43          display: inline-block;
    44          font-size: 0.85em;
    45          line-height: 1em;
    46          margin: 0 0 0 0.5em;
    47          padding: 0.5em 0.75em;
    48          vertical-align: baseline;
    49      }
    50  
    51      &:hover {
    52          color: var(--colorPrimary);
    53  
    54          .count {
    55              background-color: var(--backgroundPrimaryHighlight);
    56              color: var(--colorPrimary);
    57          }
    58      }
    59  }
    60  
    61  .pip {
    62      height: 0.5em;
    63      margin-right: 0.5em;
    64      vertical-align: middle;
    65      width: 0.5em;
    66  }