thePR0M3TH3AN/bitvid
1
0 Fork 0
mirror of https://github.com/PR0M3TH3AN/bitvid.git synced 2026-11-08 05:43:04 +00:00
Code Issues Packages Projects Releases Wiki Activity

Add visibility toggle to edit modal

Browse Source
This commit is contained in:
thePR0M3TH3AN committed 2025-10-08 10:07:19 -04:00
1 parent 31cad16403
commit fb07d706b1
3 files changed
+276 -1
Download Patch File Download Diff File Expand all files Collapse all files

No files matched your search

css/style.css
+51
View File
@@ -177,6 +177,57 @@ header img {
box-shadow: 0 0 0 0.125rem rgba(192, 132, 252, 0.65), var(--shadow-lg);
}
.video-visibility-toggle {
display: inline-flex;
align-items: center;
gap: 0.35rem;
border-radius: 9999px;
border: 1px solid rgba(30, 41, 59, 0.7);
background-color: rgba(15, 23, 42, 0.55);
padding: 0.35rem;
}
.video-visibility-toggle__option {
display: inline-flex;
align-items: center;
justify-content: center;
border-radius: 9999px;
border: 1px solid transparent;
background-color: rgba(15, 23, 42, 0.6);
color: rgba(203, 213, 225, 0.78);
font-size: 0.75rem;
font-weight: 600;
letter-spacing: 0.08em;
min-width: 5.5rem;
padding: 0.4rem 0.95rem;
text-transform: uppercase;
cursor: pointer;
transition: background-color 0.18s ease, color 0.18s ease,
border-color 0.18s ease, box-shadow 0.18s ease, opacity 0.18s ease;
}
.video-visibility-toggle__option:not(.is-disabled):hover {
background-color: rgba(148, 163, 184, 0.16);
color: rgba(226, 232, 240, 0.88);
}
.video-visibility-toggle__option[data-active="true"] {
background: linear-gradient(135deg, rgba(129, 140, 248, 0.4), rgba(192, 132, 252, 0.32));
color: #f8fafc;
border-color: rgba(129, 140, 248, 0.6);
box-shadow: 0 0 0 1px rgba(129, 140, 248, 0.4) inset,
0 6px 14px -6px rgba(129, 140, 248, 0.55);
}
.video-visibility-toggle__option.is-disabled {
opacity: 0.45;
cursor: not-allowed;
}
.video-visibility-toggle__option.is-disabled[data-active="true"] {
opacity: 0.65;
}
.video-card[data-owner-is-viewer="false"][data-url-health-state="offline"][data-stream-health-state="unhealthy"] {
display: none;
}