summaryrefslogtreecommitdiff
path: root/webcards/styles/client/card.css
diff options
context:
space:
mode:
Diffstat (limited to 'webcards/styles/client/card.css')
-rw-r--r--webcards/styles/client/card.css48
1 files changed, 36 insertions, 12 deletions
diff --git a/webcards/styles/client/card.css b/webcards/styles/client/card.css
index 2f52255..de49175 100644
--- a/webcards/styles/client/card.css
+++ b/webcards/styles/client/card.css
@@ -125,43 +125,67 @@ card[drag=true]
/* Deck */
deck {
+ --ccount: 0;
+
position: absolute;
- min-width: 160px;
- min-height: 240px;
+ width: 166px;
+ height: 250px;
top: 0;
left: 0;
overflow: visible;
- display: flex;
- justify-content: center;
- align-content: center;
border-radius: 10px;
transition-duration: 0.2s;
+
+ border: 3px solid var(--deck-shadow);
+ box-sizing: border-box;
}
deck:hover {
- box-shadow: 0 0 5px var(--deck-hover);
+ border: 3px solid var(--deck-hover);
+}
+
+/* Deck modes */
+
+deck[mode="stack"] > card {
+ transform: translate(5px, calc(var(--cpos) * 3px + 7px));
}
-deck > card {
- transform: translate(0, calc(var(--cpos) * 3px ));
+deck[mode="stack"] {
+ height: calc(var(--ccount) * 3px + 250px);
}
deck[mode="strip-hl"] > card {
- transform: translate(calc(var(--cpos) * -75px), 0);
+ transform: translate(calc(var(--ccount) * 75px + var(--cpos) * -75px + 5px), 7px);
+}
+
+deck[mode="strip-hl"] {
+ width: calc(var(--ccount) * 75px + 160px);
}
deck[mode="strip-hr"] > card {
- transform: translate(calc(var(--cpos) * 75px), 0);
+ transform: translate(calc(var(--cpos) * 75px + 5px), 7px);
+}
+
+deck[mode="strip-hr"] {
+ width: calc(var(--ccount) * 75px + 160px);
}
deck[mode="strip-vu"] > card {
- transform: translate(0, calc(var(--cpos) * -115px ));
+ transform: translate(5px, calc(var(--ccount) * 115px + var(--cpos) * -115px + 7px));
+}
+
+deck[mode="strip-vu"] {
+ height: calc(var(--ccount) * 115px + 240px);
}
deck[mode="strip-vd"] > card {
- transform: translate(0, calc(var(--cpos) * 115px ));
+ transform: translate(5px, calc(var(--cpos) * 115px + 7px));
}
+
+deck[mode="strip-vd"] {
+ height: calc(var(--ccount) * 115px + 240px);
+} \ No newline at end of file