diff --git a/src/App.vue b/src/App.vue index 080127e1..d3096194 100644 --- a/src/App.vue +++ b/src/App.vue @@ -18,23 +18,16 @@ --efy_color1_var: 239, 68, 68; --efy_color2_var: 220, 38, 38; --efy_radius: 12rem; - --efy_sidebar_button: right_middle; + --efy_sidebar_button: right_middle, off; --efy_font_family: "nunito", sans-serif, -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Helvetica Neue, Arial, Noto Sans, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol, Noto Color Emoji; - --efy_body_width: unset; + --efy_body_width: 100%; --efy_audio_path: ./audio; - --efy_modules: efy_quick, efy_mode, efy_filters, efy_backup, efy_accessibility, efy_audio; - - --efy_module_quick: on; - --efy_module_mode: on; - --efy_module_filters: on; - --efy_module_backup: on; - --efy_module_accessibility: on; - --efy_module_audio: on; + --efy_modules: efy_quick, efy_mode, efy_filters, efy_backup, efy_accessibility, efy_audio, efy_keyboard, efy_extra; } body { - @apply max-w-100vw p-16rem; + @apply p-16rem; } /*Default Mode*/ @@ -49,10 +42,8 @@ body { input, .btn, button, -.shaka-video-container, -.shaka-video-container video, -.video-grid div, -.pp-show-recs div, +.pp-show-playlist, +:is(.video-grid, .pp-show-recs, .pp-show-playlist) div, .grid .comment, .shaka-scrim-container, .suggestion-selected, @@ -60,12 +51,14 @@ button, .shaka-text-container span > span > span { border-radius: var(--efy_radius); } +.shaka-video-container, +.shaka-video-container video, +video { + border-radius: var(--efy_radius) !important; +} /*Radius 0*/ -.video-grid img, -.thumbnail-overlay, -.thumbnail-left, -.thumbnail-right { +.video-grid img { border-radius: var(--efy_radius0); } @@ -74,6 +67,87 @@ button, .modal-container { border-radius: var(--efy_radius2); } + +.pp-full-width :is(.comment, .comment-content) { + width: 100%; +} +:is(.pp-trans, .pp-solid).shaka-text-container, +:is(.pp-trans, .pp-solid).shaka-text-container * { + background: transparent !important; + text-shadow: 0 0 15rem #000 !important; + backdrop-filter: none !important; +} +.pp-solid.shaka-text-container .shaka-text-wrapper * { + background: #000 !important; + backdrop-filter: none !important; + text-shadow: none !important; +} +.pp-video-card-title { + display: -webkit-box; + -webkit-line-clamp: 2; + -webkit-box-orient: vertical; + margin: 0 0 5rem 0; + line-height: 22rem; +} +.pp-video-card-buttons { + display: flex; + flex-wrap: wrap; + gap: 10rem; + margin: 5rem 0 0; +} +.pp-video-card-buttons :is(a, button) { + padding: 4rem 8rem; + margin: 0; + border: var(--efy_border); + color: var(--efy_text); + -webkit-text-fill-color: var(--efy_text); +} +.pp-video-card-buttons :is(a:not(.pp-color), button:not(.pp-color)) { + background: var(--efy_bg1); +} +.pp-video-card-buttons .pp-color { + color: var(--efy_text2); + -webkit-text-fill-color: var(--efy_text2); + border: 0; + padding: 6rem 10rem; + height: 35rem; +} +.pp-video-card-channel > .pp-text { + line-height: 20rem; + background: var(--efy_bg1) !important; + border: var(--efy_border) !important; + display: flex; + width: fit-content; + height: 36rem; + place-items: center; + padding: 0 10rem; + overflow: hidden; +} +.pp-video-card-channel > .pp-text span { + overflow: hidden; + text-overflow: ellipsis; + white-space: nowrap; + max-width: 160rem; +} +.pp-video-card-channel > .pp-text strong span { + font-weight: normal; + font-size: 14rem !important; +} +.pp-video-card-channel { + display: flex; + gap: 10rem; + place-items: center; + background: transparent; + margin: 10rem 0 0; + width: fit-content; +} +.pp-video-card-channel > a { + height: 36rem; + width: 36rem; +} +:is(.pp-video-card-channel > a, .pp-video-card-channel > .pp-text):empty { + display: none; +}