Update CSS styles for height and width

src/assets/css/style.css

@@ -705,6 +705,20 @@ select {
   --tw-backdrop-sepia:  ;
 }
 
+html {
+  height: 100%;
+  --tw-bg-opacity: 1;
+  background-color: rgb(243 247 249 / var(--tw-bg-opacity));
+}
+
+body {
+  height: 100%;
+}
+
+#app {
+  height: 100%;
+}
+
 /* NavBar */
 
 .menu-item {
@@ -1095,10 +1109,6 @@ select {
   margin-top: 1.5rem;
 }
 
-.mt-8 {
-  margin-top: 2rem;
-}
-
 .line-clamp-1 {
   overflow: hidden;
   display: -webkit-box;
@@ -1178,6 +1188,10 @@ select {
   height: 2.7rem;
 }
 
+.h-\[56px\] {
+  height: 56px;
+}
+
 .h-\[66px\] {
   height: 66px;
 }
@@ -1203,10 +1217,6 @@ select {
   height: 80vh;
 }
 
-.h-\[56px\] {
-  height: 56px;
-}
-
 .max-h-0 {
   max-height: 0px;
 }
@@ -1231,10 +1241,6 @@ select {
   min-height: 100vh;
 }
 
-.min-h-\[56px\] {
-  min-height: 56px;
-}
-
 .w-0 {
   width: 0px;
 }
@@ -1287,6 +1293,10 @@ select {
   width: 2.25rem;
 }
 
+.w-\[170px\] {
+  width: 170px;
+}
+
 .w-\[2\.7rem\] {
   width: 2.7rem;
 }
@@ -1303,10 +1313,6 @@ select {
   width: 100%;
 }
 
-.w-\[170px\] {
-  width: 170px;
-}
-
 .max-w-2xl {
   max-width: 42rem;
 }
@@ -1468,10 +1474,6 @@ select {
   place-items: center;
 }
 
-.content-start {
-  align-content: flex-start;
-}
-
 .items-start {
   align-items: flex-start;
 }
@@ -1554,6 +1556,12 @@ select {
   margin-bottom: calc(0.25rem * var(--tw-space-y-reverse));
 }
 
+.space-y-2 > :not([hidden]) ~ :not([hidden]) {
+  --tw-space-y-reverse: 0;
+  margin-top: calc(0.5rem * calc(1 - var(--tw-space-y-reverse)));
+  margin-bottom: calc(0.5rem * var(--tw-space-y-reverse));
+}
+
 .space-y-3 > :not([hidden]) ~ :not([hidden]) {
   --tw-space-y-reverse: 0;
   margin-top: calc(0.75rem * calc(1 - var(--tw-space-y-reverse)));
@@ -1566,12 +1574,6 @@ select {
   margin-bottom: calc(1rem * var(--tw-space-y-reverse));
 }
 
-.space-y-2 > :not([hidden]) ~ :not([hidden]) {
-  --tw-space-y-reverse: 0;
-  margin-top: calc(0.5rem * calc(1 - var(--tw-space-y-reverse)));
-  margin-bottom: calc(0.5rem * var(--tw-space-y-reverse));
-}
-
 .divide-y > :not([hidden]) ~ :not([hidden]) {
   --tw-divide-y-reverse: 0;
   border-top-width: calc(1px * calc(1 - var(--tw-divide-y-reverse)));
@@ -2601,11 +2603,6 @@ select {
   background-color: rgb(255 255 0 / var(--tw-bg-opacity));
 }
 
-.hover\:text-gray-500:hover {
-  --tw-text-opacity: 1;
-  color: rgb(107 114 128 / var(--tw-text-opacity));
-}
-
 .hover\:text-primary-500:hover {
   --tw-text-opacity: 1;
   color: rgb(3 91 113 / var(--tw-text-opacity));
@@ -2695,14 +2692,14 @@ select {
   --tw-ring-opacity: 0.1;
 }
 
-.focus\:ring-offset-2:focus {
-  --tw-ring-offset-width: 2px;
-}
-
 .focus\:ring-offset-0:focus {
   --tw-ring-offset-width: 0px;
 }
 
+.focus\:ring-offset-2:focus {
+  --tw-ring-offset-width: 2px;
+}
+
 .focus-visible\:outline:focus-visible {
   outline-style: solid;
 }