diff --git a/src/components/notification/notification.scss b/src/components/notification/notification.scss new file mode 100644 index 00000000..d0e63d81 --- /dev/null +++ b/src/components/notification/notification.scss @@ -0,0 +1,52 @@ +// TODO Copypaste from Status, should unify it somehow +.Notification { + &.-muted { + padding: 0.25em 0.6em; + height: 1.2em; + line-height: 1.2em; + text-overflow: ellipsis; + overflow: hidden; + display: flex; + flex-wrap: nowrap; + + & .status-username, + & .mute-thread, + & .mute-words { + word-wrap: normal; + word-break: normal; + white-space: nowrap; + } + + & .status-username, + & .mute-words { + text-overflow: ellipsis; + overflow: hidden; + } + + .status-username { + font-weight: normal; + flex: 0 1 auto; + margin-right: 0.2em; + font-size: smaller; + } + + .mute-thread { + flex: 0 0 auto; + } + + .mute-words { + flex: 1 0 5em; + margin-left: 0.2em; + + &::before { + content: ' '; + } + } + + .unmute { + flex: 0 0 auto; + margin-left: auto; + display: block; + } + } +} diff --git a/src/components/notification/notification.vue b/src/components/notification/notification.vue index 044ac871..7fac3840 100644 --- a/src/components/notification/notification.vue +++ b/src/components/notification/notification.vue @@ -7,7 +7,7 @@