mirror of
https://github.com/PR0M3TH3AN/bitvid.git
synced 2026-10-27 07:52:24 +00:00
chore: regenerate tailwind css
This commit is contained in:
1 parent
75ebd52046
commit
85f143c4dd
3 files changed
+250
-332
No files matched your search
@@ -1,7 +1,7 @@
|
||||
:root{--surface-base:var(--color-surface);--surface-alt:var(--color-surface-alt);--surface-raised:var(--color-card);--surface-raised-private:var(--color-card-private);--surface-raised-critical:var(--color-card-critical);--surface-panel:var(--color-panel);--surface-panel-hover:var(--color-panel-hover);--surface-sunken:var(--color-surface-sunken);--surface-muted:var(--color-surface-muted);--surface-veil:var(--color-overlay-veil);--surface-inverse:var(--color-page);--surface-overlay:var(--color-overlay);--surface-overlay-muted:var(--color-overlay-muted);--surface-overlay-strong:var(--color-overlay-strong);--surface-overlay-darker:var(--color-overlay-darker);--surface-overlay-black:var(--color-overlay-black);--surface-overlay-banner-base:var(--color-page);--surface-overlay-banner:var(--surface-overlay-banner-base);--surface-overlay-banner-opaque:var(--surface-overlay-banner-base);--surface-overlay-banner-strong:color-mix(in srgb,var(--surface-overlay-banner-base) 82%,transparent);--surface-overlay-banner-bottom:color-mix(in srgb,var(--surface-overlay-banner-base) 50%,transparent);--surface-overlay-banner-channel-mid:color-mix(in srgb,var(--surface-overlay-banner-base) 24%,transparent);--surface-overlay-banner-channel-faint:color-mix(in srgb,var(--surface-overlay-banner-base) 10%,transparent);--surface-overlay-banner-soft:color-mix(in srgb,var(--surface-overlay-banner-base) 56%,transparent);--surface-overlay-banner-faint:color-mix(in srgb,var(--surface-overlay-banner-base) 18%,transparent);--surface-overlay-banner-transparent:transparent;--surface-overlay-banner-gradient-header:linear-gradient(to bottom,var(--surface-overlay-banner-opaque) 0%,var(--surface-overlay-banner-strong) 38%,var(--surface-overlay-banner-soft) 70%,var(--surface-overlay-banner-faint) 88%,var(--surface-overlay-banner-transparent) 100%);--surface-overlay-banner-gradient-channel:linear-gradient(to top,var(--surface-overlay-banner-bottom) 0%,var(--surface-overlay-banner-channel-mid) 28%,var(--surface-overlay-banner-channel-faint) 42%,var(--surface-overlay-banner-transparent) 50%);--surface-overlay-banner-gradient:var(
|
||||
--surface-overlay-banner-gradient-header
|
||||
);--surface-overlay-panel:var(--color-overlay-panel);--surface-overlay-panel-soft:var(--color-overlay-panel-soft);--surface-overlay-panel-tint:var(--color-overlay-panel-tint);--surface-overlay-panel-glass:var(--color-overlay-panel-glass);--surface-overlay-panel-glass-soft:var(--color-overlay-panel-glass-soft);--surface-modal-backdrop:var(--color-modal-backdrop);--surface-modal:var(--color-modal-surface);--blur-modal-backdrop:18px;--blur-modal-alert:14px;--blur-thumbnail-blur:18px;--modal-nav-backdrop-blur:6px;--app-header-centerline-offset:calc(var(--space-sm) + var(--space-2xl-plus)/2);--border-default:var(--color-border);--border-subtle:var(--color-border-subtle);--border-strong:var(--color-border-translucent-stronger);--border-overlay:var(--color-border-translucent);--border-overlay-strong:var(--color-border-translucent-strongest);--border-overlay-glow:var(--color-border-translucent-glow);--border-neutral-soft:var(--color-border-neutral-soft);--border-info-soft:var(--color-border-info-soft);--border-sidebar-strong:var(--color-border-sidebar-strong);--border-width-hairline:1px;--border-width-fine:0.5px;--text-primary:var(--color-text);--text-inverse:var(--color-text-inverse);--text-muted:var(--color-text-muted);--text-muted-strong:var(--color-muted-strong);--text-subtle:var(--color-subtle-text);--text-frosted-primary:var(--color-text-frosted);--text-frosted-strong:var(--color-text-frosted-strong);--text-frosted-soft:var(--color-text-frosted-soft);--status-info:var(--color-info);--status-info-strong:var(--color-info-strong);--status-info-surface:var(--color-info-glass);--status-info-border:var(--color-info-border);--status-info-on:var(--color-info-on);--status-success:var(--color-success);--status-success-strong:var(--color-success-strong);--status-success-surface:var(--color-success-surface);--status-success-border:var(--color-success-border);--status-success-on:var(--color-success-on);--status-warning:var(--color-warning);--status-warning-strong:var(--color-warning-strong);--status-warning-surface:var(--color-warning-surface);--status-warning-border:var(--color-warning-border);--status-warning-on:var(--color-warning-on);--status-danger:var(--color-critical);--status-danger-strong:var(--color-critical-strong);--status-danger-surface:var(--color-danger-surface);--status-danger-border:var(--color-danger-border);--status-danger-on:var(--color-danger-on);--status-private:var(--color-private);--status-private-strong:var(--color-private-strong);--status-private-surface:var(--color-private-surface);--status-private-border:var(--color-private-border);--status-private-on:var(--color-private-on);--status-neutral:var(--color-muted);--status-neutral-strong:var(--color-muted-strong);--status-neutral-surface:var(--color-neutral-surface);--status-neutral-border:var(--color-neutral-border);--status-neutral-on:var(--color-neutral-on);--scrollbar-width:0.5rem;--scrollbar-track:var(--color-white-soft);--scrollbar-thumb:var(--color-white-softer);--scrollbar-thumb-hover:var(--color-white-softest);--z-app-header:40;--z-overlay-nav:60;--z-overlay-floating:70;--z-overlay-popover:140;--z-overlay-toast:180;--z-sidebar-overlay:10;--z-sidebar:20;--z-modal-root:100;--z-modal-overlay:110;--z-modal-content:120;--z-modal-player:130;--z-modal-top-root:140;--z-modal-top-overlay:150;--z-modal-top-content:160;--overlay-backdrop-color:var(--color-overlay-backdrop);--overlay-backdrop-blur:12px;--sidebar-width-expanded-base:16rem;--sidebar-dropup-content-width:0px;--sidebar-width-expanded:max(var(--sidebar-width-expanded-base),var(--sidebar-dropup-content-width));--sidebar-width-collapsed:4rem;--sidebar-width:var(--sidebar-width-expanded);--sidebar-control-size:2.75rem;--sidebar-content-gap:1rem;--space-sidebar-shell-inline:var(--space-lg);--space-sidebar-shell-block-start:var(--space-sm);--space-sidebar-shell-block-end:1.75rem;--space-sidebar-scroll-gap:1.75rem;--space-sidebar-panel-gap:1.35rem;--space-sidebar-panel-padding-block:1.35rem;--space-sidebar-panel-padding-inline:1.1rem;--space-sidebar-footer-gap:0.85rem;--space-sidebar-trigger-padding-block:0.78rem;--space-sidebar-popover-offset:0.85rem;--space-sidebar-popover-padding-block:0.85rem;--space-sidebar-popover-padding-inline:0.65rem;--space-sidebar-popover-gap:0.45rem;--space-sidebar-dropup-scroll-reserve:calc(var(--scrollbar-thin-width) + var(--space-sm) + var(--space-2xs));--sidebar-dropup-max-height:18rem;--space-sidebar-nav-padding-block:0.7rem;--space-sidebar-nav-padding-inline-start:var(--space-xs);--space-sidebar-nav-padding-inline-end:calc(var(--space-lg) + var(--space-2xs));--space-sidebar-subnav-padding-block:0.55rem;--space-sidebar-nav-translate:0.35rem;--grid-card-min-width:20rem;--popover-backdrop-blur:12px;--overlay-panel-radius:var(--radius-lg);--overlay-panel-shadow:var(--shadow-lg);--overlay-panel-padding-inline:var(--popup-padding-inline);--overlay-panel-padding-block:var(--popup-padding-block);--toast-translate:-1.5rem;--sidebar-mobile-gutter:3rem;--popup-padding-Line truncated
|
||||
/*! tailwindcss v3.4.17 | MIT License | https://tailwindcss.com*/*,:after,:before{box-sizing:border-box;border:0 solid #e5e7eb}:after,:before{--tw-content:""}:host,html{line-height:1.5;-webkit-text-size-adjust:100%;-moz-tab-size:4;-o-tab-size:4;tab-size:4;font-family:var(--font-family-sans);font-feature-settings:normal;font-variation-settings:normal;-webkit-tap-highlight-color:transparent}body{line-height:inherit}hr{height:0;color:inherit;border-top-width:1px}abbr:where([title]){-webkit-text-decoration:underline dotted;text-decoration:underline dotted}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,pre,samp{font-family:var(--font-family-mono);font-feature-settings:normal;font-variation-settings:normal;font-size:1em}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}table{text-indent:0;border-color:inherit;border-collapse:collapse}button,input,optgroup,select,textarea{font-family:inherit;font-feature-settings:inherit;font-variation-settings:inherit;font-size:100%;font-weight:inherit;line-height:inherit;letter-spacing:inherit;color:inherit;margin:0;padding:0}button,select{text-transform:none}button,input:where([type=button]),input:where([type=reset]),input:where([type=submit]){-webkit-appearance:button;background-color:transparent;background-image:none}:-moz-focusring{outline:auto}:-moz-ui-invalid{box-shadow:none}progress{vertical-align:baseline}::-webkit-inner-spin-button,::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}summary{display:list-item}blockquote,dd,dl,figure,h1,h2,h3,h4,h5,h6,hr,p,pre{margin:0}fieldset{margin:0}fieldset,legend{padding:0}menu,ol,ul{list-style:none;margin:0;padding:0}dialog{padding:0}textarea{resize:vertical}input::-moz-placeholder,textarea::-moz-placeholder{opacity:1;color:#9ca3af}input::placeholder,textarea::placeholder{opacity:1;color:#9ca3af}[role=button],button{cursor:pointer}:disabled{cursor:default}audio,canvas,embed,iframe,img,object,svg,video{display:block;vertical-align:middle}img,video{max-width:100%;height:auto}[hidden]:where(:not([hidden=until-found])){display:none}html{font-size:80%}@media (min-width:768px){html{font-size:100%}}@media (min-width:1024px){html{font-size:75%}}*,:after,:before{scrollbar-width:thin;scrollbar-color:var(--scrollbar-thumb) var(--scrollbar-track)}::-webkit-scrollbar{width:var(--scrollbar-width);height:var(--scrollbar-width)}::-webkit-scrollbar-track{background:var(--scrollbar-track)}::-webkit-scrollbar-thumb{background:var(--scrollbar-thumb);border-radius:var(--radius-sm)}::-webkit-scrollbar-thumb:hover{background:var(--scrollbar-thumb-hover)}body{--app-header-centerline:calc(env(safe-area-inset-top, 0) + var(--app-header-centerline-offset));font-family:var(--font-family-sans);background-color:var(--color-page);color:var(--color-text-strong);line-height:1.5;margin:0;padding:0;overflow-x:hidden}#uiOverlay{position:fixed;inset:0;pointer-events:none;z-index:var(--z-overlay-popover)}#uiOverlay>*{pointer-events:auto}#editNip71TagsFieldset>legend,#nip71TagsFieldset>legend{margin-left:0;padding:0}#app{background-color:var(--color-page);color:inherit}body.modal-open,html.modal-open{overflow:hidden;height:100%}body.modal-open #app{overflow:hidden}body.modal-open #sidebar{pointer-events:none;opacity:0;visibility:hidden;z-index:var(--z-sidebar-overlay)}.ng-cloak,.ng-hide:not(.ng-hide-animate),.x-ng-cloak,[data-ng-cloak],[ng-cloak],[ng\:cloak],[x-ng-cloak]{display:none!important}ng\:form{display:block}.\!container{width:100%!important}.container{width:100%}@media (min-width:25rem){.\!container{max-width:25rem!important}.container{max-width:25rem}}@media (min-width:30rem){.\!container{max-width:30rem!important}.container{max-width:30rem}}@media (min-width:640px){.\!container{max-width:640px!important}.container{max-width:640px}}@media (min-width:768px){.\!container{max-width:768px!important}.container{max-width:768px}}@media (min-width:1024px){.\!container{max-width:1024px!important}.container{max-width:1024px}}@media (min-width:1280px){.\!container{max-width:1280px!important}.container{max-width:1280px}}@media (min-width:1536px){.\!container{max-width:1536px!important}.container{max-width:1536px}}#playerModal.ds-header{display:block}.ds-header{display:flex;align-items:center;justify-content:flex-start;padding-top:var(--space-sm);padding-bottom:var(--space-sm)}.app-shell__header{position:sticky;top:env(safe-area-inset-top,0);z-index:var(--z-app-header);padding-top:calc(var(--space-sm) + env(safe-area-inset-top, 0));padding-bottom:var(--space-sm);background-color:transparent;background-image:var(--surface-overlay-banner-gradient-header);background-repeat:no-repeat;background-size:100% 100%}.ds-metric-probe{position:absolute;tLine truncated
|
||||
/*! tailwindcss v3.4.17 | MIT License | https://tailwindcss.com*/*,:after,:before{box-sizing:border-box;border:0 solid #e5e7eb}:after,:before{--tw-content:""}:host,html{line-height:1.5;-webkit-text-size-adjust:100%;-moz-tab-size:4;-o-tab-size:4;tab-size:4;font-family:var(--font-family-sans);font-feature-settings:normal;font-variation-settings:normal;-webkit-tap-highlight-color:transparent}body{line-height:inherit}hr{height:0;color:inherit;border-top-width:1px}abbr:where([title]){-webkit-text-decoration:underline dotted;text-decoration:underline dotted}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,pre,samp{font-family:var(--font-family-mono);font-feature-settings:normal;font-variation-settings:normal;font-size:1em}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}table{text-indent:0;border-color:inherit;border-collapse:collapse}button,input,optgroup,select,textarea{font-family:inherit;font-feature-settings:inherit;font-variation-settings:inherit;font-size:100%;font-weight:inherit;line-height:inherit;letter-spacing:inherit;color:inherit;margin:0;padding:0}button,select{text-transform:none}button,input:where([type=button]),input:where([type=reset]),input:where([type=submit]){-webkit-appearance:button;background-color:transparent;background-image:none}:-moz-focusring{outline:auto}:-moz-ui-invalid{box-shadow:none}progress{vertical-align:baseline}::-webkit-inner-spin-button,::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}summary{display:list-item}blockquote,dd,dl,figure,h1,h2,h3,h4,h5,h6,hr,p,pre{margin:0}fieldset{margin:0}fieldset,legend{padding:0}menu,ol,ul{list-style:none;margin:0;padding:0}dialog{padding:0}textarea{resize:vertical}input::-moz-placeholder,textarea::-moz-placeholder{opacity:1;color:#9ca3af}input::placeholder,textarea::placeholder{opacity:1;color:#9ca3af}[role=button],button{cursor:pointer}:disabled{cursor:default}audio,canvas,embed,iframe,img,object,svg,video{display:block;vertical-align:middle}img,video{max-width:100%;height:auto}[hidden]:where(:not([hidden=until-found])){display:none}html{font-size:80%}@media (min-width:768px){html{font-size:100%}}@media (min-width:1024px){html{font-size:75%}}*,:after,:before{scrollbar-width:thin;scrollbar-color:var(--scrollbar-thumb) var(--scrollbar-track)}::-webkit-scrollbar{width:var(--scrollbar-width);height:var(--scrollbar-width)}::-webkit-scrollbar-track{background:var(--scrollbar-track)}::-webkit-scrollbar-thumb{background:var(--scrollbar-thumb);border-radius:var(--radius-sm)}::-webkit-scrollbar-thumb:hover{background:var(--scrollbar-thumb-hover)}body{--app-header-centerline:calc(env(safe-area-inset-top, 0) + var(--app-header-centerline-offset));font-family:var(--font-family-sans);background-color:var(--color-page);color:var(--color-text-strong);line-height:1.5;margin:0;padding:0;overflow-x:hidden}#uiOverlay{position:fixed;inset:0;pointer-events:none;z-index:var(--z-overlay-popover)}#uiOverlay>*{pointer-events:auto}#editNip71TagsFieldset>legend,#nip71TagsFieldset>legend{margin-left:0;padding:0}#app{background-color:var(--color-page);color:inherit}body.modal-open,html.modal-open{overflow:hidden;height:100%}body.modal-open #app{overflow:hidden}body.modal-open #sidebar{pointer-events:none;opacity:0;visibility:hidden;z-index:var(--z-sidebar-overlay)}.ng-cloak,.ng-hide:not(.ng-hide-animate),.x-ng-cloak,[data-ng-cloak],[ng-cloak],[ng\:cloak],[x-ng-cloak]{display:none!important}ng\:form{display:block}.\!container{width:100%!important}.container{width:100%}@media (min-width:25rem){.\!container{max-width:25rem!important}.container{max-width:25rem}}@media (min-width:30rem){.\!container{max-width:30rem!important}.container{max-width:30rem}}@media (min-width:640px){.\!container{max-width:640px!important}.container{max-width:640px}}@media (min-width:768px){.\!container{max-width:768px!important}.container{max-width:768px}}@media (min-width:1024px){.\!container{max-width:1024px!important}.container{max-width:1024px}}@media (min-width:1280px){.\!container{max-width:1280px!important}.container{max-width:1280px}}@media (min-width:1536px){.\!container{max-width:1536px!important}.container{max-width:1536px}}#playerModal.ds-header{display:block}.ds-header{display:flex;align-items:center;justify-content:flex-start;padding-top:var(--space-sm);padding-bottom:var(--space-sm)}.app-shell__header{position:sticky;top:env(safe-area-inset-top,0);z-index:var(--z-app-header);padding-top:calc(var(--space-sm) + env(safe-area-inset-top, 0));padding-bottom:var(--space-sm);background-color:transparent;background-image:var(--surface-overlay-banner-gradient-header);background-repeat:no-repeat;background-size:100% 100%}.ds-metric-probe{position:absolute;tLine truncated
|
||||
--player-modal-inline-padding,clamp(var(--space-md),4vw,var(--space-xl-plus))
|
||||
);overflow:visible}#playerModal .watch-container.video-modal__similar{padding-inline:clamp(var(--space-3xs),1vw,var(--space-sm))}#playerModal .video-modal__primary>.watch-container:first-child{padding-block-start:var(--player-modal-vertical-padding)}#playerModal .video-modal__secondary>.watch-container:last-child{padding-block-end:var(--player-modal-vertical-padding)}#playerModal .modal-nav .watch-container{max-width:none;margin-inline:0}#playerModal .modal-info-panel{display:flex;flex-direction:column;gap:var(--space-md-plus)}#playerModal h2#videoTitle{margin:0;font-size:clamp(var(--font-size-xl),calc(var(--font-size-modal-title-base) + .5vw),var(--font-size-xl-plus));font-weight:600;line-height:1.3;color:var(--color-text)}#playerModal .modal-meta{font-size:var(--font-size-sm);line-height:1.4;color:var(--color-text-muted)}#playerModal .modal-view-count{font-weight:600;color:var(--color-text)}#playerModal .channel-card{align-items:center;gap:var(--space-md);padding:var(--space-md) var(--space-lg)}#playerModal .channel-card,#playerModal .player-modal__module{display:flex;border-radius:var(--radius-xl);border:var(--border-width-hairline) solid var(--color-border-translucent);background-color:var(--color-surface);box-shadow:var(--shadow-sm)}#playerModal .player-modal__module{flex-direction:column;gap:clamp(var(--space-sm),1.75vw,var(--space-md));width:100%;padding:clamp(var(--space-sm),2vw,var(--space-lg))}#playerModal .player-modal__module-title{margin:0;font-size:var(--font-size-lg);font-weight:600;line-height:1.3;color:var(--color-text)}#playerModal .player-modal__module-list{display:flex;flex-direction:column;gap:var(--space-sm);width:100%;margin:0;padding:0;list-style:none}#playerModal .video-modal__similar .player-modal__module{gap:clamp(var(--space-xs),1.25vw,var(--space-md));padding:clamp(var(--space-sm),1.5vw,var(--space-lg));border-width:0;box-shadow:none;background-color:transparent}#playerModal .video-modal__similar .player-modal__module-title{padding-inline:clamp(var(--space-3xs),1vw,var(--space-sm))}#playerModal .video-modal__similar .player-modal__module-list{gap:clamp(var(--space-xs),1vw,var(--space-sm));padding-inline:clamp(var(--space-3xs),1vw,var(--space-sm));padding-bottom:clamp(var(--space-sm),1.25vw,var(--space-md))}#playerModal .player-modal__module-scroll{max-height:clamp(14rem,calc(100vh - var(--player-modal-vertical-padding)*2 - var(--space-2xl)),28rem);overflow-y:auto;overflow-x:hidden;overscroll-behavior:contain;scrollbar-gutter:stable;padding-inline-end:var(--space-xs)}#playerModal .video-modal__similar .player-modal__module-scroll{max-height:none;overflow:visible;padding-inline-end:0;scrollbar-gutter:auto}#playerModal .player-modal__module-scroll>li{scroll-margin-block:var(--space-xs)}@media (max-width:30rem){#playerModal .modal-nav .icon-button{width:var(--space-xl);height:var(--space-xl);min-width:var(--space-xl);min-height:var(--space-xl)}#playerModal .watch-container{padding-inline:var(--space-sm)}#playerModal .channel-card{gap:var(--space-sm);padding:var(--space-sm) var(--space-md)}}#playerModal .channel-card__avatar{flex-shrink:0;width:var(--avatar-size-lg);height:var(--avatar-size-lg);border-radius:var(--radius-full);overflow:hidden;background-color:var(--color-border-subtle)}#playerModal .channel-card__avatar img{display:block;width:100%;height:100%;-o-object-fit:cover;object-fit:cover}#playerModal .channel-card__name{margin:0;font-size:var(--font-size-lg);font-weight:600;color:var(--color-text)}#playerModal .channel-card__npub{margin:0;font-size:var(--font-size-sm);color:var(--color-text-muted)}#playerModal .description-panel{padding:var(--space-md-plus) var(--space-lg);border-radius:var(--radius-xl);border:var(--border-width-hairline) solid var(--color-border-translucent);background-color:var(--color-surface);box-shadow:var(--shadow-sm)}#playerModal .description-panel p{margin:0;font-size:var(--font-size-sm);line-height:1.6;color:var(--color-text)}.player-modal__content{position:relative;z-index:var(--z-modal-content);display:flex;flex:1 1 auto;width:100%;min-height:100%;flex-direction:column;overflow:visible;padding:0;margin:0;border:none;border-radius:0;background-color:var(--color-surface);box-shadow:none}@media (prefers-reduced-motion:reduce){.player-modal__content{transition-property:none}}#playerModal .modal-nav{position:sticky;top:0;z-index:var(--z-overlay-nav);--tw-translate-y:0px;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));transition-property:transform;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s;background-color:var(--color-overlay-darker);background-image:linear-gradient(180deg,var(--color-overlay-panel-gradient-start) 0,var(--color-overlay-panel-gradient-end) 100%);border-bottom:var(--border-width-hairline) solid var(--color-border-translucent);backdrop-filter:blur(var(--modal-navLine truncated
|
||||
--player-modal-inline-padding,clamp(var(--space-sm),3vw,var(--space-xl))
|
||||
|
||||
+190
-306
@@ -9,13 +9,13 @@
|
||||
font-size: 80%;
|
||||
}
|
||||
|
||||
@media (min-width: theme('screens.md')) {
|
||||
@media (min-width: theme("screens.md")) {
|
||||
html {
|
||||
font-size: 100%;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: theme('screens.lg')) {
|
||||
@media (min-width: theme("screens.lg")) {
|
||||
html {
|
||||
font-size: 75%;
|
||||
}
|
||||
@@ -302,7 +302,7 @@
|
||||
}
|
||||
|
||||
.header-search__input {
|
||||
@apply flex-1 appearance-none bg-transparent text-sm text-text placeholder:text-muted outline-none;
|
||||
@apply flex-1 appearance-none bg-transparent text-sm text-text outline-none placeholder:text-muted;
|
||||
min-width: 0;
|
||||
}
|
||||
|
||||
@@ -398,7 +398,11 @@
|
||||
|
||||
.markdown-prose a {
|
||||
color: var(--color-accent-strong);
|
||||
text-decoration-color: color-mix(in srgb, var(--color-accent-strong) 65%, transparent);
|
||||
text-decoration-color: color-mix(
|
||||
in srgb,
|
||||
var(--color-accent-strong) 65%,
|
||||
transparent
|
||||
);
|
||||
text-decoration-thickness: 2px;
|
||||
text-underline-offset: 0.2em;
|
||||
}
|
||||
@@ -410,7 +414,7 @@
|
||||
}
|
||||
|
||||
.markdown-prose blockquote {
|
||||
@apply border-l-4 border-border-subtle bg-surface-muted bg-opacity-50 text-muted px-4 py-2 rounded-md;
|
||||
@apply rounded-md border-l-4 border-border-subtle bg-surface-muted bg-opacity-50 px-4 py-2 text-muted;
|
||||
}
|
||||
|
||||
.markdown-prose :where(pre, code) {
|
||||
@@ -418,11 +422,11 @@
|
||||
}
|
||||
|
||||
.markdown-prose code {
|
||||
@apply bg-surface-muted text-accent-strong px-1 py-0.5 rounded-md;
|
||||
@apply rounded-md bg-surface-muted px-1 py-0.5 text-accent-strong;
|
||||
}
|
||||
|
||||
.markdown-prose pre {
|
||||
@apply bg-surface-muted text-text border border-border-subtle rounded-lg p-4 overflow-x-auto;
|
||||
@apply overflow-x-auto rounded-lg border border-border-subtle bg-surface-muted p-4 text-text;
|
||||
}
|
||||
|
||||
.markdown-prose pre code {
|
||||
@@ -437,17 +441,17 @@
|
||||
|
||||
.popover-panel,
|
||||
.popover__panel {
|
||||
@apply focus-ring z-overlay-popover min-w-menu max-w-popover-safe rounded-overlay border border-border border-opacity-40 bg-overlay-panel px-overlay-panel-inline py-overlay-panel-block text-sm text-text shadow-overlay-panel transition-transform transition-opacity duration-base ease-out opacity-0 scale-95 pointer-events-none;
|
||||
@apply focus-ring pointer-events-none z-overlay-popover min-w-menu max-w-popover-safe scale-95 rounded-overlay border border-border border-opacity-40 bg-overlay-panel px-overlay-panel-inline py-overlay-panel-block text-sm text-text opacity-0 shadow-overlay-panel transition-opacity transition-transform duration-base ease-out;
|
||||
}
|
||||
|
||||
.popover-panel[data-state="open"],
|
||||
.popover__panel[data-state="open"] {
|
||||
@apply pointer-events-auto opacity-100 scale-100;
|
||||
@apply pointer-events-auto scale-100 opacity-100;
|
||||
}
|
||||
|
||||
.popover-panel[data-state="closed"],
|
||||
.popover__panel[data-state="closed"] {
|
||||
@apply pointer-events-none opacity-0 scale-95;
|
||||
@apply pointer-events-none scale-95 opacity-0;
|
||||
}
|
||||
|
||||
.p-overlay-panel {
|
||||
@@ -469,7 +473,8 @@
|
||||
.popover__panel[data-variant="zap"] {
|
||||
background: var(--color-overlay-veil);
|
||||
color: var(--color-subtle);
|
||||
border: var(--border-width-hairline) solid var(--color-border-translucent-stronger);
|
||||
border: var(--border-width-hairline) solid
|
||||
var(--color-border-translucent-stronger);
|
||||
box-shadow: var(--shadow-popover-zap);
|
||||
backdrop-filter: blur(var(--popover-backdrop-blur));
|
||||
-webkit-backdrop-filter: blur(var(--popover-backdrop-blur));
|
||||
@@ -562,7 +567,6 @@
|
||||
--progress-fill: var(--color-info-strong);
|
||||
}
|
||||
|
||||
|
||||
.btn-ghost {
|
||||
@apply btn border border-border border-opacity-60 bg-transparent text-text shadow-none;
|
||||
}
|
||||
@@ -610,7 +614,9 @@
|
||||
border-radius: inherit;
|
||||
opacity: 0;
|
||||
transform: translate3d(0, 14%, 0);
|
||||
transition: opacity 220ms ease, transform 220ms ease;
|
||||
transition:
|
||||
opacity 220ms ease,
|
||||
transform 220ms ease;
|
||||
background: radial-gradient(
|
||||
115% 115% at 0% 0%,
|
||||
color-mix(in srgb, var(--status-neutral) 32%, transparent) 0%,
|
||||
@@ -661,7 +667,8 @@
|
||||
background-image: linear-gradient(
|
||||
145deg,
|
||||
color-mix(in srgb, var(--surface-overlay-panel-soft) 82%, transparent) 0%,
|
||||
color-mix(in srgb, var(--surface-overlay-panel-soft) 68%, transparent) 100%
|
||||
color-mix(in srgb, var(--surface-overlay-panel-soft) 68%, transparent)
|
||||
100%
|
||||
);
|
||||
}
|
||||
|
||||
@@ -709,7 +716,8 @@
|
||||
|
||||
.login-option__chevron {
|
||||
@apply inline-flex h-9 w-9 items-center justify-center rounded-full bg-overlay-panel text-text-muted transition duration-200 ease-out;
|
||||
box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--border-overlay) 60%, transparent);
|
||||
box-shadow: inset 0 0 0 1px
|
||||
color-mix(in srgb, var(--border-overlay) 60%, transparent);
|
||||
}
|
||||
|
||||
.login-option:hover .login-option__chevron,
|
||||
@@ -762,39 +770,6 @@
|
||||
* "Blog carousel tokens" section:
|
||||
*/
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
.badge {
|
||||
@apply inline-flex items-center gap-1 rounded-full border border-status-neutral-border bg-status-neutral-surface px-3 py-1 text-2xs font-semibold uppercase tracking-extra-wide text-status-neutral-on;
|
||||
}
|
||||
@@ -929,7 +904,8 @@
|
||||
--video-card-backdrop-blur: var(--blur-thumbnail-blur);
|
||||
@apply focus-ring relative rounded-lg border border-transparent bg-card text-text shadow-md transition duration-base ease-in-out;
|
||||
transform: translate3d(0, var(--video-card-lift-translate-y), 0);
|
||||
transition-property: transform, box-shadow, border-color, background-color, color;
|
||||
transition-property:
|
||||
transform, box-shadow, border-color, background-color, color;
|
||||
will-change: transform;
|
||||
isolation: isolate;
|
||||
}
|
||||
@@ -1058,7 +1034,7 @@
|
||||
.select[data-state="locked"]:focus-visible,
|
||||
textarea.form-control[data-state="locked"]:focus-visible,
|
||||
select.form-control[data-state="locked"]:focus-visible {
|
||||
@apply border-border-sidebar-strong outline-none ring-0 ring-offset-0 shadow-none;
|
||||
@apply border-border-sidebar-strong shadow-none outline-none ring-0 ring-offset-0;
|
||||
}
|
||||
|
||||
.form-control[data-state="locked"]:disabled,
|
||||
@@ -1081,13 +1057,20 @@
|
||||
.select {
|
||||
@apply form-control appearance-none pr-10;
|
||||
--select-arrow-color: var(--color-border);
|
||||
background-image: linear-gradient(135deg, transparent 50%, var(--select-arrow-color) 50%),
|
||||
background-image:
|
||||
linear-gradient(135deg, transparent 50%, var(--select-arrow-color) 50%),
|
||||
linear-gradient(45deg, var(--select-arrow-color) 50%, transparent 50%),
|
||||
linear-gradient(to right, var(--color-border-subtle), var(--color-border-subtle));
|
||||
background-position: right var(--form-select-icon-offset) center,
|
||||
linear-gradient(
|
||||
to right,
|
||||
var(--color-border-subtle),
|
||||
var(--color-border-subtle)
|
||||
);
|
||||
background-position:
|
||||
right var(--form-select-icon-offset) center,
|
||||
right var(--form-select-icon-gap) center,
|
||||
right var(--form-select-icon-hit-area) center;
|
||||
background-size: var(--form-select-icon-size) var(--form-select-icon-size),
|
||||
background-size:
|
||||
var(--form-select-icon-size) var(--form-select-icon-size),
|
||||
var(--form-select-icon-size) var(--form-select-icon-size),
|
||||
var(--form-select-divider-width) 60%;
|
||||
background-repeat: no-repeat;
|
||||
@@ -1124,7 +1107,8 @@
|
||||
.checkbox::after {
|
||||
content: "";
|
||||
@apply pointer-events-none h-2 w-3 border-b-2 border-r-2 border-white opacity-0 transition duration-base ease-in-out;
|
||||
transform: rotate(45deg) translateY(var(--form-checkbox-checkmark-offset)) scale(0.85);
|
||||
transform: rotate(45deg) translateY(var(--form-checkbox-checkmark-offset))
|
||||
scale(0.85);
|
||||
}
|
||||
|
||||
.checkbox:checked,
|
||||
@@ -1135,7 +1119,8 @@
|
||||
.checkbox:checked::after,
|
||||
.checkbox[aria-checked="true"]::after {
|
||||
@apply opacity-100;
|
||||
transform: rotate(45deg) translateY(var(--form-checkbox-checkmark-offset)) scale(1);
|
||||
transform: rotate(45deg) translateY(var(--form-checkbox-checkmark-offset))
|
||||
scale(1);
|
||||
}
|
||||
|
||||
.switch {
|
||||
@@ -1161,11 +1146,11 @@
|
||||
@apply translate-x-5;
|
||||
}
|
||||
|
||||
@media (prefers-reduced-motion: reduce) {
|
||||
.form-control,
|
||||
.checkbox,
|
||||
.checkbox::after,
|
||||
.switch,
|
||||
@media (prefers-reduced-motion: reduce) {
|
||||
.form-control,
|
||||
.checkbox,
|
||||
.checkbox::after,
|
||||
.switch,
|
||||
.switch::before,
|
||||
.popover-panel,
|
||||
.popover__panel,
|
||||
@@ -1255,7 +1240,8 @@
|
||||
|
||||
.modal-close {
|
||||
@apply focus-ring flex h-10 w-10 items-center justify-center rounded-full transition duration-base ease-out;
|
||||
border: var(--border-width-hairline) solid var(--color-border-translucent-medium);
|
||||
border: var(--border-width-hairline) solid
|
||||
var(--color-border-translucent-medium);
|
||||
background: var(--color-surface-tint-subtle);
|
||||
color: var(--color-text-frosted-strong);
|
||||
}
|
||||
@@ -1300,7 +1286,7 @@
|
||||
|
||||
/* Modal embed containers ensure iframe wrappers respect modal sizing tokens. */
|
||||
.modal-embed-frame {
|
||||
@apply flex h-modal-embed w-full max-h-modal-embed flex-col;
|
||||
@apply flex h-modal-embed max-h-modal-embed w-full flex-col;
|
||||
}
|
||||
|
||||
.modal-footer {
|
||||
@@ -1352,7 +1338,10 @@
|
||||
|
||||
.bv-grid-video {
|
||||
@apply grid gap-xl py-lg;
|
||||
grid-template-columns: repeat(auto-fill, minmax(var(--grid-card-min-width), 1fr));
|
||||
grid-template-columns: repeat(
|
||||
auto-fill,
|
||||
minmax(var(--grid-card-min-width), 1fr)
|
||||
);
|
||||
}
|
||||
|
||||
.card[data-alert="nsfw-owner"] {
|
||||
@@ -1557,7 +1546,9 @@
|
||||
#playerModal .player-modal__module-scroll {
|
||||
max-height: clamp(
|
||||
14rem,
|
||||
calc(100vh - (var(--player-modal-vertical-padding) * 2) - var(--space-2xl)),
|
||||
calc(
|
||||
100vh - (var(--player-modal-vertical-padding) * 2) - var(--space-2xl)
|
||||
),
|
||||
28rem
|
||||
);
|
||||
overflow-y: auto;
|
||||
@@ -1578,7 +1569,7 @@
|
||||
scroll-margin-block: var(--space-xs);
|
||||
}
|
||||
|
||||
@media (max-width: theme('screens.xs')) {
|
||||
@media (max-width: theme("screens.xs")) {
|
||||
#playerModal .modal-nav .icon-button {
|
||||
width: var(--space-xl);
|
||||
height: var(--space-xl);
|
||||
@@ -1645,14 +1636,15 @@
|
||||
}
|
||||
|
||||
#playerModal .modal-nav {
|
||||
@apply sticky top-0 z-overlay-nav transition-transform duration-150 translate-y-0;
|
||||
@apply sticky top-0 z-overlay-nav translate-y-0 transition-transform duration-150;
|
||||
background-color: var(--color-overlay-darker);
|
||||
background-image: linear-gradient(
|
||||
180deg,
|
||||
var(--color-overlay-panel-gradient-start) 0%,
|
||||
var(--color-overlay-panel-gradient-end) 100%
|
||||
);
|
||||
border-bottom: var(--border-width-hairline) solid var(--color-border-translucent);
|
||||
border-bottom: var(--border-width-hairline) solid
|
||||
var(--color-border-translucent);
|
||||
backdrop-filter: blur(var(--modal-nav-backdrop-blur));
|
||||
-webkit-backdrop-filter: blur(var(--modal-nav-backdrop-blur));
|
||||
}
|
||||
@@ -1679,7 +1671,8 @@
|
||||
width: var(--icon-size-md);
|
||||
height: var(--icon-size-md);
|
||||
background: var(--color-surface-tint-subtle);
|
||||
border: var(--border-width-hairline) solid var(--color-border-translucent-medium);
|
||||
border: var(--border-width-hairline) solid
|
||||
var(--color-border-translucent-medium);
|
||||
color: var(--color-text-muted);
|
||||
}
|
||||
|
||||
@@ -1714,7 +1707,7 @@
|
||||
align-items: start;
|
||||
}
|
||||
|
||||
@media (min-width: theme('screens.lg')) {
|
||||
@media (min-width: theme("screens.lg")) {
|
||||
.video-modal__layout {
|
||||
--video-modal-secondary-size: clamp(
|
||||
var(--video-modal-secondary-min),
|
||||
@@ -1723,7 +1716,10 @@
|
||||
);
|
||||
grid-template-columns:
|
||||
minmax(0, 1fr)
|
||||
minmax(var(--video-modal-secondary-min), var(--video-modal-secondary-size));
|
||||
minmax(
|
||||
var(--video-modal-secondary-min),
|
||||
var(--video-modal-secondary-size)
|
||||
);
|
||||
grid-template-areas: "primary secondary";
|
||||
align-items: stretch;
|
||||
grid-auto-flow: column;
|
||||
@@ -1750,7 +1746,7 @@
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: theme('screens.xl')) {
|
||||
@media (min-width: theme("screens.xl")) {
|
||||
.video-modal__layout {
|
||||
--video-modal-secondary-size: clamp(
|
||||
var(--video-modal-secondary-min),
|
||||
@@ -1764,7 +1760,7 @@
|
||||
display: grid;
|
||||
}
|
||||
|
||||
@media (min-width: theme('screens.lg')) {
|
||||
@media (min-width: theme("screens.lg")) {
|
||||
#playerModal .video-modal__layout {
|
||||
grid-template-columns:
|
||||
minmax(0, 1fr)
|
||||
@@ -1790,10 +1786,13 @@
|
||||
@apply grid gap-6;
|
||||
}
|
||||
|
||||
@media (min-width: theme('screens.lg')) {
|
||||
@media (min-width: theme("screens.lg")) {
|
||||
.revert-modal__layout {
|
||||
grid-template-columns:
|
||||
minmax(var(--revert-modal-sidebar-min), var(--revert-modal-sidebar-width))
|
||||
minmax(
|
||||
var(--revert-modal-sidebar-min),
|
||||
var(--revert-modal-sidebar-width)
|
||||
)
|
||||
minmax(0, 1fr);
|
||||
}
|
||||
}
|
||||
@@ -1816,7 +1815,7 @@
|
||||
display: none;
|
||||
}
|
||||
|
||||
@media (min-width: theme('screens.lg')) {
|
||||
@media (min-width: theme("screens.lg")) {
|
||||
.video-modal__similar {
|
||||
@apply flex flex-col gap-6;
|
||||
align-self: stretch;
|
||||
@@ -1825,7 +1824,7 @@
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: theme('screens.lg')) {
|
||||
@media (min-width: theme("screens.lg")) {
|
||||
#playerModal .video-modal__similar .player-modal__module {
|
||||
height: 100%;
|
||||
display: flex;
|
||||
@@ -1851,22 +1850,28 @@
|
||||
}
|
||||
|
||||
#playerModal .player-modal__module-item > .card {
|
||||
@apply flex w-full flex-row items-stretch gap-md flex-nowrap;
|
||||
@apply flex w-full flex-row flex-nowrap items-stretch gap-md;
|
||||
}
|
||||
|
||||
#playerModal .player-modal__module-item > .card:not(.player-modal__similar-card)
|
||||
#playerModal
|
||||
.player-modal__module-item
|
||||
> .card:not(.player-modal__similar-card)
|
||||
.video-card__media {
|
||||
width: clamp(5.75rem, 18vw, 8rem);
|
||||
@apply shrink-0 overflow-hidden rounded-lg;
|
||||
}
|
||||
|
||||
#playerModal .player-modal__module-item > .card:not(.player-modal__similar-card)
|
||||
#playerModal
|
||||
.player-modal__module-item
|
||||
> .card:not(.player-modal__similar-card)
|
||||
.video-card__content {
|
||||
padding: clamp(var(--space-sm), 1.25vw, var(--space-md));
|
||||
@apply flex min-w-0 flex-1 flex-col gap-sm;
|
||||
}
|
||||
|
||||
#playerModal .player-modal__module-item > .card:not(.player-modal__similar-card)
|
||||
#playerModal
|
||||
.player-modal__module-item
|
||||
> .card:not(.player-modal__similar-card)
|
||||
.video-card__meta {
|
||||
@apply flex flex-wrap items-center gap-2 text-xs text-muted-strong;
|
||||
}
|
||||
@@ -1959,7 +1964,11 @@
|
||||
position: relative;
|
||||
isolation: isolate;
|
||||
overflow: visible;
|
||||
--video-modal-ambient-bleed: clamp(var(--space-2xl), 12vw, var(--space-5xl));
|
||||
--video-modal-ambient-bleed: clamp(
|
||||
var(--space-2xl),
|
||||
12vw,
|
||||
var(--space-5xl)
|
||||
);
|
||||
--video-modal-ambient-scale: 1.38;
|
||||
--video-modal-ambient-blur: clamp(128px, 20vw, 256px);
|
||||
--video-modal-ambient-opacity: 1;
|
||||
@@ -1970,17 +1979,9 @@
|
||||
z-index: 1;
|
||||
border-radius: var(--radius-xl);
|
||||
padding-block: clamp(var(--space-xs), 2.5vw, var(--space-md-plus));
|
||||
background-color: color-mix(
|
||||
in srgb,
|
||||
var(--color-surface) 82%,
|
||||
transparent
|
||||
);
|
||||
box-shadow: 0 0 0 1px color-mix(
|
||||
in srgb,
|
||||
var(--color-border-strong) 8%,
|
||||
transparent
|
||||
)
|
||||
inset;
|
||||
background-color: color-mix(in srgb, var(--color-surface) 82%, transparent);
|
||||
box-shadow: 0 0 0 1px
|
||||
color-mix(in srgb, var(--color-border-strong) 8%, transparent) inset;
|
||||
overflow: visible;
|
||||
}
|
||||
|
||||
@@ -2016,12 +2017,11 @@
|
||||
height: 100%;
|
||||
display: block;
|
||||
transform: scale(var(--video-modal-ambient-scale));
|
||||
filter: blur(var(--video-modal-ambient-blur)) saturate(2)
|
||||
brightness(1.24);
|
||||
filter: blur(var(--video-modal-ambient-blur)) saturate(2) brightness(1.24);
|
||||
opacity: var(--video-modal-ambient-opacity);
|
||||
}
|
||||
|
||||
@media (min-width: theme('screens.lg')) {
|
||||
@media (min-width: theme("screens.lg")) {
|
||||
.video-modal__video {
|
||||
position: sticky;
|
||||
top: calc(var(--space-2xl) + var(--space-xl));
|
||||
@@ -2210,12 +2210,11 @@
|
||||
var(--color-accent) 0%,
|
||||
var(--color-accent-strong) 100%
|
||||
);
|
||||
transition: inline-size var(--motion-duration-base)
|
||||
var(--motion-ease-out);
|
||||
transition: inline-size var(--motion-duration-base) var(--motion-ease-out);
|
||||
}
|
||||
|
||||
.video-modal__actions-group {
|
||||
@apply flex flex-wrap items-center gap-3 justify-start md:justify-end;
|
||||
@apply flex flex-wrap items-center justify-start gap-3 md:justify-end;
|
||||
}
|
||||
|
||||
.video-modal__action-button {
|
||||
@@ -2274,14 +2273,18 @@
|
||||
max-block-size: none;
|
||||
overflow: hidden;
|
||||
--profile-modal-scale: 0.9;
|
||||
--profile-modal-gap:
|
||||
calc((var(--space-md) - var(--space-3xs)) * var(--profile-modal-scale));
|
||||
--profile-modal-padding-inline:
|
||||
calc((var(--space-lg) - var(--space-md)) * var(--profile-modal-scale));
|
||||
--profile-modal-padding-block-start:
|
||||
calc((var(--space-md) - var(--space-2xs)) * var(--profile-modal-scale));
|
||||
--profile-modal-padding-block-end:
|
||||
calc((var(--space-lg) - var(--space-sm)) * var(--profile-modal-scale));
|
||||
--profile-modal-gap: calc(
|
||||
(var(--space-md) - var(--space-3xs)) * var(--profile-modal-scale)
|
||||
);
|
||||
--profile-modal-padding-inline: calc(
|
||||
(var(--space-lg) - var(--space-md)) * var(--profile-modal-scale)
|
||||
);
|
||||
--profile-modal-padding-block-start: calc(
|
||||
(var(--space-md) - var(--space-2xs)) * var(--profile-modal-scale)
|
||||
);
|
||||
--profile-modal-padding-block-end: calc(
|
||||
(var(--space-lg) - var(--space-sm)) * var(--profile-modal-scale)
|
||||
);
|
||||
--profile-modal-nav-gap: calc(var(--space-xs) * var(--profile-modal-scale));
|
||||
}
|
||||
|
||||
@@ -2452,8 +2455,7 @@
|
||||
display: none;
|
||||
}
|
||||
|
||||
.profile-modal__layout[data-mobile-view="pane"]
|
||||
.profile-modal__menu {
|
||||
.profile-modal__layout[data-mobile-view="pane"] .profile-modal__menu {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
@@ -2465,7 +2467,9 @@
|
||||
|
||||
.profile-modal__body {
|
||||
gap: calc(var(--profile-modal-gap) + var(--space-2xs));
|
||||
padding-inline: calc(var(--profile-modal-padding-inline) + var(--space-xs));
|
||||
padding-inline: calc(
|
||||
var(--profile-modal-padding-inline) + var(--space-xs)
|
||||
);
|
||||
}
|
||||
|
||||
.profile-modal__layout {
|
||||
@@ -2820,7 +2824,9 @@
|
||||
border: none;
|
||||
border-radius: var(--radius-full);
|
||||
cursor: pointer;
|
||||
transition: background-color 200ms ease, box-shadow 200ms ease;
|
||||
transition:
|
||||
background-color 200ms ease,
|
||||
box-shadow 200ms ease;
|
||||
}
|
||||
|
||||
.icon-button:hover {
|
||||
@@ -3068,12 +3074,13 @@
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
gap: var(--space-md);
|
||||
padding: calc(var(--space-xl) + env(safe-area-inset-top, 0px)) var(--space-lg)
|
||||
var(--space-lg);
|
||||
padding: calc(var(--space-xl) + env(safe-area-inset-top, 0px))
|
||||
var(--space-lg) var(--space-lg);
|
||||
pointer-events: none;
|
||||
opacity: 0;
|
||||
transform: translateY(var(--toast-translate));
|
||||
transition: transform var(--motion-duration-base) var(--motion-ease-out),
|
||||
transition:
|
||||
transform var(--motion-duration-base) var(--motion-ease-out),
|
||||
opacity var(--motion-duration-base) var(--motion-ease-out);
|
||||
}
|
||||
|
||||
@@ -3116,7 +3123,8 @@
|
||||
pointer-events: auto;
|
||||
isolation: isolate;
|
||||
@apply text-sm font-semibold leading-snug;
|
||||
transition: transform var(--motion-duration-base) var(--motion-ease-out),
|
||||
transition:
|
||||
transform var(--motion-duration-base) var(--motion-ease-out),
|
||||
opacity var(--motion-duration-base) var(--motion-ease-out);
|
||||
}
|
||||
|
||||
@@ -3326,7 +3334,8 @@
|
||||
body.iframe-form #status {
|
||||
background: var(--color-surface);
|
||||
border-radius: var(--radius-sm);
|
||||
box-shadow: inset 0 0 0 var(--border-width-hairline) var(--color-border-translucent);
|
||||
box-shadow: inset 0 0 0 var(--border-width-hairline)
|
||||
var(--color-border-translucent);
|
||||
color: var(--color-subtle-text);
|
||||
min-height: calc(var(--space-2xl) + var(--space-xl));
|
||||
padding: var(--space-sm);
|
||||
@@ -3350,7 +3359,7 @@
|
||||
color: var(--color-warning-strong);
|
||||
}
|
||||
|
||||
@media (max-width: theme('screens.sm')) {
|
||||
@media (max-width: theme("screens.sm")) {
|
||||
body.iframe-form {
|
||||
margin: var(--space-md);
|
||||
}
|
||||
@@ -3385,7 +3394,9 @@
|
||||
border-right: none;
|
||||
backdrop-filter: none;
|
||||
-webkit-backdrop-filter: none;
|
||||
transition: width 200ms ease, transform 300ms ease;
|
||||
transition:
|
||||
width 200ms ease,
|
||||
transform 300ms ease;
|
||||
z-index: var(--z-sidebar);
|
||||
box-shadow: none;
|
||||
isolation: isolate;
|
||||
@@ -3455,7 +3466,10 @@
|
||||
-webkit-backdrop-filter: none;
|
||||
overflow: hidden;
|
||||
isolation: isolate;
|
||||
transition: border-color 200ms ease, box-shadow 220ms ease, background 220ms ease;
|
||||
transition:
|
||||
border-color 200ms ease,
|
||||
box-shadow 220ms ease,
|
||||
background 220ms ease;
|
||||
}
|
||||
|
||||
.sidebar-panel--primary {
|
||||
@@ -3477,11 +3491,15 @@
|
||||
width: var(--sidebar-control-size);
|
||||
height: var(--sidebar-control-size);
|
||||
border-radius: var(--radius-full);
|
||||
border: var(--border-width-hairline) solid var(--color-border-translucent-medium);
|
||||
border: var(--border-width-hairline) solid
|
||||
var(--color-border-translucent-medium);
|
||||
background: var(--color-surface-tint-subtle);
|
||||
color: inherit;
|
||||
cursor: pointer;
|
||||
transition: background 180ms ease, color 180ms ease, border-color 180ms ease;
|
||||
transition:
|
||||
background 180ms ease,
|
||||
color 180ms ease,
|
||||
border-color 180ms ease;
|
||||
flex-shrink: 0;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
@@ -3535,7 +3553,10 @@
|
||||
background: none;
|
||||
box-shadow: none;
|
||||
transform: translateX(var(--sidebar-nav-translate-x));
|
||||
transition: color 180ms ease, border-color 200ms ease, box-shadow 220ms ease,
|
||||
transition:
|
||||
color 180ms ease,
|
||||
border-color 200ms ease,
|
||||
box-shadow 220ms ease,
|
||||
transform 220ms ease;
|
||||
overflow: hidden;
|
||||
isolation: isolate;
|
||||
@@ -3550,7 +3571,9 @@
|
||||
inset: calc(var(--border-width-hairline) * -1);
|
||||
border-radius: inherit;
|
||||
pointer-events: none;
|
||||
transition: opacity 220ms ease, transform 240ms ease;
|
||||
transition:
|
||||
opacity 220ms ease,
|
||||
transform 240ms ease;
|
||||
z-index: -1;
|
||||
}
|
||||
|
||||
@@ -3583,7 +3606,8 @@
|
||||
--sidebar-nav-translate-x: var(--space-sidebar-nav-translate);
|
||||
color: var(--color-white);
|
||||
border-color: var(--color-sidebar-hover-strong);
|
||||
box-shadow: 0 0 0 var(--border-width-hairline) var(--color-sidebar-hover-strong),
|
||||
box-shadow:
|
||||
0 0 0 var(--border-width-hairline) var(--color-sidebar-hover-strong),
|
||||
var(--shadow-sidebar-accent);
|
||||
}
|
||||
|
||||
@@ -3652,7 +3676,10 @@
|
||||
backdrop-filter: none;
|
||||
-webkit-backdrop-filter: none;
|
||||
box-shadow: none;
|
||||
transition: border-color 200ms ease, color 200ms ease, box-shadow 220ms ease;
|
||||
transition:
|
||||
border-color 200ms ease,
|
||||
color 200ms ease,
|
||||
box-shadow 220ms ease;
|
||||
}
|
||||
|
||||
.sidebar-dropup-trigger::before {
|
||||
@@ -3668,7 +3695,9 @@
|
||||
);
|
||||
opacity: 0;
|
||||
transform: scale(0.96);
|
||||
transition: opacity 200ms ease, transform 220ms ease;
|
||||
transition:
|
||||
opacity 200ms ease,
|
||||
transform 220ms ease;
|
||||
z-index: -1;
|
||||
filter: saturate(140%);
|
||||
}
|
||||
@@ -3679,7 +3708,11 @@
|
||||
inset: calc(var(--border-width-hairline) * -1);
|
||||
border-radius: inherit;
|
||||
pointer-events: none;
|
||||
background: linear-gradient(110deg, var(--color-sidebar-hover) 0%, transparent 80%);
|
||||
background: linear-gradient(
|
||||
110deg,
|
||||
var(--color-sidebar-hover) 0%,
|
||||
transparent 80%
|
||||
);
|
||||
opacity: 0.18;
|
||||
mix-blend-mode: screen;
|
||||
transition: opacity 200ms ease;
|
||||
@@ -3690,7 +3723,8 @@
|
||||
.sidebar-dropup-trigger:focus-visible {
|
||||
color: var(--color-white);
|
||||
border-color: var(--color-sidebar-hover-strong);
|
||||
box-shadow: 0 0 0 var(--border-width-hairline) var(--color-sidebar-hover-strong),
|
||||
box-shadow:
|
||||
0 0 0 var(--border-width-hairline) var(--color-sidebar-hover-strong),
|
||||
var(--shadow-sidebar-dropup);
|
||||
}
|
||||
|
||||
@@ -3723,7 +3757,8 @@
|
||||
}
|
||||
|
||||
.sidebar-dropup-trigger__chevron.is-rotated,
|
||||
.sidebar-dropup-trigger[aria-expanded="true"] .sidebar-dropup-trigger__chevron {
|
||||
.sidebar-dropup-trigger[aria-expanded="true"]
|
||||
.sidebar-dropup-trigger__chevron {
|
||||
transform: rotate(180deg);
|
||||
}
|
||||
|
||||
@@ -3733,14 +3768,15 @@
|
||||
right: 0;
|
||||
bottom: calc(100% + var(--space-sidebar-popover-offset));
|
||||
border-radius: var(--radius-xl);
|
||||
border: var(--border-width-hairline) solid var(--color-sidebar-border-strong);
|
||||
background:
|
||||
linear-gradient(
|
||||
160deg,
|
||||
color-mix(in srgb, var(--color-sidebar-surface) 88%, transparent) 0%,
|
||||
color-mix(in srgb, var(--color-sidebar-surface-alt) 68%, transparent) 100%
|
||||
);
|
||||
box-shadow: inset 0 0 0 var(--border-width-fine) var(--color-sidebar-border),
|
||||
border: var(--border-width-hairline) solid
|
||||
var(--color-sidebar-border-strong);
|
||||
background: linear-gradient(
|
||||
160deg,
|
||||
color-mix(in srgb, var(--color-sidebar-surface) 88%, transparent) 0%,
|
||||
color-mix(in srgb, var(--color-sidebar-surface-alt) 68%, transparent) 100%
|
||||
);
|
||||
box-shadow:
|
||||
inset 0 0 0 var(--border-width-fine) var(--color-sidebar-border),
|
||||
var(--shadow-sidebar-panel);
|
||||
padding: var(--space-sidebar-popover-padding-block)
|
||||
var(--space-sidebar-popover-padding-inline);
|
||||
@@ -3749,7 +3785,10 @@
|
||||
visibility: hidden;
|
||||
pointer-events: none;
|
||||
transform: translateY(var(--space-sm));
|
||||
transition: opacity 180ms ease, transform 180ms ease, visibility 180ms ease,
|
||||
transition:
|
||||
opacity 180ms ease,
|
||||
transform 180ms ease,
|
||||
visibility 180ms ease,
|
||||
box-shadow 220ms ease;
|
||||
backdrop-filter: blur(var(--sidebar-panel-backdrop-blur))
|
||||
saturate(var(--sidebar-panel-backdrop-saturation));
|
||||
@@ -3817,7 +3856,10 @@
|
||||
|
||||
#app {
|
||||
box-sizing: border-box;
|
||||
transition: margin-left 200ms ease, width 200ms ease, max-width 200ms ease;
|
||||
transition:
|
||||
margin-left 200ms ease,
|
||||
width 200ms ease,
|
||||
max-width 200ms ease;
|
||||
}
|
||||
|
||||
#app[data-sidebar-state="collapsed"] {
|
||||
@@ -3922,7 +3964,7 @@
|
||||
--sidebar-nav-translate-x: 0;
|
||||
}
|
||||
|
||||
@media (min-width: theme('screens.md')) {
|
||||
@media (min-width: theme("screens.md")) {
|
||||
.sidebar-panel__header {
|
||||
display: flex;
|
||||
}
|
||||
@@ -3956,7 +3998,8 @@
|
||||
);
|
||||
width: min(
|
||||
calc(
|
||||
100vw - var(--sidebar-width-expanded-base) - var(--sidebar-content-gap)
|
||||
100vw - var(--sidebar-width-expanded-base) -
|
||||
var(--sidebar-content-gap)
|
||||
),
|
||||
calc(
|
||||
100vw - var(--sidebar-dropup-content-width) -
|
||||
@@ -3965,7 +4008,8 @@
|
||||
);
|
||||
max-width: min(
|
||||
calc(
|
||||
100vw - var(--sidebar-width-expanded-base) - var(--sidebar-content-gap)
|
||||
100vw - var(--sidebar-width-expanded-base) -
|
||||
var(--sidebar-content-gap)
|
||||
),
|
||||
calc(
|
||||
100vw - var(--sidebar-dropup-content-width) -
|
||||
@@ -3973,7 +4017,6 @@
|
||||
)
|
||||
);
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
@keyframes card-motion-enter {
|
||||
@@ -4028,7 +4071,7 @@
|
||||
}
|
||||
|
||||
@layer utilities {
|
||||
@media (max-width: theme('screens.compact')) {
|
||||
@media (max-width: theme("screens.compact")) {
|
||||
.u-max-400-flex-wrap {
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
@@ -4067,7 +4110,7 @@
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: theme('screens.sm')) {
|
||||
@media (max-width: theme("screens.sm")) {
|
||||
.bv-grid-video {
|
||||
gap: var(--space-md);
|
||||
grid-template-columns: 1fr;
|
||||
@@ -4172,8 +4215,8 @@
|
||||
|
||||
@layer components {
|
||||
.ui-grid-row {
|
||||
border-bottom: var(--border-width-hairline)
|
||||
solid var(--color-border-subtle, var(--color-border));
|
||||
border-bottom: var(--border-width-hairline) solid
|
||||
var(--color-border-subtle, var(--color-border));
|
||||
}
|
||||
|
||||
.status-line {
|
||||
@@ -4198,151 +4241,6 @@
|
||||
|
||||
/* Blog layout root scaffolding */
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
@keyframes ztr-rotate {
|
||||
100% {
|
||||
transform: rotate(360deg);
|
||||
@@ -4366,13 +4264,6 @@
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
@keyframes svelte-181fgen-loader-animation {
|
||||
0% {
|
||||
transform: rotate(0);
|
||||
@@ -4388,11 +4279,4 @@
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
}
|
||||
+59
-25
@@ -81,7 +81,9 @@
|
||||
--blur-thumbnail-blur: 18px;
|
||||
--modal-nav-backdrop-blur: 6px;
|
||||
|
||||
--app-header-centerline-offset: calc(var(--space-sm) + (var(--space-2xl-plus) / 2));
|
||||
--app-header-centerline-offset: calc(
|
||||
var(--space-sm) + (var(--space-2xl-plus) / 2)
|
||||
);
|
||||
--border-default: var(--color-border);
|
||||
--border-subtle: var(--color-border-subtle);
|
||||
--border-strong: var(--color-border-translucent-stronger);
|
||||
@@ -209,9 +211,8 @@
|
||||
--video-modal-secondary-max: 44rem;
|
||||
--video-modal-secondary-fr: 1fr;
|
||||
--video-modal-layout-max: calc(
|
||||
var(--layout-player-max-width) +
|
||||
var(--video-modal-secondary-max) +
|
||||
var(--space-2xl-plus)
|
||||
var(--layout-player-max-width) + var(--video-modal-secondary-max) +
|
||||
var(--space-2xl-plus)
|
||||
);
|
||||
--revert-modal-sidebar-min: 240px;
|
||||
--revert-modal-sidebar-width: 280px;
|
||||
@@ -307,7 +308,8 @@
|
||||
--shadow-sidebar-trigger: 0 1.25rem 2.5rem -1.35rem var(--color-shadow-panel);
|
||||
--shadow-sidebar-dropup: 0 1.75rem 3.25rem -1.45rem var(--color-sidebar-glow);
|
||||
--shadow-sidebar-panel: 0 2.25rem 4.5rem -1.85rem var(--color-shadow-sidebar);
|
||||
--shadow-sidebar-focus-ring: 0 0 0 0.125rem var(--color-sidebar-glow),
|
||||
--shadow-sidebar-focus-ring:
|
||||
0 0 0 0.125rem var(--color-sidebar-glow),
|
||||
0 0 0 0.25rem var(--color-sidebar-hover-strong);
|
||||
--shadow-popover-zap: 0 22px 48px -18px var(--color-shadow-intense);
|
||||
--shadow-video-modal: 0 1rem 2.25rem var(--color-shadow-elevated);
|
||||
@@ -479,11 +481,7 @@
|
||||
var(--color-sidebar-border-strong) 40%,
|
||||
transparent
|
||||
);
|
||||
--scrollbar-thumb: color-mix(
|
||||
in srgb,
|
||||
var(--color-accent) 64%,
|
||||
transparent
|
||||
);
|
||||
--scrollbar-thumb: color-mix(in srgb, var(--color-accent) 64%, transparent);
|
||||
--scrollbar-thumb-hover: color-mix(
|
||||
in srgb,
|
||||
var(--color-accent-strong) 76%,
|
||||
@@ -494,11 +492,31 @@
|
||||
--color-sidebar-surface-alt: rgb(236 240 247 / 0.72);
|
||||
--color-sidebar-border: rgb(184 194 212 / 0.28);
|
||||
--color-sidebar-border-strong: rgb(148 163 184 / 0.36);
|
||||
--color-sidebar-hover: color-mix(in srgb, var(--color-accent) 16%, transparent);
|
||||
--color-sidebar-hover-strong: color-mix(in srgb, var(--color-accent-strong) 24%, transparent);
|
||||
--color-sidebar-glow: color-mix(in srgb, var(--color-accent) 36%, transparent);
|
||||
--color-sidebar-accent-start: color-mix(in srgb, var(--color-accent-strong) 88%, transparent);
|
||||
--color-sidebar-accent-end: color-mix(in srgb, var(--color-accent) 82%, transparent);
|
||||
--color-sidebar-hover: color-mix(
|
||||
in srgb,
|
||||
var(--color-accent) 16%,
|
||||
transparent
|
||||
);
|
||||
--color-sidebar-hover-strong: color-mix(
|
||||
in srgb,
|
||||
var(--color-accent-strong) 24%,
|
||||
transparent
|
||||
);
|
||||
--color-sidebar-glow: color-mix(
|
||||
in srgb,
|
||||
var(--color-accent) 36%,
|
||||
transparent
|
||||
);
|
||||
--color-sidebar-accent-start: color-mix(
|
||||
in srgb,
|
||||
var(--color-accent-strong) 88%,
|
||||
transparent
|
||||
);
|
||||
--color-sidebar-accent-end: color-mix(
|
||||
in srgb,
|
||||
var(--color-accent) 82%,
|
||||
transparent
|
||||
);
|
||||
--color-sidebar-text-muted: var(--color-text-muted);
|
||||
--sidebar-icon-filter: brightness(0) saturate(100%);
|
||||
|
||||
@@ -647,11 +665,7 @@
|
||||
var(--color-sidebar-surface-alt) 54%,
|
||||
transparent
|
||||
);
|
||||
--scrollbar-thumb: color-mix(
|
||||
in srgb,
|
||||
var(--color-accent) 72%,
|
||||
transparent
|
||||
);
|
||||
--scrollbar-thumb: color-mix(in srgb, var(--color-accent) 72%, transparent);
|
||||
--scrollbar-thumb-hover: color-mix(
|
||||
in srgb,
|
||||
var(--color-accent-strong) 84%,
|
||||
@@ -662,11 +676,31 @@
|
||||
--color-sidebar-surface-alt: rgb(10 18 32 / 0.8);
|
||||
--color-sidebar-border: rgb(86 106 142 / 0.26);
|
||||
--color-sidebar-border-strong: rgb(112 133 170 / 0.42);
|
||||
--color-sidebar-hover: color-mix(in srgb, var(--color-accent) 22%, transparent);
|
||||
--color-sidebar-hover-strong: color-mix(in srgb, var(--color-accent-strong) 32%, transparent);
|
||||
--color-sidebar-glow: color-mix(in srgb, var(--color-accent) 42%, transparent);
|
||||
--color-sidebar-accent-start: color-mix(in srgb, var(--color-accent) 92%, transparent);
|
||||
--color-sidebar-accent-end: color-mix(in srgb, var(--color-accent-strong) 88%, transparent);
|
||||
--color-sidebar-hover: color-mix(
|
||||
in srgb,
|
||||
var(--color-accent) 22%,
|
||||
transparent
|
||||
);
|
||||
--color-sidebar-hover-strong: color-mix(
|
||||
in srgb,
|
||||
var(--color-accent-strong) 32%,
|
||||
transparent
|
||||
);
|
||||
--color-sidebar-glow: color-mix(
|
||||
in srgb,
|
||||
var(--color-accent) 42%,
|
||||
transparent
|
||||
);
|
||||
--color-sidebar-accent-start: color-mix(
|
||||
in srgb,
|
||||
var(--color-accent) 92%,
|
||||
transparent
|
||||
);
|
||||
--color-sidebar-accent-end: color-mix(
|
||||
in srgb,
|
||||
var(--color-accent-strong) 88%,
|
||||
transparent
|
||||
);
|
||||
--color-sidebar-text-muted: var(--color-text-muted);
|
||||
--sidebar-icon-filter: brightness(0) invert(1);
|
||||
|
||||
|
||||
Reference in new issue
Block a user