aboutsummaryrefslogtreecommitdiff
path: root/web/style
diff options
context:
space:
mode:
authormetamuffin <metamuffin@disroot.org>2024-01-16 22:58:23 +0100
committermetamuffin <metamuffin@disroot.org>2024-01-16 22:58:23 +0100
commit1c37d32a0985ff7390313833345b9299f9f0b196 (patch)
treecd46bcbe7df154bf506c083cf0325d44b3f4e0fb /web/style
parent98b379afb31e455b529d443dcfc5797b8dd6723e (diff)
downloadjellything-1c37d32a0985ff7390313833345b9299f9f0b196.tar
jellything-1c37d32a0985ff7390313833345b9299f9f0b196.tar.bz2
jellything-1c37d32a0985ff7390313833345b9299f9f0b196.tar.zst
chapter thumbnail display and player seek via url
Diffstat (limited to 'web/style')
-rw-r--r--web/style/layout.css8
-rw-r--r--web/style/nodecard.css44
2 files changed, 26 insertions, 26 deletions
diff --git a/web/style/layout.css b/web/style/layout.css
index 16ae668..3ad5236 100644
--- a/web/style/layout.css
+++ b/web/style/layout.css
@@ -106,19 +106,19 @@ footer p {
margin-right: 3px;
}
-.homelist {
+.hlist {
overflow-x: scroll;
max-width: 100%;
}
-.homelist ul {
+.hlist ul {
display: table;
}
-.homelist ul li {
+.hlist ul li {
display: table-cell;
}
@media (max-width: 750px) {
- .homelist ul {
+ .hlist ul {
padding-left: 0;
}
}
diff --git a/web/style/nodecard.css b/web/style/nodecard.css
index 7554649..b0dd3e2 100644
--- a/web/style/nodecard.css
+++ b/web/style/nodecard.css
@@ -18,52 +18,52 @@
display: block;
}
-.node.card {
+.card {
padding: 1em;
}
-.node.card .poster,
-.node.card .poster img {
+.card .poster,
+.card .poster img {
height: var(--card-size);
}
-.node.card.aspect-port {
+.card.aspect-port {
width: calc(var(--card-size) / var(--port-poster-aspect));
}
-.node.card.aspect-land {
+.card.aspect-land {
width: calc(var(--card-size) / var(--land-poster-aspect));
}
-.node.card.aspect-thumb {
+.card.aspect-thumb {
width: calc(var(--card-size) / var(--land-thumb-aspect));
}
-.node.card.aspect-square {
+.card.aspect-square {
width: calc(var(--card-size));
}
-.node.card .poster a img {
+.card .poster a img {
object-fit: cover;
object-position: center;
width: 100%;
}
-.node.card .title {
+.card .title {
text-align: center;
margin-top: 0.5em;
text-align: center;
text-overflow: ellipsis;
}
-.node.card .title a {
+.card .title a {
text-decoration-line: none;
}
-.node.card .title a:hover {
+.card .title a:hover {
text-decoration-line: underline;
}
-.node.card .poster {
+.card .poster {
display: grid;
}
-.node.card .poster a {
+.card .poster a {
grid-area: 1 / 1;
}
-.node.card.poster .poster .cardhover.item {
+.card .poster .cardhover {
position: relative;
pointer-events: none;
grid-area: 1 / 1;
@@ -74,23 +74,23 @@
justify-content: center;
align-items: center;
}
-.node.card.poster .poster:hover .cardhover.item {
+.card .poster:hover .cardhover {
opacity: 1;
}
-.node.card.poster .poster a {
+.card .poster a {
overflow: hidden;
}
-.node.card.poster .poster a img {
+.card .poster a img {
transition: transform 0.3s;
}
-.node.card.poster .poster:hover a img {
+.card .poster:hover a img {
transform: scale(1.1);
}
-.node.card.poster .poster .cardhover.item a.play {
+.card .poster .cardhover a.play {
text-decoration: none;
width: 1em;
height: 1em;
@@ -103,11 +103,11 @@
background-color: var(--overlay);
transition: background-color 0.3s, font-size 0.3s;
}
-.node.card.poster .poster .cardhover.item a.play:hover {
+.card .poster .cardhover a.play:hover {
background-color: var(--overlay-hover);
font-size: 3em;
}
-.node.card.poster .poster .cardhover.item .props {
+.card .poster .cardhover .props {
position: absolute;
bottom: 0px;
left: 0px;
@@ -120,4 +120,4 @@
.children {
justify-content: center;
}
-} \ No newline at end of file
+}