LogalDeveloper/owncast
0
Fork 0
Code Activity

fix(web): improve sizing and spacing of offline embed. Closes #4133

Browse Source
This commit is contained in:
Gabe Kangas
2025-01-17 15:39:41 -08:00
parent 6017d575c8
commit 47857e283e
1 changed files with 6 additions and 5 deletions
Download Patch File Download Diff File Expand all files Collapse all files

11
web/components/ui/OfflineEmbed/OfflineEmbed.module.scss
View File

@@ -35,7 +35,7 @@ $follow-modal-width: 300px;
display: flex; display: flex;
flex-flow: column nowrap; flex-flow: column nowrap;
align-items: center; align-items: center;
gap: 2rem; gap: clamp(15px, 7vh, 50px);
padding: 24px; padding: 24px;
text-align: center; text-align: center;
width: 100vw; width: 100vw;
@@ -51,7 +51,7 @@ $follow-modal-width: 300px;
gap: 8px; gap: 8px;
width: 100%; width: 100%;
margin: 0; margin: 0;
font-size: 1em; font-size: clamp(1em, 1.5em, 5vh);
} }
.messageContainer { .messageContainer {
@@ -84,13 +84,14 @@ $follow-modal-width: 300px;
color: var(--text-color); color: var(--text-color);
font-family: var(--theme-text-body-font-family); font-family: var(--theme-text-body-font-family);
font-style: normal; font-style: normal;
font-size: 1em; font-size: clamp(1em, 4.8vh, 20px);
line-height: 1.375; line-height: clamp(1.3em, 8vh, 35px);
letter-spacing: 0; letter-spacing: 0;
text-decoration: none; text-decoration: none;
text-transform: none; text-transform: none;
display: block; display: block;
margin: auto; margin: auto;
margin-top: 2vh;
@include screen(desktop) { @include screen(desktop) {
width: 80%; width: 80%;
@@ -102,7 +103,7 @@ $follow-modal-width: 300px;
color: var(--text-color); color: var(--text-color);
font-family: var(--theme-text-display-font-family); font-family: var(--theme-text-display-font-family);
font-style: normal; font-style: normal;
font-size: 1.375em; font-size: clamp(1.3em, 5vh, 2em);
font-weight: 600; font-weight: 600;
line-height: 1.125; line-height: 1.125;
letter-spacing: -0.125px; letter-spacing: -0.125px;