Web Dev Solutions

Catalin Mititiuc

From f35d716bd38d03285fa511f6794af5d93e88f4dc Mon Sep 17 00:00:00 2001 From: Catalin Mititiuc Date: Mon, 5 Aug 2024 15:29:45 -0700 Subject: WIP: smoothe squad view --- public/assets/css/style.css | 45 +++++++++++++--------- public/assets/images/map4.svg | 88 +++++++++++++++++++++++++++++++++++-------- public/index.html | 58 +++++++--------------------- 3 files changed, 114 insertions(+), 77 deletions(-) (limited to 'public') diff --git a/public/assets/css/style.css b/public/assets/css/style.css index f3dbc4d..bd90a4e 100644 --- a/public/assets/css/style.css +++ b/public/assets/css/style.css @@ -271,26 +271,35 @@ div#content { overflow-x: hidden; } -.soldier-record { - display: none; -} - -#record-sheet [data-view-squad-number="1"].records .soldier-record[data-squad="1"] { - display: block; -} - -#record-sheet [data-view-squad-number="2"].records .soldier-record[data-squad="2"] { - display: block; +#record-sheet .records [class^="squad-"] { + transition: transform 0.125s; } - -#record-sheet [data-view-squad-number="3"].records .soldier-record[data-squad="3"] { - display: block; -} - -#record-sheet [data-view-squad-number="4"].records .soldier-record[data-squad="4"] { - display: block; -} +#record-sheet .records > :not(:first-child) { + display: none; + transform: translateX(100%); +} + +/*.soldier-record {*/ +/* display: none;*/ +/*}*/ + +/*#record-sheet [data-view-squad-number="1"].records .soldier-record[data-squad="1"] {*/ +/* display: block;*/ +/*}*/ +/**/ +/*#record-sheet [data-view-squad-number="2"].records .soldier-record[data-squad="2"] {*/ +/* display: block;*/ +/*}*/ +/**/ +/**/ +/*#record-sheet [data-view-squad-number="3"].records .soldier-record[data-squad="3"] {*/ +/* display: block;*/ +/*}*/ +/**/ +/*#record-sheet [data-view-squad-number="4"].records .soldier-record[data-squad="4"] {*/ +/* display: block;*/ +/*}*/ #record-sheet .name { text-transform: capitalize; diff --git a/public/assets/images/map4.svg b/public/assets/images/map4.svg index 2603ed5..0113404 100644 --- a/public/assets/images/map4.svg +++ b/public/assets/images/map4.svg @@ -4,7 +4,6 @@ - @@ -25,7 +24,7 @@ - + @@ -44,7 +43,6 @@ - @@ -57,22 +55,82 @@ - - - - - - + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + - - - - - - + + + + + + + + + + + + + + + + + + + diff --git a/public/index.html b/public/index.html index 51c4fcf..c3a1c75 100644 --- a/public/index.html +++ b/public/index.html @@ -263,7 +263,7 @@
-
+
Attacker
-
+
+
1
-
- - - 2 - -
-
- - - 3 - -
-
- - - 4 - -
+
@@ -302,7 +286,7 @@
-
+
Defender
-
- - - 1 - -
-
- - - 2 - -
-
- - - 3 - -
-
- - - 4 - +
+
+
+ + + 1 + +
+
-- cgit v1.2.3