logo

pleroma-fe

My custom branche(s) on git.pleroma.social/pleroma/pleroma-fe git clone https://anongit.hacktivis.me/git/pleroma-fe.git/

notification.scss (1678B)

    

  1. // TODO Copypaste from Status, should unify it somehow
  2. .Notification {
  3.   border-bottom: 1px solid;
  4.   border-color: var(--border);
  5.   word-wrap: break-word;
  6.   word-break: break-word;
  8.   &.Status {
  9.     /* stylelint-disable-next-line declaration-no-important */
  10.     background-color: transparent !important;
  11.   }
  13.   --emoji-size: 1em;
  15.   &:hover {
  16.     --_still-image-img-visibility: visible;
  17.     --_still-image-canvas-visibility: hidden;
  18.     --_still-image-label-visibility: hidden;
  19.   }
  21.   &.-muted {
  22.     padding: 0.25em 0.6em;
  23.     height: 1.2em;
  24.     line-height: 1.2em;
  25.     text-overflow: ellipsis;
  26.     overflow: hidden;
  27.     display: flex;
  28.     flex-wrap: nowrap;
  29.     gap: 1ex;
  31.     & .status-username,
  32.     & .mute-thread,
  33.     & .mute-words {
  34.       word-wrap: normal;
  35.       word-break: normal;
  36.       white-space: nowrap;
  37.     }
  39.     & .status-username,
  40.     & .mute-words {
  41.       text-overflow: ellipsis;
  42.       overflow: hidden;
  43.     }
  45.     .status-username {
  46.       font-weight: normal;
  47.       flex: 0 1 auto;
  48.       margin-right: 0.2em;
  49.       font-size: smaller;
  50.     }
  52.     .mute-thread {
  53.       flex: 0 0 auto;
  54.     }
  56.     .mute-words {
  57.       flex: 1 0 5em;
  58.       margin-left: 0.2em;
  60.       &::before {
  61.         content: " ";
  62.       }
  63.     }
  65.     .unmute {
  66.       flex: 0 0 auto;
  67.       margin-left: auto;
  68.       display: block;
  69.     }
  70.   }
  72.   .type-icon {
  73.     margin: 0 0.1em;
  74.   }
  76.   &.-type--repeat .type-icon {
  77.     color: var(--cGreen);
  78.   }
  80.   &.-type--follow .type-icon {
  81.     color: var(--cBlue);
  82.   }
  84.   &.-type--follow-request .type-icon {
  85.     color: var(--cBlue);
  86.   }
  88.   &.-type--like .type-icon {
  89.     color: var(--cOrange);
  90.   }
  92.   &.-type--move .type-icon {
  93.     color: var(--cBlue);
  94.   }
  95. }