github.com/kyleu/dbaudit@v0.0.2-0.20240321155047-ff2f2c940496/client/src/style/tabs.css (about)

     1  /* Content managed by Project Forge, see [projectforge.md] for details. */
     2  .tabs {
     3    margin-top: var(--padding);
     4    margin-bottom: var(--padding);
     5    display: flex;
     6    flex-wrap: wrap;
     7    background-color: var(--color-background-muted);
     8    border: var(--border);
     9    padding: 0;
    10  }
    11  
    12  .tabs.padded {
    13    margin-left: var(--padding);
    14    margin-right: var(--padding);
    15  }
    16  
    17  .tabs .input {
    18    position: absolute;
    19    opacity: 0;
    20  }
    21  
    22  .tabs .label {
    23    width: auto;
    24    cursor: pointer;
    25    padding: var(--padding-small);
    26    margin-left: var(--padding-small);
    27    transition: background-color 250ms linear;
    28  }
    29  
    30  @media (prefers-reduced-motion) {
    31    .tabs .label {
    32      transition: none;
    33    }
    34  }
    35  
    36  .tabs .input:checked + .label {
    37    background-color: var(--color-background);
    38  }
    39  
    40  .tabs .panel {
    41    padding: var(--padding);
    42    background-color: var(--color-background);
    43    width: 100%;
    44    display: none;
    45    order: 99;
    46  }
    47  
    48  .tabs .input:checked + .label + .panel {
    49    display: block;
    50  }