github.com/freiheit-com/kuberpult@v1.24.2-0.20240328135542-315d5630abe6/services/frontend-service/src/ui/components/navigation/navList.scss (about)

     1  /*This file is part of kuberpult.
     2  
     3  Kuberpult is free software: you can redistribute it and/or modify
     4  it under the terms of the Expat(MIT) License as published by
     5  the Free Software Foundation.
     6  
     7  Kuberpult is distributed in the hope that it will be useful,
     8  but WITHOUT ANY WARRANTY; without even the implied warranty of
     9  MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
    10  MIT License for more details.
    11  
    12  You should have received a copy of the MIT License
    13  along with kuberpult. If not, see <https://directory.fsf.org/wiki/License:Expat>.
    14  
    15  Copyright 2023 freiheit.com*/
    16  .mdc-list {
    17      display: flex;
    18      flex-direction: column;
    19      align-items: center;
    20      justify-content: center;
    21      overflow: hidden;
    22      gap: $nav-list-item-gap;
    23      height: 100%;
    24  
    25      .mdc-list-item {
    26          display: flex;
    27          position: relative;
    28          overflow: hidden;
    29          height: 100%;
    30          padding: $nav-list-item-padding;
    31          align-items: center;
    32      }
    33  
    34      .mdc-list-item:hover .mdc-list-item__ripple::before {
    35          opacity: 0.04;
    36      }
    37  
    38      .mdc-list-item__ripple {
    39          position: absolute;
    40          top: 0;
    41          left: 0;
    42          width: 100%;
    43          height: 100%;
    44          pointer-events: none;
    45      }
    46  
    47      .mdc-list-item__ripple::before,
    48      .mdc-list-item__ripple::after {
    49          position: absolute;
    50          border-radius: 50%;
    51          opacity: 0;
    52          pointer-events: none;
    53          content: '';
    54          background-color: #000;
    55          top: -50%;
    56          left: -50%;
    57          width: 200%;
    58          height: 200%;
    59      }
    60  }