chinwag/ChinwagUI
2
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Styling for sensitive media overlay

Browse source
This commit is contained in:
Niléane 2023-12-17 16:20:27 +01:00
commit 3242b7deaf
No known key found for this signature in database
3 changed files with 84 additions and 3 deletions
Download patch file Download diff file Expand all files Collapse all files

29
TangerineUI-cherry.css
View file

@ -1934,8 +1934,35 @@ div[tabindex="-1"] + div[tabindex="-1"] > .status__wrapper > .status-reply.statu
}
.app-body .media-gallery__preview,
.app-body .video-player {
background-color: var(--color-content-bg);
background-color: var(--color-content-secondary-bg);
}
.app-body .media-gallery__preview {
outline: 1px solid rgba(0, 0, 0, 0.05);
outline-offset: -1px;
height: calc(100% - 1px);
border-radius: 8px;
transition: all .2s;
}
.app-body .spoiler-button:hover + .media-gallery__item > .media-gallery__preview {
outline: 1px solid rgba(0, 0, 0, 0.15);
}
.app-body .spoiler-button__overlay__label,
.app-body .spoiler-button__overlay__label:is(:focus, :hover),
.app-body .spoiler-button__overlay:is(:focus, :hover) .spoiler-button__overlay__label {
backdrop-filter: none;
-webkit-backdrop-filter: none;
background-color: transparent;
color: var(--color-content-fg);
}
.app-body .spoiler-button__overlay__label > span:first-child {
font-weight: bold;
}
.app-body .media-gallery__gifv__label {
background-color: rgba(0, 0, 0, .1);
border-radius: 6px;
}
/* 📊 Polls */
.app-body .poll__chart,

29
TangerineUI-purple.css
View file

@ -1933,8 +1933,35 @@ div[tabindex="-1"] + div[tabindex="-1"] > .status__wrapper > .status-reply.statu
}
.app-body .media-gallery__preview,
.app-body .video-player {
background-color: var(--color-content-bg);
background-color: var(--color-content-secondary-bg);
}
.app-body .media-gallery__preview {
outline: 1px solid rgba(0, 0, 0, 0.05);
outline-offset: -1px;
height: calc(100% - 1px);
border-radius: 8px;
transition: all .2s;
}
.app-body .spoiler-button:hover + .media-gallery__item > .media-gallery__preview {
outline: 1px solid rgba(0, 0, 0, 0.15);
}
.app-body .spoiler-button__overlay__label,
.app-body .spoiler-button__overlay__label:is(:focus, :hover),
.app-body .spoiler-button__overlay:is(:focus, :hover) .spoiler-button__overlay__label {
backdrop-filter: none;
-webkit-backdrop-filter: none;
background-color: transparent;
color: var(--color-content-fg);
}
.app-body .spoiler-button__overlay__label > span:first-child {
font-weight: bold;
}
.app-body .media-gallery__gifv__label {
background-color: rgba(0, 0, 0, .1);
border-radius: 6px;
}
/* 📊 Polls */
.app-body .poll__chart,

29
TangerineUI.css
View file

@ -1933,8 +1933,35 @@ div[tabindex="-1"] + div[tabindex="-1"] > .status__wrapper > .status-reply.statu
}
.app-body .media-gallery__preview,
.app-body .video-player {
background-color: var(--color-content-bg);
background-color: var(--color-content-secondary-bg);
}
.app-body .media-gallery__preview {
outline: 1px solid rgba(0, 0, 0, 0.05);
outline-offset: -1px;
height: calc(100% - 1px);
border-radius: 8px;
transition: all .2s;
}
.app-body .spoiler-button:hover + .media-gallery__item > .media-gallery__preview {
outline: 1px solid rgba(0, 0, 0, 0.15);
}
.app-body .spoiler-button__overlay__label,
.app-body .spoiler-button__overlay__label:is(:focus, :hover),
.app-body .spoiler-button__overlay:is(:focus, :hover) .spoiler-button__overlay__label {
backdrop-filter: none;
-webkit-backdrop-filter: none;
background-color: transparent;
color: var(--color-content-fg);
}
.app-body .spoiler-button__overlay__label > span:first-child {
font-weight: bold;
}
.app-body .media-gallery__gifv__label {
background-color: rgba(0, 0, 0, .1);
border-radius: 6px;
}
/* 📊 Polls */
.app-body .poll__chart,