feat(14): styled static selection screen

14-rock-paper-scissors/src/main/resources/public/output.css

@@ -543,10 +543,6 @@ video {
   bottom: 0px;
 }
 
-.bottom-20 {
-  bottom: 5rem;
-}
-
 .left-1\/2 {
   left: 50%;
 }
@@ -575,6 +571,10 @@ video {
   display: flex;
 }
 
+.h-10 {
+  height: 2.5rem;
+}
+
 .h-3\/4 {
   height: 75%;
 }
@@ -611,6 +611,14 @@ video {
   width: 75%;
 }
 
+.w-32 {
+  width: 8rem;
+}
+
+.w-\[375px\] {
+  width: 375px;
+}
+
 .w-\[80px\] {
   width: 80px;
 }
@@ -619,10 +627,6 @@ video {
   width: var(--diameter);
 }
 
-.w-full {
-  width: 100%;
-}
-
 .w-screen {
   width: 100vw;
 }
@@ -653,6 +657,10 @@ video {
   align-items: center;
 }
 
+.justify-between {
+  justify-content: space-between;
+}
+
 .justify-around {
   justify-content: space-around;
 }
@@ -661,10 +669,18 @@ video {
   border-radius: 9999px;
 }
 
+.rounded-lg {
+  border-radius: 0.5rem;
+}
+
 .rounded-md {
   border-radius: 0.375rem;
 }
 
+.border {
+  border-width: 1px;
+}
+
 .border-\[3px\] {
   border-width: 3px;
 }
@@ -674,6 +690,11 @@ video {
   border-color: hsl(217 16% 45% / var(--tw-border-opacity));
 }
 
+.border-white {
+  --tw-border-opacity: 1;
+  border-color: rgb(255 255 255 / var(--tw-border-opacity));
+}
+
 .bg-white {
   --tw-bg-opacity: 1;
   background-color: rgb(255 255 255 / var(--tw-bg-opacity));
@@ -717,8 +738,8 @@ video {
   --tw-gradient-to: hsl(237, 49%, 15%) var(--tw-gradient-to-position);
 }
 
-.bg-50\% {
-  background-size: 50%;
+.bg-60\% {
+  background-size: 60%;
 }
 
 .bg-center {
@@ -729,11 +750,21 @@ video {
   background-repeat: no-repeat;
 }
 
+.py-10 {
+  padding-top: 2.5rem;
+  padding-bottom: 2.5rem;
+}
+
 .py-2 {
   padding-top: 0.5rem;
   padding-bottom: 0.5rem;
 }
 
+.py-12 {
+  padding-top: 3rem;
+  padding-bottom: 3rem;
+}
+
 .pl-4 {
   padding-left: 1rem;
 }
@@ -742,11 +773,21 @@ video {
   padding-top: 2rem;
 }
 
+.text-2xl {
+  font-size: 1.5rem;
+  line-height: 2rem;
+}
+
 .text-4xl {
   font-size: 2.25rem;
   line-height: 2.5rem;
 }
 
+.text-base {
+  font-size: 1rem;
+  line-height: 1.5rem;
+}
+
 .text-xl {
   font-size: 1.25rem;
   line-height: 1.75rem;
@@ -773,6 +814,10 @@ video {
   line-height: 1;
 }
 
+.tracking-widest {
+  letter-spacing: 0.1em;
+}
+
 .text-score-text {
   --tw-text-opacity: 1;
   color: hsl(229 64% 46% / var(--tw-text-opacity));