mirror of
https://github.com/FrankerFaceZ/FrankerFaceZ.git
synced 2025-08-03 16:38:31 +00:00
* Added: Link Cards. As an option, you can open a preview card when clicking on links in chat. These preview cards function similarly to the existing tool-tip or rich embed options but can provide for enhanced interaction (e.g. an embedded video player), with potential for more in the future. * Changed: When using a custom theme with a dark background, use lighter border colors. * Changed: Draw the FFZ Control Center and other dialogs with rounded corners. * Fixed: Issue when clicking certain global Twitch emotes preventing the emote card from appearing correctly. * Fixed: Issue with URL/safety data not being loaded correctly from the link service when the overall result was an error. * Fixed: Issue with link tool-tips still appearing, but with no content, when link tool-tips are disabled. * Fixed: Issue where (re)subscription notices in chat for multiple-month-at-once subscriptions would not be displayed correctly. * Fixed: Tool-tips not displaying correctly in chat pop-outs in some circumstances. * Fixed: Incorrect border styles when the chat is in portrait mode. * Experiment Added: Set up an MQTT-based PubSub system. Let's see how well this scales.
86 lines
No EOL
1.3 KiB
SCSS
86 lines
No EOL
1.3 KiB
SCSS
.ffz-dialog {
|
|
&:not(.maximized) {
|
|
position: absolute;
|
|
top: 25%;
|
|
left: 25%;
|
|
|
|
z-index: 99999999;
|
|
|
|
--width: #{"min(75vw, 128rem)"};
|
|
--height: #{"min(75vh, calc(0.75 * var(--width)))"};
|
|
|
|
top: #{"calc(calc(100vh - var(--height)) / 2)"};
|
|
left: #{"calc(calc(100vw - var(--width)) / 2)"};
|
|
|
|
min-width: 64rem;
|
|
min-height: 30rem;
|
|
|
|
max-width: 75vw;
|
|
max-height: 75vh;
|
|
|
|
width: 75vw;
|
|
width: var(--width);
|
|
|
|
height: 50vh;
|
|
height: var(--height);
|
|
|
|
border-radius: var(--border-radius-extra-large);
|
|
|
|
> header {
|
|
cursor: move;
|
|
border-top-left-radius: var(--border-radius-extra-large);
|
|
border-top-right-radius: var(--border-radius-extra-large);
|
|
}
|
|
|
|
&.faded {
|
|
opacity: 0.5;
|
|
|
|
&:hover {
|
|
opacity: 0.75;
|
|
}
|
|
}
|
|
}
|
|
|
|
&.maximized {
|
|
position: absolute;
|
|
top: 0 !important;
|
|
left: 0 !important;
|
|
|
|
width: 100%;
|
|
height: 100%;
|
|
|
|
&, .tw-root--theme-dark & {
|
|
border: none !important;
|
|
}
|
|
|
|
> header {
|
|
cursor: default;
|
|
padding: .9rem 3rem;
|
|
}
|
|
}
|
|
|
|
&.exclusive {
|
|
z-index: 1000;
|
|
}
|
|
|
|
.want-ps {
|
|
overflow-y: auto;
|
|
}
|
|
|
|
> header {
|
|
user-select: none;
|
|
padding: .9rem 1rem .9rem 2rem;
|
|
|
|
.tw-search-input {
|
|
max-width: 40rem
|
|
}
|
|
}
|
|
}
|
|
|
|
.ffz-has-dialog {
|
|
position: relative;
|
|
|
|
& > :not(.ffz-dialog):not(.ffz__tooltip) {
|
|
visibility: hidden;
|
|
}
|
|
} |