Feat: User Relationships and Session Members.

static/css/pages/tcg/decks.css

@@ -1,8 +1,7 @@
 
 
 .tcg-card {
-    margin-top: 1vh;
-    margin-bottom: 0;
+    margin: 1vh 0 auto;
 }
 
 

static/css/pages/tcg/game.css

@@ -1,5 +1,9 @@
 /* MTG Single Game Page Styles */
 
+.tcg-title.dirty {
+    background-color: var(--tcg-accent-purple);
+}
+
 #buttonHamburger {
     display: none;
 }
@@ -100,7 +104,7 @@
 .control-group {
     display: flex;
     align-items: center;
-    gap: 1rem;
+    gap: 0.5rem;
 }
 
 .control-group .tcg-input {
@@ -113,7 +117,7 @@
 .player-names-grid {
     display: flex;
     flex-wrap: wrap;
-    gap: 1rem;
+    gap: 0.5rem;
     max-width: 800px;
     margin: 0 auto 2rem;
     justify-content: center;
@@ -230,7 +234,7 @@
     transition: all 0.4s ease;
     animation: tcg-scaleIn 0.5s ease-out backwards;
     width: fit-content;
-    max-width: 38vw;
+    max-width: 35vw;
     min-width: 20vw;
     margin: 0 auto;
 }
@@ -256,7 +260,7 @@
     align-items: center;
     margin-bottom: 1.5rem;
     flex-wrap: wrap;
-    gap: 1rem;
+    gap: 0.5rem;
 }
 
 .player-info {
@@ -353,7 +357,7 @@
 .life-gain-controls,
 .life-loss-controls {
     display: flex;
-    gap: 1rem;
+    gap: 0.5rem;
     justify-content: center;
     margin-bottom: 1vh;
 }
@@ -364,7 +368,7 @@
     border: 2px solid var(--tcg-border-color);
     color: var(--tcg-text-primary);
     width: 60px;
-    height: 60px;
+    height: 45px;
     border-radius: 12px;
     font-family: 'Cinzel', serif;
     font-size: 1.8rem;

static/css/sections/tcg.css

@@ -16,7 +16,7 @@
 #pageBody {
     max-height: 82vh;
     padding: 0 5vw;
-    margin: 0;
+    margin: 0 auto;
     border: 0;
     align-content: center;
     justify-content: flex-start;
@@ -25,7 +25,6 @@
     align-items: flex-start;
     overflow-y: auto;
     overflow-x: hidden;
-    position: absolute;
     width: 90vw;
     color: var(--colour-text);
 }