diff options
Diffstat (limited to 'server/src/routes/ui/style/nodecard.css')
-rw-r--r-- | server/src/routes/ui/style/nodecard.css | 155 |
1 files changed, 0 insertions, 155 deletions
diff --git a/server/src/routes/ui/style/nodecard.css b/server/src/routes/ui/style/nodecard.css deleted file mode 100644 index bfc0b74..0000000 --- a/server/src/routes/ui/style/nodecard.css +++ /dev/null @@ -1,155 +0,0 @@ -/* - This file is part of jellything (https://codeberg.org/metamuffin/jellything) - which is licensed under the GNU Affero General Public License (version 3); see /COPYING. - Copyright (C) 2023 metamuffin <metamuffin.org> - Copyright (C) 2023 tpart -*/ -.children { - padding: 1em; - padding-left: 3em; - padding-right: 3em; - list-style: none; - display: flex; - flex-wrap: wrap; - width: 100%; - box-sizing: border-box; -} -.children li { - display: block; -} - -.dirup { - width: 100%; - font-size: large; - display: block; - text-align: center; - background-color: var(--background-light); - border-radius: 0.2em; - padding: 0.6em; - margin: 0.2em; - transition: filter 0.22s; -} -.dirup:hover { - filter: brightness(120%); -} - -.node.card { - padding: 1em; - height: var(--card-size); -} -.node.card.poster.poster-port { - width: calc(var(--card-size) / var(--port-poster-aspect)); -} -.node.card.poster.poster-land { - width: calc(var(--card-size) / var(--land-poster-aspect)); -} -.node.card.poster.thumb-land { - width: calc(var(--card-size) / var(--land-thumb-aspect)); -} -.node.card.poster.poster-square { - width: calc(var(--card-size)); -} - -.node.card .title { - margin-top: 0.1em; - text-align: center; - text-overflow: ellipsis; -} -.node.card .poster { - display: grid; -} -.node.card .poster a { - grid-area: 1 / 1; -} - -.node.card.poster.poster-port .poster img { - width: calc(var(--card-size) / var(--port-poster-aspect)); - height: var(--card-size); -} -.node.card.poster.poster-land .poster img { - width: calc(var(--card-size) / var(--land-poster-aspect)); - height: var(--card-size); -} -.node.card.poster.thumb-land .poster img { - width: calc(var(--card-size) / var(--land-thumb-aspect)); - height: var(--card-size); -} -.node.card.poster.poster-square .poster img { - width: calc(var(--card-size)); - height: var(--card-size); -} -.node.card .poster a img { - object-fit: cover; - object-position: center; -} - -.node.card.poster .poster .cardhover.open { - transition: opacity 0.3s, backdrop-filter 0.3s; - opacity: 0; - display: flex; - position: relative; - bottom: 0px; - height: 5em; - margin-top: -5em; -} -.node.card.poster .poster:hover .cardhover.open { - opacity: 1; - background-color: #0004; - backdrop-filter: blur(3px); -} -.node.card.poster .poster .cardhover.open a { - text-decoration: none; - width: 100%; - height: 1.7em; - font-size: large; - display: block; - text-align: center; - background-color: #0004; - border-radius: 0.2em; - padding: 0.6em; - margin: 0.6em; - transition: background-color 0.2s; -} -.node.card.poster .poster .cardhover.open a:hover { - background-color: #0008; -} - -.node.card.poster .poster .cardhover.item { - position: relative; - pointer-events: none; - grid-area: 1 / 1; - transition: opacity 0.3s, backdrop-filter 0.3s; - opacity: 0; - display: flex; - justify-content: center; - align-items: center; -} -.node.card.poster .poster:hover .cardhover.item { - opacity: 1; - background-color: #0004; - backdrop-filter: blur(3px); -} - -.node.card.poster .poster .cardhover.item a.play { - text-decoration: none; - font-stretch: 200%; - width: 1em; - height: 1em; - line-height: 1; - margin: auto; - padding: 0.4em 0.3em 0.4em 0.5em; - border-radius: 50%; - font-size: 1.8em; - pointer-events: all; - background-color: #0005; - transition: background-color 0.2s, font-size 0.2s; -} -.node.card.poster .poster .cardhover.item a.play:hover { - background-color: #0008; - font-size: 2.4em; -} -.node.card.poster .poster .cardhover.item .props { - position: absolute; - bottom: 0px; - left: 0px; -} |