From 850d3ec3de34597702ac97809a8310cd390b4bbd Mon Sep 17 00:00:00 2001
From: Furkan Sahin <furkan-dev@proton.me>
Date: Thu, 9 Jun 2022 16:03:42 -0500
Subject: Need 3 separate columns of `assign-box` rather than for loop 3
 identical ones because of upper right and upper left borders. Each column
 should have a different `border`

---
 src/App.svelte | 20 ++++++++++++++++++--
 1 file changed, 18 insertions(+), 2 deletions(-)

(limited to 'src/App.svelte')

diff --git a/src/App.svelte b/src/App.svelte
index 5b453a1..d2765c4 100644
--- a/src/App.svelte
+++ b/src/App.svelte
@@ -25,21 +25,37 @@
 			width: 33.33%;
 			display: flex;
 			border-width: 4px;
-			border: solid;
 			border-color: rgb(148 163 184);
 		}
 		.assign-box:hover {
 			/* border-width: 6px; */
 			border-color: black;
+			border-width: 6px;
+			/* border-width: 8px; */
+			/* transition-timing-function: ease-in-out; */
+		}
+
+		.assign-box:hover > .assign-box-header {
+			border-bottom-color: black;
+			border-bottom-width: 6px;
 		}
 
 		.assign-box-header {
 			font-size: 1.5rem;
 			font-family: sans;
-			border-bottom: solid;
+			border-bottom-color: rgb(148 163 184);
+			border-bottom-width: 4px;
 			text-align: center;
 			height: 10%;
 			overflow: hidden;
+			flex: none;
+		}
+
+		.assign-box-body {
+			/* flex-direction: row; */
+			flex: 1 1 auto;
+			overflow-y: auto;
+			/* height: 100%; */
 		}
 	}
 </style>
-- 
cgit v1.2.3

