applications/drive/src/app/components/FolderTree/FloatingEllipsis.scss

   1 @use "sass:map";
   2 @import '~@proton/styles/scss/lib';
   3
   4 .floating-ellipsis {
   5         inline-size: 32px;
   6         inset-inline-start: 0;
   7         overflow: visible;
   8         block-size: 100%;
   9         background: linear-gradient(to right, transparent 0, var(--background-norm) 8px);
  10         position: absolute;
  11         opacity: 1;
  12         z-index: map.get($z-indexes, 'notifications');
  13         pointer-events: none;
  14         transition: opacity 150ms ease-in;
  15
  16         &::after {
  17                 content: '\2026';
  18                 position: absolute;
  19                 inset-inline-end: 0;
  20                 padding-inline-end: 8px;
  21                 inset-block-start: 50%;
  22                 transform: translate(0, -50%);
  23         }
  24
  25         &-hidden {
  26                 opacity: 0;
  27                 transition: opacity 150ms ease-in;
  28         }
  29 }