mirror of
https://github.com/FrankerFaceZ/FrankerFaceZ.git
synced 2025-07-05 10:38:30 +00:00
A bunch of CSS tweaks. Add chat appearance features to whisper messages. Fix various layout options now that the player has been modified for Mini Player support. Fix alternating row colors and subscription messages.
This commit is contained in:
parent
aef58f24af
commit
ddee1e3bb5
11 changed files with 79 additions and 5 deletions
|
@ -1,3 +1,7 @@
|
||||||
|
.thread-message__message,
|
||||||
|
.thread-message__timestamp,
|
||||||
|
.thread-message__warning,
|
||||||
|
|
||||||
.chat-line__message,
|
.chat-line__message,
|
||||||
.chat-line__moderation,
|
.chat-line__moderation,
|
||||||
.chat-line__status,
|
.chat-line__status,
|
||||||
|
@ -17,3 +21,13 @@
|
||||||
border-top-color: transparent !important;
|
border-top-color: transparent !important;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.thread-message__message,
|
||||||
|
.thread-message__timestamp,
|
||||||
|
.thread-message__warning {
|
||||||
|
padding-top: 0 !important;
|
||||||
|
|
||||||
|
& > .pd-y-05 {
|
||||||
|
padding-top: calc(.5rem - 1px) !important;
|
||||||
|
}
|
||||||
|
}
|
|
@ -1,3 +1,7 @@
|
||||||
|
.thread-message__message,
|
||||||
|
.thread-message__timestamp,
|
||||||
|
.thread-message__warning,
|
||||||
|
|
||||||
.chat-line__message,
|
.chat-line__message,
|
||||||
.chat-line__moderation,
|
.chat-line__moderation,
|
||||||
.chat-line__status,
|
.chat-line__status,
|
||||||
|
@ -17,3 +21,13 @@
|
||||||
border-top-color: transparent !important;
|
border-top-color: transparent !important;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.thread-message__message,
|
||||||
|
.thread-message__timestamp,
|
||||||
|
.thread-message__warning {
|
||||||
|
padding-top: 0 !important;
|
||||||
|
|
||||||
|
& > .pd-y-05 {
|
||||||
|
padding-top: calc(.5rem - 1px) !important;
|
||||||
|
}
|
||||||
|
}
|
|
@ -1,3 +1,7 @@
|
||||||
|
.thread-message__message,
|
||||||
|
.thread-message__timestamp,
|
||||||
|
.thread-message__warning,
|
||||||
|
|
||||||
.chat-line__message,
|
.chat-line__message,
|
||||||
.chat-line__moderation,
|
.chat-line__moderation,
|
||||||
.chat-line__status,
|
.chat-line__status,
|
||||||
|
@ -15,3 +19,13 @@
|
||||||
border-top-color: transparent !important;
|
border-top-color: transparent !important;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.thread-message__message,
|
||||||
|
.thread-message__timestamp,
|
||||||
|
.thread-message__warning {
|
||||||
|
padding-top: 0 !important;
|
||||||
|
|
||||||
|
& > .pd-y-05 {
|
||||||
|
padding-top: calc(.5rem - 1px) !important;
|
||||||
|
}
|
||||||
|
}
|
|
@ -1,3 +1,7 @@
|
||||||
|
.thread-message__message,
|
||||||
|
.thread-message__timestamp,
|
||||||
|
.thread-message__warning,
|
||||||
|
|
||||||
.chat-line__message,
|
.chat-line__message,
|
||||||
.chat-line__moderation,
|
.chat-line__moderation,
|
||||||
.chat-line__status,
|
.chat-line__status,
|
||||||
|
@ -15,3 +19,13 @@
|
||||||
border-bottom-color: transparent !important;
|
border-bottom-color: transparent !important;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.thread-message__message,
|
||||||
|
.thread-message__timestamp,
|
||||||
|
.thread-message__warning {
|
||||||
|
padding-bottom: 0 !important;
|
||||||
|
|
||||||
|
& > .pd-y-05 {
|
||||||
|
padding-bottom: calc(.5rem - 1px) !important;
|
||||||
|
}
|
||||||
|
}
|
|
@ -1,3 +1,4 @@
|
||||||
|
.whispers-thread__content,
|
||||||
.chat-list {
|
.chat-list {
|
||||||
font-size: var(--ffz-chat-font-size);
|
font-size: var(--ffz-chat-font-size);
|
||||||
line-height: var(--ffz-chat-line-height);
|
line-height: var(--ffz-chat-line-height);
|
||||||
|
|
|
@ -1,15 +1,20 @@
|
||||||
|
.thread-message__message,
|
||||||
|
.thread-message__timestamp,
|
||||||
|
.thread-message__warning,
|
||||||
|
|
||||||
.chat-line__moderation,
|
.chat-line__moderation,
|
||||||
.chat-line__status,
|
.chat-line__status,
|
||||||
.chat-line__raid,
|
.chat-line__raid,
|
||||||
|
.chat-list__lines .chat-line__subscribe,
|
||||||
.chat-line__subscribe,
|
.chat-line__subscribe,
|
||||||
.chat-line__message {
|
.chat-line__message {
|
||||||
background-color: transparent;
|
background-color: transparent !important;
|
||||||
|
|
||||||
&:nth-child(2n+0) {
|
&:nth-child(2n+0) {
|
||||||
background-color: rgba(0,0,0,0.1);
|
background-color: rgba(0,0,0,0.1) !important;
|
||||||
|
|
||||||
.theme--dark & {
|
.theme--dark & {
|
||||||
background-color: rgba(255,255,255,0.05);
|
background-color: rgba(255,255,255,0.05) !important;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
@ -4,7 +4,7 @@ body .whispers--theatre-mode.whispers--right-column-expanded {
|
||||||
|
|
||||||
body .persistent-player--theatre,
|
body .persistent-player--theatre,
|
||||||
body .channel-page__video-player--theatre-mode {
|
body .channel-page__video-player--theatre-mode {
|
||||||
width: calc(100% - var(--ffz-chat-width));
|
width: calc(100% - var(--ffz-chat-width)) !important;
|
||||||
}
|
}
|
||||||
|
|
||||||
body .video-watch-page__right-column,
|
body .video-watch-page__right-column,
|
||||||
|
|
|
@ -2,6 +2,8 @@
|
||||||
top: 1rem !important;
|
top: 1rem !important;
|
||||||
|
|
||||||
.top-nav {
|
.top-nav {
|
||||||
|
z-index: 9999;
|
||||||
|
|
||||||
top: -4rem !important;
|
top: -4rem !important;
|
||||||
transition: top ease-in-out 75ms, bottom ease-in-out 75ms;
|
transition: top ease-in-out 75ms, bottom ease-in-out 75ms;
|
||||||
|
|
||||||
|
@ -9,4 +11,8 @@
|
||||||
top: 0 !important;
|
top: 0 !important;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.channel-header {
|
||||||
|
top: -4rem;
|
||||||
|
}
|
||||||
}
|
}
|
|
@ -38,6 +38,7 @@
|
||||||
left: 0 !important;
|
left: 0 !important;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.persistent-player--theatre,
|
||||||
.channel-page__video-player--theatre-mode {
|
.channel-page__video-player--theatre-mode {
|
||||||
left: unset !important;
|
left: unset !important;
|
||||||
right: 0;
|
right: 0;
|
||||||
|
|
4
src/sites/twitch-twilight/styles/fixes.scss
Normal file
4
src/sites/twitch-twilight/styles/fixes.scss
Normal file
|
@ -0,0 +1,4 @@
|
||||||
|
.theme--dark .live-channel-card__boxart {
|
||||||
|
border-right: none;
|
||||||
|
border-bottom: none;
|
||||||
|
}
|
|
@ -6,3 +6,4 @@
|
||||||
@import 'channel';
|
@import 'channel';
|
||||||
|
|
||||||
@import 'chat';
|
@import 'chat';
|
||||||
|
@import 'fixes';
|
Loading…
Add table
Add a link
Reference in a new issue