f0ck algos

This commit is contained in:
2026-09-12 04:25:49 +02:00
parent b55a17dc85
commit 2913b03d50
12 changed files with 1756 additions and 22 deletions
+442 -12
View File
@@ -2229,7 +2229,7 @@ html[theme='95'] .item-main-content .metadata {
width: 320px;
background: var(--dropdown-bg);
border: 1px solid var(--nav-border-color);
z-index: 1000;
z-index: 10000 !important;
}
/* Arrow caret pointing up toward the icon */
@@ -2585,6 +2585,7 @@ body.layout-modern .global-sidebar-right {
display: flex;
align-items: center;
justify-content: center;
top: var(--navbar-h, 50px) !important;
opacity: 0;
transition: opacity 0.2s ease;
}
@@ -2625,6 +2626,7 @@ body.sidebar-right-hidden #sidebar-drag-zone {
display: flex;
align-items: center;
justify-content: flex-start;
top: var(--navbar-h, 50px) !important;
padding-left: 10px;
opacity: 0;
transition: opacity 0.2s ease;
@@ -2918,6 +2920,432 @@ body.sidebar-right-hidden #sidebar-drag-zone {
letter-spacing: 1px;
}
/* Sidebar Tabs */
.sidebar-tabs {
display: flex;
width: 100%;
background: var(--nav-bg);
border-bottom: 1px solid var(--nav-border-color);
user-select: none;
flex-shrink: 0;
z-index: 2;
}
.sidebar-tab {
flex: 1;
display: flex;
align-items: center;
justify-content: center;
padding: 11px 0;
background: transparent;
border: none;
outline: none;
cursor: pointer;
color: var(--text-color, #888);
opacity: 0.55;
font-size: 1.15em;
position: relative;
transition: color 0.2s ease, opacity 0.2s ease, background-color 0.2s ease;
}
.sidebar-tab:hover {
color: var(--accent);
opacity: 0.9;
background: rgba(255, 255, 255, 0.03);
}
.sidebar-tab.active {
color: var(--accent);
opacity: 1;
}
.sidebar-tab::after {
content: '';
position: absolute;
bottom: -1px;
left: 20%;
right: 20%;
height: 2px;
background: transparent;
transition: background-color 0.2s ease;
border-radius: 2px 2px 0 0;
}
.sidebar-tab.active::after {
background: var(--accent);
}
/* Sidebar Tab Content panels */
.sidebar-tab-content {
display: none;
flex: 1;
min-height: 0;
overflow-y: auto;
scrollbar-width: none;
touch-action: pan-y;
}
.sidebar-tab-content::-webkit-scrollbar {
display: none;
}
.sidebar-tab-content.active {
display: block;
}
/* Video Recommendations List */
.sidebar-recommendations-list {
flex: 1;
overflow-y: auto;
scrollbar-width: none;
padding: 6px;
touch-action: pan-y;
}
.sidebar-recommendations-list::-webkit-scrollbar {
display: none;
}
/* Recommendation Video Cards (YouTube-style) */
.sidebar-video-card {
margin-bottom: 5px;
border-radius: 8px;
padding: 5px;
overflow: hidden;
background: rgba(255, 255, 255, 0.02);
border: 1px solid rgba(255, 255, 255, 0.05);
transition: background-color 0.2s ease, border-color 0.2s ease, transform 0.2s ease;
}
.sidebar-video-card:hover {
background: rgba(255, 255, 255, 0.06);
border-color: rgba(255, 255, 255, 0.12);
transform: translateY(-1px);
}
.sidebar-video-card:active {
transform: scale(0.99);
}
.sidebar-video-card.sidebar-card-swapping {
opacity: 0.35;
filter: grayscale(0.6);
transition: opacity 0.5s ease, filter 0.5s ease;
}
.sidebar-video-card.sidebar-card-entering {
animation: sidebarCardEnter 2s cubic-bezier(0.16, 1, 0.3, 1) forwards;
}
@keyframes sidebarCardEnter {
0% {
opacity: 0;
transform: scale(0.91) translateY(8px);
filter: brightness(1.2) contrast(0.95);
}
40% {
opacity: 0.75;
transform: scale(0.97) translateY(3px);
}
75% {
opacity: 0.95;
transform: scale(0.995) translateY(0.5px);
}
100% {
opacity: 1;
transform: scale(1) translateY(0);
filter: brightness(1) contrast(1);
}
}
.sidebar-video-card .sidebar-video-link {
display: flex;
flex-direction: column;
text-decoration: none;
color: inherit;
}
.sidebar-video-thumb-wrap {
position: relative;
width: 100%;
aspect-ratio: 16 / 9;
border-radius: 6px;
overflow: hidden;
background: #000;
}
.sidebar-video-thumb {
width: 100%;
height: 100%;
object-fit: cover;
display: block;
transition: transform 0.3s ease;
}
.sidebar-video-card:hover .sidebar-video-thumb {
transform: scale(1.04);
}
.sidebar-video-play-overlay {
position: absolute;
inset: 0;
display: flex;
align-items: center;
justify-content: center;
background: rgba(0, 0, 0, 0.25);
color: #fff;
font-size: 1.2em;
opacity: 0;
transition: opacity 0.2s ease, background 0.2s ease;
}
.sidebar-video-play-overlay i {
width: 38px;
height: 38px;
border-radius: 50%;
background: rgba(0, 0, 0, 0.65);
display: flex;
align-items: center;
justify-content: center;
padding-left: 3px;
border: 1px solid rgba(255, 255, 255, 0.2);
box-shadow: 0 4px 12px rgba(0, 0, 0, 0.5);
}
.sidebar-video-card:hover .sidebar-video-play-overlay {
opacity: 1;
background: rgba(0, 0, 0, 0.35);
}
.sidebar-video-badge {
position: absolute;
bottom: 6px;
right: 6px;
font-size: 0.65em;
font-weight: 700;
padding: 2px 5px;
border-radius: 3px;
text-transform: uppercase;
line-height: 1;
letter-spacing: 0.5px;
color: #fff;
text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.8);
box-shadow: 0 1px 3px rgba(0, 0, 0, 0.4);
}
.sidebar-video-badge.rating-sfw {
background-color: var(--badge-sfw);
border: 1px solid rgba(0, 0, 0, 0.2);
}
.sidebar-video-badge.rating-nsfw {
background-color: var(--badge-nsfw);
border: 1px solid rgba(0, 0, 0, 0.2);
}
.sidebar-video-badge.rating-nsfl {
background-color: var(--badge-nsfl);
border: 1px solid rgba(0, 0, 0, 0.2);
}
.sidebar-video-badge.rating-untagged {
background-color: var(--badge-tag, #37474f);
border: 1px dashed rgba(255, 255, 255, 0.35);
}
.sidebar-media-format-badge {
position: absolute;
top: 6px;
left: 6px;
font-size: 0.6em;
font-weight: 700;
padding: 2px 5px;
border-radius: 3px;
background: rgba(0, 0, 0, 0.75);
color: #fff;
letter-spacing: 0.5px;
backdrop-filter: blur(4px);
border: 1px solid rgba(255, 255, 255, 0.15);
line-height: 1;
}
.sidebar-media-placeholder {
position: absolute;
inset: 0;
display: flex;
align-items: center;
justify-content: center;
background: linear-gradient(135deg, #1e1b4b, #312e81);
color: var(--accent);
font-size: 2em;
}
.sidebar-media-placeholder.audio {
background: linear-gradient(135deg, #0f172a, #1e293b);
color: #38bdf8;
}
.sidebar-media-placeholder.hidden {
display: none !important;
}
.sidebar-video-details {
display: flex;
margin-top: 8px;
}
.sidebar-video-info {
display: flex;
flex-direction: column;
flex: 1;
min-width: 0;
}
.sidebar-video-title {
font-size: 0.86em;
font-weight: 600;
color: var(--text-color, #eee);
line-height: 1.35;
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
overflow: hidden;
word-break: break-word;
transition: color 0.15s ease;
}
.sidebar-video-card:hover .sidebar-video-title {
color: var(--accent);
}
.sidebar-video-channel {
font-size: 0.76em;
color: #999;
margin-top: 3px;
line-height: 1.2;
}
.sidebar-video-user {
font-weight: 500;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
display: inline-block;
max-width: 100%;
}
.sidebar-video-meta {
display: flex;
align-items: center;
gap: 5px;
font-size: 0.7em;
color: #777;
margin-top: 2px;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
.sidebar-video-time {
opacity: 0.85;
}
.sidebar-video-xd {
font-size: 0.8em;
font-weight: bold;
padding: 0 4px;
border-radius: 2px;
display: inline-block;
background: rgba(255, 255, 255, 0.08);
color: var(--accent);
}
.sidebar-personalized-pill {
display: inline-flex;
align-items: center;
gap: 3px;
color: var(--accent, #a78bfa);
font-weight: 600;
letter-spacing: 0.02em;
}
.sidebar-personalized-pill i {
font-size: 0.9em;
}
/* Light / Paper themes */
html[theme='light'] .sidebar-tabs,
html[theme='paper'] .sidebar-tabs {
background: #ffffff;
border-bottom: 1px solid #e2e8f0;
}
html[theme='light'] .sidebar-tab,
html[theme='paper'] .sidebar-tab {
color: #64748b;
}
html[theme='light'] .sidebar-tab:hover,
html[theme='paper'] .sidebar-tab:hover {
background: #f8fafc;
}
html[theme='light'] .sidebar-video-card,
html[theme='paper'] .sidebar-video-card {
background: #ffffff;
border: 1px solid #e2e8f0;
box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05);
}
html[theme='light'] .sidebar-video-card:hover,
html[theme='paper'] .sidebar-video-card:hover {
background: #f8fafc;
border-color: #cbd5e1;
}
html[theme='light'] .sidebar-video-title,
html[theme='paper'] .sidebar-video-title {
color: #0f172a;
}
html[theme='light'] .sidebar-video-channel,
html[theme='paper'] .sidebar-video-channel {
color: #64748b;
}
html[theme='light'] .sidebar-video-play-overlay,
html[theme='paper'] .sidebar-video-play-overlay {
background: rgba(0, 0, 0, 0.2);
}
/* Theme 95 */
html[theme='95'] .sidebar-tabs {
background: #c0c0c0;
border-bottom: 2px solid #808080;
}
html[theme='95'] .sidebar-tab {
border-right: 1px solid #808080;
color: #000;
}
html[theme='95'] .sidebar-tab.active {
background: #dfdfdf;
box-shadow: inset 1px 1px 0 #fff, inset -1px -1px 0 #808080;
}
html[theme='95'] .sidebar-video-card {
background: #c0c0c0;
border: 2px solid #808080;
border-right-color: #fff;
border-bottom-color: #fff;
}
html[theme='95'] .sidebar-video-title {
color: #000;
font-family: 'MS Sans Serif', sans-serif;
}
#sidebar-activity-container.sidebar-comments-list {
flex: 1;
overflow-y: auto;
@@ -9735,7 +10163,7 @@ input#s_avatar {
background: var(--dropdown-bg);
border: 1px solid var(--nav-border-color);
border-radius: 0;
z-index: 10000;
z-index: 10000 !important;
overflow: hidden;
}
@@ -11010,10 +11438,6 @@ video.sidebar-comment-img.emoji {
margin-right: 4px;
}
.sidebar-video-link:hover {
text-decoration: underline;
}
.comment-content img:not(.emoji) {
display: block;
cursor: pointer;
@@ -11522,7 +11946,7 @@ div.sbt {
body > nav.navbar {
position: sticky !important;
top: 0 !important;
z-index: 1005 !important;
z-index: 10070 !important;
width: 100% !important;
display: flex !important;
flex-direction: row !important;
@@ -11648,17 +12072,22 @@ body > nav.navbar {
}
/* Right-anchor all dropdowns inside nav-right-group */
.nav-right-group .nav-user-menu {
.nav-right-group .nav-user-menu,
#nav-user-menu,
#nav-visitor-menu {
left: auto;
right: 0;
transform: none;
z-index: 10000 !important;
}
.nav-right-group .notif-dropdown {
.nav-right-group .notif-dropdown,
#notif-dropdown {
left: auto;
right: 0;
/* anchor to bell container right edge; JS overrides on mobile */
transform: none;
z-index: 10000 !important;
}
/* Shift arrow to sit directly under the bell icon */
@@ -19075,7 +19504,7 @@ body.onara-modal-open nav.navbar {
opacity: 1 !important;
filter: none !important;
pointer-events: auto !important;
z-index: 10060 !important;
z-index: 10070 !important;
position: fixed !important;
top: 0 !important;
left: 0 !important;
@@ -19084,7 +19513,7 @@ body.onara-modal-open nav.navbar {
/* Ensure hamburger dropdown is interactive and above the Onara modal */
body.onara-modal-open nav.navbar .nav-collapse {
z-index: 10065 !important;
z-index: 10075 !important;
pointer-events: auto !important;
}
@@ -19098,7 +19527,8 @@ body.onara-modal-open .global-sidebar-right {
body.onara-modal-open #sidebar-drag-zone {
opacity: 1 !important;
pointer-events: auto !important;
z-index: 10061 !important;
z-index: 10059 !important;
top: var(--navbar-h, 50px) !important;
}
body.onara-modal-open .admin-bar {