mirror of
https://github.com/stashapp/Stash-Docs.git
synced 2025-12-11 20:50:05 -06:00
5105 lines
232 KiB
HTML
5105 lines
232 KiB
HTML
<!DOCTYPE html><html lang="en" class="no-js"><head>
|
|
|
|
<meta charset="utf-8">
|
|
<meta name="viewport" content="width=device-width,initial-scale=1">
|
|
|
|
<meta name="description" content="Stash documentation, guides, plugins and support.">
|
|
|
|
|
|
|
|
<link rel="canonical" href="https://docs.stashapp.cc/themes/custom-css-snippets/">
|
|
|
|
|
|
<link rel="prev" href="../list/">
|
|
|
|
|
|
<link rel="next" href="../../userscripts/">
|
|
|
|
|
|
<link rel="icon" href="../../assets/images/favicon.ico">
|
|
<meta name="generator" content="mkdocs-1.6.1, mkdocs-material-9.6.19">
|
|
|
|
|
|
|
|
<title>Custom CSS snippets - Stash-Docs</title>
|
|
|
|
|
|
|
|
<link rel="stylesheet" href="../../assets/stylesheets/main.7e37652d.min.css">
|
|
|
|
|
|
<link rel="stylesheet" href="../../assets/stylesheets/palette.06af60db.min.css">
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
|
|
<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Roboto:300,300i,400,400i,700,700i%7CRoboto+Mono:400,400i,700,700i&display=fallback">
|
|
<style>:root{--md-text-font:"Roboto";--md-code-font:"Roboto Mono"}</style>
|
|
|
|
|
|
|
|
<link rel="stylesheet" href="../../stylesheets/extra.css">
|
|
|
|
<script>__md_scope=new URL("../..",location),__md_hash=e=>[...e].reduce(((e,_)=>(e<<5)-e+_.charCodeAt(0)),0),__md_get=(e,_=localStorage,t=__md_scope)=>JSON.parse(_.getItem(t.pathname+"."+e)),__md_set=(e,_,t=localStorage,a=__md_scope)=>{try{t.setItem(a.pathname+"."+e,JSON.stringify(_))}catch(e){}}</script>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<meta property="og:type" content="website">
|
|
|
|
<meta property="og:title" content="Custom CSS snippets - Stash-Docs">
|
|
|
|
<meta property="og:description" content="Stash documentation, guides, plugins and support.">
|
|
|
|
<meta property="og:image" content="https://docs.stashapp.cc/assets/images/social/themes/custom-css-snippets.png">
|
|
|
|
<meta property="og:image:type" content="image/png">
|
|
|
|
<meta property="og:image:width" content="1200">
|
|
|
|
<meta property="og:image:height" content="630">
|
|
|
|
<meta property="og:url" content="https://docs.stashapp.cc/themes/custom-css-snippets/">
|
|
|
|
<meta name="twitter:card" content="summary_large_image">
|
|
|
|
<meta name="twitter:title" content="Custom CSS snippets - Stash-Docs">
|
|
|
|
<meta name="twitter:description" content="Stash documentation, guides, plugins and support.">
|
|
|
|
<meta name="twitter:image" content="https://docs.stashapp.cc/assets/images/social/themes/custom-css-snippets.png">
|
|
|
|
|
|
|
|
<link rel="stylesheet" href="../../assets/stylesheets/announce.css">
|
|
|
|
<link href="../../assets/stylesheets/glightbox.min.css" rel="stylesheet"><script src="../../assets/javascripts/glightbox.min.js"></script><style id="glightbox-style">
|
|
html.glightbox-open { overflow: initial; height: 100%; }
|
|
.gslide-title { margin-top: 0px; user-select: text; }
|
|
.gslide-desc { color: #666; user-select: text; }
|
|
.gslide-image img { background: white; }
|
|
.gscrollbar-fixer { padding-right: 15px; }
|
|
.gdesc-inner { font-size: 0.75rem; }
|
|
body[data-md-color-scheme="slate"] .gdesc-inner { background: var(--md-default-bg-color); }
|
|
body[data-md-color-scheme="slate"] .gslide-title { color: var(--md-default-fg-color); }
|
|
body[data-md-color-scheme="slate"] .gslide-desc { color: var(--md-default-fg-color); }
|
|
</style></head>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<body dir="ltr" data-md-color-scheme="default" data-md-color-primary="indigo" data-md-color-accent="indigo">
|
|
|
|
|
|
<input class="md-toggle" data-md-toggle="drawer" type="checkbox" id="__drawer" autocomplete="off">
|
|
<input class="md-toggle" data-md-toggle="search" type="checkbox" id="__search" autocomplete="off">
|
|
<label class="md-overlay" for="__drawer"></label>
|
|
<div data-md-component="skip">
|
|
|
|
|
|
<a href="#scenes" class="md-skip">
|
|
Skip to content
|
|
</a>
|
|
|
|
</div>
|
|
<div data-md-component="announce">
|
|
|
|
<aside class="md-banner">
|
|
<div class="md-banner__inner md-grid md-typeset">
|
|
|
|
<button class="md-banner__button md-icon" aria-label="Don't show this again">
|
|
|
|
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M19 6.41 17.59 5 12 10.59 6.41 5 5 6.41 10.59 12 5 17.59 6.41 19 12 13.41 17.59 19 19 17.59 13.41 12z"></path></svg>
|
|
</button>
|
|
|
|
|
|
<span class="twemoji heart"> <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><!--! Font Awesome Free 7.0.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free (Icons: CC BY 4.0, Fonts: SIL OFL 1.1, Code: MIT License) Copyright 2025 Fonticons, Inc.--><path fill="currentColor" d="m241 87.1 15 20.7 15-20.7C296 52.5 336.2 32 378.9 32 452.4 32 512 91.6 512 165.1v2.6c0 112.2-139.9 242.5-212.9 298.2-12.4 9.4-27.6 14.1-43.1 14.1s-30.8-4.6-43.1-14.1C139.9 410.2 0 279.9 0 167.7v-2.6C0 91.6 59.6 32 133.1 32 175.8 32 216 52.5 241 87.1"></path></svg></span>
|
|
Support continued development via
|
|
<a href="https://opencollective.com/stashapp">
|
|
<span class="twemoji mastodon">
|
|
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M12 0C5.373 0 0 5.373 0 12s5.373 12 12 12c2.54 0 4.894-.79 6.834-2.135l-3.107-3.109a7.715 7.715 0 1 1 0-13.512l3.107-3.109A11.94 11.94 0 0 0 12 0m9.865 5.166-3.109 3.107A7.7 7.7 0 0 1 19.715 12a7.7 7.7 0 0 1-.959 3.727l3.109 3.107A11.94 11.94 0 0 0 24 12c0-2.54-.79-4.894-2.135-6.834"></path></svg>
|
|
</span>
|
|
OpenCollective donation</a>
|
|
or
|
|
<a href="https://github.com/sponsors/stashapp">
|
|
<span class="twemoji mastodon">
|
|
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M12 .297c-6.63 0-12 5.373-12 12 0 5.303 3.438 9.8 8.205 11.385.6.113.82-.258.82-.577 0-.285-.01-1.04-.015-2.04-3.338.724-4.042-1.61-4.042-1.61C4.422 18.07 3.633 17.7 3.633 17.7c-1.087-.744.084-.729.084-.729 1.205.084 1.838 1.236 1.838 1.236 1.07 1.835 2.809 1.305 3.495.998.108-.776.417-1.305.76-1.605-2.665-.3-5.466-1.332-5.466-5.93 0-1.31.465-2.38 1.235-3.22-.135-.303-.54-1.523.105-3.176 0 0 1.005-.322 3.3 1.23.96-.267 1.98-.399 3-.405 1.02.006 2.04.138 3 .405 2.28-1.552 3.285-1.23 3.285-1.23.645 1.653.24 2.873.12 3.176.765.84 1.23 1.91 1.23 3.22 0 4.61-2.805 5.625-5.475 5.92.42.36.81 1.096.81 2.22 0 1.606-.015 2.896-.015 3.286 0 .315.21.69.825.57C20.565 22.092 24 17.592 24 12.297c0-6.627-5.373-12-12-12"></path></svg>
|
|
</span>
|
|
GitHub sponsorship</a>
|
|
|
|
</div>
|
|
|
|
<script>var el=document.querySelector("[data-md-component=announce]");if(el){var content=el.querySelector(".md-typeset");__md_hash(content.innerHTML)===__md_get("__announce")&&(el.hidden=!0)}</script>
|
|
|
|
</aside>
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
<header class="md-header" data-md-component="header">
|
|
<nav class="md-header__inner md-grid" aria-label="Header">
|
|
<a href="../.." title="Stash-Docs" class="md-header__button md-logo" aria-label="Stash-Docs" data-md-component="logo">
|
|
|
|
<img src="../../assets/images/logo_white.svg" alt="logo">
|
|
|
|
</a>
|
|
<label class="md-header__button md-icon" for="__drawer">
|
|
|
|
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M3 6h18v2H3zm0 5h18v2H3zm0 5h18v2H3z"></path></svg>
|
|
</label>
|
|
<div class="md-header__title" data-md-component="header-title">
|
|
<div class="md-header__ellipsis">
|
|
<div class="md-header__topic">
|
|
<span class="md-ellipsis">
|
|
Stash-Docs
|
|
</span>
|
|
</div>
|
|
<div class="md-header__topic" data-md-component="header-topic">
|
|
<span class="md-ellipsis">
|
|
|
|
Custom CSS snippets
|
|
|
|
</span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
|
|
<form class="md-header__option" data-md-component="palette">
|
|
|
|
|
|
|
|
|
|
<input class="md-option" data-md-color-media="(prefers-color-scheme: light)" data-md-color-scheme="default" data-md-color-primary="indigo" data-md-color-accent="indigo" aria-label="Switch to dark mode" type="radio" name="__palette" id="__palette_0">
|
|
|
|
<label class="md-header__button md-icon" title="Switch to dark mode" for="__palette_1" hidden>
|
|
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M12 8a4 4 0 0 0-4 4 4 4 0 0 0 4 4 4 4 0 0 0 4-4 4 4 0 0 0-4-4m0 10a6 6 0 0 1-6-6 6 6 0 0 1 6-6 6 6 0 0 1 6 6 6 6 0 0 1-6 6m8-9.31V4h-4.69L12 .69 8.69 4H4v4.69L.69 12 4 15.31V20h4.69L12 23.31 15.31 20H20v-4.69L23.31 12z"></path></svg>
|
|
</label>
|
|
|
|
|
|
|
|
|
|
|
|
<input class="md-option" data-md-color-media="(prefers-color-scheme: dark)" data-md-color-scheme="slate" data-md-color-primary="indigo" data-md-color-accent="indigo" aria-label="Switch to light mode" type="radio" name="__palette" id="__palette_1">
|
|
|
|
<label class="md-header__button md-icon" title="Switch to light mode" for="__palette_0" hidden>
|
|
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M12 18c-.89 0-1.74-.2-2.5-.55C11.56 16.5 13 14.42 13 12s-1.44-4.5-3.5-5.45C10.26 6.2 11.11 6 12 6a6 6 0 0 1 6 6 6 6 0 0 1-6 6m8-9.31V4h-4.69L12 .69 8.69 4H4v4.69L.69 12 4 15.31V20h4.69L12 23.31 15.31 20H20v-4.69L23.31 12z"></path></svg>
|
|
</label>
|
|
|
|
|
|
</form>
|
|
|
|
|
|
|
|
<script>var palette=__md_get("__palette");if(palette&&palette.color){if("(prefers-color-scheme)"===palette.color.media){var media=matchMedia("(prefers-color-scheme: light)"),input=document.querySelector(media.matches?"[data-md-color-media='(prefers-color-scheme: light)']":"[data-md-color-media='(prefers-color-scheme: dark)']");palette.color.media=input.getAttribute("data-md-color-media"),palette.color.scheme=input.getAttribute("data-md-color-scheme"),palette.color.primary=input.getAttribute("data-md-color-primary"),palette.color.accent=input.getAttribute("data-md-color-accent")}for(var[key,value]of Object.entries(palette.color))document.body.setAttribute("data-md-color-"+key,value)}</script>
|
|
|
|
|
|
|
|
|
|
|
|
<label class="md-header__button md-icon" for="__search">
|
|
|
|
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M9.5 3A6.5 6.5 0 0 1 16 9.5c0 1.61-.59 3.09-1.56 4.23l.27.27h.79l5 5-1.5 1.5-5-5v-.79l-.27-.27A6.52 6.52 0 0 1 9.5 16 6.5 6.5 0 0 1 3 9.5 6.5 6.5 0 0 1 9.5 3m0 2C7 5 5 7 5 9.5S7 14 9.5 14 14 12 14 9.5 12 5 9.5 5"></path></svg>
|
|
</label>
|
|
<div class="md-search" data-md-component="search" role="dialog">
|
|
<label class="md-search__overlay" for="__search"></label>
|
|
<div class="md-search__inner" role="search">
|
|
<form class="md-search__form" name="search">
|
|
<input type="text" class="md-search__input" name="query" aria-label="Search" placeholder="Search" autocapitalize="off" autocorrect="off" autocomplete="off" spellcheck="false" data-md-component="search-query" required>
|
|
<label class="md-search__icon md-icon" for="__search">
|
|
|
|
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M9.5 3A6.5 6.5 0 0 1 16 9.5c0 1.61-.59 3.09-1.56 4.23l.27.27h.79l5 5-1.5 1.5-5-5v-.79l-.27-.27A6.52 6.52 0 0 1 9.5 16 6.5 6.5 0 0 1 3 9.5 6.5 6.5 0 0 1 9.5 3m0 2C7 5 5 7 5 9.5S7 14 9.5 14 14 12 14 9.5 12 5 9.5 5"></path></svg>
|
|
|
|
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M20 11v2H8l5.5 5.5-1.42 1.42L4.16 12l7.92-7.92L13.5 5.5 8 11z"></path></svg>
|
|
</label>
|
|
<nav class="md-search__options" aria-label="Search">
|
|
|
|
<a href="javascript:void(0)" class="md-search__icon md-icon" title="Share" aria-label="Share" data-clipboard data-clipboard-text="" data-md-component="search-share" tabindex="-1">
|
|
|
|
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M18 16.08c-.76 0-1.44.3-1.96.77L8.91 12.7c.05-.23.09-.46.09-.7s-.04-.47-.09-.7l7.05-4.11c.54.5 1.25.81 2.04.81a3 3 0 0 0 3-3 3 3 0 0 0-3-3 3 3 0 0 0-3 3c0 .24.04.47.09.7L8.04 9.81C7.5 9.31 6.79 9 6 9a3 3 0 0 0-3 3 3 3 0 0 0 3 3c.79 0 1.5-.31 2.04-.81l7.12 4.15c-.05.21-.08.43-.08.66 0 1.61 1.31 2.91 2.92 2.91s2.92-1.3 2.92-2.91A2.92 2.92 0 0 0 18 16.08"></path></svg>
|
|
</a>
|
|
|
|
<button type="reset" class="md-search__icon md-icon" title="Clear" aria-label="Clear" tabindex="-1">
|
|
|
|
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M19 6.41 17.59 5 12 10.59 6.41 5 5 6.41 10.59 12 5 17.59 6.41 19 12 13.41 17.59 19 19 17.59 13.41 12z"></path></svg>
|
|
</button>
|
|
</nav>
|
|
|
|
</form>
|
|
<div class="md-search__output">
|
|
<div class="md-search__scrollwrap" tabindex="0" data-md-scrollfix>
|
|
<div class="md-search-result" data-md-component="search-result">
|
|
<div class="md-search-result__meta">
|
|
Initializing search
|
|
</div>
|
|
<ol class="md-search-result__list" role="presentation"></ol>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
|
|
|
|
<div class="md-header__source">
|
|
<a href="https://github.com/stashapp/Stash-Docs" title="Go to repository" class="md-source" data-md-component="source">
|
|
<div class="md-source__icon md-icon">
|
|
|
|
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448 512"><!--! Font Awesome Free 7.0.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free (Icons: CC BY 4.0, Fonts: SIL OFL 1.1, Code: MIT License) Copyright 2025 Fonticons, Inc.--><path fill="currentColor" d="M439.6 236.1 244 40.5c-5.4-5.5-12.8-8.5-20.4-8.5s-15 3-20.4 8.4L162.5 81l51.5 51.5c27.1-9.1 52.7 16.8 43.4 43.7l49.7 49.7c34.2-11.8 61.2 31 35.5 56.7-26.5 26.5-70.2-2.9-56-37.3L240.3 199v121.9c25.3 12.5 22.3 41.8 9.1 55-6.4 6.4-15.2 10.1-24.3 10.1s-17.8-3.6-24.3-10.1c-17.6-17.6-11.1-46.9 11.2-56v-123c-20.8-8.5-24.6-30.7-18.6-45L142.6 101 8.5 235.1C3 240.6 0 247.9 0 255.5s3 15 8.5 20.4l195.6 195.7c5.4 5.4 12.7 8.4 20.4 8.4s15-3 20.4-8.4l194.7-194.7c5.4-5.4 8.4-12.8 8.4-20.4s-3-15-8.4-20.4"></path></svg>
|
|
</div>
|
|
<div class="md-source__repository">
|
|
stashapp/Stash-Docs
|
|
</div>
|
|
</a>
|
|
</div>
|
|
|
|
</nav>
|
|
|
|
</header>
|
|
|
|
<div class="md-container" data-md-component="container">
|
|
|
|
|
|
|
|
|
|
|
|
<nav class="md-tabs" aria-label="Tabs" data-md-component="tabs">
|
|
<div class="md-grid">
|
|
<ul class="md-tabs__list">
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<li class="md-tabs__item">
|
|
<a href="../.." class="md-tabs__link">
|
|
|
|
|
|
|
|
|
|
|
|
Home
|
|
|
|
</a>
|
|
</li>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<li class="md-tabs__item">
|
|
<a href="../../installation/" class="md-tabs__link">
|
|
|
|
|
|
|
|
|
|
|
|
Installation
|
|
|
|
</a>
|
|
</li>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<li class="md-tabs__item">
|
|
<a href="../../in-app-manual/" class="md-tabs__link">
|
|
|
|
|
|
|
|
|
|
|
|
In-app manual
|
|
|
|
</a>
|
|
</li>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<li class="md-tabs__item">
|
|
<a href="../../guides/" class="md-tabs__link">
|
|
|
|
|
|
|
|
|
|
|
|
Guides
|
|
|
|
</a>
|
|
</li>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<li class="md-tabs__item">
|
|
<a href="../../metadata-sources/" class="md-tabs__link">
|
|
|
|
|
|
|
|
|
|
|
|
Metadata sources
|
|
|
|
</a>
|
|
</li>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<li class="md-tabs__item md-tabs__item--active">
|
|
<a href="../../plugins/" class="md-tabs__link">
|
|
|
|
|
|
|
|
|
|
|
|
Plugins
|
|
|
|
</a>
|
|
</li>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<li class="md-tabs__item">
|
|
<a href="../../api/" class="md-tabs__link">
|
|
|
|
|
|
|
|
|
|
|
|
API
|
|
|
|
</a>
|
|
</li>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<li class="md-tabs__item">
|
|
<a href="https://discourse.stashapp.cc" class="md-tabs__link">
|
|
|
|
|
|
|
|
|
|
|
|
Community forum
|
|
|
|
</a>
|
|
</li>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<li class="md-tabs__item">
|
|
<a href="../../code-of-conduct/" class="md-tabs__link">
|
|
|
|
|
|
|
|
|
|
|
|
Code of conduct
|
|
|
|
</a>
|
|
</li>
|
|
|
|
|
|
|
|
</ul>
|
|
</div>
|
|
</nav>
|
|
|
|
|
|
|
|
<main class="md-main" data-md-component="main">
|
|
<div class="md-main__inner md-grid">
|
|
|
|
|
|
|
|
<div class="md-sidebar md-sidebar--primary" data-md-component="sidebar" data-md-type="navigation">
|
|
<div class="md-sidebar__scrollwrap">
|
|
<div class="md-sidebar__inner">
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<nav class="md-nav md-nav--primary md-nav--lifted" aria-label="Navigation" data-md-level="0">
|
|
<label class="md-nav__title" for="__drawer">
|
|
<a href="../.." title="Stash-Docs" class="md-nav__button md-logo" aria-label="Stash-Docs" data-md-component="logo">
|
|
|
|
<img src="../../assets/images/logo_white.svg" alt="logo">
|
|
|
|
</a>
|
|
Stash-Docs
|
|
</label>
|
|
|
|
<div class="md-nav__source">
|
|
<a href="https://github.com/stashapp/Stash-Docs" title="Go to repository" class="md-source" data-md-component="source">
|
|
<div class="md-source__icon md-icon">
|
|
|
|
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448 512"><!--! Font Awesome Free 7.0.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free (Icons: CC BY 4.0, Fonts: SIL OFL 1.1, Code: MIT License) Copyright 2025 Fonticons, Inc.--><path fill="currentColor" d="M439.6 236.1 244 40.5c-5.4-5.5-12.8-8.5-20.4-8.5s-15 3-20.4 8.4L162.5 81l51.5 51.5c27.1-9.1 52.7 16.8 43.4 43.7l49.7 49.7c34.2-11.8 61.2 31 35.5 56.7-26.5 26.5-70.2-2.9-56-37.3L240.3 199v121.9c25.3 12.5 22.3 41.8 9.1 55-6.4 6.4-15.2 10.1-24.3 10.1s-17.8-3.6-24.3-10.1c-17.6-17.6-11.1-46.9 11.2-56v-123c-20.8-8.5-24.6-30.7-18.6-45L142.6 101 8.5 235.1C3 240.6 0 247.9 0 255.5s3 15 8.5 20.4l195.6 195.7c5.4 5.4 12.7 8.4 20.4 8.4s15-3 20.4-8.4l194.7-194.7c5.4-5.4 8.4-12.8 8.4-20.4s-3-15-8.4-20.4"></path></svg>
|
|
</div>
|
|
<div class="md-source__repository">
|
|
stashapp/Stash-Docs
|
|
</div>
|
|
</a>
|
|
</div>
|
|
|
|
<ul class="md-nav__list" data-md-scrollfix>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<li class="md-nav__item">
|
|
<a href="../.." class="md-nav__link">
|
|
|
|
|
|
|
|
<span class="md-ellipsis">
|
|
Home
|
|
|
|
</span>
|
|
|
|
|
|
</a>
|
|
</li>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<li class="md-nav__item md-nav__item--nested">
|
|
|
|
|
|
|
|
<input class="md-nav__toggle md-toggle " type="checkbox" id="__nav_2">
|
|
|
|
|
|
<div class="md-nav__link md-nav__container">
|
|
<a href="../../installation/" class="md-nav__link ">
|
|
|
|
|
|
|
|
<span class="md-ellipsis">
|
|
Installation
|
|
|
|
</span>
|
|
|
|
|
|
</a>
|
|
|
|
|
|
<label class="md-nav__link " for="__nav_2" id="__nav_2_label" tabindex="0">
|
|
<span class="md-nav__icon md-icon"></span>
|
|
</label>
|
|
|
|
</div>
|
|
|
|
<nav class="md-nav" data-md-level="1" aria-labelledby="__nav_2_label" aria-expanded="false">
|
|
<label class="md-nav__title" for="__nav_2">
|
|
<span class="md-nav__icon md-icon"></span>
|
|
Installation
|
|
</label>
|
|
<ul class="md-nav__list" data-md-scrollfix>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<li class="md-nav__item">
|
|
<a href="../../installation/windows/" class="md-nav__link">
|
|
|
|
|
|
|
|
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448 512"><!--! Font Awesome Free 7.0.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free (Icons: CC BY 4.0, Fonts: SIL OFL 1.1, Code: MIT License) Copyright 2025 Fonticons, Inc.--><path fill="currentColor" d="m0 93.7 183.6-25.3v177.4H0zm0 324.6 183.6 25.3V268.4H0zm203.8 28L448 480V268.4H203.8zm0-380.6v180.1H448V32z"></path></svg>
|
|
|
|
<span class="md-ellipsis">
|
|
Windows
|
|
|
|
</span>
|
|
|
|
|
|
</a>
|
|
</li>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<li class="md-nav__item">
|
|
<a href="../../installation/macos/" class="md-nav__link">
|
|
|
|
|
|
|
|
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 384 512"><!--! Font Awesome Free 7.0.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free (Icons: CC BY 4.0, Fonts: SIL OFL 1.1, Code: MIT License) Copyright 2025 Fonticons, Inc.--><path fill="currentColor" d="M319.1 268.7c-.2-36.7 16.4-64.4 50-84.8-18.8-26.9-47.2-41.7-84.7-44.6-35.5-2.8-74.3 20.7-88.5 20.7-15 0-49.4-19.7-76.4-19.7-55.8.9-115.1 44.5-115.1 133.2 0 26.2 4.8 53.3 14.4 81.2 12.8 36.7 59 126.7 107.2 125.2 25.2-.6 43-17.9 75.8-17.9 31.8 0 48.3 17.9 76.4 17.9 48.6-.7 90.4-82.5 102.6-119.3-65.2-30.7-61.7-90-61.7-91.9m-56.6-164.2c27.3-32.4 24.8-61.9 24-72.5-24.1 1.4-52 16.4-67.9 34.9-17.5 19.8-27.8 44.3-25.6 71.9 26.1 2 49.9-11.4 69.5-34.3"></path></svg>
|
|
|
|
<span class="md-ellipsis">
|
|
macOS
|
|
|
|
</span>
|
|
|
|
|
|
</a>
|
|
</li>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<li class="md-nav__item">
|
|
<a href="../../installation/linux/" class="md-nav__link">
|
|
|
|
|
|
|
|
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448 512"><!--! Font Awesome Free 7.0.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free (Icons: CC BY 4.0, Fonts: SIL OFL 1.1, Code: MIT License) Copyright 2025 Fonticons, Inc.--><path fill="currentColor" d="M220.9 123.3c1 .5 1.8 1.7 3 1.7 1.1 0 2.8-.4 2.9-1.5.2-1.4-1.9-2.3-3.2-2.9-1.7-.7-3.9-1-5.5-.1-.4.2-.8.7-.6 1.1.3 1.3 2.3 1.1 3.4 1.7M199 125c1.2 0 2-1.2 3-1.7 1.1-.6 3.1-.4 3.5-1.6.2-.4-.2-.9-.6-1.1-1.6-.9-3.8-.6-5.5.1-1.3.6-3.4 1.5-3.2 2.9.1 1 1.8 1.5 2.8 1.4m221 278.8c-3.6-4-5.3-11.6-7.2-19.7-1.8-8.1-3.9-16.8-10.5-22.4-1.3-1.1-2.6-2.1-4-2.9-1.3-.8-2.7-1.5-4.1-2 9.2-27.3 5.6-54.5-3.7-79.1-11.4-30.1-31.3-56.4-46.5-74.4-17.1-21.5-33.7-41.9-33.4-72C311.1 85.4 315.7.1 234.8 0 132.4-.2 158 103.4 156.9 135.2c-1.7 23.4-6.4 41.8-22.5 64.7-18.9 22.5-45.5 58.8-58.1 96.7-6 17.9-8.8 36.1-6.2 53.3-6.5 5.8-11.4 14.7-16.6 20.2-4.2 4.3-10.3 5.9-17 8.3s-14 6-18.5 14.5c-2.1 3.9-2.8 8.1-2.8 12.4 0 3.9.6 7.9 1.2 11.8 1.2 8.1 2.5 15.7.8 20.8-5.2 14.4-5.9 24.4-2.2 31.7 3.8 7.3 11.4 10.5 20.1 12.3 17.3 3.6 40.8 2.7 59.3 12.5 19.8 10.4 39.9 14.1 55.9 10.4 11.6-2.6 21.1-9.6 25.9-20.2 12.5-.1 26.3-5.4 48.3-6.6 14.9-1.2 33.6 5.3 55.1 4.1.6 2.3 1.4 4.6 2.5 6.7v.1c8.3 16.7 23.8 24.3 40.3 23 16.6-1.3 34.1-11 48.3-27.9 13.6-16.4 36-23.2 50.9-32.2 7.4-4.5 13.4-10.1 13.9-18.3.4-8.2-4.4-17.3-15.5-29.7M223.8 87.3c9.8-22.2 34.2-21.8 44-.4 6.5 14.2 3.6 30.9-4.3 40.4-1.6-.8-5.9-2.6-12.6-4.9 1.1-1.2 3.1-2.7 3.9-4.6 4.8-11.8-.2-27-9.1-27.3-7.3-.5-13.9 10.8-11.8 23-4.1-2-9.4-3.5-13-4.4-1-6.9-.3-14.6 2.9-21.8m-40.7-11.5c10.1 0 20.8 14.2 19.1 33.5-3.5 1-7.1 2.5-10.2 4.6 1.2-8.9-3.3-20.1-9.6-19.6-8.4.7-9.8 21.2-1.8 28.1 1 .8 1.9-.2-5.9 5.5-15.6-14.6-10.5-52.1 8.4-52.1m-13.6 60.7c6.2-4.6 13.6-10 14.1-10.5 4.7-4.4 13.5-14.2 27.9-14.2 7.1 0 15.6 2.3 25.9 8.9 6.3 4.1 11.3 4.4 22.6 9.3 8.4 3.5 13.7 9.7 10.5 18.2-2.6 7.1-11 14.4-22.7 18.1-11.1 3.6-19.8 16-38.2 14.9-3.9-.2-7-1-9.6-2.1-8-3.5-12.2-10.4-20-15-8.6-4.8-13.2-10.4-14.7-15.3q-2.1-7.35 4.2-12.3m3.3 334c-2.7 35.1-43.9 34.4-75.3 18-29.9-15.8-68.6-6.5-76.5-21.9-2.4-4.7-2.4-12.7 2.6-26.4v-.2c2.4-7.6.6-16-.6-23.9-1.2-7.8-1.8-15 .9-20 3.5-6.7 8.5-9.1 14.8-11.3 10.3-3.7 11.8-3.4 19.6-9.9 5.5-5.7 9.5-12.9 14.3-18 5.1-5.5 10-8.1 17.7-6.9 8.1 1.2 15.1 6.8 21.9 16l19.6 35.6c9.5 19.9 43.1 48.4 41 68.9m-1.4-25.9c-4.1-6.6-9.6-13.6-14.4-19.6 7.1 0 14.2-2.2 16.7-8.9 2.3-6.2 0-14.9-7.4-24.9-13.5-18.2-38.3-32.5-38.3-32.5-13.5-8.4-21.1-18.7-24.6-29.9s-3-23.3-.3-35.2c5.2-22.9 18.6-45.2 27.2-59.2 2.3-1.7.8 3.2-8.7 20.8-8.5 16.1-24.4 53.3-2.6 82.4.6-20.7 5.5-41.8 13.8-61.5 12-27.4 37.3-74.9 39.3-112.7 1.1.8 4.6 3.2 6.2 4.1 4.6 2.7 8.1 6.7 12.6 10.3 12.4 10 28.5 9.2 42.4 1.2 6.2-3.5 11.2-7.5 15.9-9 9.9-3.1 17.8-8.6 22.3-15 7.7 30.4 25.7 74.3 37.2 95.7 6.1 11.4 18.3 35.5 23.6 64.6 3.3-.1 7 .4 10.9 1.4 13.8-35.7-11.7-74.2-23.3-84.9-4.7-4.6-4.9-6.6-2.6-6.5 12.6 11.2 29.2 33.7 35.2 59 2.8 11.6 3.3 23.7.4 35.7 16.4 6.8 35.9 17.9 30.7 34.8-2.2-.1-3.2 0-4.2 0 3.2-10.1-3.9-17.6-22.8-26.1-19.6-8.6-36-8.6-38.3 12.5-12.1 4.2-18.3 14.7-21.4 27.3-2.8 11.2-3.6 24.7-4.4 39.9-.5 7.7-3.6 18-6.8 29-32.1 22.9-76.7 32.9-114.3 7.2m257.4-11.5c-.9 16.8-41.2 19.9-63.2 46.5-13.2 15.7-29.4 24.4-43.6 25.5s-26.5-4.8-33.7-19.3c-4.7-11.1-2.4-23.1 1.1-36.3 3.7-14.2 9.2-28.8 9.9-40.6.8-15.2 1.7-28.5 4.2-38.7 2.6-10.3 6.6-17.2 13.7-21.1.3-.2.7-.3 1-.5.8 13.2 7.3 26.6 18.8 29.5 12.6 3.3 30.7-7.5 38.4-16.3 9-.3 15.7-.9 22.6 5.1 9.9 8.5 7.1 30.3 17.1 41.6 10.6 11.6 14 19.5 13.7 24.6M173.4 148.7c2 1.9 4.7 4.5 8 7.1 6.6 5.2 15.8 10.6 27.3 10.6 11.6 0 22.5-5.9 31.8-10.8 4.9-2.6 10.9-7 14.8-10.4s5.9-6.3 3.1-6.6-2.6 2.6-6 5.1c-4.4 3.2-9.7 7.4-13.9 9.8-7.4 4.2-19.5 10.2-29.9 10.2s-18.7-4.8-24.9-9.7c-3.1-2.5-5.7-5-7.7-6.9-1.5-1.4-1.9-4.6-4.3-4.9-1.4-.1-1.8 3.7 1.7 6.5"></path></svg>
|
|
|
|
<span class="md-ellipsis">
|
|
Linux
|
|
|
|
</span>
|
|
|
|
|
|
</a>
|
|
</li>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<li class="md-nav__item">
|
|
<a href="../../installation/docker/" class="md-nav__link">
|
|
|
|
|
|
|
|
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 640 512"><!--! Font Awesome Free 7.0.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free (Icons: CC BY 4.0, Fonts: SIL OFL 1.1, Code: MIT License) Copyright 2025 Fonticons, Inc.--><path fill="currentColor" d="M349.9 236.3h-66.1v-59.4h66.1zm0-204.3h-66.1v60.7h66.1zm78.2 144.8H362v59.4h66.1zm-156.3-72.1h-66.1v60.1h66.1zm78.1 0h-66.1v60.1h66.1zm276.8 100c-14.4-9.7-47.6-13.2-73.1-8.4-3.3-24-16.7-44.9-41.1-63.7l-14-9.3-9.3 14c-18.4 27.8-23.4 73.6-3.7 103.8-8.7 4.7-25.8 11.1-48.4 10.7H2.4c-8.7 50.8 5.8 116.8 44 162.1 37.1 43.9 92.7 66.2 165.4 66.2 157.4 0 273.9-72.5 328.4-204.2 21.4.4 67.6.1 91.3-45.2 1.5-2.5 6.6-13.2 8.5-17.1zm-511.1-27.9h-66v59.4h66.1v-59.4zm78.1 0h-66.1v59.4h66.1zm78.1 0h-66.1v59.4h66.1zm-78.1-72.1h-66.1v60.1h66.1z"></path></svg>
|
|
|
|
<span class="md-ellipsis">
|
|
Docker
|
|
|
|
</span>
|
|
|
|
|
|
</a>
|
|
</li>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<li class="md-nav__item">
|
|
<a href="../../installation/synology/" class="md-nav__link">
|
|
|
|
|
|
|
|
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="m13.44 8.927-.889.37.056.117a.6.6 0 0 1 .212-.054q.076.001.126.046.05.042.072.16.022.119.022.634v2.736q0 .284-.042.381a.3.3 0 0 1-.118.142q-.079.046-.286.045v.12h1.481v-.12q-.231 0-.32-.048a.3.3 0 0 1-.126-.142q-.04-.09-.04-.378V8.927zm-11.722.34q-.494 0-.84.147-.35.15-.534.436a1.1 1.1 0 0 0-.185.612q0 .508.393.864.276.252.968.422.537.135.688.191a.7.7 0 0 1 .31.183q.087.106.088.259 0 .232-.21.41-.212.175-.628.176-.393 0-.625-.197-.23-.199-.307-.619L0 12.23q.084.72.517 1.096.434.378 1.244.378.556-.002.93-.156a1.26 1.26 0 0 0 .781-1.169 1.3 1.3 0 0 0-.171-.684 1.2 1.2 0 0 0-.472-.437q-.3-.16-.927-.31-.628-.147-.79-.286a.326.326 0 0 1 .009-.524q.21-.157.586-.156.361 0 .542.145.181.147.237.471l.864-.028q-.019-.591-.425-.949-.407-.353-1.208-.353zm21.808.33a.475.475 0 1 0-.002.95.475.475 0 0 0 .002-.95m0 .072a.4.4 0 0 1 .401.403c0 .116-.05.22-.128.294l-.086-.135a.4.4 0 0 0-.065-.078.2.2 0 0 0-.048-.03.2.2 0 0 0 .127-.057.14.14 0 0 0 .043-.109.2.2 0 0 0-.025-.091.13.13 0 0 0-.067-.055.3.3 0 0 0-.123-.02h-.266v.606h.08v-.268h.091q.03 0 .045.003.02.005.036.014.018.014.04.043.023.03.059.083l.08.125h.043a.4.4 0 0 1-.237.08.405.405 0 0 1-.404-.405c0-.224.18-.403.404-.403m-.157.191h.191q.067 0 .097.027a.09.09 0 0 1 .03.07.1.1 0 0 1-.016.055.08.08 0 0 1-.047.035.2.2 0 0 1-.085.013h-.17zm-15.037.6q-.616-.001-1.023.514v-.455h-.754v3.105h.814v-1.401c0-.348.022-.583.063-.713a.6.6 0 0 1 .234-.306.67.67 0 0 1 .385-.118q.167 0 .287.082.119.08.17.229.055.148.054.646v1.581h.816V11.7a2.5 2.5 0 0 0-.046-.55.9.9 0 0 0-.16-.343.83.83 0 0 0-.341-.25 1.3 1.3 0 0 0-.499-.097m2.65 0a1.7 1.7 0 0 0-.826.2 1.4 1.4 0 0 0-.571.586 1.7 1.7 0 0 0-.202.793q0 .534.202.904.201.374.588.566.388.194.814.194.69-.001 1.144-.463.455-.464.455-1.167 0-.697-.451-1.156-.449-.457-1.154-.457zm7.315.05q-.527 0-.865.323a1.02 1.02 0 0 0-.336.77q0 .29.147.534c.1.162.24.285.423.379q-.334.281-.429.44a.55.55 0 0 0-.092.271q0 .102.071.184t.24.187a10 10 0 0 0-.329.355c-.113.145-.19.253-.226.336a.4.4 0 0 0-.034.157q0 .178.246.343.437.284 1.071.284.825 0 1.337-.477.349-.326.35-.694a.61.61 0 0 0-.183-.45.84.84 0 0 0-.49-.227 9 9 0 0 0-.878-.053 4 4 0 0 1-.46-.027q-.159-.023-.212-.075-.056-.054-.056-.112a.4.4 0 0 1 .05-.159.9.9 0 0 1 .186-.221q.234.072.459.07.54 0 .864-.301a.96.96 0 0 0 .323-.722q0-.37-.187-.61h.394c.097 0 .15-.002.167-.01a.06.06 0 0 0 .035-.025.3.3 0 0 0 .018-.12.2.2 0 0 0-.02-.105.1.1 0 0 0-.033-.028 1 1 0 0 0-.166-.008h-.639a1.3 1.3 0 0 0-.746-.21zm-2.752 0q-.378 0-.714.194a1.44 1.44 0 0 0-.546.61 1.8 1.8 0 0 0-.205.825q0 .571.34 1.03a1.29 1.29 0 0 0 1.09.543q.419 0 .76-.211.344-.21.54-.627.194-.414.194-.821 0-.577-.354-1.022a1.34 1.34 0 0 0-1.105-.522zm-12.182.009 1.174 3.113a1.2 1.2 0 0 1-.21.431q-.135.168-.419.167-.154 0-.344-.04l.067.645q.228.05.464.052.232-.001.418-.052a1 1 0 0 0 .31-.138.9.9 0 0 0 .224-.234 2.2 2.2 0 0 0 .205-.414l.199-.545 1.085-2.985h-.844l-.722 2.204-.74-2.204zm16.631.078v.122a.8.8 0 0 1 .245.091q.052.043.136.157.108.152.158.255l1.088 2.275-.213.526q-.119.292-.236.393-.118.103-.217.104a1 1 0 0 1-.167-.05 1 1 0 0 0-.3-.07c-.105 0-.19.025-.25.084a.29.29 0 0 0-.092.22q0 .146.126.257a.46.46 0 0 0 .322.112q.27.002.56-.223.29-.224.469-.664l1.226-3.014a1.6 1.6 0 0 1 .113-.254.6.6 0 0 1 .145-.146.5.5 0 0 1 .188-.053v-.122h-.978v.122q.14 0 .197.023a.17.17 0 0 1 .083.057.15.15 0 0 1 .023.087q0 .136-.056.271l-.675 1.671-.737-1.53q-.11-.225-.11-.356a.21.21 0 0 1 .074-.16.35.35 0 0 1 .224-.063h.068v-.122zm-1.753.08q.26.001.43.217.224.293.224.815 0 .398-.16.584a.52.52 0 0 1-.41.188.53.53 0 0 1-.43-.216q-.223-.286-.223-.802c0-.268.054-.461.163-.59a.52.52 0 0 1 .406-.197zm-2.798.054q.362-.002.598.312.346.46.346 1.263 0 .643-.209.905a.65.65 0 0 1-.528.264q-.429-.002-.691-.477c-.174-.32-.263-.695-.263-1.135q0-.406.11-.669a.73.73 0 0 1 .285-.361.67.67 0 0 1 .352-.102m-4.463.395q.323.001.543.247.216.244.216.703 0 .468-.216.712a.7.7 0 0 1-.543.248.7.7 0 0 1-.542-.248q-.22-.242-.22-.708 0-.463.22-.707a.7.7 0 0 1 .542-.247m6.66 2.498q.398.056 1.142.08.51.01.68.083t.17.241q0 .235-.282.442-.284.208-.874.208-.622-.001-.951-.204-.191-.115-.19-.277c0-.078.024-.169.076-.26a1.5 1.5 0 0 1 .228-.313z"></path></svg>
|
|
|
|
<span class="md-ellipsis">
|
|
Synology
|
|
|
|
</span>
|
|
|
|
|
|
</a>
|
|
</li>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<li class="md-nav__item">
|
|
<a href="../../installation/freenas-truenas/" class="md-nav__link">
|
|
|
|
|
|
|
|
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M24 10.049v5.114l-10.949 6.324v-5.114zm-24 0v5.114l10.956 6.324v-5.114zm12.004-.605-4.433 2.559 4.433 2.559 4.429-2.559zm10.952-1.207-9.905-5.723v5.118l5.473 3.164zm-12-.605V2.513L1.044 8.236l4.432 2.555z"></path></svg>
|
|
|
|
<span class="md-ellipsis">
|
|
FreeNAS/TrueNAS
|
|
|
|
</span>
|
|
|
|
|
|
</a>
|
|
</li>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<li class="md-nav__item">
|
|
<a href="../../installation/unraid/" class="md-nav__link">
|
|
|
|
|
|
|
|
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M11.406 8.528h1.17v6.926h-1.17zM1.17 15.454H0V8.528h1.17zm4.534.828h1.17v2.645h-1.17zm-2.86-2.969h1.169v4.282h-1.17zm5.703 0h1.17v4.282h-1.17zM22.83 8.528H24v6.926h-1.17zm-4.534-.81h-1.17V5.073h1.17zm2.86 2.95h-1.169V6.406h1.17zm-5.72 0h-1.17V6.406h1.17z"></path></svg>
|
|
|
|
<span class="md-ellipsis">
|
|
Unraid
|
|
|
|
</span>
|
|
|
|
|
|
</a>
|
|
</li>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<li class="md-nav__item md-nav__item--nested">
|
|
|
|
|
|
|
|
<input class="md-nav__toggle md-toggle " type="checkbox" id="__nav_2_9">
|
|
|
|
|
|
<label class="md-nav__link" for="__nav_2_9" id="__nav_2_9_label" tabindex="0">
|
|
|
|
|
|
|
|
<span class="md-ellipsis">
|
|
Getting started
|
|
|
|
</span>
|
|
|
|
|
|
<span class="md-nav__icon md-icon"></span>
|
|
</label>
|
|
|
|
<nav class="md-nav" data-md-level="2" aria-labelledby="__nav_2_9_label" aria-expanded="false">
|
|
<label class="md-nav__title" for="__nav_2_9">
|
|
<span class="md-nav__icon md-icon"></span>
|
|
Getting started
|
|
</label>
|
|
<ul class="md-nav__list" data-md-scrollfix>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<li class="md-nav__item">
|
|
<a href="../../getting-started/first-steps/" class="md-nav__link">
|
|
|
|
|
|
|
|
<span class="md-ellipsis">
|
|
First steps
|
|
|
|
</span>
|
|
|
|
|
|
</a>
|
|
</li>
|
|
|
|
|
|
|
|
|
|
</ul>
|
|
</nav>
|
|
|
|
</li>
|
|
|
|
|
|
|
|
|
|
</ul>
|
|
</nav>
|
|
|
|
</li>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<li class="md-nav__item md-nav__item--nested">
|
|
|
|
|
|
|
|
<input class="md-nav__toggle md-toggle " type="checkbox" id="__nav_3">
|
|
|
|
|
|
<div class="md-nav__link md-nav__container">
|
|
<a href="../../in-app-manual/" class="md-nav__link ">
|
|
|
|
|
|
|
|
<span class="md-ellipsis">
|
|
In-app manual
|
|
|
|
</span>
|
|
|
|
|
|
</a>
|
|
|
|
|
|
<label class="md-nav__link " for="__nav_3" id="__nav_3_label" tabindex="0">
|
|
<span class="md-nav__icon md-icon"></span>
|
|
</label>
|
|
|
|
</div>
|
|
|
|
<nav class="md-nav" data-md-level="1" aria-labelledby="__nav_3_label" aria-expanded="false">
|
|
<label class="md-nav__title" for="__nav_3">
|
|
<span class="md-nav__icon md-icon"></span>
|
|
In-app manual
|
|
</label>
|
|
<ul class="md-nav__list" data-md-scrollfix>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<li class="md-nav__item">
|
|
<a href="../../in-app-manual/introduction/" class="md-nav__link">
|
|
|
|
|
|
|
|
<span class="md-ellipsis">
|
|
Introduction
|
|
|
|
</span>
|
|
|
|
|
|
</a>
|
|
</li>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<li class="md-nav__item">
|
|
<a href="../../in-app-manual/configuration/" class="md-nav__link">
|
|
|
|
|
|
|
|
<span class="md-ellipsis">
|
|
Configuration
|
|
|
|
</span>
|
|
|
|
|
|
</a>
|
|
</li>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<li class="md-nav__item">
|
|
<a href="../../in-app-manual/interface/" class="md-nav__link">
|
|
|
|
|
|
|
|
<span class="md-ellipsis">
|
|
Interface options
|
|
|
|
</span>
|
|
|
|
|
|
</a>
|
|
</li>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<li class="md-nav__item md-nav__item--nested">
|
|
|
|
|
|
|
|
<input class="md-nav__toggle md-toggle " type="checkbox" id="__nav_3_5">
|
|
|
|
|
|
<div class="md-nav__link md-nav__container">
|
|
<a href="../../in-app-manual/tasks/" class="md-nav__link ">
|
|
|
|
|
|
|
|
<span class="md-ellipsis">
|
|
Tasks
|
|
|
|
</span>
|
|
|
|
|
|
</a>
|
|
|
|
|
|
<label class="md-nav__link " for="__nav_3_5" id="__nav_3_5_label" tabindex="0">
|
|
<span class="md-nav__icon md-icon"></span>
|
|
</label>
|
|
|
|
</div>
|
|
|
|
<nav class="md-nav" data-md-level="2" aria-labelledby="__nav_3_5_label" aria-expanded="false">
|
|
<label class="md-nav__title" for="__nav_3_5">
|
|
<span class="md-nav__icon md-icon"></span>
|
|
Tasks
|
|
</label>
|
|
<ul class="md-nav__list" data-md-scrollfix>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<li class="md-nav__item">
|
|
<a href="../../in-app-manual/tasks/identify/" class="md-nav__link">
|
|
|
|
|
|
|
|
<span class="md-ellipsis">
|
|
Identify
|
|
|
|
</span>
|
|
|
|
|
|
</a>
|
|
</li>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<li class="md-nav__item">
|
|
<a href="../../in-app-manual/tasks/autotagging/" class="md-nav__link">
|
|
|
|
|
|
|
|
<span class="md-ellipsis">
|
|
Auto tagging
|
|
|
|
</span>
|
|
|
|
|
|
</a>
|
|
</li>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<li class="md-nav__item">
|
|
<a href="../../in-app-manual/tasks/scenefilenameparser/" class="md-nav__link">
|
|
|
|
|
|
|
|
<span class="md-ellipsis">
|
|
Scene filename parser
|
|
|
|
</span>
|
|
|
|
|
|
</a>
|
|
</li>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<li class="md-nav__item">
|
|
<a href="../../in-app-manual/tasks/jsonspec/" class="md-nav__link">
|
|
|
|
|
|
|
|
<span class="md-ellipsis">
|
|
Import/export JSON specification
|
|
|
|
</span>
|
|
|
|
|
|
</a>
|
|
</li>
|
|
|
|
|
|
|
|
|
|
</ul>
|
|
</nav>
|
|
|
|
</li>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<li class="md-nav__item">
|
|
<a href="../../in-app-manual/browsing/" class="md-nav__link">
|
|
|
|
|
|
|
|
<span class="md-ellipsis">
|
|
Browsing
|
|
|
|
</span>
|
|
|
|
|
|
</a>
|
|
</li>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<li class="md-nav__item">
|
|
<a href="../../in-app-manual/images/" class="md-nav__link">
|
|
|
|
|
|
|
|
<span class="md-ellipsis">
|
|
Images and galleries
|
|
|
|
</span>
|
|
|
|
|
|
</a>
|
|
</li>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<li class="md-nav__item md-nav__item--nested">
|
|
|
|
|
|
|
|
<input class="md-nav__toggle md-toggle " type="checkbox" id="__nav_3_8">
|
|
|
|
|
|
<div class="md-nav__link md-nav__container">
|
|
<a href="../../in-app-manual/scraping/" class="md-nav__link ">
|
|
|
|
|
|
|
|
<span class="md-ellipsis">
|
|
Metadata scraping
|
|
|
|
</span>
|
|
|
|
|
|
</a>
|
|
|
|
|
|
<label class="md-nav__link " for="__nav_3_8" id="__nav_3_8_label" tabindex="0">
|
|
<span class="md-nav__icon md-icon"></span>
|
|
</label>
|
|
|
|
</div>
|
|
|
|
<nav class="md-nav" data-md-level="2" aria-labelledby="__nav_3_8_label" aria-expanded="false">
|
|
<label class="md-nav__title" for="__nav_3_8">
|
|
<span class="md-nav__icon md-icon"></span>
|
|
Metadata scraping
|
|
</label>
|
|
<ul class="md-nav__list" data-md-scrollfix>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<li class="md-nav__item">
|
|
<a href="../../in-app-manual/scraping/scraperdevelopment/" class="md-nav__link">
|
|
|
|
|
|
|
|
<span class="md-ellipsis">
|
|
Contributing scrapers
|
|
|
|
</span>
|
|
|
|
|
|
</a>
|
|
</li>
|
|
|
|
|
|
|
|
|
|
</ul>
|
|
</nav>
|
|
|
|
</li>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<li class="md-nav__item md-nav__item--nested">
|
|
|
|
|
|
|
|
<input class="md-nav__toggle md-toggle " type="checkbox" id="__nav_3_9">
|
|
|
|
|
|
<div class="md-nav__link md-nav__container">
|
|
<a href="../../in-app-manual/plugins/" class="md-nav__link ">
|
|
|
|
|
|
|
|
<span class="md-ellipsis">
|
|
Plugins
|
|
|
|
</span>
|
|
|
|
|
|
</a>
|
|
|
|
|
|
<label class="md-nav__link " for="__nav_3_9" id="__nav_3_9_label" tabindex="0">
|
|
<span class="md-nav__icon md-icon"></span>
|
|
</label>
|
|
|
|
</div>
|
|
|
|
<nav class="md-nav" data-md-level="2" aria-labelledby="__nav_3_9_label" aria-expanded="false">
|
|
<label class="md-nav__title" for="__nav_3_9">
|
|
<span class="md-nav__icon md-icon"></span>
|
|
Plugins
|
|
</label>
|
|
<ul class="md-nav__list" data-md-scrollfix>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<li class="md-nav__item">
|
|
<a href="../../in-app-manual/plugins/externalplugins/" class="md-nav__link">
|
|
|
|
|
|
|
|
<span class="md-ellipsis">
|
|
External plugins
|
|
|
|
</span>
|
|
|
|
|
|
</a>
|
|
</li>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<li class="md-nav__item">
|
|
<a href="../../in-app-manual/plugins/embeddedplugins/" class="md-nav__link">
|
|
|
|
|
|
|
|
<span class="md-ellipsis">
|
|
Embedded plugins
|
|
|
|
</span>
|
|
|
|
|
|
</a>
|
|
</li>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<li class="md-nav__item">
|
|
<a href="../../in-app-manual/plugins/uipluginapi/" class="md-nav__link">
|
|
|
|
|
|
|
|
<span class="md-ellipsis">
|
|
UI plugin API
|
|
|
|
</span>
|
|
|
|
|
|
</a>
|
|
</li>
|
|
|
|
|
|
|
|
|
|
</ul>
|
|
</nav>
|
|
|
|
</li>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<li class="md-nav__item">
|
|
<a href="../../in-app-manual/tagger/" class="md-nav__link">
|
|
|
|
|
|
|
|
<span class="md-ellipsis">
|
|
Scene tagger
|
|
|
|
</span>
|
|
|
|
|
|
</a>
|
|
</li>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<li class="md-nav__item">
|
|
<a href="../../in-app-manual/deduplication/" class="md-nav__link">
|
|
|
|
|
|
|
|
<span class="md-ellipsis">
|
|
Dupe checker
|
|
|
|
</span>
|
|
|
|
|
|
</a>
|
|
</li>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<li class="md-nav__item">
|
|
<a href="../../in-app-manual/interactive/" class="md-nav__link">
|
|
|
|
|
|
|
|
<span class="md-ellipsis">
|
|
Interactivity
|
|
|
|
</span>
|
|
|
|
|
|
</a>
|
|
</li>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<li class="md-nav__item">
|
|
<a href="../../in-app-manual/captions/" class="md-nav__link">
|
|
|
|
|
|
|
|
<span class="md-ellipsis">
|
|
Captions
|
|
|
|
</span>
|
|
|
|
|
|
</a>
|
|
</li>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<li class="md-nav__item">
|
|
<a href="../../in-app-manual/keyboardshortcuts/" class="md-nav__link">
|
|
|
|
|
|
|
|
<span class="md-ellipsis">
|
|
Keyboard shortcuts
|
|
|
|
</span>
|
|
|
|
|
|
</a>
|
|
</li>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<li class="md-nav__item">
|
|
<a href="../../in-app-manual/contributing/" class="md-nav__link">
|
|
|
|
|
|
|
|
<span class="md-ellipsis">
|
|
Ways to contribute
|
|
|
|
</span>
|
|
|
|
|
|
</a>
|
|
</li>
|
|
|
|
|
|
|
|
|
|
</ul>
|
|
</nav>
|
|
|
|
</li>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<li class="md-nav__item md-nav__item--nested">
|
|
|
|
|
|
|
|
<input class="md-nav__toggle md-toggle " type="checkbox" id="__nav_4">
|
|
|
|
|
|
<div class="md-nav__link md-nav__container">
|
|
<a href="../../guides/" class="md-nav__link ">
|
|
|
|
|
|
|
|
<span class="md-ellipsis">
|
|
Guides
|
|
|
|
</span>
|
|
|
|
|
|
</a>
|
|
|
|
|
|
<label class="md-nav__link " for="__nav_4" id="__nav_4_label" tabindex="0">
|
|
<span class="md-nav__icon md-icon"></span>
|
|
</label>
|
|
|
|
</div>
|
|
|
|
<nav class="md-nav" data-md-level="1" aria-labelledby="__nav_4_label" aria-expanded="false">
|
|
<label class="md-nav__title" for="__nav_4">
|
|
<span class="md-nav__icon md-icon"></span>
|
|
Guides
|
|
</label>
|
|
<ul class="md-nav__list" data-md-scrollfix>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<li class="md-nav__item">
|
|
<a href="../../guides/scraping-scenes-via-stash-box/" class="md-nav__link">
|
|
|
|
|
|
|
|
<span class="md-ellipsis">
|
|
Scraping scenes via stash-box
|
|
|
|
</span>
|
|
|
|
|
|
</a>
|
|
</li>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<li class="md-nav__item">
|
|
<a href="../../guides/backup-and-restore-database/" class="md-nav__link">
|
|
|
|
|
|
|
|
<span class="md-ellipsis">
|
|
Backup and restore database
|
|
|
|
</span>
|
|
|
|
|
|
</a>
|
|
</li>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<li class="md-nav__item">
|
|
<a href="../../guides/reverse-proxy/" class="md-nav__link">
|
|
|
|
|
|
|
|
<span class="md-ellipsis">
|
|
Reverse proxy
|
|
|
|
</span>
|
|
|
|
|
|
</a>
|
|
</li>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<li class="md-nav__item">
|
|
<a href="../../guides/troubleshooting-video-playback/" class="md-nav__link">
|
|
|
|
|
|
|
|
<span class="md-ellipsis">
|
|
Troubleshooting video playback
|
|
|
|
</span>
|
|
|
|
|
|
</a>
|
|
</li>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<li class="md-nav__item">
|
|
<a href="../../guides/run-cdp-on-truenas-scale/" class="md-nav__link">
|
|
|
|
|
|
|
|
<span class="md-ellipsis">
|
|
Run CDP on TrueNAS Scale
|
|
|
|
</span>
|
|
|
|
|
|
</a>
|
|
</li>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<li class="md-nav__item">
|
|
<a href="../../guides/advanced-configuration-options/" class="md-nav__link">
|
|
|
|
|
|
|
|
<span class="md-ellipsis">
|
|
Advanced configuration options
|
|
|
|
</span>
|
|
|
|
|
|
</a>
|
|
</li>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<li class="md-nav__item">
|
|
<a href="../../guides/importing-via-csv-using-gql-iterate/" class="md-nav__link">
|
|
|
|
|
|
|
|
<span class="md-ellipsis">
|
|
Bulk importing via CSV using gql-iterate
|
|
|
|
</span>
|
|
|
|
|
|
</a>
|
|
</li>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<li class="md-nav__item">
|
|
<a href="../../guides/manually-editing-the-stash-sqlite3-database/" class="md-nav__link">
|
|
|
|
|
|
|
|
<span class="md-ellipsis">
|
|
Manually editing the Stash sqlite3 database
|
|
|
|
</span>
|
|
|
|
|
|
</a>
|
|
</li>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<li class="md-nav__item">
|
|
<a href="../../guides/scraping-metadata-behind-login/" class="md-nav__link">
|
|
|
|
|
|
|
|
<span class="md-ellipsis">
|
|
Scraping metadata behind login
|
|
|
|
</span>
|
|
|
|
|
|
</a>
|
|
</li>
|
|
|
|
|
|
|
|
|
|
</ul>
|
|
</nav>
|
|
|
|
</li>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<li class="md-nav__item md-nav__item--nested">
|
|
|
|
|
|
|
|
<input class="md-nav__toggle md-toggle " type="checkbox" id="__nav_5">
|
|
|
|
|
|
<div class="md-nav__link md-nav__container">
|
|
<a href="../../metadata-sources/" class="md-nav__link ">
|
|
|
|
|
|
|
|
<span class="md-ellipsis">
|
|
Metadata sources
|
|
|
|
</span>
|
|
|
|
|
|
</a>
|
|
|
|
|
|
<label class="md-nav__link " for="__nav_5" id="__nav_5_label" tabindex="0">
|
|
<span class="md-nav__icon md-icon"></span>
|
|
</label>
|
|
|
|
</div>
|
|
|
|
<nav class="md-nav" data-md-level="1" aria-labelledby="__nav_5_label" aria-expanded="false">
|
|
<label class="md-nav__title" for="__nav_5">
|
|
<span class="md-nav__icon md-icon"></span>
|
|
Metadata sources
|
|
</label>
|
|
<ul class="md-nav__list" data-md-scrollfix>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<li class="md-nav__item">
|
|
<a href="../../metadata-sources/stash-box-instances/" class="md-nav__link">
|
|
|
|
|
|
|
|
<span class="md-ellipsis">
|
|
stash-box instances
|
|
|
|
</span>
|
|
|
|
|
|
</a>
|
|
</li>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<li class="md-nav__item">
|
|
<a href="../../metadata-sources/scrapers/" class="md-nav__link">
|
|
|
|
|
|
|
|
<span class="md-ellipsis">
|
|
Scrapers
|
|
|
|
</span>
|
|
|
|
|
|
</a>
|
|
</li>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<li class="md-nav__item">
|
|
<a href="../../metadata-sources/list/" class="md-nav__link">
|
|
|
|
|
|
|
|
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16"><path d="M3.75 2h3.5a.75.75 0 0 1 0 1.5h-3.5a.25.25 0 0 0-.25.25v8.5c0 .138.112.25.25.25h8.5a.25.25 0 0 0 .25-.25v-3.5a.75.75 0 0 1 1.5 0v3.5A1.75 1.75 0 0 1 12.25 14h-8.5A1.75 1.75 0 0 1 2 12.25v-8.5C2 2.784 2.784 2 3.75 2m6.854-1h4.146a.25.25 0 0 1 .25.25v4.146a.25.25 0 0 1-.427.177L13.03 4.03 9.28 7.78a.75.75 0 0 1-1.042-.018.75.75 0 0 1-.018-1.042l3.75-3.75-1.543-1.543A.25.25 0 0 1 10.604 1"></path></svg>
|
|
|
|
<span class="md-ellipsis">
|
|
Browse scrapers
|
|
|
|
</span>
|
|
|
|
|
|
</a>
|
|
</li>
|
|
|
|
|
|
|
|
|
|
</ul>
|
|
</nav>
|
|
|
|
</li>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<li class="md-nav__item md-nav__item--active md-nav__item--section md-nav__item--nested">
|
|
|
|
|
|
|
|
<input class="md-nav__toggle md-toggle " type="checkbox" id="__nav_6" checked>
|
|
|
|
|
|
<div class="md-nav__link md-nav__container">
|
|
<a href="../../plugins/" class="md-nav__link ">
|
|
|
|
|
|
|
|
<span class="md-ellipsis">
|
|
Plugins
|
|
|
|
</span>
|
|
|
|
|
|
</a>
|
|
|
|
|
|
<label class="md-nav__link " for="__nav_6" id="__nav_6_label" tabindex="">
|
|
<span class="md-nav__icon md-icon"></span>
|
|
</label>
|
|
|
|
</div>
|
|
|
|
<nav class="md-nav" data-md-level="1" aria-labelledby="__nav_6_label" aria-expanded="true">
|
|
<label class="md-nav__title" for="__nav_6">
|
|
<span class="md-nav__icon md-icon"></span>
|
|
Plugins
|
|
</label>
|
|
<ul class="md-nav__list" data-md-scrollfix>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<li class="md-nav__item">
|
|
<a href="../../plugins/list/" class="md-nav__link">
|
|
|
|
|
|
|
|
<span class="md-ellipsis">
|
|
Browse plugins
|
|
|
|
</span>
|
|
|
|
|
|
</a>
|
|
</li>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<li class="md-nav__item md-nav__item--active md-nav__item--section md-nav__item--nested">
|
|
|
|
|
|
|
|
<input class="md-nav__toggle md-toggle " type="checkbox" id="__nav_6_3" checked>
|
|
|
|
|
|
<div class="md-nav__link md-nav__container">
|
|
<a href="../" class="md-nav__link ">
|
|
|
|
|
|
|
|
<span class="md-ellipsis">
|
|
Themes
|
|
|
|
</span>
|
|
|
|
|
|
</a>
|
|
|
|
|
|
<label class="md-nav__link " for="__nav_6_3" id="__nav_6_3_label" tabindex="">
|
|
<span class="md-nav__icon md-icon"></span>
|
|
</label>
|
|
|
|
</div>
|
|
|
|
<nav class="md-nav" data-md-level="2" aria-labelledby="__nav_6_3_label" aria-expanded="true">
|
|
<label class="md-nav__title" for="__nav_6_3">
|
|
<span class="md-nav__icon md-icon"></span>
|
|
Themes
|
|
</label>
|
|
<ul class="md-nav__list" data-md-scrollfix>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<li class="md-nav__item">
|
|
<a href="../list/" class="md-nav__link">
|
|
|
|
|
|
|
|
<span class="md-ellipsis">
|
|
Browse themes
|
|
|
|
</span>
|
|
|
|
|
|
</a>
|
|
</li>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<li class="md-nav__item md-nav__item--active">
|
|
|
|
<input class="md-nav__toggle md-toggle" type="checkbox" id="__toc">
|
|
|
|
|
|
|
|
<label class="md-nav__link md-nav__link--active" for="__toc">
|
|
|
|
|
|
|
|
<span class="md-ellipsis">
|
|
Custom CSS snippets
|
|
|
|
</span>
|
|
|
|
|
|
<span class="md-nav__icon md-icon"></span>
|
|
</label>
|
|
|
|
<a href="./" class="md-nav__link md-nav__link--active">
|
|
|
|
|
|
|
|
<span class="md-ellipsis">
|
|
Custom CSS snippets
|
|
|
|
</span>
|
|
|
|
|
|
</a>
|
|
|
|
|
|
|
|
<nav class="md-nav md-nav--secondary" aria-label="Table of contents">
|
|
|
|
|
|
|
|
|
|
<label class="md-nav__title" for="__toc">
|
|
<span class="md-nav__icon md-icon"></span>
|
|
Table of contents
|
|
</label>
|
|
<ul class="md-nav__list" data-md-component="toc" data-md-scrollfix>
|
|
|
|
<li class="md-nav__item">
|
|
<a href="#scenes" class="md-nav__link">
|
|
<span class="md-ellipsis">
|
|
Scenes
|
|
</span>
|
|
</a>
|
|
|
|
<nav class="md-nav" aria-label="Scenes">
|
|
<ul class="md-nav__list">
|
|
|
|
<li class="md-nav__item">
|
|
<a href="#fit-more-thumbnails-on-each-row" class="md-nav__link">
|
|
<span class="md-ellipsis">
|
|
Fit more thumbnails on each row
|
|
</span>
|
|
</a>
|
|
|
|
</li>
|
|
|
|
<li class="md-nav__item">
|
|
<a href="#allow-for-longer-string-when-displaying-studio-as-text-on-scene-thumbnails" class="md-nav__link">
|
|
<span class="md-ellipsis">
|
|
Allow for longer string when displaying "Studio as Text" on scene thumbnails
|
|
</span>
|
|
</a>
|
|
|
|
</li>
|
|
|
|
<li class="md-nav__item">
|
|
<a href="#hide-scene-specs-resolution-duration-from-scene-card" class="md-nav__link">
|
|
<span class="md-ellipsis">
|
|
Hide scene specs (resolution, duration) from scene card
|
|
</span>
|
|
</a>
|
|
|
|
</li>
|
|
|
|
<li class="md-nav__item">
|
|
<a href="#hide-studio-logotext-from-scene-card" class="md-nav__link">
|
|
<span class="md-ellipsis">
|
|
Hide studio logo/text from scene card
|
|
</span>
|
|
</a>
|
|
|
|
</li>
|
|
|
|
<li class="md-nav__item">
|
|
<a href="#make-the-list-of-tags-take-up-less-width" class="md-nav__link">
|
|
<span class="md-ellipsis">
|
|
Make the list of tags take up less width
|
|
</span>
|
|
</a>
|
|
|
|
</li>
|
|
|
|
<li class="md-nav__item">
|
|
<a href="#swap-studio-and-resolutionduration-positions" class="md-nav__link">
|
|
<span class="md-ellipsis">
|
|
Swap studio and resolution/duration positions
|
|
</span>
|
|
</a>
|
|
|
|
</li>
|
|
|
|
<li class="md-nav__item">
|
|
<a href="#adjust-the-mouse-over-behaviour-in-wall-mode" class="md-nav__link">
|
|
<span class="md-ellipsis">
|
|
Adjust the mouse over behaviour in wall mode
|
|
</span>
|
|
</a>
|
|
|
|
</li>
|
|
|
|
<li class="md-nav__item">
|
|
<a href="#disable-zoom-on-hover-in-wall-mode" class="md-nav__link">
|
|
<span class="md-ellipsis">
|
|
Disable zoom on hover in wall mode
|
|
</span>
|
|
</a>
|
|
|
|
</li>
|
|
|
|
<li class="md-nav__item">
|
|
<a href="#hide-the-scene-scrubber" class="md-nav__link">
|
|
<span class="md-ellipsis">
|
|
Hide the scene scrubber
|
|
</span>
|
|
</a>
|
|
|
|
</li>
|
|
|
|
<li class="md-nav__item">
|
|
<a href="#hide-the-truncated-text" class="md-nav__link">
|
|
<span class="md-ellipsis">
|
|
Hide the truncated text
|
|
</span>
|
|
</a>
|
|
|
|
</li>
|
|
|
|
</ul>
|
|
</nav>
|
|
|
|
</li>
|
|
|
|
<li class="md-nav__item">
|
|
<a href="#images" class="md-nav__link">
|
|
<span class="md-ellipsis">
|
|
Images
|
|
</span>
|
|
</a>
|
|
|
|
<nav class="md-nav" aria-label="Images">
|
|
<ul class="md-nav__list">
|
|
|
|
<li class="md-nav__item">
|
|
<a href="#disable-lightbox-animation" class="md-nav__link">
|
|
<span class="md-ellipsis">
|
|
Disable lightbox animation
|
|
</span>
|
|
</a>
|
|
|
|
</li>
|
|
|
|
<li class="md-nav__item">
|
|
<a href="#dont-crop-preview-thumbnails" class="md-nav__link">
|
|
<span class="md-ellipsis">
|
|
Don't crop preview thumbnails
|
|
</span>
|
|
</a>
|
|
|
|
</li>
|
|
|
|
</ul>
|
|
</nav>
|
|
|
|
</li>
|
|
|
|
<li class="md-nav__item">
|
|
<a href="#groups" class="md-nav__link">
|
|
<span class="md-ellipsis">
|
|
Groups
|
|
</span>
|
|
</a>
|
|
|
|
<nav class="md-nav" aria-label="Groups">
|
|
<ul class="md-nav__list">
|
|
|
|
<li class="md-nav__item">
|
|
<a href="#better-group-layout-for-desktops-regular-size-poster" class="md-nav__link">
|
|
<span class="md-ellipsis">
|
|
Better Group layout for desktops, regular size poster
|
|
</span>
|
|
</a>
|
|
|
|
</li>
|
|
|
|
<li class="md-nav__item">
|
|
<a href="#better-group-layout-for-desktops-larger-size-poster" class="md-nav__link">
|
|
<span class="md-ellipsis">
|
|
Better Group layout for desktops, larger size poster
|
|
</span>
|
|
</a>
|
|
|
|
</li>
|
|
|
|
</ul>
|
|
</nav>
|
|
|
|
</li>
|
|
|
|
<li class="md-nav__item">
|
|
<a href="#galleries" class="md-nav__link">
|
|
<span class="md-ellipsis">
|
|
Galleries
|
|
</span>
|
|
</a>
|
|
|
|
<nav class="md-nav" aria-label="Galleries">
|
|
<ul class="md-nav__list">
|
|
|
|
<li class="md-nav__item">
|
|
<a href="#grid-view-for-galleries" class="md-nav__link">
|
|
<span class="md-ellipsis">
|
|
Grid view for galleries
|
|
</span>
|
|
</a>
|
|
|
|
</li>
|
|
|
|
<li class="md-nav__item">
|
|
<a href="#disable-lightbox-image-transition" class="md-nav__link">
|
|
<span class="md-ellipsis">
|
|
Disable lightbox image transition
|
|
</span>
|
|
</a>
|
|
|
|
</li>
|
|
|
|
<li class="md-nav__item">
|
|
<a href="#hide-the-lightbox-header-and-footer" class="md-nav__link">
|
|
<span class="md-ellipsis">
|
|
Hide the lightbox header and footer
|
|
</span>
|
|
</a>
|
|
|
|
</li>
|
|
|
|
</ul>
|
|
</nav>
|
|
|
|
</li>
|
|
|
|
<li class="md-nav__item">
|
|
<a href="#performers" class="md-nav__link">
|
|
<span class="md-ellipsis">
|
|
Performers
|
|
</span>
|
|
</a>
|
|
|
|
<nav class="md-nav" aria-label="Performers">
|
|
<ul class="md-nav__list">
|
|
|
|
<li class="md-nav__item">
|
|
<a href="#show-entire-performer-image-in-performer-card" class="md-nav__link">
|
|
<span class="md-ellipsis">
|
|
Show entire performer image in performer card
|
|
</span>
|
|
</a>
|
|
|
|
</li>
|
|
|
|
<li class="md-nav__item">
|
|
<a href="#show-a-larger-image-in-performers-page-for-desktop" class="md-nav__link">
|
|
<span class="md-ellipsis">
|
|
Show a larger image in performer's page for desktop
|
|
</span>
|
|
</a>
|
|
|
|
</li>
|
|
|
|
<li class="md-nav__item">
|
|
<a href="#place-performer-image-in-the-background-on-performer-page" class="md-nav__link">
|
|
<span class="md-ellipsis">
|
|
Place performer image in the background on performer page
|
|
</span>
|
|
</a>
|
|
|
|
</li>
|
|
|
|
<li class="md-nav__item">
|
|
<a href="#show-larger-performer-images-in-performers-list" class="md-nav__link">
|
|
<span class="md-ellipsis">
|
|
Show larger performer images in performers list
|
|
</span>
|
|
</a>
|
|
|
|
</li>
|
|
|
|
<li class="md-nav__item">
|
|
<a href="#move-the-buttons-in-the-performers-edit-panel-to-the-top-instead-of-bottom" class="md-nav__link">
|
|
<span class="md-ellipsis">
|
|
Move the buttons in the Performer's edit panel to the top instead of bottom
|
|
</span>
|
|
</a>
|
|
|
|
</li>
|
|
|
|
<li class="md-nav__item">
|
|
<a href="#move-the-tags-row-in-the-performers-edit-panel-to-the-second-position-just-after-name" class="md-nav__link">
|
|
<span class="md-ellipsis">
|
|
Move the tags row in the Performer's edit panel to the second position (just after name)
|
|
</span>
|
|
</a>
|
|
|
|
</li>
|
|
|
|
</ul>
|
|
</nav>
|
|
|
|
</li>
|
|
|
|
<li class="md-nav__item">
|
|
<a href="#studios" class="md-nav__link">
|
|
<span class="md-ellipsis">
|
|
Studios
|
|
</span>
|
|
</a>
|
|
|
|
<nav class="md-nav" aria-label="Studios">
|
|
<ul class="md-nav__list">
|
|
|
|
<li class="md-nav__item">
|
|
<a href="#different-studio-cards-layout" class="md-nav__link">
|
|
<span class="md-ellipsis">
|
|
Different studio cards layout
|
|
</span>
|
|
</a>
|
|
|
|
</li>
|
|
|
|
<li class="md-nav__item">
|
|
<a href="#more-studio-per-row" class="md-nav__link">
|
|
<span class="md-ellipsis">
|
|
More studio per row
|
|
</span>
|
|
</a>
|
|
|
|
</li>
|
|
|
|
</ul>
|
|
</nav>
|
|
|
|
</li>
|
|
|
|
<li class="md-nav__item">
|
|
<a href="#tags" class="md-nav__link">
|
|
<span class="md-ellipsis">
|
|
Tags
|
|
</span>
|
|
</a>
|
|
|
|
<nav class="md-nav" aria-label="Tags">
|
|
<ul class="md-nav__list">
|
|
|
|
<li class="md-nav__item">
|
|
<a href="#different-tag-cards-layout" class="md-nav__link">
|
|
<span class="md-ellipsis">
|
|
Different tag cards layout
|
|
</span>
|
|
</a>
|
|
|
|
</li>
|
|
|
|
<li class="md-nav__item">
|
|
<a href="#alternative-tag-layout" class="md-nav__link">
|
|
<span class="md-ellipsis">
|
|
Alternative tag layout
|
|
</span>
|
|
</a>
|
|
|
|
</li>
|
|
|
|
<li class="md-nav__item">
|
|
<a href="#subtag-explorer" class="md-nav__link">
|
|
<span class="md-ellipsis">
|
|
Subtag explorer
|
|
</span>
|
|
</a>
|
|
|
|
</li>
|
|
|
|
</ul>
|
|
</nav>
|
|
|
|
</li>
|
|
|
|
<li class="md-nav__item">
|
|
<a href="#global" class="md-nav__link">
|
|
<span class="md-ellipsis">
|
|
Global
|
|
</span>
|
|
</a>
|
|
|
|
<nav class="md-nav" aria-label="Global">
|
|
<ul class="md-nav__list">
|
|
|
|
<li class="md-nav__item">
|
|
<a href="#change-the-order-of-navigation-bar-buttons" class="md-nav__link">
|
|
<span class="md-ellipsis">
|
|
Change the order of navigation bar buttons
|
|
</span>
|
|
</a>
|
|
|
|
</li>
|
|
|
|
<li class="md-nav__item">
|
|
<a href="#hide-the-donate-button" class="md-nav__link">
|
|
<span class="md-ellipsis">
|
|
Hide the Donate button
|
|
</span>
|
|
</a>
|
|
|
|
</li>
|
|
|
|
<li class="md-nav__item">
|
|
<a href="#blur-nsfw-images" class="md-nav__link">
|
|
<span class="md-ellipsis">
|
|
Blur NSFW images
|
|
</span>
|
|
</a>
|
|
|
|
</li>
|
|
|
|
<li class="md-nav__item">
|
|
<a href="#blur-nsfw-images-and-unblur-on-mouse-over" class="md-nav__link">
|
|
<span class="md-ellipsis">
|
|
Blur NSFW images and unblur on mouse over
|
|
</span>
|
|
</a>
|
|
|
|
</li>
|
|
|
|
<li class="md-nav__item">
|
|
<a href="#hide-0-count-badges" class="md-nav__link">
|
|
<span class="md-ellipsis">
|
|
Hide 0 count badges
|
|
</span>
|
|
</a>
|
|
|
|
</li>
|
|
|
|
<li class="md-nav__item">
|
|
<a href="#border-around-cards-activated-with-checkbox-selection" class="md-nav__link">
|
|
<span class="md-ellipsis">
|
|
Border around cards activated with checkbox selection
|
|
</span>
|
|
</a>
|
|
|
|
</li>
|
|
|
|
</ul>
|
|
</nav>
|
|
|
|
</li>
|
|
|
|
</ul>
|
|
|
|
</nav>
|
|
|
|
</li>
|
|
|
|
|
|
|
|
|
|
</ul>
|
|
</nav>
|
|
|
|
</li>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<li class="md-nav__item md-nav__item--section md-nav__item--nested">
|
|
|
|
|
|
|
|
<input class="md-nav__toggle md-toggle " type="checkbox" id="__nav_6_4">
|
|
|
|
|
|
<div class="md-nav__link md-nav__container">
|
|
<a href="../../userscripts/" class="md-nav__link ">
|
|
|
|
|
|
|
|
<span class="md-ellipsis">
|
|
Userscripts
|
|
|
|
</span>
|
|
|
|
|
|
</a>
|
|
|
|
|
|
<label class="md-nav__link " for="__nav_6_4" id="__nav_6_4_label" tabindex="">
|
|
<span class="md-nav__icon md-icon"></span>
|
|
</label>
|
|
|
|
</div>
|
|
|
|
<nav class="md-nav" data-md-level="2" aria-labelledby="__nav_6_4_label" aria-expanded="false">
|
|
<label class="md-nav__title" for="__nav_6_4">
|
|
<span class="md-nav__icon md-icon"></span>
|
|
Userscripts
|
|
</label>
|
|
<ul class="md-nav__list" data-md-scrollfix>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<li class="md-nav__item">
|
|
<a href="../../userscripts/list/" class="md-nav__link">
|
|
|
|
|
|
|
|
<span class="md-ellipsis">
|
|
Browse userscripts
|
|
|
|
</span>
|
|
|
|
|
|
</a>
|
|
</li>
|
|
|
|
|
|
|
|
|
|
</ul>
|
|
</nav>
|
|
|
|
</li>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<li class="md-nav__item md-nav__item--section md-nav__item--nested">
|
|
|
|
|
|
|
|
<input class="md-nav__toggle md-toggle " type="checkbox" id="__nav_6_5">
|
|
|
|
|
|
<div class="md-nav__link md-nav__container">
|
|
<a href="../../scripts/" class="md-nav__link ">
|
|
|
|
|
|
|
|
<span class="md-ellipsis">
|
|
Scripts
|
|
|
|
</span>
|
|
|
|
|
|
</a>
|
|
|
|
|
|
<label class="md-nav__link " for="__nav_6_5" id="__nav_6_5_label" tabindex="">
|
|
<span class="md-nav__icon md-icon"></span>
|
|
</label>
|
|
|
|
</div>
|
|
|
|
<nav class="md-nav" data-md-level="2" aria-labelledby="__nav_6_5_label" aria-expanded="false">
|
|
<label class="md-nav__title" for="__nav_6_5">
|
|
<span class="md-nav__icon md-icon"></span>
|
|
Scripts
|
|
</label>
|
|
<ul class="md-nav__list" data-md-scrollfix>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<li class="md-nav__item">
|
|
<a href="../../scripts/list/" class="md-nav__link">
|
|
|
|
|
|
|
|
<span class="md-ellipsis">
|
|
Browse scripts
|
|
|
|
</span>
|
|
|
|
|
|
</a>
|
|
</li>
|
|
|
|
|
|
|
|
|
|
</ul>
|
|
</nav>
|
|
|
|
</li>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<li class="md-nav__item md-nav__item--section md-nav__item--nested">
|
|
|
|
|
|
|
|
<input class="md-nav__toggle md-toggle " type="checkbox" id="__nav_6_6">
|
|
|
|
|
|
<div class="md-nav__link md-nav__container">
|
|
<a href="../../utilities/" class="md-nav__link ">
|
|
|
|
|
|
|
|
<span class="md-ellipsis">
|
|
Utilities
|
|
|
|
</span>
|
|
|
|
|
|
</a>
|
|
|
|
|
|
<label class="md-nav__link " for="__nav_6_6" id="__nav_6_6_label" tabindex="">
|
|
<span class="md-nav__icon md-icon"></span>
|
|
</label>
|
|
|
|
</div>
|
|
|
|
<nav class="md-nav" data-md-level="2" aria-labelledby="__nav_6_6_label" aria-expanded="false">
|
|
<label class="md-nav__title" for="__nav_6_6">
|
|
<span class="md-nav__icon md-icon"></span>
|
|
Utilities
|
|
</label>
|
|
<ul class="md-nav__list" data-md-scrollfix>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<li class="md-nav__item">
|
|
<a href="../../utilities/list/" class="md-nav__link">
|
|
|
|
|
|
|
|
<span class="md-ellipsis">
|
|
Browse utilities
|
|
|
|
</span>
|
|
|
|
|
|
</a>
|
|
</li>
|
|
|
|
|
|
|
|
|
|
</ul>
|
|
</nav>
|
|
|
|
</li>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<li class="md-nav__item md-nav__item--section md-nav__item--nested">
|
|
|
|
|
|
|
|
<input class="md-nav__toggle md-toggle " type="checkbox" id="__nav_6_7">
|
|
|
|
|
|
<div class="md-nav__link md-nav__container">
|
|
<a href="../../integrations/" class="md-nav__link ">
|
|
|
|
|
|
|
|
<span class="md-ellipsis">
|
|
Integrations
|
|
|
|
</span>
|
|
|
|
|
|
</a>
|
|
|
|
|
|
<label class="md-nav__link " for="__nav_6_7" id="__nav_6_7_label" tabindex="">
|
|
<span class="md-nav__icon md-icon"></span>
|
|
</label>
|
|
|
|
</div>
|
|
|
|
<nav class="md-nav" data-md-level="2" aria-labelledby="__nav_6_7_label" aria-expanded="false">
|
|
<label class="md-nav__title" for="__nav_6_7">
|
|
<span class="md-nav__icon md-icon"></span>
|
|
Integrations
|
|
</label>
|
|
<ul class="md-nav__list" data-md-scrollfix>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<li class="md-nav__item">
|
|
<a href="../../integrations/list/" class="md-nav__link">
|
|
|
|
|
|
|
|
<span class="md-ellipsis">
|
|
Browse integrations
|
|
|
|
</span>
|
|
|
|
|
|
</a>
|
|
</li>
|
|
|
|
|
|
|
|
|
|
</ul>
|
|
</nav>
|
|
|
|
</li>
|
|
|
|
|
|
|
|
|
|
</ul>
|
|
</nav>
|
|
|
|
</li>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<li class="md-nav__item">
|
|
<a href="../../api/" class="md-nav__link">
|
|
|
|
|
|
|
|
<span class="md-ellipsis">
|
|
API
|
|
|
|
</span>
|
|
|
|
|
|
</a>
|
|
</li>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<li class="md-nav__item">
|
|
<a href="https://discourse.stashapp.cc" class="md-nav__link">
|
|
|
|
|
|
|
|
<span class="md-ellipsis">
|
|
Community forum
|
|
|
|
</span>
|
|
|
|
|
|
</a>
|
|
</li>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<li class="md-nav__item">
|
|
<a href="../../code-of-conduct/" class="md-nav__link">
|
|
|
|
|
|
|
|
<span class="md-ellipsis">
|
|
Code of conduct
|
|
|
|
</span>
|
|
|
|
|
|
</a>
|
|
</li>
|
|
|
|
|
|
|
|
</ul>
|
|
</nav>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
|
|
|
|
<div class="md-sidebar md-sidebar--secondary" data-md-component="sidebar" data-md-type="toc">
|
|
<div class="md-sidebar__scrollwrap">
|
|
<div class="md-sidebar__inner">
|
|
|
|
|
|
<nav class="md-nav md-nav--secondary" aria-label="Table of contents">
|
|
|
|
|
|
|
|
|
|
<label class="md-nav__title" for="__toc">
|
|
<span class="md-nav__icon md-icon"></span>
|
|
Table of contents
|
|
</label>
|
|
<ul class="md-nav__list" data-md-component="toc" data-md-scrollfix>
|
|
|
|
<li class="md-nav__item">
|
|
<a href="#scenes" class="md-nav__link">
|
|
<span class="md-ellipsis">
|
|
Scenes
|
|
</span>
|
|
</a>
|
|
|
|
<nav class="md-nav" aria-label="Scenes">
|
|
<ul class="md-nav__list">
|
|
|
|
<li class="md-nav__item">
|
|
<a href="#fit-more-thumbnails-on-each-row" class="md-nav__link">
|
|
<span class="md-ellipsis">
|
|
Fit more thumbnails on each row
|
|
</span>
|
|
</a>
|
|
|
|
</li>
|
|
|
|
<li class="md-nav__item">
|
|
<a href="#allow-for-longer-string-when-displaying-studio-as-text-on-scene-thumbnails" class="md-nav__link">
|
|
<span class="md-ellipsis">
|
|
Allow for longer string when displaying "Studio as Text" on scene thumbnails
|
|
</span>
|
|
</a>
|
|
|
|
</li>
|
|
|
|
<li class="md-nav__item">
|
|
<a href="#hide-scene-specs-resolution-duration-from-scene-card" class="md-nav__link">
|
|
<span class="md-ellipsis">
|
|
Hide scene specs (resolution, duration) from scene card
|
|
</span>
|
|
</a>
|
|
|
|
</li>
|
|
|
|
<li class="md-nav__item">
|
|
<a href="#hide-studio-logotext-from-scene-card" class="md-nav__link">
|
|
<span class="md-ellipsis">
|
|
Hide studio logo/text from scene card
|
|
</span>
|
|
</a>
|
|
|
|
</li>
|
|
|
|
<li class="md-nav__item">
|
|
<a href="#make-the-list-of-tags-take-up-less-width" class="md-nav__link">
|
|
<span class="md-ellipsis">
|
|
Make the list of tags take up less width
|
|
</span>
|
|
</a>
|
|
|
|
</li>
|
|
|
|
<li class="md-nav__item">
|
|
<a href="#swap-studio-and-resolutionduration-positions" class="md-nav__link">
|
|
<span class="md-ellipsis">
|
|
Swap studio and resolution/duration positions
|
|
</span>
|
|
</a>
|
|
|
|
</li>
|
|
|
|
<li class="md-nav__item">
|
|
<a href="#adjust-the-mouse-over-behaviour-in-wall-mode" class="md-nav__link">
|
|
<span class="md-ellipsis">
|
|
Adjust the mouse over behaviour in wall mode
|
|
</span>
|
|
</a>
|
|
|
|
</li>
|
|
|
|
<li class="md-nav__item">
|
|
<a href="#disable-zoom-on-hover-in-wall-mode" class="md-nav__link">
|
|
<span class="md-ellipsis">
|
|
Disable zoom on hover in wall mode
|
|
</span>
|
|
</a>
|
|
|
|
</li>
|
|
|
|
<li class="md-nav__item">
|
|
<a href="#hide-the-scene-scrubber" class="md-nav__link">
|
|
<span class="md-ellipsis">
|
|
Hide the scene scrubber
|
|
</span>
|
|
</a>
|
|
|
|
</li>
|
|
|
|
<li class="md-nav__item">
|
|
<a href="#hide-the-truncated-text" class="md-nav__link">
|
|
<span class="md-ellipsis">
|
|
Hide the truncated text
|
|
</span>
|
|
</a>
|
|
|
|
</li>
|
|
|
|
</ul>
|
|
</nav>
|
|
|
|
</li>
|
|
|
|
<li class="md-nav__item">
|
|
<a href="#images" class="md-nav__link">
|
|
<span class="md-ellipsis">
|
|
Images
|
|
</span>
|
|
</a>
|
|
|
|
<nav class="md-nav" aria-label="Images">
|
|
<ul class="md-nav__list">
|
|
|
|
<li class="md-nav__item">
|
|
<a href="#disable-lightbox-animation" class="md-nav__link">
|
|
<span class="md-ellipsis">
|
|
Disable lightbox animation
|
|
</span>
|
|
</a>
|
|
|
|
</li>
|
|
|
|
<li class="md-nav__item">
|
|
<a href="#dont-crop-preview-thumbnails" class="md-nav__link">
|
|
<span class="md-ellipsis">
|
|
Don't crop preview thumbnails
|
|
</span>
|
|
</a>
|
|
|
|
</li>
|
|
|
|
</ul>
|
|
</nav>
|
|
|
|
</li>
|
|
|
|
<li class="md-nav__item">
|
|
<a href="#groups" class="md-nav__link">
|
|
<span class="md-ellipsis">
|
|
Groups
|
|
</span>
|
|
</a>
|
|
|
|
<nav class="md-nav" aria-label="Groups">
|
|
<ul class="md-nav__list">
|
|
|
|
<li class="md-nav__item">
|
|
<a href="#better-group-layout-for-desktops-regular-size-poster" class="md-nav__link">
|
|
<span class="md-ellipsis">
|
|
Better Group layout for desktops, regular size poster
|
|
</span>
|
|
</a>
|
|
|
|
</li>
|
|
|
|
<li class="md-nav__item">
|
|
<a href="#better-group-layout-for-desktops-larger-size-poster" class="md-nav__link">
|
|
<span class="md-ellipsis">
|
|
Better Group layout for desktops, larger size poster
|
|
</span>
|
|
</a>
|
|
|
|
</li>
|
|
|
|
</ul>
|
|
</nav>
|
|
|
|
</li>
|
|
|
|
<li class="md-nav__item">
|
|
<a href="#galleries" class="md-nav__link">
|
|
<span class="md-ellipsis">
|
|
Galleries
|
|
</span>
|
|
</a>
|
|
|
|
<nav class="md-nav" aria-label="Galleries">
|
|
<ul class="md-nav__list">
|
|
|
|
<li class="md-nav__item">
|
|
<a href="#grid-view-for-galleries" class="md-nav__link">
|
|
<span class="md-ellipsis">
|
|
Grid view for galleries
|
|
</span>
|
|
</a>
|
|
|
|
</li>
|
|
|
|
<li class="md-nav__item">
|
|
<a href="#disable-lightbox-image-transition" class="md-nav__link">
|
|
<span class="md-ellipsis">
|
|
Disable lightbox image transition
|
|
</span>
|
|
</a>
|
|
|
|
</li>
|
|
|
|
<li class="md-nav__item">
|
|
<a href="#hide-the-lightbox-header-and-footer" class="md-nav__link">
|
|
<span class="md-ellipsis">
|
|
Hide the lightbox header and footer
|
|
</span>
|
|
</a>
|
|
|
|
</li>
|
|
|
|
</ul>
|
|
</nav>
|
|
|
|
</li>
|
|
|
|
<li class="md-nav__item">
|
|
<a href="#performers" class="md-nav__link">
|
|
<span class="md-ellipsis">
|
|
Performers
|
|
</span>
|
|
</a>
|
|
|
|
<nav class="md-nav" aria-label="Performers">
|
|
<ul class="md-nav__list">
|
|
|
|
<li class="md-nav__item">
|
|
<a href="#show-entire-performer-image-in-performer-card" class="md-nav__link">
|
|
<span class="md-ellipsis">
|
|
Show entire performer image in performer card
|
|
</span>
|
|
</a>
|
|
|
|
</li>
|
|
|
|
<li class="md-nav__item">
|
|
<a href="#show-a-larger-image-in-performers-page-for-desktop" class="md-nav__link">
|
|
<span class="md-ellipsis">
|
|
Show a larger image in performer's page for desktop
|
|
</span>
|
|
</a>
|
|
|
|
</li>
|
|
|
|
<li class="md-nav__item">
|
|
<a href="#place-performer-image-in-the-background-on-performer-page" class="md-nav__link">
|
|
<span class="md-ellipsis">
|
|
Place performer image in the background on performer page
|
|
</span>
|
|
</a>
|
|
|
|
</li>
|
|
|
|
<li class="md-nav__item">
|
|
<a href="#show-larger-performer-images-in-performers-list" class="md-nav__link">
|
|
<span class="md-ellipsis">
|
|
Show larger performer images in performers list
|
|
</span>
|
|
</a>
|
|
|
|
</li>
|
|
|
|
<li class="md-nav__item">
|
|
<a href="#move-the-buttons-in-the-performers-edit-panel-to-the-top-instead-of-bottom" class="md-nav__link">
|
|
<span class="md-ellipsis">
|
|
Move the buttons in the Performer's edit panel to the top instead of bottom
|
|
</span>
|
|
</a>
|
|
|
|
</li>
|
|
|
|
<li class="md-nav__item">
|
|
<a href="#move-the-tags-row-in-the-performers-edit-panel-to-the-second-position-just-after-name" class="md-nav__link">
|
|
<span class="md-ellipsis">
|
|
Move the tags row in the Performer's edit panel to the second position (just after name)
|
|
</span>
|
|
</a>
|
|
|
|
</li>
|
|
|
|
</ul>
|
|
</nav>
|
|
|
|
</li>
|
|
|
|
<li class="md-nav__item">
|
|
<a href="#studios" class="md-nav__link">
|
|
<span class="md-ellipsis">
|
|
Studios
|
|
</span>
|
|
</a>
|
|
|
|
<nav class="md-nav" aria-label="Studios">
|
|
<ul class="md-nav__list">
|
|
|
|
<li class="md-nav__item">
|
|
<a href="#different-studio-cards-layout" class="md-nav__link">
|
|
<span class="md-ellipsis">
|
|
Different studio cards layout
|
|
</span>
|
|
</a>
|
|
|
|
</li>
|
|
|
|
<li class="md-nav__item">
|
|
<a href="#more-studio-per-row" class="md-nav__link">
|
|
<span class="md-ellipsis">
|
|
More studio per row
|
|
</span>
|
|
</a>
|
|
|
|
</li>
|
|
|
|
</ul>
|
|
</nav>
|
|
|
|
</li>
|
|
|
|
<li class="md-nav__item">
|
|
<a href="#tags" class="md-nav__link">
|
|
<span class="md-ellipsis">
|
|
Tags
|
|
</span>
|
|
</a>
|
|
|
|
<nav class="md-nav" aria-label="Tags">
|
|
<ul class="md-nav__list">
|
|
|
|
<li class="md-nav__item">
|
|
<a href="#different-tag-cards-layout" class="md-nav__link">
|
|
<span class="md-ellipsis">
|
|
Different tag cards layout
|
|
</span>
|
|
</a>
|
|
|
|
</li>
|
|
|
|
<li class="md-nav__item">
|
|
<a href="#alternative-tag-layout" class="md-nav__link">
|
|
<span class="md-ellipsis">
|
|
Alternative tag layout
|
|
</span>
|
|
</a>
|
|
|
|
</li>
|
|
|
|
<li class="md-nav__item">
|
|
<a href="#subtag-explorer" class="md-nav__link">
|
|
<span class="md-ellipsis">
|
|
Subtag explorer
|
|
</span>
|
|
</a>
|
|
|
|
</li>
|
|
|
|
</ul>
|
|
</nav>
|
|
|
|
</li>
|
|
|
|
<li class="md-nav__item">
|
|
<a href="#global" class="md-nav__link">
|
|
<span class="md-ellipsis">
|
|
Global
|
|
</span>
|
|
</a>
|
|
|
|
<nav class="md-nav" aria-label="Global">
|
|
<ul class="md-nav__list">
|
|
|
|
<li class="md-nav__item">
|
|
<a href="#change-the-order-of-navigation-bar-buttons" class="md-nav__link">
|
|
<span class="md-ellipsis">
|
|
Change the order of navigation bar buttons
|
|
</span>
|
|
</a>
|
|
|
|
</li>
|
|
|
|
<li class="md-nav__item">
|
|
<a href="#hide-the-donate-button" class="md-nav__link">
|
|
<span class="md-ellipsis">
|
|
Hide the Donate button
|
|
</span>
|
|
</a>
|
|
|
|
</li>
|
|
|
|
<li class="md-nav__item">
|
|
<a href="#blur-nsfw-images" class="md-nav__link">
|
|
<span class="md-ellipsis">
|
|
Blur NSFW images
|
|
</span>
|
|
</a>
|
|
|
|
</li>
|
|
|
|
<li class="md-nav__item">
|
|
<a href="#blur-nsfw-images-and-unblur-on-mouse-over" class="md-nav__link">
|
|
<span class="md-ellipsis">
|
|
Blur NSFW images and unblur on mouse over
|
|
</span>
|
|
</a>
|
|
|
|
</li>
|
|
|
|
<li class="md-nav__item">
|
|
<a href="#hide-0-count-badges" class="md-nav__link">
|
|
<span class="md-ellipsis">
|
|
Hide 0 count badges
|
|
</span>
|
|
</a>
|
|
|
|
</li>
|
|
|
|
<li class="md-nav__item">
|
|
<a href="#border-around-cards-activated-with-checkbox-selection" class="md-nav__link">
|
|
<span class="md-ellipsis">
|
|
Border around cards activated with checkbox selection
|
|
</span>
|
|
</a>
|
|
|
|
</li>
|
|
|
|
</ul>
|
|
</nav>
|
|
|
|
</li>
|
|
|
|
</ul>
|
|
|
|
</nav>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
|
|
|
|
<div class="md-content" data-md-component="content">
|
|
<article class="md-content__inner md-typeset">
|
|
|
|
|
|
|
|
|
|
|
|
<a href="https://github.com/stashapp/Stash-Docs/edit/main/docs/themes/custom-css-snippets.md" title="Edit this page" class="md-content__button md-icon" rel="edit">
|
|
|
|
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M10 20H6V4h7v5h5v3.1l2-2V8l-6-6H6c-1.1 0-2 .9-2 2v16c0 1.1.9 2 2 2h4zm10.2-7c.1 0 .3.1.4.2l1.3 1.3c.2.2.2.6 0 .8l-1 1-2.1-2.1 1-1c.1-.1.2-.2.4-.2m0 3.9L14.1 23H12v-2.1l6.1-6.1z"></path></svg>
|
|
</a>
|
|
|
|
|
|
|
|
|
|
|
|
<a href="https://github.com/stashapp/Stash-Docs/raw/main/docs/themes/custom-css-snippets.md" title="View source of this page" class="md-content__button md-icon">
|
|
|
|
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M17 18c.56 0 1 .44 1 1s-.44 1-1 1-1-.44-1-1 .44-1 1-1m0-3c-2.73 0-5.06 1.66-6 4 .94 2.34 3.27 4 6 4s5.06-1.66 6-4c-.94-2.34-3.27-4-6-4m0 6.5a2.5 2.5 0 0 1-2.5-2.5 2.5 2.5 0 0 1 2.5-2.5 2.5 2.5 0 0 1 2.5 2.5 2.5 2.5 0 0 1-2.5 2.5M9.27 20H6V4h7v5h5v4.07c.7.08 1.36.25 2 .49V8l-6-6H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h4.5a8.2 8.2 0 0 1-1.23-2"></path></svg>
|
|
</a>
|
|
|
|
|
|
|
|
<h1>Custom CSS snippets</h1>
|
|
|
|
<p><strong>Custom CSS</strong> allows you to modify Stash stock stylesheets.</p>
|
|
<p>The following is a list of some useful CSS snippets. You may use them by copying-and-pasting them into the Custom CSS editor found in the <span class="twemoji"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><!--! Font Awesome Free 7.0.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free (Icons: CC BY 4.0, Fonts: SIL OFL 1.1, Code: MIT License) Copyright 2025 Fonticons, Inc.--><path fill="currentColor" d="M195.1 9.5c3-14.8 16.1-25.5 31.3-25.5h59.8c15.2 0 28.3 10.7 31.3 25.5l14.5 70c14.1 6 27.3 13.7 39.3 22.8l67.8-22.5c14.4-4.8 30.2 1.2 37.8 14.4l29.9 51.8c7.6 13.2 4.9 29.8-6.5 39.9L447 233.3c.9 7.4 1.3 15 1.3 22.7s-.5 15.3-1.3 22.7l53.4 47.5c11.4 10.1 14 26.8 6.5 39.9L477 417.9c-7.6 13.1-23.4 19.2-37.8 14.4l-67.8-22.5c-12.1 9.1-25.3 16.7-39.3 22.8l-14.4 69.9c-3.1 14.9-16.2 25.5-31.3 25.5h-59.8c-15.2 0-28.3-10.7-31.3-25.5l-14.4-69.9c-14.1-6-27.2-13.7-39.3-22.8l-68.1 22.5c-14.4 4.8-30.2-1.2-37.8-14.4L5.8 366.1c-7.6-13.2-4.9-29.8 6.5-39.9l53.4-47.5c-.9-7.4-1.3-15-1.3-22.7s.5-15.3 1.3-22.7l-53.4-47.5C.9 175.7-1.7 159 5.8 145.9l29.9-51.8c7.6-13.2 23.4-19.2 37.8-14.4l67.8 22.5c12.1-9.1 25.3-16.7 39.3-22.8zM256.3 336a80 80 0 1 0-.6-160 80 80 0 1 0 .6 160"></path></svg></span> <strong>Settings</strong> > <strong>Interface</strong> panel or by navigating to <code>localhost:9999/settings?tab=interface</code></p>
|
|
<div class="admonition warning">
|
|
<p class="admonition-title">Warning</p>
|
|
<ul>
|
|
<li>Future releases of Stash may break these CSS tweaks. </li>
|
|
<li>CSS tweaks may not appear without flushing the Stash browser cache first on Chrome.</li>
|
|
</ul>
|
|
</div>
|
|
<h2 id="scenes">Scenes<a class="headerlink" href="#scenes" title="Permanent link">¶</a></h2>
|
|
<h3 id="fit-more-thumbnails-on-each-row">Fit more thumbnails on each row<a class="headerlink" href="#fit-more-thumbnails-on-each-row" title="Permanent link">¶</a></h3>
|
|
<div class="tabbed-set tabbed-alternate" data-tabs="1:4"><input checked="checked" id="description" name="__tabbed_1" type="radio"><input id="author" name="__tabbed_1" type="radio"><input id="screenshots" name="__tabbed_1" type="radio"><input id="css-code" name="__tabbed_1" type="radio"><div class="tabbed-labels"><label for="description">Description</label><label for="author">Author</label><label for="screenshots">Screenshots</label><label for="css-code">CSS code</label></div>
|
|
<div class="tabbed-content">
|
|
<div class="tabbed-block">
|
|
<p>Reduce left and right padding on Scene and Performer grid pages allowing for more thumbnails on each row.</p>
|
|
</div>
|
|
<div class="tabbed-block"></div>
|
|
<div class="tabbed-block"></div>
|
|
<div class="tabbed-block">
|
|
<div class="highlight"><pre><span></span><code><span class="c">/* [Scenes tab] Fit more thumbnails on each row */</span>
|
|
|
|
<span class="p">.</span><span class="nc">grid</span><span class="w"> </span><span class="p">{</span><span class="w"> </span><span class="k">padding</span><span class="p">:</span><span class="w"> </span><span class="mi">0</span><span class="kt">px</span><span class="w"> </span><span class="cp">!important</span><span class="p">;</span><span class="w"> </span><span class="p">}</span>
|
|
</code></pre></div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<h3 id="allow-for-longer-string-when-displaying-studio-as-text-on-scene-thumbnails">Allow for longer string when displaying "Studio as Text" on scene thumbnails<a class="headerlink" href="#allow-for-longer-string-when-displaying-studio-as-text-on-scene-thumbnails" title="Permanent link">¶</a></h3>
|
|
<div class="tabbed-set tabbed-alternate" data-tabs="2:4"><input checked="checked" id="description_1" name="__tabbed_2" type="radio"><input id="author_1" name="__tabbed_2" type="radio"><input id="screenshots_1" name="__tabbed_2" type="radio"><input id="css-code_1" name="__tabbed_2" type="radio"><div class="tabbed-labels"><label for="description_1">Description</label><label for="author_1">Author</label><label for="screenshots_1">Screenshots</label><label for="css-code_1">CSS code</label></div>
|
|
<div class="tabbed-content">
|
|
<div class="tabbed-block">
|
|
<p>Allow for longer string when displaying "Studio as Text" on scene thumbnails.</p>
|
|
</div>
|
|
<div class="tabbed-block"></div>
|
|
<div class="tabbed-block"></div>
|
|
<div class="tabbed-block">
|
|
<div class="highlight"><pre><span></span><code><span class="c">/* [Scenes tab] Allow for longer string when displaying "Studio as Text" on scene thumbnails */</span>
|
|
|
|
<span class="p">.</span><span class="nc">scene-studio-overlay</span><span class="w"> </span><span class="p">{</span>
|
|
<span class="w"> </span><span class="k">font-weight</span><span class="p">:</span><span class="w"> </span><span class="mi">600</span><span class="w"> </span><span class="cp">!important</span><span class="p">;</span>
|
|
<span class="w"> </span><span class="k">opacity</span><span class="p">:</span><span class="w"> </span><span class="mi">1</span><span class="w"> </span><span class="cp">!important</span><span class="p">;</span>
|
|
<span class="w"> </span><span class="k">width</span><span class="p">:</span><span class="w"> </span><span class="mi">60</span><span class="kt">%</span><span class="w"> </span><span class="cp">!important</span><span class="p">;</span>
|
|
<span class="w"> </span><span class="k">text-overflow</span><span class="p">:</span><span class="w"> </span><span class="kc">ellipsis</span><span class="w"> </span><span class="cp">!important</span><span class="p">;</span>
|
|
<span class="p">}</span>
|
|
</code></pre></div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<h3 id="hide-scene-specs-resolution-duration-from-scene-card">Hide scene specs (resolution, duration) from scene card<a class="headerlink" href="#hide-scene-specs-resolution-duration-from-scene-card" title="Permanent link">¶</a></h3>
|
|
<div class="tabbed-set tabbed-alternate" data-tabs="3:4"><input checked="checked" id="description_2" name="__tabbed_3" type="radio"><input id="author_2" name="__tabbed_3" type="radio"><input id="screenshots_2" name="__tabbed_3" type="radio"><input id="css-code_2" name="__tabbed_3" type="radio"><div class="tabbed-labels"><label for="description_2">Description</label><label for="author_2">Author</label><label for="screenshots_2">Screenshots</label><label for="css-code_2">CSS code</label></div>
|
|
<div class="tabbed-content">
|
|
<div class="tabbed-block">
|
|
<p>Hide scene specs (resolution, duration) from scene card.</p>
|
|
</div>
|
|
<div class="tabbed-block"></div>
|
|
<div class="tabbed-block"></div>
|
|
<div class="tabbed-block">
|
|
<div class="highlight"><pre><span></span><code><span class="c">/* [Scenes tab] Hide scene specs (resolution, duration) from scene card */</span>
|
|
|
|
<span class="p">.</span><span class="nc">scene-specs-overlay</span><span class="w"> </span><span class="p">{</span>
|
|
<span class="k">display</span><span class="p">:</span><span class="w"> </span><span class="kc">none</span><span class="p">;</span>
|
|
<span class="p">}</span>
|
|
</code></pre></div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<h3 id="hide-studio-logotext-from-scene-card">Hide studio logo/text from scene card<a class="headerlink" href="#hide-studio-logotext-from-scene-card" title="Permanent link">¶</a></h3>
|
|
<div class="tabbed-set tabbed-alternate" data-tabs="4:4"><input checked="checked" id="description_3" name="__tabbed_4" type="radio"><input id="author_3" name="__tabbed_4" type="radio"><input id="screenshots_3" name="__tabbed_4" type="radio"><input id="css-code_3" name="__tabbed_4" type="radio"><div class="tabbed-labels"><label for="description_3">Description</label><label for="author_3">Author</label><label for="screenshots_3">Screenshots</label><label for="css-code_3">CSS code</label></div>
|
|
<div class="tabbed-content">
|
|
<div class="tabbed-block">
|
|
<p>Hide studio logo/text from scene card.</p>
|
|
</div>
|
|
<div class="tabbed-block"></div>
|
|
<div class="tabbed-block"></div>
|
|
<div class="tabbed-block">
|
|
<div class="highlight"><pre><span></span><code><span class="c">/* [Scenes tab] Hide studio logo/text from scene card */</span>
|
|
|
|
<span class="p">.</span><span class="nc">scene-studio-overlay</span><span class="w"> </span><span class="p">{</span>
|
|
<span class="k">display</span><span class="p">:</span><span class="w"> </span><span class="kc">none</span><span class="p">;</span>
|
|
<span class="p">}</span>
|
|
</code></pre></div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<h3 id="make-the-list-of-tags-take-up-less-width">Make the list of tags take up less width<a class="headerlink" href="#make-the-list-of-tags-take-up-less-width" title="Permanent link">¶</a></h3>
|
|
<div class="tabbed-set tabbed-alternate" data-tabs="5:4"><input checked="checked" id="description_4" name="__tabbed_5" type="radio"><input id="author_4" name="__tabbed_5" type="radio"><input id="screenshots_4" name="__tabbed_5" type="radio"><input id="css-code_4" name="__tabbed_5" type="radio"><div class="tabbed-labels"><label for="description_4">Description</label><label for="author_4">Author</label><label for="screenshots_4">Screenshots</label><label for="css-code_4">CSS code</label></div>
|
|
<div class="tabbed-content">
|
|
<div class="tabbed-block">
|
|
<p>Make the list of tags take up less width.</p>
|
|
</div>
|
|
<div class="tabbed-block"></div>
|
|
<div class="tabbed-block"></div>
|
|
<div class="tabbed-block">
|
|
<div class="highlight"><pre><span></span><code><span class="c">/* [Scenes tab] Make the list of tags take up less width */</span>
|
|
|
|
<span class="p">.</span><span class="nc">bs-popover-bottom</span><span class="w"> </span><span class="p">{</span>
|
|
<span class="k">max-width</span><span class="p">:</span><span class="w"> </span><span class="mi">500</span><span class="kt">px</span>
|
|
<span class="p">}</span>
|
|
</code></pre></div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<h3 id="swap-studio-and-resolutionduration-positions">Swap studio and resolution/duration positions<a class="headerlink" href="#swap-studio-and-resolutionduration-positions" title="Permanent link">¶</a></h3>
|
|
<div class="tabbed-set tabbed-alternate" data-tabs="6:4"><input checked="checked" id="description_5" name="__tabbed_6" type="radio"><input id="author_5" name="__tabbed_6" type="radio"><input id="screenshots_5" name="__tabbed_6" type="radio"><input id="css-code_5" name="__tabbed_6" type="radio"><div class="tabbed-labels"><label for="description_5">Description</label><label for="author_5">Author</label><label for="screenshots_5">Screenshots</label><label for="css-code_5">CSS code</label></div>
|
|
<div class="tabbed-content">
|
|
<div class="tabbed-block">
|
|
<p>Swap studio and resolution/duration positions.</p>
|
|
</div>
|
|
<div class="tabbed-block"></div>
|
|
<div class="tabbed-block"></div>
|
|
<div class="tabbed-block">
|
|
<div class="highlight"><pre><span></span><code><span class="c">/* [Scenes tab] Swap studio and resolution/duration positions */</span>
|
|
|
|
<span class="p">.</span><span class="nc">scene-studio-overlay</span><span class="w"> </span><span class="p">{</span>
|
|
<span class="k">bottom</span><span class="p">:</span><span class="w"> </span><span class="mi">1</span><span class="kt">rem</span><span class="p">;</span>
|
|
<span class="k">right</span><span class="p">:</span><span class="w"> </span><span class="mf">0.7</span><span class="kt">rem</span><span class="p">;</span>
|
|
<span class="k">height</span><span class="p">:</span><span class="w"> </span><span class="kc">inherit</span><span class="p">;</span>
|
|
<span class="k">top</span><span class="p">:</span><span class="w"> </span><span class="kc">inherit</span><span class="p">;</span>
|
|
<span class="p">}</span>
|
|
|
|
<span class="p">.</span><span class="nc">scene-specs-overlay</span><span class="w"> </span><span class="p">{</span>
|
|
<span class="k">right</span><span class="p">:</span><span class="w"> </span><span class="mf">0.7</span><span class="kt">rem</span><span class="p">;</span>
|
|
<span class="k">top</span><span class="p">:</span><span class="w"> </span><span class="mf">0.7</span><span class="kt">rem</span><span class="p">;</span>
|
|
<span class="k">bottom</span><span class="p">:</span><span class="w"> </span><span class="kc">inherit</span><span class="p">;</span>
|
|
<span class="p">}</span>
|
|
</code></pre></div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<h3 id="adjust-the-mouse-over-behaviour-in-wall-mode">Adjust the mouse over behaviour in wall mode<a class="headerlink" href="#adjust-the-mouse-over-behaviour-in-wall-mode" title="Permanent link">¶</a></h3>
|
|
<div class="tabbed-set tabbed-alternate" data-tabs="7:4"><input checked="checked" id="description_6" name="__tabbed_7" type="radio"><input id="author_6" name="__tabbed_7" type="radio"><input id="screenshots_6" name="__tabbed_7" type="radio"><input id="css-code_6" name="__tabbed_7" type="radio"><div class="tabbed-labels"><label for="description_6">Description</label><label for="author_6">Author</label><label for="screenshots_6">Screenshots</label><label for="css-code_6">CSS code</label></div>
|
|
<div class="tabbed-content">
|
|
<div class="tabbed-block">
|
|
<p>Adjust the mouse over behaviour in wall mode.</p>
|
|
</div>
|
|
<div class="tabbed-block"></div>
|
|
<div class="tabbed-block"></div>
|
|
<div class="tabbed-block">
|
|
<div class="highlight"><pre><span></span><code><span class="c">/* [Scenes tab] Adjust the mouse over behaviour in wall mode */</span>
|
|
|
|
<span class="p">@</span><span class="k">media</span><span class="w"> </span><span class="o">(</span><span class="nt">min-width</span><span class="o">:</span><span class="w"> </span><span class="nt">576px</span><span class="o">)</span><span class="w"> </span><span class="p">{</span>
|
|
<span class="p">.</span><span class="nc">wall-item</span><span class="p">:</span><span class="nd">hover</span><span class="p">::</span><span class="nd">before</span><span class="w"> </span><span class="p">{</span>
|
|
<span class="k">opacity</span><span class="p">:</span><span class="w"> </span><span class="mi">0</span><span class="p">;</span><span class="w"> </span>
|
|
<span class="p">}</span>
|
|
|
|
<span class="p">.</span><span class="nc">wall-item</span><span class="p">:</span><span class="nd">hover</span><span class="w"> </span><span class="p">.</span><span class="nc">wall-item-container</span><span class="w"> </span><span class="p">{</span>
|
|
<span class="k">transform</span><span class="p">:</span><span class="w"> </span><span class="nb">scale</span><span class="p">(</span><span class="mf">1.5</span><span class="p">);</span>
|
|
<span class="p">}</span>
|
|
<span class="p">}</span>
|
|
</code></pre></div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<h3 id="disable-zoom-on-hover-in-wall-mode">Disable zoom on hover in wall mode<a class="headerlink" href="#disable-zoom-on-hover-in-wall-mode" title="Permanent link">¶</a></h3>
|
|
<div class="tabbed-set tabbed-alternate" data-tabs="8:4"><input checked="checked" id="description_7" name="__tabbed_8" type="radio"><input id="author_7" name="__tabbed_8" type="radio"><input id="screenshots_7" name="__tabbed_8" type="radio"><input id="css-code_7" name="__tabbed_8" type="radio"><div class="tabbed-labels"><label for="description_7">Description</label><label for="author_7">Author</label><label for="screenshots_7">Screenshots</label><label for="css-code_7">CSS code</label></div>
|
|
<div class="tabbed-content">
|
|
<div class="tabbed-block">
|
|
<p>Disable zoom on hover in wall mode.</p>
|
|
</div>
|
|
<div class="tabbed-block"></div>
|
|
<div class="tabbed-block"></div>
|
|
<div class="tabbed-block">
|
|
<div class="highlight"><pre><span></span><code><span class="c">/* [Scenes tab] Disable zoom on hover in wall mode */</span>
|
|
|
|
<span class="p">.</span><span class="nc">wall-item</span><span class="p">:</span><span class="nd">hover</span><span class="w"> </span><span class="p">.</span><span class="nc">wall-item-container</span><span class="w"> </span><span class="p">{</span>
|
|
<span class="w"> </span><span class="k">transform</span><span class="p">:</span><span class="w"> </span><span class="kc">none</span><span class="p">;</span>
|
|
<span class="p">}</span>
|
|
<span class="p">.</span><span class="nc">wall-item</span><span class="p">:</span><span class="nd">before</span><span class="w"> </span><span class="p">{</span>
|
|
<span class="w"> </span><span class="k">opacity</span><span class="p">:</span><span class="w"> </span><span class="mi">0</span><span class="w"> </span><span class="cp">!important</span><span class="p">;</span>
|
|
<span class="p">}</span>
|
|
</code></pre></div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<h3 id="hide-the-scene-scrubber">Hide the scene scrubber<a class="headerlink" href="#hide-the-scene-scrubber" title="Permanent link">¶</a></h3>
|
|
<div class="tabbed-set tabbed-alternate" data-tabs="9:4"><input checked="checked" id="description_8" name="__tabbed_9" type="radio"><input id="author_8" name="__tabbed_9" type="radio"><input id="screenshots_8" name="__tabbed_9" type="radio"><input id="css-code_8" name="__tabbed_9" type="radio"><div class="tabbed-labels"><label for="description_8">Description</label><label for="author_8">Author</label><label for="screenshots_8">Screenshots</label><label for="css-code_8">CSS code</label></div>
|
|
<div class="tabbed-content">
|
|
<div class="tabbed-block">
|
|
<p>This will hide the large scene scrubber under the video player and max out the player's height.</p>
|
|
</div>
|
|
<div class="tabbed-block"></div>
|
|
<div class="tabbed-block">
|
|
<p><a class="glightbox" data-type="image" data-width="auto" data-height="auto" href="/assets/user-interface-ui/css-scrubber.png" data-desc-position="bottom"><img alt="Image" loading="lazy" src="/assets/user-interface-ui/css-scrubber.png"></a></p>
|
|
</div>
|
|
<div class="tabbed-block">
|
|
<div class="highlight"><pre><span></span><code><span class="c">/* [Scenes tab] Hide the scene scrubber and max out the player's height */</span>
|
|
<span class="p">.</span><span class="nc">scrubber-wrapper</span><span class="w"> </span><span class="p">{</span>
|
|
<span class="k">display</span><span class="p">:</span><span class="w"> </span><span class="kc">none</span><span class="p">;</span>
|
|
<span class="p">}</span>
|
|
</code></pre></div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<h3 id="hide-the-truncated-text">Hide the truncated text<a class="headerlink" href="#hide-the-truncated-text" title="Permanent link">¶</a></h3>
|
|
<div class="tabbed-set tabbed-alternate" data-tabs="10:4"><input checked="checked" id="description_9" name="__tabbed_10" type="radio"><input id="author_9" name="__tabbed_10" type="radio"><input id="screenshots_9" name="__tabbed_10" type="radio"><input id="css-code_9" name="__tabbed_10" type="radio"><div class="tabbed-labels"><label for="description_9">Description</label><label for="author_9">Author</label><label for="screenshots_9">Screenshots</label><label for="css-code_9">CSS code</label></div>
|
|
<div class="tabbed-content">
|
|
<div class="tabbed-block">
|
|
<p>This will hide the truncated text that appears under the tile and date.</p>
|
|
</div>
|
|
<div class="tabbed-block"></div>
|
|
<div class="tabbed-block"></div>
|
|
<div class="tabbed-block">
|
|
<div class="highlight"><pre><span></span><code><span class="c">/* [Scenes Tab] - Hide the truncated text on scene card */</span>
|
|
|
|
<span class="p">.</span><span class="nc">TruncatedText</span><span class="p">.</span><span class="nc">scene-card__description</span><span class="w"> </span><span class="p">{</span><span class="w"> </span>
|
|
<span class="k">display</span><span class="p">:</span><span class="w"> </span><span class="kc">none</span><span class="p">;</span>
|
|
<span class="p">}</span>
|
|
</code></pre></div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<h2 id="images">Images<a class="headerlink" href="#images" title="Permanent link">¶</a></h2>
|
|
<h3 id="disable-lightbox-animation">Disable lightbox animation<a class="headerlink" href="#disable-lightbox-animation" title="Permanent link">¶</a></h3>
|
|
<div class="tabbed-set tabbed-alternate" data-tabs="11:4"><input checked="checked" id="description_10" name="__tabbed_11" type="radio"><input id="author_10" name="__tabbed_11" type="radio"><input id="screenshots_10" name="__tabbed_11" type="radio"><input id="css-code_10" name="__tabbed_11" type="radio"><div class="tabbed-labels"><label for="description_10">Description</label><label for="author_10">Author</label><label for="screenshots_10">Screenshots</label><label for="css-code_10">CSS code</label></div>
|
|
<div class="tabbed-content">
|
|
<div class="tabbed-block">
|
|
<p>Disable lightbox animation.</p>
|
|
</div>
|
|
<div class="tabbed-block"></div>
|
|
<div class="tabbed-block"></div>
|
|
<div class="tabbed-block">
|
|
<div class="highlight"><pre><span></span><code><span class="c">/* [Images tab] Disable lightbox animation */</span>
|
|
|
|
<span class="p">.</span><span class="nc">Lightbox-carousel</span><span class="w"> </span><span class="p">{</span>
|
|
<span class="k">transition</span><span class="p">:</span><span class="w"> </span><span class="kc">none</span><span class="p">;</span>
|
|
<span class="p">}</span>
|
|
</code></pre></div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<h3 id="dont-crop-preview-thumbnails">Don't crop preview thumbnails<a class="headerlink" href="#dont-crop-preview-thumbnails" title="Permanent link">¶</a></h3>
|
|
<div class="tabbed-set tabbed-alternate" data-tabs="12:4"><input checked="checked" id="description_11" name="__tabbed_12" type="radio"><input id="author_11" name="__tabbed_12" type="radio"><input id="screenshots_11" name="__tabbed_12" type="radio"><input id="css-code_11" name="__tabbed_12" type="radio"><div class="tabbed-labels"><label for="description_11">Description</label><label for="author_11">Author</label><label for="screenshots_11">Screenshots</label><label for="css-code_11">CSS code</label></div>
|
|
<div class="tabbed-content">
|
|
<div class="tabbed-block">
|
|
<p>Don't crop preview thumbnails.</p>
|
|
</div>
|
|
<div class="tabbed-block"></div>
|
|
<div class="tabbed-block"></div>
|
|
<div class="tabbed-block">
|
|
<div class="highlight"><pre><span></span><code><span class="c">/* [Images tab] Don't crop preview thumbnails */</span>
|
|
|
|
<span class="p">.</span><span class="nc">flexbin</span><span class="w"> </span><span class="o">></span><span class="w"> </span><span class="o">*</span><span class="w"> </span><span class="o">></span><span class="w"> </span><span class="nt">img</span><span class="w"> </span><span class="p">{</span>
|
|
<span class="k">object-fit</span><span class="p">:</span><span class="w"> </span><span class="kc">inherit</span><span class="p">;</span>
|
|
<span class="k">max-width</span><span class="p">:</span><span class="w"> </span><span class="kc">none</span><span class="p">;</span>
|
|
<span class="k">min-width</span><span class="p">:</span><span class="w"> </span><span class="kc">initial</span><span class="p">;</span>
|
|
<span class="p">}</span>
|
|
</code></pre></div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<h2 id="groups">Groups<a class="headerlink" href="#groups" title="Permanent link">¶</a></h2>
|
|
<h3 id="better-group-layout-for-desktops-regular-size-poster">Better Group layout for desktops, regular size poster<a class="headerlink" href="#better-group-layout-for-desktops-regular-size-poster" title="Permanent link">¶</a></h3>
|
|
<div class="tabbed-set tabbed-alternate" data-tabs="13:4"><input checked="checked" id="description_12" name="__tabbed_13" type="radio"><input id="author_12" name="__tabbed_13" type="radio"><input id="screenshots_12" name="__tabbed_13" type="radio"><input id="css-code_12" name="__tabbed_13" type="radio"><div class="tabbed-labels"><label for="description_12">Description</label><label for="author_12">Author</label><label for="screenshots_12">Screenshots</label><label for="css-code_12">CSS code</label></div>
|
|
<div class="tabbed-content">
|
|
<div class="tabbed-block">
|
|
<p>Making the front and back image much bigger. Left panel uses 70% while the right uses 30%.</p>
|
|
</div>
|
|
<div class="tabbed-block"></div>
|
|
<div class="tabbed-block"></div>
|
|
<div class="tabbed-block">
|
|
<div class="highlight"><pre><span></span><code><span class="c">/* [Groups tab] Better Group layout for desktops: Regular size poster */</span>
|
|
|
|
<span class="p">.</span><span class="nc">group-details</span><span class="p">.</span><span class="nc">mb-3</span><span class="p">.</span><span class="nc">col</span><span class="p">.</span><span class="nc">col-xl-4</span><span class="p">.</span><span class="nc">col-lg-6</span><span class="w"> </span><span class="p">{</span>
|
|
<span class="k">flex-basis</span><span class="p">:</span><span class="w"> </span><span class="mi">70</span><span class="kt">%</span>
|
|
<span class="p">}</span>
|
|
<span class="p">.</span><span class="nc">col-xl-8</span><span class="p">.</span><span class="nc">col-lg-6</span><span class="p">{</span>
|
|
<span class="k">flex-basis</span><span class="p">:</span><span class="w"> </span><span class="mi">30</span><span class="kt">%</span><span class="w"> </span>
|
|
<span class="p">}</span>
|
|
<span class="p">.</span><span class="nc">group-images</span><span class="p">{</span>
|
|
<span class="k">flex-wrap</span><span class="p">:</span><span class="w"> </span><span class="kc">wrap</span>
|
|
<span class="p">}</span>
|
|
<span class="p">.</span><span class="nc">group-image-container</span><span class="w"> </span><span class="p">{</span>
|
|
<span class="k">flex</span><span class="p">:</span><span class="w"> </span><span class="mi">0</span><span class="w"> </span><span class="mi">0</span><span class="w"> </span><span class="mi">500</span><span class="kt">px</span>
|
|
<span class="p">}</span>
|
|
</code></pre></div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<h3 id="better-group-layout-for-desktops-larger-size-poster">Better Group layout for desktops, larger size poster<a class="headerlink" href="#better-group-layout-for-desktops-larger-size-poster" title="Permanent link">¶</a></h3>
|
|
<div class="tabbed-set tabbed-alternate" data-tabs="14:4"><input checked="checked" id="description_13" name="__tabbed_14" type="radio"><input id="author_13" name="__tabbed_14" type="radio"><input id="screenshots_13" name="__tabbed_14" type="radio"><input id="css-code_13" name="__tabbed_14" type="radio"><div class="tabbed-labels"><label for="description_13">Description</label><label for="author_13">Author</label><label for="screenshots_13">Screenshots</label><label for="css-code_13">CSS code</label></div>
|
|
<div class="tabbed-content">
|
|
<div class="tabbed-block">
|
|
<p>Making the front and back image much bigger. Left panel uses 70% while the right uses 30%.</p>
|
|
</div>
|
|
<div class="tabbed-block"></div>
|
|
<div class="tabbed-block"></div>
|
|
<div class="tabbed-block">
|
|
<div class="highlight"><pre><span></span><code><span class="c">/* [Groups tab] Better Group layout for desktops: Larger size poster */</span>
|
|
|
|
<span class="p">.</span><span class="nc">group-details</span><span class="p">.</span><span class="nc">mb-3</span><span class="p">.</span><span class="nc">col</span><span class="p">.</span><span class="nc">col-xl-4</span><span class="p">.</span><span class="nc">col-lg-6</span><span class="w"> </span><span class="p">{</span>
|
|
<span class="k">flex-basis</span><span class="p">:</span><span class="w"> </span><span class="mi">70</span><span class="kt">%</span>
|
|
<span class="p">}</span>
|
|
<span class="p">.</span><span class="nc">col-xl-8</span><span class="p">.</span><span class="nc">col-lg-6</span><span class="p">{</span>
|
|
<span class="k">flex-basis</span><span class="p">:</span><span class="w"> </span><span class="mi">30</span><span class="kt">%</span><span class="w"> </span>
|
|
<span class="p">}</span>
|
|
<span class="p">.</span><span class="nc">group-images</span><span class="p">{</span>
|
|
<span class="k">flex-direction</span><span class="p">:</span><span class="w"> </span><span class="kc">column</span><span class="p">;</span>
|
|
<span class="k">flex-wrap</span><span class="p">:</span><span class="w"> </span><span class="kc">wrap</span>
|
|
<span class="p">}</span>
|
|
<span class="p">.</span><span class="nc">group-image-container</span><span class="w"> </span><span class="p">{</span>
|
|
<span class="k">flex</span><span class="p">:</span><span class="w"> </span><span class="mi">1</span><span class="w"> </span><span class="mi">1</span><span class="w"> </span><span class="mi">700</span><span class="kt">px</span>
|
|
<span class="p">}</span>
|
|
</code></pre></div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<h2 id="galleries">Galleries<a class="headerlink" href="#galleries" title="Permanent link">¶</a></h2>
|
|
<h3 id="grid-view-for-galleries">Grid view for galleries<a class="headerlink" href="#grid-view-for-galleries" title="Permanent link">¶</a></h3>
|
|
<div class="tabbed-set tabbed-alternate" data-tabs="15:4"><input checked="checked" id="description_14" name="__tabbed_15" type="radio"><input id="author_14" name="__tabbed_15" type="radio"><input id="screenshots_14" name="__tabbed_15" type="radio"><input id="css-code_14" name="__tabbed_15" type="radio"><div class="tabbed-labels"><label for="description_14">Description</label><label for="author_14">Author</label><label for="screenshots_14">Screenshots</label><label for="css-code_14">CSS code</label></div>
|
|
<div class="tabbed-content">
|
|
<div class="tabbed-block">
|
|
<p>Grid view for galleries.</p>
|
|
</div>
|
|
<div class="tabbed-block"></div>
|
|
<div class="tabbed-block"></div>
|
|
<div class="tabbed-block">
|
|
<div class="highlight"><pre><span></span><code><span class="c">/* [Galleries tab] Grid view for galleries */</span>
|
|
|
|
<span class="p">.</span><span class="nc">col</span><span class="p">.</span><span class="nc">col-sm-6</span><span class="p">.</span><span class="nc">mx-auto</span><span class="p">.</span><span class="nc">table</span><span class="w"> </span><span class="p">.</span><span class="nc">d-none</span><span class="p">.</span><span class="nc">d-sm-block</span><span class="w"> </span><span class="p">{</span>
|
|
<span class="w"> </span><span class="k">display</span><span class="p">:</span><span class="w"> </span><span class="kc">none</span><span class="w"> </span><span class="cp">!important</span><span class="p">;</span>
|
|
<span class="p">}</span>
|
|
<span class="p">.</span><span class="nc">col</span><span class="p">.</span><span class="nc">col-sm-6</span><span class="p">.</span><span class="nc">mx-auto</span><span class="p">.</span><span class="nc">table</span><span class="w"> </span><span class="p">.</span><span class="nc">w-100</span><span class="p">.</span><span class="nc">w-sm-auto</span><span class="w"> </span><span class="p">{</span>
|
|
<span class="w"> </span><span class="k">width</span><span class="p">:</span><span class="w"> </span><span class="mi">175</span><span class="kt">px</span><span class="w"> </span><span class="cp">!important</span><span class="p">;</span>
|
|
<span class="w"> </span><span class="k">background-color</span><span class="p">:</span><span class="w"> </span><span class="nb">rgba</span><span class="p">(</span><span class="mi">0</span><span class="p">,</span><span class="w"> </span><span class="mi">0</span><span class="p">,</span><span class="w"> </span><span class="mi">0</span><span class="p">,</span><span class="w"> </span><span class="mf">.45</span><span class="p">);</span>
|
|
<span class="w"> </span><span class="k">box-shadow</span><span class="p">:</span><span class="w"> </span><span class="mi">0</span><span class="w"> </span><span class="mi">0</span><span class="w"> </span><span class="mi">2</span><span class="kt">px</span><span class="w"> </span><span class="nb">rgba</span><span class="p">(</span><span class="mi">0</span><span class="p">,</span><span class="w"> </span><span class="mi">0</span><span class="p">,</span><span class="w"> </span><span class="mi">0</span><span class="p">,</span><span class="w"> </span><span class="mf">.35</span><span class="p">);</span>
|
|
<span class="p">}</span>
|
|
<span class="p">.</span><span class="nc">col</span><span class="p">.</span><span class="nc">col-sm-6</span><span class="p">.</span><span class="nc">mx-auto</span><span class="p">.</span><span class="nc">table</span><span class="w"> </span><span class="nt">tr</span><span class="w"> </span><span class="p">{</span>
|
|
<span class="w"> </span><span class="k">display</span><span class="p">:</span><span class="w"> </span><span class="kc">inline-table</span><span class="p">;</span>
|
|
<span class="p">}</span>
|
|
</code></pre></div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<h3 id="disable-lightbox-image-transition">Disable lightbox image transition<a class="headerlink" href="#disable-lightbox-image-transition" title="Permanent link">¶</a></h3>
|
|
<div class="tabbed-set tabbed-alternate" data-tabs="16:4"><input checked="checked" id="description_15" name="__tabbed_16" type="radio"><input id="author_15" name="__tabbed_16" type="radio"><input id="screenshots_15" name="__tabbed_16" type="radio"><input id="css-code_15" name="__tabbed_16" type="radio"><div class="tabbed-labels"><label for="description_15">Description</label><label for="author_15">Author</label><label for="screenshots_15">Screenshots</label><label for="css-code_15">CSS code</label></div>
|
|
<div class="tabbed-content">
|
|
<div class="tabbed-block">
|
|
<p>Disable lightbox image transition.</p>
|
|
</div>
|
|
<div class="tabbed-block"></div>
|
|
<div class="tabbed-block"></div>
|
|
<div class="tabbed-block">
|
|
<div class="highlight"><pre><span></span><code><span class="c">/* [Gallery tab] Disable lightbox image transition */</span>
|
|
<span class="p">.</span><span class="nc">Lightbox-carousel</span><span class="w"> </span><span class="p">{</span>
|
|
<span class="k">transition</span><span class="p">:</span><span class="w"> </span><span class="kc">unset</span><span class="p">;</span>
|
|
<span class="p">}</span>
|
|
</code></pre></div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<h3 id="hide-the-lightbox-header-and-footer">Hide the lightbox header and footer<a class="headerlink" href="#hide-the-lightbox-header-and-footer" title="Permanent link">¶</a></h3>
|
|
<div class="tabbed-set tabbed-alternate" data-tabs="17:4"><input checked="checked" id="description_16" name="__tabbed_17" type="radio"><input id="author_16" name="__tabbed_17" type="radio"><input id="screenshots_16" name="__tabbed_17" type="radio"><input id="css-code_16" name="__tabbed_17" type="radio"><div class="tabbed-labels"><label for="description_16">Description</label><label for="author_16">Author</label><label for="screenshots_16">Screenshots</label><label for="css-code_16">CSS code</label></div>
|
|
<div class="tabbed-content">
|
|
<div class="tabbed-block">
|
|
<p>Hides the lightbox header and footer to make the image area larger. Mouse reveals them as an overlay to the image.</p>
|
|
</div>
|
|
<div class="tabbed-block">
|
|
<p><a href="https://github.com/peresabcod" target="_blank">peresabcod</a></p>
|
|
</div>
|
|
<div class="tabbed-block"></div>
|
|
<div class="tabbed-block">
|
|
<div class="highlight"><pre><span></span><code><span class="c">/* [Gallery tab] Hides the lightbox header and footer to make the image area larger. Mouse reveals them as an overlay to the image*/</span>
|
|
|
|
<span class="p">.</span><span class="nc">Lightbox-header</span><span class="o">,</span>
|
|
<span class="p">.</span><span class="nc">Lightbox-footer</span><span class="p">{</span>
|
|
<span class="k">z-index</span><span class="p">:</span><span class="mi">9999</span><span class="p">;</span>
|
|
<span class="k">position</span><span class="p">:</span><span class="kc">absolute</span><span class="p">;</span>
|
|
<span class="k">width</span><span class="p">:</span><span class="mi">100</span><span class="kt">%</span><span class="p">;</span>
|
|
<span class="k">opacity</span><span class="p">:</span><span class="mi">0</span><span class="p">;</span>
|
|
<span class="k">background-color</span><span class="p">:</span><span class="mh">#0008</span><span class="p">;</span>
|
|
<span class="k">transition</span><span class="p">:</span><span class="w"> </span><span class="k">opacity</span><span class="w"> </span><span class="mf">0.5</span><span class="kt">s</span><span class="w"> </span><span class="kc">ease</span><span class="p">;</span>
|
|
<span class="p">}</span>
|
|
|
|
<span class="p">.</span><span class="nc">Lightbox-footer</span><span class="p">{</span>
|
|
<span class="k">bottom</span><span class="p">:</span><span class="mi">0</span><span class="p">;}</span>
|
|
|
|
<span class="p">.</span><span class="nc">Lightbox-navbutton</span><span class="p">{</span>
|
|
<span class="k">opacity</span><span class="p">:</span><span class="mi">0</span><span class="p">;</span>
|
|
<span class="k">transition</span><span class="p">:</span><span class="w"> </span><span class="k">opacity</span><span class="w"> </span><span class="mf">0.5</span><span class="kt">s</span><span class="w"> </span><span class="kc">ease</span><span class="p">;</span>
|
|
<span class="p">}</span>
|
|
|
|
|
|
<span class="p">.</span><span class="nc">Lightbox-navbutton</span><span class="p">:</span><span class="nd">hover</span><span class="o">,</span>
|
|
<span class="p">.</span><span class="nc">Lightbox-header</span><span class="p">:</span><span class="nd">hover</span><span class="o">,</span>
|
|
<span class="p">.</span><span class="nc">Lightbox-footer</span><span class="p">:</span><span class="nd">hover</span><span class="p">{</span>
|
|
<span class="k">opacity</span><span class="p">:</span><span class="mi">1</span><span class="p">;</span>
|
|
<span class="p">}</span>
|
|
</code></pre></div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<h2 id="performers">Performers<a class="headerlink" href="#performers" title="Permanent link">¶</a></h2>
|
|
<h3 id="show-entire-performer-image-in-performer-card">Show entire performer image in performer card<a class="headerlink" href="#show-entire-performer-image-in-performer-card" title="Permanent link">¶</a></h3>
|
|
<div class="tabbed-set tabbed-alternate" data-tabs="18:4"><input checked="checked" id="description_17" name="__tabbed_18" type="radio"><input id="author_17" name="__tabbed_18" type="radio"><input id="screenshots_17" name="__tabbed_18" type="radio"><input id="css-code_17" name="__tabbed_18" type="radio"><div class="tabbed-labels"><label for="description_17">Description</label><label for="author_17">Author</label><label for="screenshots_17">Screenshots</label><label for="css-code_17">CSS code</label></div>
|
|
<div class="tabbed-content">
|
|
<div class="tabbed-block">
|
|
<p>Show entire performer image in performer card.</p>
|
|
</div>
|
|
<div class="tabbed-block"></div>
|
|
<div class="tabbed-block"></div>
|
|
<div class="tabbed-block">
|
|
<div class="highlight"><pre><span></span><code><span class="c">/* [Performers tab] Show entire performer image in performer card */</span>
|
|
|
|
<span class="p">.</span><span class="nc">performer</span><span class="p">.</span><span class="nc">image</span><span class="w"> </span><span class="p">{</span>
|
|
<span class="k">background-size</span><span class="p">:</span><span class="w"> </span><span class="kc">contain</span><span class="w"> </span><span class="cp">!important</span><span class="p">;</span>
|
|
<span class="p">}</span>
|
|
</code></pre></div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<h3 id="show-a-larger-image-in-performers-page-for-desktop">Show a larger image in performer's page for desktop<a class="headerlink" href="#show-a-larger-image-in-performers-page-for-desktop" title="Permanent link">¶</a></h3>
|
|
<div class="tabbed-set tabbed-alternate" data-tabs="19:4"><input checked="checked" id="description_18" name="__tabbed_19" type="radio"><input id="author_18" name="__tabbed_19" type="radio"><input id="screenshots_18" name="__tabbed_19" type="radio"><input id="css-code_18" name="__tabbed_19" type="radio"><div class="tabbed-labels"><label for="description_18">Description</label><label for="author_18">Author</label><label for="screenshots_18">Screenshots</label><label for="css-code_18">CSS code</label></div>
|
|
<div class="tabbed-content">
|
|
<div class="tabbed-block">
|
|
<p>Show a larger image in performer's page for desktop.</p>
|
|
</div>
|
|
<div class="tabbed-block"></div>
|
|
<div class="tabbed-block"></div>
|
|
<div class="tabbed-block">
|
|
<div class="highlight"><pre><span></span><code><span class="c">/* [Performers tab] Show a larger image in performer's page for desktop */</span>
|
|
<span class="p">.</span><span class="nc">performer-image-container</span><span class="p">{</span>
|
|
<span class="k">flex</span><span class="p">:</span><span class="w"> </span><span class="mi">0</span><span class="w"> </span><span class="mi">0</span><span class="w"> </span><span class="mi">50</span><span class="kt">%</span><span class="p">;</span>
|
|
<span class="k">max-width</span><span class="p">:</span><span class="w"> </span><span class="mi">50</span><span class="kt">%</span><span class="p">;</span>
|
|
<span class="p">}</span>
|
|
<span class="c">/* Changing .col-md-8 settings also affects studios and tags display. 50% should be good enough. */</span>
|
|
<span class="p">.</span><span class="nc">col-md-8</span><span class="w"> </span><span class="p">{</span>
|
|
<span class="k">flex</span><span class="p">:</span><span class="w"> </span><span class="mi">0</span><span class="w"> </span><span class="mi">0</span><span class="w"> </span><span class="mi">50</span><span class="kt">%</span><span class="p">;</span>
|
|
<span class="k">max-width</span><span class="p">:</span><span class="w"> </span><span class="mi">50</span><span class="kt">%</span><span class="p">;</span>
|
|
<span class="p">}</span>
|
|
</code></pre></div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<h3 id="place-performer-image-in-the-background-on-performer-page">Place performer image in the background on performer page<a class="headerlink" href="#place-performer-image-in-the-background-on-performer-page" title="Permanent link">¶</a></h3>
|
|
<div class="tabbed-set tabbed-alternate" data-tabs="20:4"><input checked="checked" id="description_19" name="__tabbed_20" type="radio"><input id="author_19" name="__tabbed_20" type="radio"><input id="screenshots_19" name="__tabbed_20" type="radio"><input id="css-code_19" name="__tabbed_20" type="radio"><div class="tabbed-labels"><label for="description_19">Description</label><label for="author_19">Author</label><label for="screenshots_19">Screenshots</label><label for="css-code_19">CSS code</label></div>
|
|
<div class="tabbed-content">
|
|
<div class="tabbed-block">
|
|
<p>Place performer image in the background on performer page.</p>
|
|
</div>
|
|
<div class="tabbed-block"></div>
|
|
<div class="tabbed-block"></div>
|
|
<div class="tabbed-block">
|
|
<div class="highlight"><pre><span></span><code><span class="c">/* [Performers tab] Place performer image in the background on performer page */</span>
|
|
|
|
<span class="p">.</span><span class="nc">performer-image-container</span><span class="p">.</span><span class="nc">col-md-4</span><span class="p">.</span><span class="nc">text-center</span><span class="w"> </span><span class="p">{</span>
|
|
<span class="w"> </span><span class="k">flex</span><span class="p">:</span><span class="w"> </span><span class="mi">0</span><span class="w"> </span><span class="mi">0</span><span class="w"> </span><span class="mi">0</span><span class="kt">%</span><span class="p">;</span>
|
|
<span class="w"> </span><span class="k">max-width</span><span class="p">:</span><span class="w"> </span><span class="mi">0</span><span class="kt">%</span><span class="p">;</span>
|
|
<span class="p">}</span>
|
|
|
|
<span class="p">#</span><span class="nn">performer-page</span><span class="w"> </span><span class="p">.</span><span class="nc">performer-image-container</span><span class="w"> </span><span class="p">.</span><span class="nc">btn</span><span class="p">.</span><span class="nc">btn-link</span><span class="w"> </span><span class="p">{</span>
|
|
<span class="w"> </span><span class="k">position</span><span class="p">:</span><span class="w"> </span><span class="kc">fixed</span><span class="p">;</span>
|
|
<span class="w"> </span><span class="k">width</span><span class="p">:</span><span class="w"> </span><span class="mi">100</span><span class="kt">%</span><span class="p">;</span>
|
|
<span class="w"> </span><span class="k">top</span><span class="p">:</span><span class="w"> </span><span class="mi">0</span><span class="p">;</span>
|
|
<span class="w"> </span><span class="k">left</span><span class="p">:</span><span class="w"> </span><span class="mi">0</span><span class="p">;</span>
|
|
<span class="w"> </span><span class="k">padding</span><span class="p">:</span><span class="w"> </span><span class="mi">0</span><span class="p">;</span>
|
|
<span class="p">}</span>
|
|
|
|
<span class="p">#</span><span class="nn">performer-page</span><span class="w"> </span><span class="p">.</span><span class="nc">performer-image-container</span><span class="w"> </span><span class="p">.</span><span class="nc">btn</span><span class="p">.</span><span class="nc">btn-link</span><span class="p">:</span><span class="nd">before</span><span class="w"> </span><span class="p">{</span>
|
|
<span class="w"> </span><span class="k">content</span><span class="p">:</span><span class="w"> </span><span class="s1">''</span><span class="p">;</span>
|
|
<span class="w"> </span><span class="k">position</span><span class="p">:</span><span class="kc">absolute</span><span class="p">;</span>
|
|
<span class="w"> </span><span class="k">top</span><span class="p">:</span><span class="mi">0</span><span class="p">;</span>
|
|
<span class="w"> </span><span class="k">left</span><span class="p">:</span><span class="w"> </span><span class="mi">0</span><span class="p">;</span>
|
|
<span class="w"> </span><span class="k">right</span><span class="p">:</span><span class="w"> </span><span class="mi">0</span><span class="p">;</span>
|
|
<span class="w"> </span><span class="k">bottom</span><span class="p">:</span><span class="w"> </span><span class="mi">0</span><span class="p">;</span>
|
|
<span class="w"> </span><span class="k">background</span><span class="p">:</span><span class="w"> </span><span class="nb">linear-gradient</span><span class="p">(</span><span class="kc">to</span><span class="w"> </span><span class="kc">left</span><span class="p">,</span><span class="w"> </span><span class="nb">rgba</span><span class="p">(</span><span class="mi">0</span><span class="p">,</span><span class="mi">0</span><span class="p">,</span><span class="mi">0</span><span class="p">,</span><span class="mi">0</span><span class="p">)</span><span class="w"> </span><span class="mi">0</span><span class="kt">%</span><span class="p">,</span><span class="nb">rgb</span><span class="p">(</span><span class="mi">0</span><span class="w"> </span><span class="mi">0</span><span class="w"> </span><span class="mi">0</span><span class="w"> </span><span class="o">/</span><span class="w"> </span><span class="mi">75</span><span class="kt">%</span><span class="p">)</span><span class="w"> </span><span class="mi">100</span><span class="kt">%</span><span class="p">);</span>
|
|
<span class="w"> </span><span class="k">z-index</span><span class="p">:</span><span class="w"> </span><span class="mi">1</span><span class="p">;</span>
|
|
<span class="p">}</span>
|
|
|
|
<span class="p">#</span><span class="nn">performer-page</span><span class="w"> </span><span class="p">.</span><span class="nc">performer-image-container</span><span class="w"> </span><span class="p">.</span><span class="nc">performer</span><span class="w"> </span><span class="p">{</span>
|
|
<span class="w"> </span><span class="k">max-height</span><span class="p">:</span><span class="w"> </span><span class="kc">none</span><span class="p">;</span>
|
|
<span class="w"> </span><span class="k">max-width</span><span class="p">:</span><span class="w"> </span><span class="kc">none</span><span class="p">;</span>
|
|
<span class="w"> </span><span class="k">width</span><span class="p">:</span><span class="w"> </span><span class="mi">100</span><span class="kt">%</span><span class="p">;</span>
|
|
<span class="p">}</span>
|
|
</code></pre></div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<h3 id="show-larger-performer-images-in-performers-list">Show larger performer images in performers list<a class="headerlink" href="#show-larger-performer-images-in-performers-list" title="Permanent link">¶</a></h3>
|
|
<div class="tabbed-set tabbed-alternate" data-tabs="21:4"><input checked="checked" id="description_20" name="__tabbed_21" type="radio"><input id="author_20" name="__tabbed_21" type="radio"><input id="screenshots_20" name="__tabbed_21" type="radio"><input id="css-code_20" name="__tabbed_21" type="radio"><div class="tabbed-labels"><label for="description_20">Description</label><label for="author_20">Author</label><label for="screenshots_20">Screenshots</label><label for="css-code_20">CSS code</label></div>
|
|
<div class="tabbed-content">
|
|
<div class="tabbed-block">
|
|
<p>Show larger performer images in performers list.</p>
|
|
</div>
|
|
<div class="tabbed-block"></div>
|
|
<div class="tabbed-block"></div>
|
|
<div class="tabbed-block">
|
|
<div class="highlight"><pre><span></span><code><span class="c">/* [Performers tab] Show larger performer images in performers list */</span>
|
|
<span class="c">/* original value: height: 30rem; min-width:13.25rem; */</span>
|
|
<span class="p">.</span><span class="nc">performer-card-image</span><span class="p">{</span>
|
|
<span class="k">height</span><span class="p">:</span><span class="w"> </span><span class="mi">45</span><span class="kt">rem</span><span class="p">;</span>
|
|
<span class="k">min-width</span><span class="p">:</span><span class="w"> </span><span class="mi">20</span><span class="kt">rem</span><span class="p">;</span>
|
|
<span class="p">}</span>
|
|
</code></pre></div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<h3 id="move-the-buttons-in-the-performers-edit-panel-to-the-top-instead-of-bottom">Move the buttons in the Performer's edit panel to the top instead of bottom<a class="headerlink" href="#move-the-buttons-in-the-performers-edit-panel-to-the-top-instead-of-bottom" title="Permanent link">¶</a></h3>
|
|
<div class="tabbed-set tabbed-alternate" data-tabs="22:4"><input checked="checked" id="description_21" name="__tabbed_22" type="radio"><input id="author_21" name="__tabbed_22" type="radio"><input id="screenshots_21" name="__tabbed_22" type="radio"><input id="css-code_21" name="__tabbed_22" type="radio"><div class="tabbed-labels"><label for="description_21">Description</label><label for="author_21">Author</label><label for="screenshots_21">Screenshots</label><label for="css-code_21">CSS code</label></div>
|
|
<div class="tabbed-content">
|
|
<div class="tabbed-block">
|
|
<p>Move the buttons in the Performer's edit panel to the top instead of bottom (in newer version of Stash, the buttons are already positioned both at top and bottom.</p>
|
|
</div>
|
|
<div class="tabbed-block"></div>
|
|
<div class="tabbed-block"></div>
|
|
<div class="tabbed-block">
|
|
<div class="highlight"><pre><span></span><code><span class="c">/* [Performers tab] Move the buttons in the Performer's edit panel to the top instead of bottom (in newer version of Stash, the buttons are already positioned both at top and bottom. */</span>
|
|
|
|
<span class="nt">form</span><span class="p">#</span><span class="nn">performer-edit</span><span class="w"> </span><span class="p">{</span>
|
|
<span class="w"> </span><span class="k">display</span><span class="p">:</span><span class="w"> </span><span class="kc">flex</span><span class="p">;</span>
|
|
<span class="w"> </span><span class="k">flex-direction</span><span class="p">:</span><span class="w"> </span><span class="kc">column</span><span class="p">;</span>
|
|
<span class="p">}</span>
|
|
<span class="p">#</span><span class="nn">performer-edit</span><span class="w"> </span><span class="o">></span><span class="w"> </span><span class="p">.</span><span class="nc">row</span><span class="w"> </span><span class="p">{</span>
|
|
<span class="w"> </span><span class="k">order</span><span class="p">:</span><span class="w"> </span><span class="mi">1</span><span class="p">;</span>
|
|
<span class="p">}</span>
|
|
<span class="p">#</span><span class="nn">performer-edit</span><span class="w"> </span><span class="o">></span><span class="w"> </span><span class="p">.</span><span class="nc">row</span><span class="p">:</span><span class="nd">last-child</span><span class="w"> </span><span class="p">{</span>
|
|
<span class="w"> </span><span class="k">order</span><span class="p">:</span><span class="w"> </span><span class="mi">0</span><span class="p">;</span>
|
|
<span class="w"> </span><span class="k">margin-bottom</span><span class="p">:</span><span class="w"> </span><span class="mi">1</span><span class="kt">rem</span><span class="p">;</span>
|
|
<span class="p">}</span>
|
|
</code></pre></div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<h3 id="move-the-tags-row-in-the-performers-edit-panel-to-the-second-position-just-after-name">Move the tags row in the Performer's edit panel to the second position (just after name)<a class="headerlink" href="#move-the-tags-row-in-the-performers-edit-panel-to-the-second-position-just-after-name" title="Permanent link">¶</a></h3>
|
|
<div class="tabbed-set tabbed-alternate" data-tabs="23:4"><input checked="checked" id="description_22" name="__tabbed_23" type="radio"><input id="author_22" name="__tabbed_23" type="radio"><input id="screenshots_22" name="__tabbed_23" type="radio"><input id="css-code_22" name="__tabbed_23" type="radio"><div class="tabbed-labels"><label for="description_22">Description</label><label for="author_22">Author</label><label for="screenshots_22">Screenshots</label><label for="css-code_22">CSS code</label></div>
|
|
<div class="tabbed-content">
|
|
<div class="tabbed-block">
|
|
<p>Move the tags row in the Performer's edit panel to the second position (just after name).</p>
|
|
</div>
|
|
<div class="tabbed-block"></div>
|
|
<div class="tabbed-block"></div>
|
|
<div class="tabbed-block">
|
|
<div class="highlight"><pre><span></span><code><span class="c">/* [Performers tab] Move the tags row in the Performer's edit panel to the second position (just after name). */</span>
|
|
|
|
<span class="nt">form</span><span class="p">#</span><span class="nn">performer-edit</span><span class="w"> </span><span class="p">{</span>
|
|
<span class="w"> </span><span class="k">display</span><span class="p">:</span><span class="w"> </span><span class="kc">flex</span><span class="p">;</span>
|
|
<span class="w"> </span><span class="k">flex-direction</span><span class="p">:</span><span class="w"> </span><span class="kc">column</span><span class="p">;</span>
|
|
<span class="p">}</span>
|
|
<span class="p">#</span><span class="nn">performer-edit</span><span class="w"> </span><span class="o">></span><span class="w"> </span><span class="p">.</span><span class="nc">row</span><span class="p">:</span><span class="nd">nth-child</span><span class="o">(</span><span class="nt">24</span><span class="o">)</span><span class="w"> </span><span class="p">{</span>
|
|
<span class="w"> </span><span class="k">order</span><span class="p">:</span><span class="w"> </span><span class="mi">-1</span><span class="p">;</span>
|
|
<span class="p">}</span>
|
|
<span class="p">#</span><span class="nn">performer-edit</span><span class="w"> </span><span class="o">></span><span class="w"> </span><span class="p">.</span><span class="nc">row</span><span class="p">:</span><span class="nd">first-child</span><span class="w"> </span><span class="p">{</span>
|
|
<span class="w"> </span><span class="k">order</span><span class="p">:</span><span class="w"> </span><span class="mi">-2</span><span class="p">;</span>
|
|
<span class="p">}</span>
|
|
</code></pre></div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<h2 id="studios">Studios<a class="headerlink" href="#studios" title="Permanent link">¶</a></h2>
|
|
<h3 id="different-studio-cards-layout">Different studio cards layout<a class="headerlink" href="#different-studio-cards-layout" title="Permanent link">¶</a></h3>
|
|
<div class="tabbed-set tabbed-alternate" data-tabs="24:4"><input checked="checked" id="description_23" name="__tabbed_24" type="radio"><input id="author_23" name="__tabbed_24" type="radio"><input id="screenshots_23" name="__tabbed_24" type="radio"><input id="css-code_23" name="__tabbed_24" type="radio"><div class="tabbed-labels"><label for="description_23">Description</label><label for="author_23">Author</label><label for="screenshots_23">Screenshots</label><label for="css-code_23">CSS code</label></div>
|
|
<div class="tabbed-content">
|
|
<div class="tabbed-block">
|
|
<p>Changes the layout of studio cards.</p>
|
|
</div>
|
|
<div class="tabbed-block">
|
|
<p>Qx#1573</p>
|
|
</div>
|
|
<div class="tabbed-block">
|
|
<p><a class="glightbox" data-type="image" data-width="auto" data-height="auto" href="/assets/user-interface-ui/studios_layout.png" data-desc-position="bottom"><img alt="" loading="lazy" src="/assets/user-interface-ui/studios_layout.png"></a></p>
|
|
</div>
|
|
<div class="tabbed-block">
|
|
<div class="highlight"><pre><span></span><code><span class="c">/* [Studios tab] Changes the layout of studio cards */</span>
|
|
<span class="p">.</span><span class="nc">studio-card</span><span class="p">.</span><span class="nc">grid-card</span><span class="p">.</span><span class="nc">card</span><span class="w"> </span><span class="nt">div</span><span class="p">.</span><span class="nc">card-section</span><span class="w"> </span><span class="nt">div</span><span class="p">.</span><span class="nc">rating-banner</span><span class="w"> </span><span class="p">{</span><span class="w"> </span><span class="k">display</span><span class="p">:</span><span class="w"> </span><span class="kc">none</span><span class="p">;</span><span class="w"> </span><span class="p">}</span>
|
|
<span class="p">.</span><span class="nc">slick-slide</span><span class="w"> </span><span class="p">.</span><span class="nc">studio-card-image</span><span class="w"> </span><span class="p">{</span><span class="w"> </span><span class="k">height</span><span class="p">:</span><span class="w"> </span><span class="mi">300</span><span class="kt">px</span><span class="p">;</span><span class="w"> </span><span class="p">}</span>
|
|
|
|
<span class="p">.</span><span class="nc">studio-card</span><span class="o">,</span><span class="w"> </span><span class="p">.</span><span class="nc">recommendation-row</span><span class="w"> </span><span class="p">.</span><span class="nc">studio-card</span><span class="w"> </span><span class="p">{</span>
|
|
<span class="w"> </span><span class="k">padding</span><span class="p">:</span><span class="w"> </span><span class="mi">0</span><span class="p">;</span>
|
|
<span class="w"> </span><span class="k">width</span><span class="p">:</span><span class="w"> </span><span class="mi">500</span><span class="kt">px</span><span class="p">;</span>
|
|
<span class="w"> </span><span class="k">height</span><span class="p">:</span><span class="w"> </span><span class="mi">300</span><span class="kt">px</span><span class="p">;</span>
|
|
<span class="p">}</span>
|
|
|
|
<span class="p">.</span><span class="nc">studio-card-image</span><span class="o">,</span><span class="w"> </span><span class="p">.</span><span class="nc">recommendation-row</span><span class="w"> </span><span class="p">.</span><span class="nc">studio-card</span><span class="w"> </span><span class="p">.</span><span class="nc">studio-card-image</span><span class="w"> </span><span class="p">{</span>
|
|
<span class="w"> </span><span class="k">max-height</span><span class="p">:</span><span class="w"> </span><span class="mi">300</span><span class="kt">px</span><span class="p">;</span>
|
|
<span class="w"> </span><span class="k">width</span><span class="p">:</span><span class="w"> </span><span class="mi">500</span><span class="kt">px</span><span class="p">;</span>
|
|
<span class="p">}</span>
|
|
|
|
<span class="p">.</span><span class="nc">studio-card</span><span class="p">.</span><span class="nc">grid-card</span><span class="p">.</span><span class="nc">card</span><span class="w"> </span><span class="nt">div</span><span class="p">.</span><span class="nc">card-section</span><span class="w"> </span><span class="p">{</span>
|
|
<span class="w"> </span><span class="k">position</span><span class="p">:</span><span class="w"> </span><span class="kc">absolute</span><span class="p">;</span>
|
|
<span class="w"> </span><span class="k">bottom</span><span class="p">:</span><span class="w"> </span><span class="mi">0</span><span class="kt">em</span><span class="p">;</span>
|
|
<span class="w"> </span><span class="k">width</span><span class="p">:</span><span class="w"> </span><span class="kc">inherit</span><span class="p">;</span>
|
|
<span class="w"> </span><span class="k">background-color</span><span class="p">:</span><span class="w"> </span><span class="nb">rgba</span><span class="p">(</span><span class="mi">0</span><span class="p">,</span><span class="w"> </span><span class="mi">0</span><span class="p">,</span><span class="w"> </span><span class="mi">0</span><span class="p">,</span><span class="w"> </span><span class="mf">0.7</span><span class="p">);</span>
|
|
<span class="w"> </span><span class="k">overflow</span><span class="p">:</span><span class="w"> </span><span class="kc">hidden</span><span class="p">;</span>
|
|
<span class="w"> </span><span class="k">height</span><span class="p">:</span><span class="w"> </span><span class="mf">2.5</span><span class="kt">em</span><span class="p">;</span>
|
|
<span class="w"> </span><span class="k">transition</span><span class="p">:</span><span class="w"> </span><span class="mf">0.5</span><span class="kt">s</span><span class="w"> </span><span class="kc">ease-in-out</span><span class="p">;</span>
|
|
<span class="p">}</span>
|
|
|
|
<span class="p">.</span><span class="nc">studio-card</span><span class="p">.</span><span class="nc">grid-card</span><span class="p">.</span><span class="nc">card</span><span class="w"> </span><span class="nt">div</span><span class="p">.</span><span class="nc">card-section</span><span class="p">:</span><span class="nd">hover</span><span class="w"> </span><span class="p">{</span>
|
|
<span class="w"> </span><span class="k">height</span><span class="p">:</span><span class="w"> </span><span class="mi">7</span><span class="kt">em</span><span class="p">;</span>
|
|
<span class="p">}</span>
|
|
</code></pre></div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<h3 id="more-studio-per-row">More studio per row<a class="headerlink" href="#more-studio-per-row" title="Permanent link">¶</a></h3>
|
|
<div class="tabbed-set tabbed-alternate" data-tabs="25:4"><input checked="checked" id="description_24" name="__tabbed_25" type="radio"><input id="author_24" name="__tabbed_25" type="radio"><input id="screenshots_24" name="__tabbed_25" type="radio"><input id="css-code_24" name="__tabbed_25" type="radio"><div class="tabbed-labels"><label for="description_24">Description</label><label for="author_24">Author</label><label for="screenshots_24">Screenshots</label><label for="css-code_24">CSS code</label></div>
|
|
<div class="tabbed-content">
|
|
<div class="tabbed-block">
|
|
<p>Display more studio per row</p>
|
|
</div>
|
|
<div class="tabbed-block">
|
|
<p><a href="https://github.com/HijackHornet" target="_blank">hijack_hornet</a></p>
|
|
</div>
|
|
<div class="tabbed-block">
|
|
<p><a class="glightbox" data-type="image" data-width="auto" data-height="auto" href="/assets/user-interface-ui/more_studio_item_before.jpg" data-desc-position="bottom"><img alt="" loading="lazy" src="/assets/user-interface-ui/more_studio_item_before.jpg"></a>
|
|
<a class="glightbox" data-type="image" data-width="auto" data-height="auto" href="/assets/user-interface-ui/more_studio_item_after.jpg" data-desc-position="bottom"><img alt="" loading="lazy" src="/assets/user-interface-ui/more_studio_item_after.jpg"></a></p>
|
|
</div>
|
|
<div class="tabbed-block">
|
|
<div class="highlight"><pre><span></span><code><span class="c">/* [Studios tab] Show more item per row */</span>
|
|
<span class="p">:</span><span class="nd">not</span><span class="o">(</span><span class="p">.</span><span class="nc">recommendation-row</span><span class="w"> </span><span class="p">.</span><span class="nc">studio-card</span><span class="o">)</span><span class="p">.</span><span class="nc">studio-card</span><span class="w"> </span><span class="p">{</span>
|
|
<span class="w"> </span><span class="k">width</span><span class="p">:</span><span class="w"> </span><span class="mi">15</span><span class="kt">%</span>
|
|
<span class="p">}</span>
|
|
<span class="p">:</span><span class="nd">not</span><span class="o">(</span><span class="p">.</span><span class="nc">recommendation-row</span><span class="w"> </span><span class="p">.</span><span class="nc">studio-card-image</span><span class="o">)</span><span class="p">.</span><span class="nc">studio-card-image</span><span class="w"> </span><span class="p">{</span>
|
|
<span class="w"> </span><span class="k">width</span><span class="p">:</span><span class="w"> </span><span class="mi">100</span><span class="kt">%</span>
|
|
<span class="p">}</span>
|
|
<span class="p">.</span><span class="nc">studio-card</span><span class="w"> </span><span class="nt">h5</span><span class="w"> </span><span class="p">{</span>
|
|
<span class="w"> </span><span class="k">text-align</span><span class="p">:</span><span class="w"> </span><span class="kc">center</span><span class="w"> </span><span class="cp">!important</span><span class="p">;</span>
|
|
<span class="w"> </span><span class="k">display</span><span class="p">:</span><span class="w"> </span><span class="kc">block</span><span class="p">;</span>
|
|
<span class="p">}</span>
|
|
</code></pre></div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<h2 id="tags">Tags<a class="headerlink" href="#tags" title="Permanent link">¶</a></h2>
|
|
<h3 id="different-tag-cards-layout">Different tag cards layout<a class="headerlink" href="#different-tag-cards-layout" title="Permanent link">¶</a></h3>
|
|
<div class="tabbed-set tabbed-alternate" data-tabs="26:4"><input checked="checked" id="description_25" name="__tabbed_26" type="radio"><input id="author_25" name="__tabbed_26" type="radio"><input id="screenshots_25" name="__tabbed_26" type="radio"><input id="css-code_25" name="__tabbed_26" type="radio"><div class="tabbed-labels"><label for="description_25">Description</label><label for="author_25">Author</label><label for="screenshots_25">Screenshots</label><label for="css-code_25">CSS code</label></div>
|
|
<div class="tabbed-content">
|
|
<div class="tabbed-block">
|
|
<p>Changes the layout of tag cards on tags tab and when hovering on tags in different content.</p>
|
|
</div>
|
|
<div class="tabbed-block">
|
|
<p>Qx#1573</p>
|
|
</div>
|
|
<div class="tabbed-block">
|
|
<p><a class="glightbox" data-type="image" data-width="auto" data-height="auto" href="/assets/user-interface-ui/tags_layout.png" data-desc-position="bottom"><img alt="" loading="lazy" src="/assets/user-interface-ui/tags_layout.png"></a></p>
|
|
</div>
|
|
<div class="tabbed-block">
|
|
<div class="highlight"><pre><span></span><code><span class="c">/* [Tags changes] changes the layout of tag cards on tags page and hover */</span>
|
|
<span class="p">.</span><span class="nc">tag-parent-tags</span><span class="o">,</span><span class="w"> </span><span class="p">.</span><span class="nc">tag-sub-tags</span><span class="w"> </span><span class="p">{</span><span class="w"> </span><span class="k">display</span><span class="p">:</span><span class="w"> </span><span class="kc">none</span><span class="p">;}</span>
|
|
<span class="p">.</span><span class="nc">tag-card</span><span class="p">.</span><span class="nc">zoom-0</span><span class="p">.</span><span class="nc">grid-card</span><span class="p">.</span><span class="nc">card</span><span class="w"> </span><span class="nt">div</span><span class="p">.</span><span class="nc">card-section</span><span class="w"> </span><span class="nt">div</span><span class="p">.</span><span class="nc">card-popovers</span><span class="p">.</span><span class="nc">btn-group</span><span class="w"> </span><span class="p">{</span><span class="w"> </span><span class="k">margin-top</span><span class="p">:</span><span class="w"> </span><span class="mi">1</span><span class="kt">em</span><span class="p">;</span><span class="w"> </span><span class="p">}</span>
|
|
<span class="p">.</span><span class="nc">tag-card</span><span class="p">.</span><span class="nc">zoom-0</span><span class="p">.</span><span class="nc">grid-card</span><span class="p">.</span><span class="nc">card</span><span class="w"> </span><span class="nt">div</span><span class="p">.</span><span class="nc">thumbnail-section</span><span class="w"> </span><span class="nt">a</span><span class="p">.</span><span class="nc">tag-card-header</span><span class="w"> </span><span class="nt">img</span><span class="p">.</span><span class="nc">tag-card-image</span><span class="w"> </span><span class="p">{</span><span class="w"> </span><span class="k">object-fit</span><span class="p">:</span><span class="w"> </span><span class="kc">cover</span><span class="p">;</span><span class="w"> </span><span class="p">}</span>
|
|
<span class="p">.</span><span class="nc">tag-card</span><span class="p">.</span><span class="nc">zoom-0</span><span class="p">.</span><span class="nc">grid-card</span><span class="p">.</span><span class="nc">card</span><span class="w"> </span><span class="nt">div</span><span class="p">.</span><span class="nc">card-section</span><span class="w"> </span><span class="nt">hr</span><span class="w"> </span><span class="p">{</span><span class="w"> </span><span class="k">display</span><span class="p">:</span><span class="w"> </span><span class="kc">none</span><span class="p">;</span><span class="w"> </span><span class="p">}</span>
|
|
|
|
<span class="p">.</span><span class="nc">tag-card</span><span class="p">.</span><span class="nc">zoom-0</span><span class="p">.</span><span class="nc">grid-card</span><span class="p">.</span><span class="nc">card</span><span class="w"> </span><span class="p">{</span>
|
|
<span class="w"> </span><span class="k">padding</span><span class="p">:</span><span class="w"> </span><span class="mi">0</span><span class="p">;</span>
|
|
<span class="w"> </span><span class="k">width</span><span class="p">:</span><span class="w"> </span><span class="mi">300</span><span class="kt">px</span><span class="p">;</span>
|
|
<span class="w"> </span><span class="k">height</span><span class="p">:</span><span class="w"> </span><span class="mi">180</span><span class="kt">px</span><span class="p">;</span>
|
|
<span class="p">}</span>
|
|
|
|
<span class="p">.</span><span class="nc">tag-card</span><span class="p">.</span><span class="nc">zoom-0</span><span class="p">.</span><span class="nc">grid-card</span><span class="p">.</span><span class="nc">card</span><span class="w"> </span><span class="nt">div</span><span class="p">.</span><span class="nc">card-section</span><span class="w"> </span><span class="p">{</span>
|
|
<span class="w"> </span><span class="k">position</span><span class="p">:</span><span class="w"> </span><span class="kc">absolute</span><span class="p">;</span>
|
|
<span class="w"> </span><span class="k">text-shadow</span><span class="p">:</span><span class="w"> </span><span class="mi">2</span><span class="kt">px</span><span class="w"> </span><span class="mi">2</span><span class="kt">px</span><span class="w"> </span><span class="mi">2</span><span class="kt">px</span><span class="w"> </span><span class="mh">#000</span><span class="p">;</span>
|
|
<span class="w"> </span><span class="k">width</span><span class="p">:</span><span class="w"> </span><span class="mi">100</span><span class="kt">%</span><span class="p">;</span>
|
|
<span class="w"> </span><span class="k">background-color</span><span class="p">:</span><span class="w"> </span><span class="nb">rgba</span><span class="p">(</span><span class="mi">0</span><span class="p">,</span><span class="w"> </span><span class="mi">0</span><span class="p">,</span><span class="w"> </span><span class="mi">0</span><span class="p">,</span><span class="w"> </span><span class="mf">0.3</span><span class="p">);</span>
|
|
<span class="w"> </span><span class="k">height</span><span class="p">:</span><span class="w"> </span><span class="mi">3</span><span class="kt">em</span><span class="p">;</span>
|
|
<span class="w"> </span><span class="k">overflow</span><span class="p">:</span><span class="w"> </span><span class="kc">hidden</span><span class="p">;</span>
|
|
<span class="w"> </span><span class="k">transition</span><span class="p">:</span><span class="w"> </span><span class="mf">0.8</span><span class="kt">s</span><span class="w"> </span><span class="kc">ease-in-out</span><span class="p">;</span>
|
|
<span class="p">}</span>
|
|
|
|
<span class="p">.</span><span class="nc">tag-card</span><span class="p">.</span><span class="nc">zoom-0</span><span class="p">.</span><span class="nc">grid-card</span><span class="p">.</span><span class="nc">card</span><span class="w"> </span><span class="nt">div</span><span class="p">.</span><span class="nc">card-section</span><span class="w"> </span><span class="nt">a</span><span class="w"> </span><span class="p">{</span>
|
|
<span class="w"> </span><span class="k">text-decoration</span><span class="p">:</span><span class="w"> </span><span class="kc">none</span><span class="p">;</span>
|
|
<span class="p">}</span>
|
|
|
|
<span class="p">.</span><span class="nc">tag-card</span><span class="p">.</span><span class="nc">zoom-0</span><span class="p">.</span><span class="nc">grid-card</span><span class="p">.</span><span class="nc">card</span><span class="w"> </span><span class="nt">div</span><span class="p">.</span><span class="nc">card-section</span><span class="p">:</span><span class="nd">hover</span><span class="w"> </span><span class="p">{</span>
|
|
<span class="w"> </span><span class="k">height</span><span class="p">:</span><span class="w"> </span><span class="mi">22</span><span class="kt">em</span><span class="p">;</span>
|
|
<span class="p">}</span>
|
|
|
|
<span class="p">.</span><span class="nc">tag-card</span><span class="p">.</span><span class="nc">zoom-0</span><span class="p">.</span><span class="nc">grid-card</span><span class="p">.</span><span class="nc">card</span><span class="w"> </span>
|
|
<span class="w"> </span><span class="nt">div</span><span class="p">.</span><span class="nc">card-section</span><span class="w"> </span><span class="nt">a</span><span class="w"> </span>
|
|
<span class="w"> </span><span class="nt">h5</span><span class="p">.</span><span class="nc">card-section-title</span><span class="p">.</span><span class="nc">flex-aligned</span><span class="w"> </span>
|
|
<span class="w"> </span><span class="nt">div</span><span class="p">.</span><span class="nc">TruncatedText</span><span class="w"> </span><span class="p">{</span>
|
|
<span class="w"> </span><span class="k">white-space</span><span class="p">:</span><span class="w"> </span><span class="kc">nowrap</span><span class="p">;</span>
|
|
<span class="w"> </span><span class="k">text-overflow</span><span class="p">:</span><span class="w"> </span><span class="kc">ellipsis</span><span class="p">;</span>
|
|
<span class="w"> </span><span class="k">width</span><span class="p">:</span><span class="w"> </span><span class="mi">300</span><span class="kt">px</span><span class="p">;</span>
|
|
<span class="w"> </span><span class="k">overflow</span><span class="p">:</span><span class="w"> </span><span class="kc">hidden</span><span class="p">;</span>
|
|
<span class="w"> </span><span class="k">display</span><span class="p">:</span><span class="w"> </span><span class="kc">block</span><span class="p">;</span>
|
|
<span class="p">}</span>
|
|
|
|
<span class="p">.</span><span class="nc">tag-card</span><span class="p">.</span><span class="nc">zoom-0</span><span class="p">.</span><span class="nc">grid-card</span><span class="p">.</span><span class="nc">card</span><span class="w"> </span><span class="nt">div</span><span class="p">.</span><span class="nc">card-section</span><span class="w"> </span><span class="nt">div</span><span class="p">.</span><span class="nc">TruncatedText</span><span class="p">.</span><span class="nc">tag-description</span><span class="w"> </span><span class="p">{</span>
|
|
<span class="w"> </span><span class="k">position</span><span class="p">:</span><span class="w"> </span><span class="kc">relative</span><span class="p">;</span>
|
|
<span class="w"> </span><span class="k">top</span><span class="p">:</span><span class="w"> </span><span class="mf">0.5</span><span class="kt">em</span><span class="p">;</span>
|
|
<span class="w"> </span><span class="kp">-webkit-</span><span class="n">text-stroke-width</span><span class="p">:</span><span class="w"> </span><span class="mi">1</span><span class="kt">px</span><span class="p">;</span>
|
|
<span class="w"> </span><span class="k">font-size</span><span class="p">:</span><span class="w"> </span><span class="mi">16</span><span class="kt">px</span><span class="p">;</span>
|
|
<span class="p">}</span>
|
|
|
|
<span class="p">.</span><span class="nc">tag-card</span><span class="w"> </span><span class="p">.</span><span class="nc">card-popovers</span><span class="w"> </span><span class="p">.</span><span class="nc">btn</span><span class="w"> </span><span class="p">{</span>
|
|
<span class="w"> </span><span class="k">text-shadow</span><span class="p">:</span><span class="w"> </span><span class="mi">1</span><span class="kt">px</span><span class="w"> </span><span class="mi">1</span><span class="kt">px</span><span class="w"> </span><span class="mi">1</span><span class="kt">px</span><span class="w"> </span><span class="mh">#000</span><span class="p">;</span>
|
|
<span class="w"> </span><span class="k">stroke</span><span class="p">:</span><span class="w"> </span><span class="kc">black</span><span class="p">;</span>
|
|
<span class="w"> </span><span class="k">stroke-width</span><span class="p">:</span><span class="w"> </span><span class="mi">15</span><span class="p">;</span>
|
|
<span class="p">}</span>
|
|
</code></pre></div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<h3 id="alternative-tag-layout">Alternative tag layout<a class="headerlink" href="#alternative-tag-layout" title="Permanent link">¶</a></h3>
|
|
<div class="tabbed-set tabbed-alternate" data-tabs="27:4"><input checked="checked" id="description_26" name="__tabbed_27" type="radio"><input id="author_26" name="__tabbed_27" type="radio"><input id="screenshots_26" name="__tabbed_27" type="radio"><input id="css-code_26" name="__tabbed_27" type="radio"><div class="tabbed-labels"><label for="description_26">Description</label><label for="author_26">Author</label><label for="screenshots_26">Screenshots</label><label for="css-code_26">CSS code</label></div>
|
|
<div class="tabbed-content">
|
|
<div class="tabbed-block">
|
|
<p>Changes the tags layout to show more images, and details on hover.</p>
|
|
</div>
|
|
<div class="tabbed-block">
|
|
<p><a href="https://github.com/HijackHornet" target="_blank">hijack_hornet</a></p>
|
|
</div>
|
|
<div class="tabbed-block">
|
|
<p><a class="glightbox" data-type="image" data-width="auto" data-height="auto" href="/assets/user-interface-ui/more_tag_before.jpg" data-desc-position="bottom"><img alt="" loading="lazy" src="/assets/user-interface-ui/more_tag_before.jpg"></a>
|
|
<a class="glightbox" data-type="image" data-width="auto" data-height="auto" href="/assets/user-interface-ui/more_tag_after_1.jpg" data-desc-position="bottom"><img alt="" loading="lazy" src="/assets/user-interface-ui/more_tag_after_1.jpg"></a>
|
|
<a class="glightbox" data-type="image" data-width="auto" data-height="auto" href="/assets/user-interface-ui/more_tag_after_2.jpg" data-desc-position="bottom"><img alt="" loading="lazy" src="/assets/user-interface-ui/more_tag_after_2.jpg"></a></p>
|
|
</div>
|
|
<div class="tabbed-block">
|
|
<div class="highlight"><pre><span></span><code><span class="c">/*Tag layout changes*/</span>
|
|
<span class="p">.</span><span class="nc">tag-card</span><span class="w"> </span><span class="p">{</span>
|
|
<span class="w"> </span><span class="k">width</span><span class="p">:</span><span class="w"> </span><span class="mi">16</span><span class="kt">rem</span><span class="p">;</span>
|
|
<span class="w"> </span><span class="k">padding</span><span class="p">:</span><span class="w"> </span><span class="mi">0</span><span class="p">;</span>
|
|
<span class="p">}</span>
|
|
|
|
<span class="p">.</span><span class="nc">tag-card</span><span class="w"> </span><span class="p">.</span><span class="nc">card-section</span><span class="w"> </span><span class="p">{</span>
|
|
<span class="w"> </span><span class="k">height</span><span class="p">:</span><span class="w"> </span><span class="mf">2.5</span><span class="kt">rem</span><span class="p">;</span>
|
|
<span class="w"> </span><span class="k">position</span><span class="p">:</span><span class="w"> </span><span class="kc">absolute</span><span class="p">;</span>
|
|
<span class="w"> </span><span class="k">bottom</span><span class="p">:</span><span class="w"> </span><span class="mi">0</span><span class="p">;</span>
|
|
<span class="w"> </span><span class="k">left</span><span class="p">:</span><span class="w"> </span><span class="mi">0</span><span class="p">;</span>
|
|
<span class="w"> </span><span class="k">right</span><span class="p">:</span><span class="w"> </span><span class="mi">0</span><span class="p">;</span>
|
|
<span class="w"> </span><span class="k">background</span><span class="p">:</span><span class="w"> </span><span class="mh">#000000</span><span class="mi">7</span><span class="n">a</span><span class="p">;</span>
|
|
<span class="w"> </span><span class="k">line-height</span><span class="p">:</span><span class="w"> </span><span class="kc">none</span><span class="p">;</span>
|
|
<span class="p">}</span>
|
|
<span class="p">.</span><span class="nc">tag-card</span><span class="w"> </span><span class="p">.</span><span class="nc">card-section</span><span class="w"> </span><span class="p">.</span><span class="nc">TruncatedText</span><span class="w"> </span><span class="p">{</span>
|
|
<span class="w"> </span><span class="kp">-webkit-</span><span class="k">line-clamp</span><span class="p">:</span><span class="w"> </span><span class="mi">1</span><span class="w"> </span><span class="cp">!important</span><span class="p">;</span>
|
|
<span class="p">}</span>
|
|
<span class="p">.</span><span class="nc">tag-card</span><span class="w"> </span><span class="nt">h1</span><span class="o">,</span>
|
|
<span class="nt">h2</span><span class="o">,</span>
|
|
<span class="nt">h3</span><span class="o">,</span>
|
|
<span class="nt">h4</span><span class="o">,</span>
|
|
<span class="nt">h5</span><span class="o">,</span>
|
|
<span class="nt">h6</span><span class="o">,</span>
|
|
<span class="p">.</span><span class="nc">h1</span><span class="o">,</span>
|
|
<span class="p">.</span><span class="nc">h2</span><span class="o">,</span>
|
|
<span class="p">.</span><span class="nc">h3</span><span class="o">,</span>
|
|
<span class="p">.</span><span class="nc">h4</span><span class="o">,</span>
|
|
<span class="p">.</span><span class="nc">h5</span><span class="o">,</span>
|
|
<span class="p">.</span><span class="nc">h6</span><span class="w"> </span><span class="p">{</span>
|
|
<span class="w"> </span><span class="k">line-height</span><span class="p">:</span><span class="w"> </span><span class="kc">normal</span><span class="p">;</span>
|
|
<span class="p">}</span>
|
|
<span class="p">.</span><span class="nc">tag-card</span><span class="w"> </span><span class="nt">hr</span><span class="o">,</span>
|
|
<span class="p">.</span><span class="nc">tag-description</span><span class="w"> </span><span class="p">{</span>
|
|
<span class="w"> </span><span class="k">display</span><span class="p">:</span><span class="w"> </span><span class="kc">none</span><span class="p">;</span>
|
|
<span class="p">}</span>
|
|
<span class="p">.</span><span class="nc">tag-card</span><span class="w"> </span><span class="p">.</span><span class="nc">btn-group</span><span class="w"> </span><span class="p">{</span>
|
|
<span class="w"> </span><span class="k">position</span><span class="p">:</span><span class="w"> </span><span class="kc">absolute</span><span class="p">;</span>
|
|
<span class="w"> </span><span class="k">width</span><span class="p">:</span><span class="w"> </span><span class="mi">100</span><span class="kt">%</span><span class="p">;</span>
|
|
<span class="w"> </span><span class="k">bottom</span><span class="p">:</span><span class="w"> </span><span class="mf">2.5</span><span class="kt">rem</span><span class="p">;</span>
|
|
<span class="w"> </span><span class="k">margin-bottom</span><span class="p">:</span><span class="w"> </span><span class="mi">0</span><span class="p">;</span>
|
|
<span class="w"> </span><span class="k">opacity</span><span class="p">:</span><span class="w"> </span><span class="mi">0</span><span class="p">;</span>
|
|
<span class="w"> </span><span class="k">transition</span><span class="p">:</span><span class="w"> </span><span class="kc">ease</span><span class="w"> </span><span class="mf">0.2</span><span class="kt">s</span><span class="p">;</span>
|
|
<span class="p">}</span>
|
|
<span class="p">.</span><span class="nc">tag-card</span><span class="w"> </span><span class="p">.</span><span class="nc">btn-group</span><span class="p">:</span><span class="nd">hover</span><span class="w"> </span><span class="p">{</span>
|
|
<span class="w"> </span><span class="k">opacity</span><span class="p">:</span><span class="w"> </span><span class="mi">1</span><span class="p">;</span>
|
|
<span class="w"> </span><span class="k">transition</span><span class="p">:</span><span class="w"> </span><span class="kc">ease</span><span class="w"> </span><span class="mf">0.2</span><span class="kt">s</span><span class="p">;</span>
|
|
<span class="w"> </span><span class="k">background</span><span class="p">:</span><span class="w"> </span><span class="mh">#000000</span><span class="mi">7</span><span class="n">a</span><span class="p">;</span>
|
|
<span class="p">}</span>
|
|
|
|
<span class="p">.</span><span class="nc">tag-card-image</span><span class="w"> </span><span class="p">{</span>
|
|
<span class="w"> </span><span class="k">object-fit</span><span class="p">:</span><span class="w"> </span><span class="kc">cover</span><span class="p">;</span>
|
|
<span class="w"> </span><span class="k">object-position</span><span class="p">:</span><span class="w"> </span><span class="kc">center</span><span class="p">;</span>
|
|
<span class="p">}</span>
|
|
|
|
<span class="p">.</span><span class="nc">zoom-0</span><span class="w"> </span><span class="p">.</span><span class="nc">tag-card-image</span><span class="w"> </span><span class="p">{</span>
|
|
<span class="w"> </span><span class="k">max-height</span><span class="p">:</span><span class="w"> </span><span class="kc">none</span><span class="p">;</span>
|
|
<span class="w"> </span><span class="k">height</span><span class="p">:</span><span class="w"> </span><span class="mi">16</span><span class="kt">rem</span><span class="p">;</span>
|
|
<span class="w"> </span><span class="k">width</span><span class="p">:</span><span class="w"> </span><span class="mi">12</span><span class="kt">rem</span><span class="p">;</span>
|
|
<span class="p">}</span>
|
|
|
|
<span class="p">.</span><span class="nc">zoom-1</span><span class="w"> </span><span class="p">.</span><span class="nc">tag-card-image</span><span class="w"> </span><span class="p">{</span>
|
|
<span class="w"> </span><span class="k">max-height</span><span class="p">:</span><span class="w"> </span><span class="kc">none</span><span class="p">;</span>
|
|
<span class="w"> </span><span class="k">height</span><span class="p">:</span><span class="w"> </span><span class="mi">20</span><span class="kt">rem</span><span class="p">;</span>
|
|
<span class="w"> </span><span class="k">width</span><span class="p">:</span><span class="w"> </span><span class="mi">15</span><span class="kt">rem</span><span class="p">;</span>
|
|
<span class="p">}</span>
|
|
|
|
<span class="p">.</span><span class="nc">zoom-2</span><span class="w"> </span><span class="p">.</span><span class="nc">tag-card-image</span><span class="w"> </span><span class="p">{</span>
|
|
<span class="w"> </span><span class="k">max-height</span><span class="p">:</span><span class="w"> </span><span class="kc">none</span><span class="p">;</span>
|
|
<span class="w"> </span><span class="k">height</span><span class="p">:</span><span class="w"> </span><span class="mi">24</span><span class="kt">rem</span><span class="p">;</span>
|
|
<span class="w"> </span><span class="k">width</span><span class="p">:</span><span class="w"> </span><span class="mi">18</span><span class="kt">rem</span><span class="p">;</span>
|
|
<span class="p">}</span>
|
|
|
|
<span class="p">.</span><span class="nc">zoom-3</span><span class="w"> </span><span class="p">.</span><span class="nc">tag-card-image</span><span class="w"> </span><span class="p">{</span>
|
|
<span class="w"> </span><span class="k">max-height</span><span class="p">:</span><span class="w"> </span><span class="kc">none</span><span class="p">;</span>
|
|
<span class="w"> </span><span class="k">height</span><span class="p">:</span><span class="w"> </span><span class="mi">28</span><span class="kt">rem</span><span class="p">;</span>
|
|
<span class="w"> </span><span class="k">width</span><span class="p">:</span><span class="w"> </span><span class="mi">21</span><span class="kt">rem</span><span class="p">;</span>
|
|
<span class="p">}</span>
|
|
|
|
<span class="p">.</span><span class="nc">zoom-0</span><span class="p">.</span><span class="nc">tag-card</span><span class="o">,</span>
|
|
<span class="p">.</span><span class="nc">zoom-1</span><span class="p">.</span><span class="nc">tag-card</span><span class="o">,</span>
|
|
<span class="p">.</span><span class="nc">zoom-2</span><span class="p">.</span><span class="nc">tag-card</span><span class="o">,</span>
|
|
<span class="p">.</span><span class="nc">zoom-3</span><span class="p">.</span><span class="nc">tag-card</span><span class="w"> </span><span class="p">{</span>
|
|
<span class="w"> </span><span class="k">width</span><span class="p">:</span><span class="w"> </span><span class="kc">initial</span><span class="p">;</span>
|
|
<span class="p">}</span>
|
|
|
|
<span class="p">.</span><span class="nc">tag-card</span><span class="w"> </span><span class="p">.</span><span class="nc">card-section</span><span class="w"> </span><span class="o">></span><span class="w"> </span><span class="nt">a</span><span class="w"> </span><span class="p">{</span>
|
|
<span class="w"> </span><span class="k">position</span><span class="p">:</span><span class="w"> </span><span class="kc">absolute</span><span class="p">;</span>
|
|
<span class="w"> </span><span class="k">width</span><span class="p">:</span><span class="w"> </span><span class="mi">100</span><span class="kt">%</span><span class="p">;</span>
|
|
<span class="w"> </span><span class="k">height</span><span class="p">:</span><span class="w"> </span><span class="mi">100</span><span class="kt">%</span><span class="p">;</span>
|
|
<span class="w"> </span><span class="k">display</span><span class="p">:</span><span class="w"> </span><span class="kc">block</span><span class="p">;</span>
|
|
<span class="w"> </span><span class="k">left</span><span class="p">:</span><span class="w"> </span><span class="mi">0</span><span class="p">;</span>
|
|
<span class="w"> </span><span class="k">right</span><span class="p">:</span><span class="w"> </span><span class="mi">0</span><span class="p">;</span>
|
|
<span class="w"> </span><span class="k">top</span><span class="p">:</span><span class="w"> </span><span class="mi">0</span><span class="p">;</span>
|
|
<span class="w"> </span><span class="k">bottom</span><span class="p">:</span><span class="w"> </span><span class="mi">0</span><span class="p">;</span>
|
|
<span class="w"> </span><span class="k">padding</span><span class="p">:</span><span class="w"> </span><span class="mi">7</span><span class="kt">px</span><span class="w"> </span><span class="mi">14</span><span class="kt">px</span><span class="w"> </span><span class="mi">0</span><span class="kt">px</span><span class="w"> </span><span class="mi">14</span><span class="kt">px</span><span class="p">;</span>
|
|
<span class="p">}</span>
|
|
<span class="p">.</span><span class="nc">tag-card</span><span class="w"> </span><span class="p">.</span><span class="nc">card-section</span><span class="w"> </span><span class="p">.</span><span class="nc">tag-sub-tags</span><span class="w"> </span><span class="p">{</span>
|
|
<span class="w"> </span><span class="k">position</span><span class="p">:</span><span class="w"> </span><span class="kc">relative</span><span class="p">;</span>
|
|
<span class="w"> </span><span class="k">margin-top</span><span class="p">:</span><span class="w"> </span><span class="mi">2</span><span class="kt">rem</span><span class="p">;</span>
|
|
<span class="w"> </span><span class="k">z-index</span><span class="p">:</span><span class="w"> </span><span class="mi">1</span><span class="p">;</span>
|
|
<span class="p">}</span>
|
|
<span class="p">.</span><span class="nc">tag-sub-tags</span><span class="w"> </span><span class="p">{</span>
|
|
<span class="w"> </span><span class="k">font-size</span><span class="p">:</span><span class="w"> </span><span class="mi">0</span><span class="p">;</span>
|
|
<span class="p">}</span>
|
|
<span class="p">.</span><span class="nc">tag-parent-tags</span><span class="w"> </span><span class="p">{</span>
|
|
<span class="w"> </span><span class="k">display</span><span class="p">:</span><span class="w"> </span><span class="kc">none</span><span class="p">;</span>
|
|
<span class="p">}</span>
|
|
</code></pre></div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<h3 id="subtag-explorer">Subtag explorer<a class="headerlink" href="#subtag-explorer" title="Permanent link">¶</a></h3>
|
|
<div class="tabbed-set tabbed-alternate" data-tabs="28:4"><input checked="checked" id="description_27" name="__tabbed_28" type="radio"><input id="author_27" name="__tabbed_28" type="radio"><input id="screenshots_27" name="__tabbed_28" type="radio"><input id="css-code_27" name="__tabbed_28" type="radio"><div class="tabbed-labels"><label for="description_27">Description</label><label for="author_27">Author</label><label for="screenshots_27">Screenshots</label><label for="css-code_27">CSS code</label></div>
|
|
<div class="tabbed-content">
|
|
<div class="tabbed-block">
|
|
<p>This snipset includes the above tag layout snipset with a twist. Its meant to be used for people who use subtags as a hierachy. For example Watermelon is a subtag of Fruits, so when i click Fruits i want to see both oranges and watermelons, but i might want to get into the list of fruits subtags more easily. That what this snipset is used for. Any tag that has a subtag will show a (...) icon. When clicking its name you will show all subtags of this tag. if you click its image, it will instead open the tag itself normaly. You can change '137cbd' in the icon url to any color you want to match you theme.</p>
|
|
</div>
|
|
<div class="tabbed-block">
|
|
<p><a href="https://github.com/HijackHornet" target="_blank">hijack_hornet</a></p>
|
|
</div>
|
|
<div class="tabbed-block">
|
|
<p><a class="glightbox" data-type="image" data-width="auto" data-height="auto" href="/assets/user-interface-ui/more_tag_subtag.jpg" data-desc-position="bottom"><img alt="" loading="lazy" src="/assets/user-interface-ui/more_tag_subtag.jpg"></a></p>
|
|
</div>
|
|
<div class="tabbed-block">
|
|
<div class="highlight"><pre><span></span><code><span class="c">/*Tag layout changes*/</span>
|
|
<span class="p">.</span><span class="nc">tag-card</span><span class="w"> </span><span class="p">{</span>
|
|
<span class="w"> </span><span class="k">width</span><span class="p">:</span><span class="w"> </span><span class="mi">16</span><span class="kt">rem</span><span class="p">;</span>
|
|
<span class="w"> </span><span class="k">padding</span><span class="p">:</span><span class="w"> </span><span class="mi">0</span><span class="p">;</span>
|
|
<span class="p">}</span>
|
|
|
|
<span class="p">.</span><span class="nc">tag-card</span><span class="w"> </span><span class="p">.</span><span class="nc">card-section</span><span class="w"> </span><span class="p">{</span>
|
|
<span class="w"> </span><span class="k">height</span><span class="p">:</span><span class="w"> </span><span class="mf">2.5</span><span class="kt">rem</span><span class="p">;</span>
|
|
<span class="w"> </span><span class="k">position</span><span class="p">:</span><span class="w"> </span><span class="kc">absolute</span><span class="p">;</span>
|
|
<span class="w"> </span><span class="k">bottom</span><span class="p">:</span><span class="w"> </span><span class="mi">0</span><span class="p">;</span>
|
|
<span class="w"> </span><span class="k">left</span><span class="p">:</span><span class="w"> </span><span class="mi">0</span><span class="p">;</span>
|
|
<span class="w"> </span><span class="k">right</span><span class="p">:</span><span class="w"> </span><span class="mi">0</span><span class="p">;</span>
|
|
<span class="w"> </span><span class="k">background</span><span class="p">:</span><span class="w"> </span><span class="mh">#000000</span><span class="mi">7</span><span class="n">a</span><span class="p">;</span>
|
|
<span class="w"> </span><span class="k">line-height</span><span class="p">:</span><span class="w"> </span><span class="kc">none</span><span class="p">;</span>
|
|
<span class="p">}</span>
|
|
<span class="p">.</span><span class="nc">tag-card</span><span class="w"> </span><span class="p">.</span><span class="nc">card-section</span><span class="w"> </span><span class="p">.</span><span class="nc">TruncatedText</span><span class="w"> </span><span class="p">{</span>
|
|
<span class="w"> </span><span class="kp">-webkit-</span><span class="k">line-clamp</span><span class="p">:</span><span class="w"> </span><span class="mi">1</span><span class="w"> </span><span class="cp">!important</span><span class="p">;</span>
|
|
<span class="p">}</span>
|
|
<span class="p">.</span><span class="nc">tag-card</span><span class="w"> </span><span class="nt">h1</span><span class="o">,</span>
|
|
<span class="nt">h2</span><span class="o">,</span>
|
|
<span class="nt">h3</span><span class="o">,</span>
|
|
<span class="nt">h4</span><span class="o">,</span>
|
|
<span class="nt">h5</span><span class="o">,</span>
|
|
<span class="nt">h6</span><span class="o">,</span>
|
|
<span class="p">.</span><span class="nc">h1</span><span class="o">,</span>
|
|
<span class="p">.</span><span class="nc">h2</span><span class="o">,</span>
|
|
<span class="p">.</span><span class="nc">h3</span><span class="o">,</span>
|
|
<span class="p">.</span><span class="nc">h4</span><span class="o">,</span>
|
|
<span class="p">.</span><span class="nc">h5</span><span class="o">,</span>
|
|
<span class="p">.</span><span class="nc">h6</span><span class="w"> </span><span class="p">{</span>
|
|
<span class="w"> </span><span class="k">line-height</span><span class="p">:</span><span class="w"> </span><span class="kc">normal</span><span class="p">;</span>
|
|
<span class="p">}</span>
|
|
<span class="p">.</span><span class="nc">tag-card</span><span class="w"> </span><span class="nt">hr</span><span class="o">,</span>
|
|
<span class="p">.</span><span class="nc">tag-description</span><span class="w"> </span><span class="p">{</span>
|
|
<span class="w"> </span><span class="k">display</span><span class="p">:</span><span class="w"> </span><span class="kc">none</span><span class="p">;</span>
|
|
<span class="p">}</span>
|
|
<span class="p">.</span><span class="nc">tag-card</span><span class="w"> </span><span class="p">.</span><span class="nc">btn-group</span><span class="w"> </span><span class="p">{</span>
|
|
<span class="w"> </span><span class="k">position</span><span class="p">:</span><span class="w"> </span><span class="kc">absolute</span><span class="p">;</span>
|
|
<span class="w"> </span><span class="k">width</span><span class="p">:</span><span class="w"> </span><span class="mi">100</span><span class="kt">%</span><span class="p">;</span>
|
|
<span class="w"> </span><span class="k">bottom</span><span class="p">:</span><span class="w"> </span><span class="mf">2.5</span><span class="kt">rem</span><span class="p">;</span>
|
|
<span class="w"> </span><span class="k">margin-bottom</span><span class="p">:</span><span class="w"> </span><span class="mi">0</span><span class="p">;</span>
|
|
<span class="w"> </span><span class="k">opacity</span><span class="p">:</span><span class="w"> </span><span class="mi">0</span><span class="p">;</span>
|
|
<span class="w"> </span><span class="k">transition</span><span class="p">:</span><span class="w"> </span><span class="kc">ease</span><span class="w"> </span><span class="mf">0.2</span><span class="kt">s</span><span class="p">;</span>
|
|
<span class="p">}</span>
|
|
<span class="p">.</span><span class="nc">tag-card</span><span class="w"> </span><span class="p">.</span><span class="nc">btn-group</span><span class="p">:</span><span class="nd">hover</span><span class="w"> </span><span class="p">{</span>
|
|
<span class="w"> </span><span class="k">opacity</span><span class="p">:</span><span class="w"> </span><span class="mi">1</span><span class="p">;</span>
|
|
<span class="w"> </span><span class="k">transition</span><span class="p">:</span><span class="w"> </span><span class="kc">ease</span><span class="w"> </span><span class="mf">0.2</span><span class="kt">s</span><span class="p">;</span>
|
|
<span class="w"> </span><span class="k">background</span><span class="p">:</span><span class="w"> </span><span class="mh">#000000</span><span class="mi">7</span><span class="n">a</span><span class="p">;</span>
|
|
<span class="p">}</span>
|
|
|
|
<span class="p">.</span><span class="nc">tag-card-image</span><span class="w"> </span><span class="p">{</span>
|
|
<span class="w"> </span><span class="k">object-fit</span><span class="p">:</span><span class="w"> </span><span class="kc">cover</span><span class="p">;</span>
|
|
<span class="w"> </span><span class="k">object-position</span><span class="p">:</span><span class="w"> </span><span class="kc">center</span><span class="p">;</span>
|
|
<span class="p">}</span>
|
|
|
|
<span class="p">.</span><span class="nc">zoom-0</span><span class="w"> </span><span class="p">.</span><span class="nc">tag-card-image</span><span class="w"> </span><span class="p">{</span>
|
|
<span class="w"> </span><span class="k">max-height</span><span class="p">:</span><span class="w"> </span><span class="kc">none</span><span class="p">;</span>
|
|
<span class="w"> </span><span class="k">height</span><span class="p">:</span><span class="w"> </span><span class="mi">16</span><span class="kt">rem</span><span class="p">;</span>
|
|
<span class="w"> </span><span class="k">width</span><span class="p">:</span><span class="w"> </span><span class="mi">12</span><span class="kt">rem</span><span class="p">;</span>
|
|
<span class="p">}</span>
|
|
|
|
<span class="p">.</span><span class="nc">zoom-1</span><span class="w"> </span><span class="p">.</span><span class="nc">tag-card-image</span><span class="w"> </span><span class="p">{</span>
|
|
<span class="w"> </span><span class="k">max-height</span><span class="p">:</span><span class="w"> </span><span class="kc">none</span><span class="p">;</span>
|
|
<span class="w"> </span><span class="k">height</span><span class="p">:</span><span class="w"> </span><span class="mi">20</span><span class="kt">rem</span><span class="p">;</span>
|
|
<span class="w"> </span><span class="k">width</span><span class="p">:</span><span class="w"> </span><span class="mi">15</span><span class="kt">rem</span><span class="p">;</span>
|
|
<span class="p">}</span>
|
|
|
|
<span class="p">.</span><span class="nc">zoom-2</span><span class="w"> </span><span class="p">.</span><span class="nc">tag-card-image</span><span class="w"> </span><span class="p">{</span>
|
|
<span class="w"> </span><span class="k">max-height</span><span class="p">:</span><span class="w"> </span><span class="kc">none</span><span class="p">;</span>
|
|
<span class="w"> </span><span class="k">height</span><span class="p">:</span><span class="w"> </span><span class="mi">24</span><span class="kt">rem</span><span class="p">;</span>
|
|
<span class="w"> </span><span class="k">width</span><span class="p">:</span><span class="w"> </span><span class="mi">18</span><span class="kt">rem</span><span class="p">;</span>
|
|
<span class="p">}</span>
|
|
|
|
<span class="p">.</span><span class="nc">zoom-3</span><span class="w"> </span><span class="p">.</span><span class="nc">tag-card-image</span><span class="w"> </span><span class="p">{</span>
|
|
<span class="w"> </span><span class="k">max-height</span><span class="p">:</span><span class="w"> </span><span class="kc">none</span><span class="p">;</span>
|
|
<span class="w"> </span><span class="k">height</span><span class="p">:</span><span class="w"> </span><span class="mi">28</span><span class="kt">rem</span><span class="p">;</span>
|
|
<span class="w"> </span><span class="k">width</span><span class="p">:</span><span class="w"> </span><span class="mi">21</span><span class="kt">rem</span><span class="p">;</span>
|
|
<span class="p">}</span>
|
|
|
|
<span class="p">.</span><span class="nc">zoom-0</span><span class="p">.</span><span class="nc">tag-card</span><span class="o">,</span>
|
|
<span class="p">.</span><span class="nc">zoom-1</span><span class="p">.</span><span class="nc">tag-card</span><span class="o">,</span>
|
|
<span class="p">.</span><span class="nc">zoom-2</span><span class="p">.</span><span class="nc">tag-card</span><span class="o">,</span>
|
|
<span class="p">.</span><span class="nc">zoom-3</span><span class="p">.</span><span class="nc">tag-card</span><span class="w"> </span><span class="p">{</span>
|
|
<span class="w"> </span><span class="k">width</span><span class="p">:</span><span class="w"> </span><span class="kc">initial</span><span class="p">;</span>
|
|
<span class="p">}</span>
|
|
|
|
<span class="p">.</span><span class="nc">tag-card</span><span class="w"> </span><span class="p">.</span><span class="nc">card-section</span><span class="w"> </span><span class="o">></span><span class="w"> </span><span class="nt">a</span><span class="w"> </span><span class="p">{</span>
|
|
<span class="w"> </span><span class="k">position</span><span class="p">:</span><span class="w"> </span><span class="kc">absolute</span><span class="p">;</span>
|
|
<span class="w"> </span><span class="k">width</span><span class="p">:</span><span class="w"> </span><span class="mi">100</span><span class="kt">%</span><span class="p">;</span>
|
|
<span class="w"> </span><span class="k">height</span><span class="p">:</span><span class="w"> </span><span class="mi">100</span><span class="kt">%</span><span class="p">;</span>
|
|
<span class="w"> </span><span class="k">display</span><span class="p">:</span><span class="w"> </span><span class="kc">block</span><span class="p">;</span>
|
|
<span class="w"> </span><span class="k">left</span><span class="p">:</span><span class="w"> </span><span class="mi">0</span><span class="p">;</span>
|
|
<span class="w"> </span><span class="k">right</span><span class="p">:</span><span class="w"> </span><span class="mi">0</span><span class="p">;</span>
|
|
<span class="w"> </span><span class="k">top</span><span class="p">:</span><span class="w"> </span><span class="mi">0</span><span class="p">;</span>
|
|
<span class="w"> </span><span class="k">bottom</span><span class="p">:</span><span class="w"> </span><span class="mi">0</span><span class="p">;</span>
|
|
<span class="w"> </span><span class="k">padding</span><span class="p">:</span><span class="w"> </span><span class="mi">7</span><span class="kt">px</span><span class="w"> </span><span class="mi">14</span><span class="kt">px</span><span class="w"> </span><span class="mi">0</span><span class="kt">px</span><span class="w"> </span><span class="mi">14</span><span class="kt">px</span><span class="p">;</span>
|
|
<span class="p">}</span>
|
|
<span class="p">.</span><span class="nc">tag-card</span><span class="w"> </span><span class="p">.</span><span class="nc">card-section</span><span class="w"> </span><span class="p">.</span><span class="nc">tag-sub-tags</span><span class="w"> </span><span class="p">{</span>
|
|
<span class="w"> </span><span class="k">position</span><span class="p">:</span><span class="w"> </span><span class="kc">relative</span><span class="p">;</span>
|
|
<span class="w"> </span><span class="k">margin-top</span><span class="p">:</span><span class="w"> </span><span class="mi">2</span><span class="kt">rem</span><span class="p">;</span>
|
|
<span class="w"> </span><span class="k">z-index</span><span class="p">:</span><span class="w"> </span><span class="mi">1</span><span class="p">;</span>
|
|
<span class="p">}</span>
|
|
<span class="p">.</span><span class="nc">tag-sub-tags</span><span class="w"> </span><span class="p">{</span>
|
|
<span class="w"> </span><span class="k">font-size</span><span class="p">:</span><span class="w"> </span><span class="mi">0</span><span class="p">;</span>
|
|
<span class="p">}</span>
|
|
<span class="p">.</span><span class="nc">tag-parent-tags</span><span class="w"> </span><span class="p">{</span>
|
|
<span class="w"> </span><span class="k">display</span><span class="p">:</span><span class="w"> </span><span class="kc">none</span><span class="p">;</span>
|
|
<span class="p">}</span>
|
|
<span class="c">/*Tag subtag exploration snipset*/</span>
|
|
<span class="p">.</span><span class="nc">tag-card</span><span class="w"> </span><span class="p">.</span><span class="nc">card-section</span><span class="w"> </span><span class="o">></span><span class="w"> </span><span class="nt">a</span><span class="w"> </span><span class="p">{</span>
|
|
<span class="w"> </span><span class="k">cursor</span><span class="p">:</span><span class="w"> </span><span class="kc">default</span><span class="p">;</span>
|
|
<span class="w"> </span><span class="k">pointer-events</span><span class="p">:</span><span class="w"> </span><span class="kc">none</span><span class="p">;</span>
|
|
<span class="p">}</span>
|
|
<span class="p">.</span><span class="nc">tag-card</span><span class="w"> </span><span class="p">.</span><span class="nc">card-section</span><span class="w"> </span><span class="o">></span><span class="w"> </span><span class="nt">hr</span><span class="w"> </span><span class="p">{</span>
|
|
<span class="w"> </span><span class="k">margin-top</span><span class="p">:</span><span class="w"> </span><span class="mi">2</span><span class="kt">rem</span><span class="p">;</span>
|
|
<span class="p">}</span>
|
|
<span class="p">.</span><span class="nc">tag-card</span><span class="w"> </span><span class="p">.</span><span class="nc">card-section</span><span class="w"> </span><span class="p">.</span><span class="nc">tag-sub-tags</span><span class="w"> </span><span class="p">{</span>
|
|
<span class="w"> </span><span class="k">position</span><span class="p">:</span><span class="w"> </span><span class="kc">absolute</span><span class="w"> </span><span class="cp">!important</span><span class="p">;</span>
|
|
<span class="w"> </span><span class="k">margin-top</span><span class="p">:</span><span class="w"> </span><span class="mi">0</span><span class="w"> </span><span class="cp">!important</span><span class="p">;</span>
|
|
<span class="w"> </span><span class="k">width</span><span class="p">:</span><span class="w"> </span><span class="mi">100</span><span class="kt">%</span><span class="p">;</span>
|
|
<span class="w"> </span><span class="k">height</span><span class="p">:</span><span class="w"> </span><span class="mi">100</span><span class="kt">%</span><span class="p">;</span>
|
|
<span class="w"> </span><span class="k">display</span><span class="p">:</span><span class="w"> </span><span class="kc">block</span><span class="p">;</span>
|
|
<span class="w"> </span><span class="k">left</span><span class="p">:</span><span class="w"> </span><span class="mi">0</span><span class="p">;</span>
|
|
<span class="w"> </span><span class="k">right</span><span class="p">:</span><span class="w"> </span><span class="mi">0</span><span class="p">;</span>
|
|
<span class="w"> </span><span class="k">top</span><span class="p">:</span><span class="w"> </span><span class="mi">0</span><span class="p">;</span>
|
|
<span class="w"> </span><span class="k">bottom</span><span class="p">:</span><span class="w"> </span><span class="mi">0</span><span class="p">;</span>
|
|
<span class="w"> </span><span class="k">padding</span><span class="p">:</span><span class="w"> </span><span class="mi">0</span><span class="p">;</span>
|
|
<span class="p">}</span>
|
|
<span class="p">.</span><span class="nc">tag-sub-tags</span><span class="p">::</span><span class="nd">before</span><span class="w"> </span><span class="p">{</span>
|
|
<span class="w"> </span><span class="k">content</span><span class="p">:</span><span class="w"> </span><span class="s2">""</span><span class="p">;</span>
|
|
<span class="w"> </span><span class="k">display</span><span class="p">:</span><span class="w"> </span><span class="kc">block</span><span class="p">;</span>
|
|
<span class="w"> </span><span class="k">background</span><span class="p">:</span><span class="w"> </span><span class="nb">url</span><span class="p">(</span><span class="s2">"https://img.icons8.com/material-outlined/24/137cbd/connection-status-off.png"</span><span class="p">)</span>
|
|
<span class="w"> </span><span class="kc">no-repeat</span><span class="p">;</span>
|
|
<span class="w"> </span><span class="k">background-size</span><span class="p">:</span><span class="w"> </span><span class="mf">1.5</span><span class="kt">rem</span><span class="w"> </span><span class="mf">1.5</span><span class="kt">rem</span><span class="p">;</span>
|
|
<span class="w"> </span><span class="k">width</span><span class="p">:</span><span class="w"> </span><span class="mf">1.5</span><span class="kt">rem</span><span class="p">;</span>
|
|
<span class="w"> </span><span class="k">height</span><span class="p">:</span><span class="w"> </span><span class="mf">1.5</span><span class="kt">rem</span><span class="p">;</span>
|
|
<span class="w"> </span><span class="k">float</span><span class="p">:</span><span class="w"> </span><span class="kc">right</span><span class="p">;</span>
|
|
<span class="w"> </span><span class="k">margin</span><span class="p">:</span><span class="w"> </span><span class="mf">0.5</span><span class="kt">rem</span><span class="w"> </span><span class="mf">0.5</span><span class="kt">rem</span><span class="w"> </span><span class="mi">0</span><span class="w"> </span><span class="mi">0</span><span class="p">;</span>
|
|
<span class="p">}</span>
|
|
<span class="p">.</span><span class="nc">tag-sub-tags</span><span class="w"> </span><span class="o">></span><span class="w"> </span><span class="nt">a</span><span class="w"> </span><span class="p">{</span>
|
|
<span class="w"> </span><span class="k">width</span><span class="p">:</span><span class="w"> </span><span class="mi">100</span><span class="kt">%</span><span class="p">;</span>
|
|
<span class="w"> </span><span class="k">height</span><span class="p">:</span><span class="w"> </span><span class="mi">100</span><span class="kt">%</span><span class="p">;</span>
|
|
<span class="w"> </span><span class="k">display</span><span class="p">:</span><span class="w"> </span><span class="kc">block</span><span class="p">;</span>
|
|
<span class="p">}</span>
|
|
|
|
<span class="p">.</span><span class="nc">tag-card</span><span class="w"> </span><span class="p">.</span><span class="nc">btn-group</span><span class="w"> </span><span class="nt">a</span><span class="w"> </span><span class="p">{</span>
|
|
<span class="w"> </span><span class="k">z-index</span><span class="p">:</span><span class="w"> </span><span class="mi">10</span><span class="p">;</span>
|
|
<span class="p">}</span>
|
|
<span class="p">.</span><span class="nc">tag-sub-tags</span><span class="w"> </span><span class="p">{</span>
|
|
<span class="w"> </span><span class="k">font-size</span><span class="p">:</span><span class="w"> </span><span class="mi">0</span><span class="p">;</span>
|
|
<span class="p">}</span>
|
|
<span class="p">.</span><span class="nc">tag-parent-tags</span><span class="w"> </span><span class="p">{</span>
|
|
<span class="w"> </span><span class="k">display</span><span class="p">:</span><span class="w"> </span><span class="kc">none</span><span class="p">;</span>
|
|
<span class="p">}</span>
|
|
</code></pre></div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<h2 id="global">Global<a class="headerlink" href="#global" title="Permanent link">¶</a></h2>
|
|
<h3 id="change-the-order-of-navigation-bar-buttons">Change the order of navigation bar buttons<a class="headerlink" href="#change-the-order-of-navigation-bar-buttons" title="Permanent link">¶</a></h3>
|
|
<div class="tabbed-set tabbed-alternate" data-tabs="29:4"><input checked="checked" id="description_28" name="__tabbed_29" type="radio"><input id="author_28" name="__tabbed_29" type="radio"><input id="screenshots_28" name="__tabbed_29" type="radio"><input id="css-code_28" name="__tabbed_29" type="radio"><div class="tabbed-labels"><label for="description_28">Description</label><label for="author_28">Author</label><label for="screenshots_28">Screenshots</label><label for="css-code_28">CSS code</label></div>
|
|
<div class="tabbed-content">
|
|
<div class="tabbed-block">
|
|
<p>Use <code>order</code> values below 0 to move specific buttons to the left of the non-ordered buttons, and values above 1 to move them to the right of the non-ordered buttons.</p>
|
|
</div>
|
|
<div class="tabbed-block"></div>
|
|
<div class="tabbed-block">
|
|
<p><a class="glightbox" data-type="image" data-width="auto" data-height="auto" href="/assets/user-interface-ui/navigation-before.png" data-desc-position="bottom"><img alt="Navigation before" loading="lazy" src="/assets/user-interface-ui/navigation-before.png"></a>
|
|
<a class="glightbox" data-type="image" data-width="auto" data-height="auto" href="/assets/user-interface-ui/navigation-after.png" data-desc-position="bottom"><img alt="Navigation after" loading="lazy" src="/assets/user-interface-ui/navigation-after.png"></a></p>
|
|
</div>
|
|
<div class="tabbed-block">
|
|
<div class="highlight"><pre><span></span><code><span class="c">/* [Global changes] Change the order of navigation bar buttons */</span>
|
|
|
|
<span class="nt">nav</span><span class="w"> </span><span class="p">.</span><span class="nc">navbar-nav</span><span class="p">:</span><span class="nd">first-child</span><span class="w"> </span><span class="p">{</span>
|
|
<span class="k">display</span><span class="p">:</span><span class="w"> </span><span class="kc">flex</span><span class="p">;</span>
|
|
<span class="k">flex-direction</span><span class="p">:</span><span class="w"> </span><span class="kc">row</span><span class="p">;</span>
|
|
<span class="p">}</span>
|
|
<span class="nt">div</span><span class="p">.</span><span class="nc">nav-link</span><span class="o">[</span><span class="nt">data-rb-event-key</span><span class="o">=</span><span class="s2">"/tags"</span><span class="o">]</span><span class="w"> </span><span class="p">{</span>
|
|
<span class="k">order</span><span class="p">:</span><span class="w"> </span><span class="mi">-2</span><span class="p">;</span>
|
|
<span class="p">}</span>
|
|
<span class="nt">div</span><span class="p">.</span><span class="nc">nav-link</span><span class="o">[</span><span class="nt">data-rb-event-key</span><span class="o">=</span><span class="s2">"/groups"</span><span class="o">]</span><span class="w"> </span><span class="p">{</span>
|
|
<span class="k">order</span><span class="p">:</span><span class="w"> </span><span class="mi">-1</span><span class="p">;</span>
|
|
<span class="p">}</span>
|
|
<span class="nt">div</span><span class="p">.</span><span class="nc">nav-link</span><span class="o">[</span><span class="nt">data-rb-event-key</span><span class="o">=</span><span class="s2">"/scenes"</span><span class="o">]</span><span class="w"> </span><span class="p">{</span>
|
|
<span class="k">order</span><span class="p">:</span><span class="w"> </span><span class="mi">1</span><span class="p">;</span>
|
|
<span class="p">}</span>
|
|
</code></pre></div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<h3 id="hide-the-donate-button">Hide the Donate button<a class="headerlink" href="#hide-the-donate-button" title="Permanent link">¶</a></h3>
|
|
<div class="tabbed-set tabbed-alternate" data-tabs="30:4"><input checked="checked" id="description_29" name="__tabbed_30" type="radio"><input id="author_29" name="__tabbed_30" type="radio"><input id="screenshots_29" name="__tabbed_30" type="radio"><input id="css-code_29" name="__tabbed_30" type="radio"><div class="tabbed-labels"><label for="description_29">Description</label><label for="author_29">Author</label><label for="screenshots_29">Screenshots</label><label for="css-code_29">CSS code</label></div>
|
|
<div class="tabbed-content">
|
|
<div class="tabbed-block">
|
|
<p>Hide the Donate button.</p>
|
|
</div>
|
|
<div class="tabbed-block"></div>
|
|
<div class="tabbed-block"></div>
|
|
<div class="tabbed-block">
|
|
<div class="highlight"><pre><span></span><code><span class="c">/* [Global changes] Hide the Donate button */</span>
|
|
|
|
<span class="p">.</span><span class="nc">btn-primary</span><span class="p">.</span><span class="nc">btn</span><span class="p">.</span><span class="nc">donate</span><span class="p">.</span><span class="nc">minimal</span><span class="w"> </span><span class="p">{</span>
|
|
<span class="k">display</span><span class="p">:</span><span class="w"> </span><span class="kc">none</span><span class="p">;</span>
|
|
<span class="p">}</span>
|
|
</code></pre></div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<h3 id="blur-nsfw-images">Blur NSFW images<a class="headerlink" href="#blur-nsfw-images" title="Permanent link">¶</a></h3>
|
|
<div class="tabbed-set tabbed-alternate" data-tabs="31:4"><input checked="checked" id="description_30" name="__tabbed_31" type="radio"><input id="author_30" name="__tabbed_31" type="radio"><input id="screenshots_30" name="__tabbed_31" type="radio"><input id="css-code_30" name="__tabbed_31" type="radio"><div class="tabbed-labels"><label for="description_30">Description</label><label for="author_30">Author</label><label for="screenshots_30">Screenshots</label><label for="css-code_30">CSS code</label></div>
|
|
<div class="tabbed-content">
|
|
<div class="tabbed-block">
|
|
<p>Use for when working on stash but don't want to expose NSFW images and text. May not be exhaustive.</p>
|
|
</div>
|
|
<div class="tabbed-block"></div>
|
|
<div class="tabbed-block"></div>
|
|
<div class="tabbed-block">
|
|
<div class="highlight"><pre><span></span><code><span class="c">/* [Global changes] Blur NSFW images */</span>
|
|
|
|
<span class="p">.</span><span class="nc">scene-card-preview-video</span><span class="o">,</span>
|
|
<span class="p">.</span><span class="nc">scene-card-preview-image</span><span class="o">,</span>
|
|
<span class="p">.</span><span class="nc">image-card-preview-image</span><span class="o">,</span>
|
|
<span class="p">.</span><span class="nc">image-thumbnail</span><span class="o">,</span>
|
|
<span class="p">.</span><span class="nc">gallery-card-image</span><span class="o">,</span>
|
|
<span class="p">.</span><span class="nc">performer-card-image</span><span class="o">,</span>
|
|
<span class="p">.</span><span class="nc">tag-card-image</span><span class="o">,</span>
|
|
<span class="nt">img</span><span class="p">.</span><span class="nc">performer</span><span class="o">,</span>
|
|
<span class="p">.</span><span class="nc">group-card-image</span><span class="o">,</span>
|
|
<span class="p">.</span><span class="nc">gallery</span><span class="w"> </span><span class="p">.</span><span class="nc">flexbin</span><span class="w"> </span><span class="nt">img</span><span class="o">,</span>
|
|
<span class="p">.</span><span class="nc">wall-item-media</span><span class="o">,</span>
|
|
<span class="p">.</span><span class="nc">scene-studio-overlay</span><span class="w"> </span><span class="p">.</span><span class="nc">image-thumbnail</span><span class="o">,</span>
|
|
<span class="p">.</span><span class="nc">image-card-preview-image</span><span class="o">,</span>
|
|
<span class="p">#</span><span class="nn">scene-details-container</span><span class="w"> </span><span class="p">.</span><span class="nc">text-input</span><span class="o">,</span>
|
|
<span class="p">#</span><span class="nn">scene-details-container</span><span class="w"> </span><span class="p">.</span><span class="nc">scene-header</span><span class="o">,</span>
|
|
<span class="p">#</span><span class="nn">scene-details-container</span><span class="w"> </span><span class="p">.</span><span class="nc">react-select__single-value</span><span class="o">,</span>
|
|
<span class="p">.</span><span class="nc">scene-details</span><span class="w"> </span><span class="p">.</span><span class="nc">pre</span><span class="o">,</span>
|
|
<span class="p">#</span><span class="nn">scene-tabs-tabpane-scene-file-info-panel</span><span class="w"> </span><span class="nt">span</span><span class="p">.</span><span class="nc">col-8</span><span class="p">.</span><span class="nc">text-truncate</span><span class="w"> </span><span class="o">></span><span class="w"> </span><span class="nt">a</span><span class="o">,</span>
|
|
<span class="p">.</span><span class="nc">gallery</span><span class="w"> </span><span class="p">.</span><span class="nc">flexbin</span><span class="w"> </span><span class="nt">img</span><span class="o">,</span>
|
|
<span class="p">.</span><span class="nc">group-details</span><span class="w"> </span><span class="p">.</span><span class="nc">logo</span><span class="w"> </span><span class="p">{</span>
|
|
<span class="k">filter</span><span class="p">:</span><span class="w"> </span><span class="nb">blur</span><span class="p">(</span><span class="mi">12</span><span class="kt">px</span><span class="p">);</span>
|
|
<span class="p">}</span>
|
|
|
|
<span class="p">.</span><span class="nc">scene-card-video</span><span class="w"> </span><span class="p">{</span>
|
|
<span class="k">filter</span><span class="p">:</span><span class="w"> </span><span class="nb">blur</span><span class="p">(</span><span class="mi">13</span><span class="kt">px</span><span class="p">);</span>
|
|
<span class="p">}</span>
|
|
|
|
<span class="p">.</span><span class="nc">jw-video</span><span class="o">,</span>
|
|
<span class="p">.</span><span class="nc">jw-preview</span><span class="o">,</span>
|
|
<span class="p">.</span><span class="nc">jw-flag-floating</span><span class="o">,</span>
|
|
<span class="p">.</span><span class="nc">image-container</span><span class="o">,</span>
|
|
<span class="p">.</span><span class="nc">studio-logo</span><span class="o">,</span>
|
|
<span class="p">.</span><span class="nc">scene-cover</span><span class="w"> </span><span class="p">{</span>
|
|
<span class="k">filter</span><span class="p">:</span><span class="w"> </span><span class="nb">blur</span><span class="p">(</span><span class="mi">20</span><span class="kt">px</span><span class="p">);</span>
|
|
<span class="p">}</span>
|
|
|
|
<span class="p">.</span><span class="nc">group-card</span><span class="w"> </span><span class="p">.</span><span class="nc">text-truncate</span><span class="o">,</span>
|
|
<span class="p">.</span><span class="nc">scene-card</span><span class="w"> </span><span class="p">.</span><span class="nc">card-section</span><span class="w"> </span><span class="p">{</span>
|
|
<span class="k">filter</span><span class="p">:</span><span class="w"> </span><span class="nb">blur</span><span class="p">(</span><span class="mi">4</span><span class="kt">px</span><span class="p">);</span>
|
|
<span class="p">}</span>
|
|
</code></pre></div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<h3 id="blur-nsfw-images-and-unblur-on-mouse-over">Blur NSFW images and unblur on mouse over<a class="headerlink" href="#blur-nsfw-images-and-unblur-on-mouse-over" title="Permanent link">¶</a></h3>
|
|
<div class="tabbed-set tabbed-alternate" data-tabs="32:4"><input checked="checked" id="description_31" name="__tabbed_32" type="radio"><input id="author_31" name="__tabbed_32" type="radio"><input id="screenshots_31" name="__tabbed_32" type="radio"><input id="css-code_31" name="__tabbed_32" type="radio"><div class="tabbed-labels"><label for="description_31">Description</label><label for="author_31">Author</label><label for="screenshots_31">Screenshots</label><label for="css-code_31">CSS code</label></div>
|
|
<div class="tabbed-content">
|
|
<div class="tabbed-block">
|
|
<p>Blur NSFW images and unblur on mouse over.</p>
|
|
</div>
|
|
<div class="tabbed-block">
|
|
<p>fl0w#9497</p>
|
|
</div>
|
|
<div class="tabbed-block">
|
|
<p><a class="glightbox" data-type="image" data-width="auto" data-height="auto" href="/assets/user-interface-ui/blur2.png" data-desc-position="bottom"><img alt="" loading="lazy" src="/assets/user-interface-ui/blur2.png"></a></p>
|
|
</div>
|
|
<div class="tabbed-block">
|
|
<div class="highlight"><pre><span></span><code><span class="c">/* [Global changes] Blur NSFW images and unblur on mouse over */</span>
|
|
<span class="c">/* === MORE BLUR === */</span>
|
|
<span class="c">/* scene */</span>
|
|
<span class="p">.</span><span class="nc">scene-card-preview</span><span class="o">,</span>
|
|
<span class="p">.</span><span class="nc">vjs-poster</span><span class="o">,</span>
|
|
<span class="nt">video</span><span class="o">,</span>
|
|
<span class="p">.</span><span class="nc">scene-cover</span><span class="o">,</span>
|
|
<span class="p">.</span><span class="nc">scrubber-item</span><span class="o">,</span>
|
|
|
|
<span class="c">/* image */</span>
|
|
<span class="p">.</span><span class="nc">image-card-preview</span><span class="o">,</span>
|
|
<span class="p">.</span><span class="nc">image-image</span><span class="o">,</span>
|
|
<span class="p">.</span><span class="nc">gallery-image</span><span class="o">,</span>
|
|
|
|
<span class="c">/* group */</span>
|
|
<span class="p">.</span><span class="nc">group-card-image</span><span class="o">,</span>
|
|
<span class="p">.</span><span class="nc">group-images</span><span class="o">,</span>
|
|
|
|
<span class="c">/* gallery */</span>
|
|
<span class="p">.</span><span class="nc">gallery-card-image</span><span class="o">,</span>
|
|
<span class="nt">table</span><span class="w"> </span><span class="o">></span><span class="w"> </span><span class="nt">tbody</span><span class="w"> </span><span class="o">></span><span class="w"> </span><span class="nt">tr</span><span class="w"> </span><span class="o">></span><span class="w"> </span><span class="nt">td</span><span class="w"> </span><span class="o">></span><span class="w"> </span><span class="nt">a</span><span class="w"> </span><span class="o">></span><span class="w"> </span><span class="nt">img</span><span class="p">.</span><span class="nc">w-100</span><span class="o">,</span>
|
|
|
|
<span class="c">/* performer */</span>
|
|
<span class="p">.</span><span class="nc">performer-card-image</span><span class="o">,</span>
|
|
<span class="nt">img</span><span class="p">.</span><span class="nc">performer</span><span class="o">,</span>
|
|
|
|
<span class="c">/* studio */</span>
|
|
<span class="p">.</span><span class="nc">studio-card-image</span><span class="o">,</span>
|
|
|
|
<span class="c">/* tag */</span>
|
|
<span class="p">.</span><span class="nc">tag-card-image</span>
|
|
|
|
<span class="p">{</span>
|
|
<span class="k">filter</span><span class="p">:</span><span class="w"> </span><span class="nb">blur</span><span class="p">(</span><span class="mi">30</span><span class="kt">px</span><span class="p">);</span>
|
|
<span class="p">}</span>
|
|
|
|
<span class="c">/* === LESS BLUR === */</span>
|
|
<span class="c">/* common */</span>
|
|
<span class="p">.</span><span class="nc">card-section-title</span><span class="o">,</span>
|
|
|
|
<span class="c">/* scene */</span>
|
|
<span class="p">.</span><span class="nc">scene-studio-overlay</span><span class="o">,</span>
|
|
<span class="p">.</span><span class="nc">scene-header</span><span class="w"> </span><span class="o">></span><span class="w"> </span><span class="nt">h3</span><span class="o">,</span>
|
|
<span class="nt">h3</span><span class="p">.</span><span class="nc">scene-header</span><span class="o">,</span>
|
|
<span class="p">.</span><span class="nc">studio-logo</span><span class="o">,</span>
|
|
<span class="p">.</span><span class="nc">image-thumbnail</span><span class="o">,</span>
|
|
|
|
<span class="c">/* image */</span>
|
|
<span class="nt">h3</span><span class="p">.</span><span class="nc">image-header</span><span class="o">,</span>
|
|
|
|
<span class="c">/* group */</span>
|
|
<span class="p">.</span><span class="nc">group-details</span><span class="w"> </span><span class="o">></span><span class="w"> </span><span class="nt">div</span><span class="w"> </span><span class="o">></span><span class="w"> </span><span class="nt">h2</span><span class="o">,</span>
|
|
|
|
<span class="c">/* gallery */</span>
|
|
<span class="nt">h3</span><span class="p">.</span><span class="nc">gallery-header</span><span class="o">,</span>
|
|
|
|
<span class="c">/* studio */</span>
|
|
<span class="p">.</span><span class="nc">studio-details</span><span class="w"> </span><span class="p">.</span><span class="nc">logo</span><span class="o">,</span>
|
|
<span class="p">.</span><span class="nc">studio-details</span><span class="w"> </span><span class="o">></span><span class="w"> </span><span class="nt">div</span><span class="w"> </span><span class="o">></span><span class="w"> </span><span class="nt">h2</span><span class="o">,</span>
|
|
|
|
<span class="c">/* tag */</span>
|
|
<span class="p">.</span><span class="nc">logo-container</span><span class="w"> </span><span class="o">></span><span class="w"> </span><span class="p">.</span><span class="nc">logo</span><span class="o">,</span>
|
|
<span class="p">.</span><span class="nc">logo-container</span><span class="w"> </span><span class="o">></span><span class="w"> </span><span class="nt">h2</span>
|
|
|
|
<span class="p">{</span>
|
|
<span class="k">filter</span><span class="p">:</span><span class="w"> </span><span class="nb">blur</span><span class="p">(</span><span class="mi">2</span><span class="kt">px</span><span class="p">);</span>
|
|
<span class="p">}</span>
|
|
|
|
<span class="c">/* === UNBLUR ON HOVER === */</span>
|
|
<span class="c">/* common */</span>
|
|
<span class="p">.</span><span class="nc">thumbnail-section</span><span class="p">:</span><span class="nd">hover</span><span class="w"> </span><span class="o">*,</span>
|
|
<span class="p">.</span><span class="nc">card</span><span class="p">:</span><span class="nd">hover</span><span class="w"> </span><span class="p">.</span><span class="nc">card-section-title</span><span class="o">,</span>
|
|
|
|
<span class="c">/* scene */</span>
|
|
<span class="p">.</span><span class="nc">card</span><span class="p">:</span><span class="nd">hover</span><span class="w"> </span><span class="p">.</span><span class="nc">scene-studio-overlay</span><span class="o">,</span>
|
|
<span class="p">.</span><span class="nc">video-js</span><span class="p">:</span><span class="nd">hover</span><span class="w"> </span><span class="p">.</span><span class="nc">vjs-poster</span><span class="o">,</span>
|
|
<span class="nt">video</span><span class="p">:</span><span class="nd">hover</span><span class="o">,</span>
|
|
<span class="p">.</span><span class="nc">scene-header</span><span class="p">:</span><span class="nd">hover</span><span class="w"> </span><span class="o">></span><span class="w"> </span><span class="nt">h3</span><span class="o">,</span>
|
|
<span class="nt">div</span><span class="p">:</span><span class="nd">hover</span><span class="w"> </span><span class="o">></span><span class="w"> </span><span class="p">.</span><span class="nc">scene-header</span><span class="o">,</span>
|
|
<span class="p">.</span><span class="nc">studio-logo</span><span class="p">:</span><span class="nd">hover</span><span class="o">,</span>
|
|
<span class="p">.</span><span class="nc">scene-cover</span><span class="p">:</span><span class="nd">hover</span><span class="o">,</span>
|
|
<span class="p">.</span><span class="nc">image-thumbnail</span><span class="p">:</span><span class="nd">hover</span><span class="o">,</span>
|
|
<span class="p">.</span><span class="nc">scene-card-preview</span><span class="p">:</span><span class="nd">hover</span><span class="o">,</span>
|
|
<span class="p">.</span><span class="nc">scrubber-item</span><span class="p">:</span><span class="nd">hover</span><span class="o">,</span>
|
|
|
|
<span class="c">/* image */</span>
|
|
<span class="p">.</span><span class="nc">image-image</span><span class="p">:</span><span class="nd">hover</span><span class="o">,</span>
|
|
<span class="nt">div</span><span class="p">:</span><span class="nd">hover</span><span class="w"> </span><span class="o">></span><span class="w"> </span><span class="p">.</span><span class="nc">image-header</span><span class="o">,</span>
|
|
<span class="p">.</span><span class="nc">gallery-image</span><span class="p">:</span><span class="nd">hover</span><span class="o">,</span>
|
|
|
|
<span class="c">/* group */</span>
|
|
<span class="p">.</span><span class="nc">group-images</span><span class="p">:</span><span class="nd">hover</span><span class="o">,</span>
|
|
<span class="p">.</span><span class="nc">group-details</span><span class="w"> </span><span class="o">></span><span class="w"> </span><span class="nt">div</span><span class="w"> </span><span class="o">></span><span class="w"> </span><span class="nt">h2</span><span class="p">:</span><span class="nd">hover</span><span class="o">,</span>
|
|
|
|
<span class="c">/* gallery */</span>
|
|
<span class="nt">div</span><span class="p">:</span><span class="nd">hover</span><span class="w"> </span><span class="o">></span><span class="w"> </span><span class="p">.</span><span class="nc">gallery-header</span><span class="o">,</span>
|
|
<span class="nt">table</span><span class="w"> </span><span class="o">></span><span class="w"> </span><span class="nt">tbody</span><span class="w"> </span><span class="o">></span><span class="w"> </span><span class="nt">tr</span><span class="w"> </span><span class="o">></span><span class="w"> </span><span class="nt">td</span><span class="p">:</span><span class="nd">hover</span><span class="w"> </span><span class="o">></span><span class="w"> </span><span class="nt">a</span><span class="w"> </span><span class="o">></span><span class="w"> </span><span class="nt">img</span><span class="p">.</span><span class="nc">w-100</span><span class="o">,</span>
|
|
|
|
<span class="c">/* performer */</span>
|
|
<span class="nt">img</span><span class="p">.</span><span class="nc">performer</span><span class="p">:</span><span class="nd">hover</span><span class="o">,</span>
|
|
|
|
<span class="c">/* studio */</span><span class="w"> </span>
|
|
<span class="p">.</span><span class="nc">studio-details</span><span class="w"> </span><span class="p">.</span><span class="nc">logo</span><span class="p">:</span><span class="nd">hover</span><span class="o">,</span>
|
|
<span class="p">.</span><span class="nc">studio-details</span><span class="p">:</span><span class="nd">hover</span><span class="w"> </span><span class="o">></span><span class="w"> </span><span class="nt">div</span><span class="w"> </span><span class="o">></span><span class="w"> </span><span class="nt">h2</span><span class="o">,</span>
|
|
|
|
<span class="c">/* tag */</span>
|
|
<span class="p">.</span><span class="nc">logo-container</span><span class="w"> </span><span class="o">></span><span class="w"> </span><span class="p">.</span><span class="nc">logo</span><span class="p">:</span><span class="nd">hover</span><span class="o">,</span>
|
|
<span class="p">.</span><span class="nc">logo-container</span><span class="p">:</span><span class="nd">hover</span><span class="w"> </span><span class="o">></span><span class="w"> </span><span class="nt">h2</span>
|
|
<span class="p">{</span>
|
|
<span class="k">filter</span><span class="p">:</span><span class="w"> </span><span class="nb">blur</span><span class="p">(</span><span class="mi">0</span><span class="kt">px</span><span class="p">);</span>
|
|
<span class="p">}</span>
|
|
</code></pre></div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<h3 id="hide-0-count-badges">Hide 0 count badges<a class="headerlink" href="#hide-0-count-badges" title="Permanent link">¶</a></h3>
|
|
<div class="tabbed-set tabbed-alternate" data-tabs="33:4"><input checked="checked" id="description_32" name="__tabbed_33" type="radio"><input id="author_32" name="__tabbed_33" type="radio"><input id="screenshots_32" name="__tabbed_33" type="radio"><input id="css-code_32" name="__tabbed_33" type="radio"><div class="tabbed-labels"><label for="description_32">Description</label><label for="author_32">Author</label><label for="screenshots_32">Screenshots</label><label for="css-code_32">CSS code</label></div>
|
|
<div class="tabbed-content">
|
|
<div class="tabbed-block">
|
|
<p>Hide 0 count badges.</p>
|
|
</div>
|
|
<div class="tabbed-block">
|
|
<p>echo6ix</p>
|
|
</div>
|
|
<div class="tabbed-block">
|
|
<p><a class="glightbox" data-type="image" data-width="auto" data-height="auto" href="/assets/user-interface-ui/hide_0_count_badges.png" data-desc-position="bottom"><img alt="" loading="lazy" src="/assets/user-interface-ui/hide_0_count_badges.png"></a></p>
|
|
</div>
|
|
<div class="tabbed-block">
|
|
<div class="highlight"><pre><span></span><code><span class="c">/* [Global changes] Hide 0 count badges */</span>
|
|
<span class="nt">span</span><span class="p">.</span><span class="nc">badge</span><span class="o">[</span><span class="nt">data-value</span><span class="o">=</span><span class="s2">"0"</span><span class="o">]</span><span class="w"> </span><span class="p">{</span>
|
|
<span class="w"> </span><span class="k">display</span><span class="p">:</span><span class="w"> </span><span class="kc">none</span><span class="p">;</span>
|
|
<span class="p">}</span>
|
|
</code></pre></div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<h3 id="border-around-cards-activated-with-checkbox-selection">Border around cards activated with checkbox selection<a class="headerlink" href="#border-around-cards-activated-with-checkbox-selection" title="Permanent link">¶</a></h3>
|
|
<div class="tabbed-set tabbed-alternate" data-tabs="34:4"><input checked="checked" id="description_33" name="__tabbed_34" type="radio"><input id="author_33" name="__tabbed_34" type="radio"><input id="screenshots_33" name="__tabbed_34" type="radio"><input id="css-code_33" name="__tabbed_34" type="radio"><div class="tabbed-labels"><label for="description_33">Description</label><label for="author_33">Author</label><label for="screenshots_33">Screenshots</label><label for="css-code_33">CSS code</label></div>
|
|
<div class="tabbed-content">
|
|
<div class="tabbed-block">
|
|
<p>Add a noticeable border around any cards that have been selected using the checkbox selection. Border color uses Stash's <code>--primary</code> color variable to maintain consistency with any theme that uses Stash's color variables.</p>
|
|
</div>
|
|
<div class="tabbed-block">
|
|
<p>echo6ix</p>
|
|
</div>
|
|
<div class="tabbed-block">
|
|
<p><a class="glightbox" data-type="image" data-width="auto" data-height="auto" href="/assets/user-interface-ui/Border-around-cards.png" data-desc-position="bottom"><img alt="" loading="lazy" src="/assets/user-interface-ui/Border-around-cards.png"></a></p>
|
|
</div>
|
|
<div class="tabbed-block">
|
|
<div class="highlight"><pre><span></span><code><span class="c">/* [Global changes] Modify card when checkbox is selected */</span>
|
|
<span class="p">.</span><span class="nc">grid-card</span><span class="p">.</span><span class="nc">card</span><span class="p">:</span><span class="nd">has</span><span class="o">(</span><span class="nt">input</span><span class="p">:</span><span class="nd">checked</span><span class="o">)</span><span class="w"> </span><span class="p">{</span>
|
|
<span class="k">box-shadow</span><span class="p">:</span><span class="w"> </span><span class="mi">0</span><span class="w"> </span><span class="mi">0</span><span class="w"> </span><span class="mi">0</span><span class="w"> </span><span class="mi">1</span><span class="kt">px</span><span class="w"> </span><span class="nf">var</span><span class="p">(</span><span class="nv">--primary</span><span class="p">,</span><span class="nb">rgba</span><span class="p">(</span><span class="mi">255</span><span class="p">,</span><span class="w"> </span><span class="mi">255</span><span class="p">,</span><span class="w"> </span><span class="mi">255</span><span class="p">,</span><span class="w"> </span><span class="mf">0.30</span><span class="p">));</span>
|
|
<span class="p">}</span>
|
|
</code></pre></div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<aside class="md-source-file">
|
|
|
|
|
|
<span class="md-source-file__fact">
|
|
<span class="md-icon" title="Last update">
|
|
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M21 13.1c-.1 0-.3.1-.4.2l-1 1 2.1 2.1 1-1c.2-.2.2-.6 0-.8l-1.3-1.3c-.1-.1-.2-.2-.4-.2m-1.9 1.8-6.1 6V23h2.1l6.1-6.1zM12.5 7v5.2l4 2.4-1 1L11 13V7zM11 21.9c-5.1-.5-9-4.8-9-9.9C2 6.5 6.5 2 12 2c5.3 0 9.6 4.1 10 9.3-.3-.1-.6-.2-1-.2s-.7.1-1 .2C19.6 7.2 16.2 4 12 4c-4.4 0-8 3.6-8 8 0 4.1 3.1 7.5 7.1 7.9l-.1.2z"></path></svg>
|
|
</span>
|
|
<span class="git-revision-date-localized-plugin git-revision-date-localized-plugin-date" title="November 16, 2024 17:26:49 UTC">November 16, 2024</span>
|
|
</span>
|
|
|
|
|
|
|
|
|
|
<span class="md-source-file__fact">
|
|
<span class="md-icon" title="Created">
|
|
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M14.47 15.08 11 13V7h1.5v5.25l3.08 1.83c-.41.28-.79.62-1.11 1m-1.39 4.84c-.36.05-.71.08-1.08.08-4.42 0-8-3.58-8-8s3.58-8 8-8 8 3.58 8 8c0 .37-.03.72-.08 1.08.69.1 1.33.32 1.92.64.1-.56.16-1.13.16-1.72 0-5.5-4.5-10-10-10S2 6.5 2 12s4.47 10 10 10c.59 0 1.16-.06 1.72-.16-.32-.59-.54-1.23-.64-1.92M18 15v3h-3v2h3v3h2v-3h3v-2h-3v-3z"></path></svg>
|
|
</span>
|
|
<span class="git-revision-date-localized-plugin git-revision-date-localized-plugin-date" title="November 16, 2024 17:26:49 UTC">November 16, 2024</span>
|
|
</span>
|
|
|
|
|
|
|
|
|
|
</aside>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
</article>
|
|
</div>
|
|
|
|
|
|
<script>var target=document.getElementById(location.hash.slice(1));target&&target.name&&(target.checked=target.name.startsWith("__tabbed_"))</script>
|
|
</div>
|
|
|
|
<button type="button" class="md-top md-icon" data-md-component="top" hidden>
|
|
|
|
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M13 20h-2V8l-5.5 5.5-1.42-1.42L12 4.16l7.92 7.92-1.42 1.42L13 8z"></path></svg>
|
|
Back to top
|
|
</button>
|
|
|
|
</main>
|
|
|
|
<footer class="md-footer">
|
|
|
|
<div class="md-footer-meta md-typeset">
|
|
<div class="md-footer-meta__inner md-grid">
|
|
<div class="md-copyright">
|
|
|
|
<div class="md-copyright__highlight">
|
|
Copyright © 2017 - 2024 stashapp contributors
|
|
</div>
|
|
|
|
|
|
Made with
|
|
<a href="https://squidfunk.github.io/mkdocs-material/" target="_blank" rel="noopener">
|
|
Material for MkDocs
|
|
</a>
|
|
|
|
</div>
|
|
|
|
|
|
<div class="md-social">
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<a href="https://opencollective.com/stashapp" target="_blank" rel="noopener" title="opencollective.com" class="md-social__link">
|
|
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M12 0C5.373 0 0 5.373 0 12s5.373 12 12 12c2.54 0 4.894-.79 6.834-2.135l-3.107-3.109a7.715 7.715 0 1 1 0-13.512l3.107-3.109A11.94 11.94 0 0 0 12 0m9.865 5.166-3.109 3.107A7.7 7.7 0 0 1 19.715 12a7.7 7.7 0 0 1-.959 3.727l3.109 3.107A11.94 11.94 0 0 0 24 12c0-2.54-.79-4.894-2.135-6.834"></path></svg>
|
|
</a>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<a href="https://github.com/stashapp" target="_blank" rel="noopener" title="github.com" class="md-social__link">
|
|
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M12 .297c-6.63 0-12 5.373-12 12 0 5.303 3.438 9.8 8.205 11.385.6.113.82-.258.82-.577 0-.285-.01-1.04-.015-2.04-3.338.724-4.042-1.61-4.042-1.61C4.422 18.07 3.633 17.7 3.633 17.7c-1.087-.744.084-.729.084-.729 1.205.084 1.838 1.236 1.838 1.236 1.07 1.835 2.809 1.305 3.495.998.108-.776.417-1.305.76-1.605-2.665-.3-5.466-1.332-5.466-5.93 0-1.31.465-2.38 1.235-3.22-.135-.303-.54-1.523.105-3.176 0 0 1.005-.322 3.3 1.23.96-.267 1.98-.399 3-.405 1.02.006 2.04.138 3 .405 2.28-1.552 3.285-1.23 3.285-1.23.645 1.653.24 2.873.12 3.176.765.84 1.23 1.91 1.23 3.22 0 4.61-2.805 5.625-5.475 5.92.42.36.81 1.096.81 2.22 0 1.606-.015 2.896-.015 3.286 0 .315.21.69.825.57C20.565 22.092 24 17.592 24 12.297c0-6.627-5.373-12-12-12"></path></svg>
|
|
</a>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<a href="https://hub.docker.com/r/stashapp/stash" target="_blank" rel="noopener" title="hub.docker.com" class="md-social__link">
|
|
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M13.983 11.078h2.119a.186.186 0 0 0 .186-.185V9.006a.186.186 0 0 0-.186-.186h-2.119a.185.185 0 0 0-.185.185v1.888c0 .102.083.185.185.185m-2.954-5.43h2.118a.186.186 0 0 0 .186-.186V3.574a.186.186 0 0 0-.186-.185h-2.118a.185.185 0 0 0-.185.185v1.888c0 .102.082.185.185.185m0 2.716h2.118a.187.187 0 0 0 .186-.186V6.29a.186.186 0 0 0-.186-.185h-2.118a.185.185 0 0 0-.185.185v1.887c0 .102.082.185.185.186m-2.93 0h2.12a.186.186 0 0 0 .184-.186V6.29a.185.185 0 0 0-.185-.185H8.1a.185.185 0 0 0-.185.185v1.887c0 .102.083.185.185.186m-2.964 0h2.119a.186.186 0 0 0 .185-.186V6.29a.185.185 0 0 0-.185-.185H5.136a.186.186 0 0 0-.186.185v1.887c0 .102.084.185.186.186m5.893 2.715h2.118a.186.186 0 0 0 .186-.185V9.006a.186.186 0 0 0-.186-.186h-2.118a.185.185 0 0 0-.185.185v1.888c0 .102.082.185.185.185m-2.93 0h2.12a.185.185 0 0 0 .184-.185V9.006a.185.185 0 0 0-.184-.186h-2.12a.185.185 0 0 0-.184.185v1.888c0 .102.083.185.185.185m-2.964 0h2.119a.185.185 0 0 0 .185-.185V9.006a.185.185 0 0 0-.184-.186h-2.12a.186.186 0 0 0-.186.186v1.887c0 .102.084.185.186.185m-2.92 0h2.12a.185.185 0 0 0 .184-.185V9.006a.185.185 0 0 0-.184-.186h-2.12a.185.185 0 0 0-.184.185v1.888c0 .102.082.185.185.185M23.763 9.89c-.065-.051-.672-.51-1.954-.51q-.508.001-1.01.087c-.248-1.7-1.653-2.53-1.716-2.566l-.344-.199-.226.327c-.284.438-.49.922-.612 1.43-.23.97-.09 1.882.403 2.661-.595.332-1.55.413-1.744.42H.751a.75.75 0 0 0-.75.748 11.4 11.4 0 0 0 .692 4.062c.545 1.428 1.355 2.48 2.41 3.124 1.18.723 3.1 1.137 5.275 1.137a15.7 15.7 0 0 0 2.93-.266 12.3 12.3 0 0 0 3.823-1.389 10.5 10.5 0 0 0 2.61-2.136c1.252-1.418 1.998-2.997 2.553-4.4h.221c1.372 0 2.215-.549 2.68-1.009.309-.293.55-.65.707-1.046l.098-.288Z"></path></svg>
|
|
</a>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<a href="https://discord.gg/frQ7qBvB3S" target="_blank" rel="noopener" title="discord.gg" class="md-social__link">
|
|
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M20.317 4.37a19.8 19.8 0 0 0-4.885-1.515.074.074 0 0 0-.079.037c-.21.375-.444.864-.608 1.25a18.3 18.3 0 0 0-5.487 0 13 13 0 0 0-.617-1.25.08.08 0 0 0-.079-.037A19.7 19.7 0 0 0 3.677 4.37a.1.1 0 0 0-.032.027C.533 9.046-.32 13.58.099 18.057a.08.08 0 0 0 .031.057 19.9 19.9 0 0 0 5.993 3.03.08.08 0 0 0 .084-.028c.462-.63.874-1.295 1.226-1.994a.076.076 0 0 0-.041-.106 13 13 0 0 1-1.872-.892.077.077 0 0 1-.008-.128 10 10 0 0 0 .372-.292.07.07 0 0 1 .077-.01c3.928 1.793 8.18 1.793 12.062 0a.07.07 0 0 1 .078.01c.12.098.246.198.373.292a.077.077 0 0 1-.006.127 12.3 12.3 0 0 1-1.873.892.077.077 0 0 0-.041.107c.36.698.772 1.362 1.225 1.993a.08.08 0 0 0 .084.028 19.8 19.8 0 0 0 6.002-3.03.08.08 0 0 0 .032-.054c.5-5.177-.838-9.674-3.549-13.66a.06.06 0 0 0-.031-.03M8.02 15.33c-1.182 0-2.157-1.085-2.157-2.419 0-1.333.956-2.419 2.157-2.419 1.21 0 2.176 1.096 2.157 2.42 0 1.333-.956 2.418-2.157 2.418m7.975 0c-1.183 0-2.157-1.085-2.157-2.419 0-1.333.955-2.419 2.157-2.419 1.21 0 2.176 1.096 2.157 2.42 0 1.333-.946 2.418-2.157 2.418"></path></svg>
|
|
</a>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<a href="https://discourse.stashapp.cc" target="_blank" rel="noopener" title="discourse.stashapp.cc" class="md-social__link">
|
|
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M12.103 0C18.666 0 24 5.485 24 11.997c0 6.51-5.33 11.99-11.9 11.99L0 24V11.79C0 5.28 5.532 0 12.103 0m.116 4.563a7.4 7.4 0 0 0-6.337 3.57 7.25 7.25 0 0 0-.148 7.22L4.4 19.61l4.794-1.074a7.42 7.42 0 0 0 8.136-1.39 7.26 7.26 0 0 0 1.737-7.997 7.375 7.375 0 0 0-6.84-4.585z"></path></svg>
|
|
</a>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<a href="https://discuss.online/c/stashapp" target="_blank" rel="noopener" title="discuss.online" class="md-social__link">
|
|
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M2.96 4.223a4 4 0 0 0-.333.019A2.84 2.84 0 0 0 .474 5.628c-.475.8-.593 1.68-.35 2.497.242.816.83 1.558 1.698 2.145l.016.011c.746.45 1.492.743 2.288.9-.02.332-.028.669-.006 1.018.063 1.043.436 2 .996 2.85l-2.006.818a.42.42 0 0 0-.228.224.42.42 0 0 0 .088.455.42.42 0 0 0 .294.123.4.4 0 0 0 .16-.031l2.209-.904c.408.486.87.932 1.372 1.318q.03.02.06.043l-1.291 1.71a.416.416 0 0 0 .664.5l1.314-1.738a9.3 9.3 0 0 0 2.229 1.025c.383.72 1.138 1.187 2.02 1.187.89 0 1.644-.501 2.024-1.207a9.4 9.4 0 0 0 2.208-1.027l1.332 1.76a.416.416 0 0 0 .744-.193.42.42 0 0 0-.08-.307l-1.31-1.735c.008-.007.018-.01.026-.018.497-.38.955-.818 1.362-1.294l2.155.88a.416.416 0 0 0 .541-.228.415.415 0 0 0-.227-.544l-1.944-.792c.577-.854.97-1.819 1.05-2.87.027-.35.025-.691.009-1.026a7 7 0 0 0 2.273-.897l.017-.012c.868-.587 1.456-1.328 1.698-2.145.242-.816.125-1.697-.35-2.497a2.84 2.84 0 0 0-2.155-1.386 3 3 0 0 0-.332-.019c-.786-.015-1.623.23-2.429.694-.593.342-1.125.867-1.543 1.439-1.17-.67-2.693-1.048-4.564-1.078a16 16 0 0 0-.51 0c-2.086.034-3.755.43-5.015 1.144-.003-.003-.005-.011-.008-.015-.423-.591-.973-1.136-1.584-1.489-.805-.465-1.643-.708-2.428-.694Zm.285.736c.557.042 1.17.236 1.779.588.485.28.976.755 1.346 1.27a6 6 0 0 0-.497.408c-.92.852-1.461 1.96-1.668 3.233a6.2 6.2 0 0 1-1.984-.794C1.466 9.15 1.005 8.54.821 7.919.636 7.295.713 6.648 1.098 6c.375-.63.928-.953 1.612-1.032a3 3 0 0 1 .535-.007Zm17.51 0a3 3 0 0 1 .535.008c.684.078 1.237.402 1.612 1.032.385.648.462 1.296.277 1.92-.184.622-.645 1.231-1.4 1.744a6.2 6.2 0 0 1-1.96.789c-.194-1.297-.737-2.434-1.666-3.302a6 6 0 0 0-.47-.392c.364-.49.828-.943 1.293-1.212.61-.351 1.222-.545 1.779-.587Zm-8.749 1.045a15 15 0 0 1 .487 0c2.39.039 4.085.67 5.163 1.678 1.15 1.075 1.642 2.6 1.5 4.467-.132 1.707-1.221 3.228-2.653 4.324a9 9 0 0 1-2.225 1.229c.003-.045.014-.089.014-.135.003-1.196-.932-2.213-2.292-2.213s-2.322 1.015-2.292 2.221c.001.05.014.097.018.147a8.9 8.9 0 0 1-2.278-1.245c-1.423-1.095-2.5-2.613-2.603-4.322-.113-1.857.378-3.339 1.521-4.397s2.986-1.711 5.64-1.754m-3.642 6.829a1.096 1.096 0 1 0 0 2.192 1.096 1.096 0 0 0 0-2.192m7.282.011a1.086 1.086 0 1 0 0 2.173 1.086 1.086 0 0 0 0-2.173M12 16.084c1.024 0 1.565.638 1.563 1.482-.001.785-.672 1.485-1.563 1.485-.917 0-1.54-.562-1.563-1.493-.022-.834.54-1.474 1.563-1.474"></path></svg>
|
|
</a>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
</div>
|
|
</footer>
|
|
|
|
</div>
|
|
<div class="md-dialog" data-md-component="dialog">
|
|
<div class="md-dialog__inner md-typeset"></div>
|
|
</div>
|
|
|
|
<div class="md-progress" data-md-component="progress" role="progressbar"></div>
|
|
|
|
|
|
|
|
|
|
<script id="__config" type="application/json">{"base": "../..", "features": ["header.autohide", "announce.dismiss", "content.action.edit", "content.action.view", "search.highlight", "search.share", "navigation.instant", "navigation.instant.progress", "navigation.tabs", "navigation.sections", "toc.follow", "navigation.top", "navigation.indexes", "content.tooltips", "content.code.copy"], "search": "../../assets/javascripts/workers/search.973d3a69.min.js", "tags": null, "translations": {"clipboard.copied": "Copied to clipboard", "clipboard.copy": "Copy to clipboard", "search.result.more.one": "1 more on this page", "search.result.more.other": "# more on this page", "search.result.none": "No matching documents", "search.result.one": "1 matching document", "search.result.other": "# matching documents", "search.result.placeholder": "Type to start searching", "search.result.term.missing": "Missing", "select.version": "Select version"}, "version": null}</script>
|
|
|
|
|
|
<script src="../../assets/javascripts/bundle.92b07e13.min.js"></script>
|
|
|
|
|
|
|
|
<script id="init-glightbox">const lightbox = GLightbox({"touchNavigation": true, "loop": false, "zoomable": true, "draggable": true, "openEffect": "zoom", "closeEffect": "zoom", "slideEffect": "slide"});
|
|
document$.subscribe(()=>{ lightbox.reload(); });
|
|
</script></body></html> |