ADD : new welcome page

launcher/public/output.css

@@ -515,7 +515,7 @@ video {
   --tw-backdrop-sepia:  ;
 }
 
-::-webkit-backdrop{
+::-ms-backdrop{
   --tw-border-spacing-x: 0;
   --tw-border-spacing-y: 0;
   --tw-translate-x: 0;
@@ -796,6 +796,10 @@ video {
   right: 0.25rem;
 }
 
+.right-10{
+  right: 2.5rem;
+}
+
 .right-2{
   right: 0.5rem;
 }
@@ -824,10 +828,18 @@ video {
   top: 0.25rem;
 }
 
+.top-10{
+  top: 2.5rem;
+}
+
 .top-\[-18px\]{
   top: -18px;
 }
 
+.top-\[-2px\]{
+  top: -2px;
+}
+
 .z-0{
   z-index: 0;
 }
@@ -856,6 +868,10 @@ video {
   grid-column: span 1 / span 1;
 }
 
+.col-span-2{
+  grid-column: span 2 / span 2;
+}
+
 .col-span-3{
   grid-column: span 3 / span 3;
 }
@@ -940,10 +956,18 @@ video {
   grid-column-end: 2;
 }
 
+.col-end-20{
+  grid-column-end: 20;
+}
+
 .col-end-21{
   grid-column-end: 21;
 }
 
+.col-end-23{
+  grid-column-end: 23;
+}
+
 .col-end-25{
   grid-column-end: 25;
 }
@@ -988,6 +1012,10 @@ video {
   grid-row-start: 1;
 }
 
+.row-start-11{
+  grid-row-start: 11;
+}
+
 .row-start-12{
   grid-row-start: 12;
 }
@@ -1614,6 +1642,10 @@ video {
   max-width: 32rem;
 }
 
+.max-w-xs{
+  max-width: 20rem;
+}
+
 .flex-auto{
   -webkit-box-flex: 1;
       -ms-flex: 1 1 auto;
@@ -1984,6 +2016,11 @@ video {
       align-self: flex-start;
 }
 
+.self-end{
+  -ms-flex-item-align: end;
+      align-self: flex-end;
+}
+
 .self-center{
   -ms-flex-item-align: center;
       align-self: center;
@@ -2043,6 +2080,10 @@ video {
   white-space: pre;
 }
 
+.break-words{
+  overflow-wrap: break-word;
+}
+
 .rounded{
   border-radius: 0.25rem;
 }
@@ -2100,10 +2141,19 @@ video {
   border-top-right-radius: 0.5rem;
 }
 
+.rounded-t-md{
+  border-top-left-radius: 0.375rem;
+  border-top-right-radius: 0.375rem;
+}
+
 .rounded-bl-\[37px\]{
   border-bottom-left-radius: 37px;
 }
 
+.rounded-bl-\[50px\]{
+  border-bottom-left-radius: 50px;
+}
+
 .rounded-bl-lg{
   border-bottom-left-radius: 0.5rem;
 }
@@ -2112,6 +2162,10 @@ video {
   border-bottom-right-radius: 37px;
 }
 
+.rounded-br-\[50px\]{
+  border-bottom-right-radius: 50px;
+}
+
 .rounded-tl-lg{
   border-top-left-radius: 0.5rem;
 }
@@ -2120,6 +2174,10 @@ video {
   border-top-right-radius: 37px;
 }
 
+.rounded-tr-\[50px\]{
+  border-top-right-radius: 50px;
+}
+
 .border{
   border-width: 1px;
 }
@@ -2174,6 +2232,21 @@ video {
   border-color: rgb(28 54 52 / var(--tw-border-opacity));
 }
 
+.border-\[\#262626\]{
+  --tw-border-opacity: 1;
+  border-color: rgb(38 38 38 / var(--tw-border-opacity));
+}
+
+.border-\[\#336666\]{
+  --tw-border-opacity: 1;
+  border-color: rgb(51 102 102 / var(--tw-border-opacity));
+}
+
+.border-\[\#719d87\]{
+  --tw-border-opacity: 1;
+  border-color: rgb(113 157 135 / var(--tw-border-opacity));
+}
+
 .border-blue-100{
   --tw-border-opacity: 1;
   border-color: rgb(219 234 254 / var(--tw-border-opacity));
@@ -2278,6 +2351,10 @@ video {
   border-right-color: rgb(38 71 68 / var(--tw-border-opacity));
 }
 
+.border-r-transparent{
+  border-right-color: transparent;
+}
+
 .bg-\[\#111315\]{
   --tw-bg-opacity: 1;
   background-color: rgb(17 19 21 / var(--tw-bg-opacity));
@@ -2318,6 +2395,11 @@ video {
   background-color: rgb(25 27 30 / var(--tw-bg-opacity));
 }
 
+.bg-\[\#1E2429\]{
+  --tw-bg-opacity: 1;
+  background-color: rgb(30 36 41 / var(--tw-bg-opacity));
+}
+
 .bg-\[\#1c1d1d\]{
   --tw-bg-opacity: 1;
   background-color: rgb(28 29 29 / var(--tw-bg-opacity));
@@ -2328,6 +2410,11 @@ video {
   background-color: rgb(28 32 33 / var(--tw-bg-opacity));
 }
 
+.bg-\[\#1d1f20\]{
+  --tw-bg-opacity: 1;
+  background-color: rgb(29 31 32 / var(--tw-bg-opacity));
+}
+
 .bg-\[\#1f2123\]{
   --tw-bg-opacity: 1;
   background-color: rgb(31 33 35 / var(--tw-bg-opacity));
@@ -2353,6 +2440,11 @@ video {
   background-color: rgb(36 61 54 / var(--tw-bg-opacity));
 }
 
+.bg-\[\#262626\]{
+  --tw-bg-opacity: 1;
+  background-color: rgb(38 38 38 / var(--tw-bg-opacity));
+}
+
 .bg-\[\#264744\]{
   --tw-bg-opacity: 1;
   background-color: rgb(38 71 68 / var(--tw-bg-opacity));
@@ -2373,6 +2465,11 @@ video {
   background-color: rgb(46 81 81 / var(--tw-bg-opacity));
 }
 
+.bg-\[\#303232\]{
+  --tw-bg-opacity: 1;
+  background-color: rgb(48 50 50 / var(--tw-bg-opacity));
+}
+
 .bg-\[\#33393E\]{
   --tw-bg-opacity: 1;
   background-color: rgb(51 57 62 / var(--tw-bg-opacity));
@@ -2388,6 +2485,11 @@ video {
   background-color: rgb(51 77 77 / var(--tw-bg-opacity));
 }
 
+.bg-\[\#336666\]{
+  --tw-bg-opacity: 1;
+  background-color: rgb(51 102 102 / var(--tw-bg-opacity));
+}
+
 .bg-\[\#38504e\]{
   --tw-bg-opacity: 1;
   background-color: rgb(56 80 78 / var(--tw-bg-opacity));
@@ -2590,10 +2692,18 @@ video {
   --tw-gradient-to-position: 95%;
 }
 
+.bg-contain{
+  background-size: contain;
+}
+
 .bg-cover{
   background-size: cover;
 }
 
+.bg-fixed{
+  background-attachment: fixed;
+}
+
 .bg-center{
   background-position: center;
 }
@@ -2650,6 +2760,11 @@ video {
   padding-right: 0.5rem;
 }
 
+.px-3{
+  padding-left: 0.75rem;
+  padding-right: 0.75rem;
+}
+
 .px-4{
   padding-left: 1rem;
   padding-right: 1rem;
@@ -2741,6 +2856,11 @@ video {
   font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
 }
 
+.text-2xl{
+  font-size: 1.5rem;
+  line-height: 2rem;
+}
+
 .text-\[10px\]{
   font-size: 10px;
 }
@@ -2835,6 +2955,11 @@ video {
   color: rgb(251 191 36 / var(--tw-text-opacity));
 }
 
+.text-amber-500{
+  --tw-text-opacity: 1;
+  color: rgb(245 158 11 / var(--tw-text-opacity));
+}
+
 .text-amber-600{
   --tw-text-opacity: 1;
   color: rgb(217 119 6 / var(--tw-text-opacity));
@@ -2970,6 +3095,11 @@ video {
   color: rgb(234 179 8 / var(--tw-text-opacity));
 }
 
+.text-amber-300{
+  --tw-text-opacity: 1;
+  color: rgb(252 211 77 / var(--tw-text-opacity));
+}
+
 .placeholder-gray-500::-webkit-input-placeholder{
   --tw-placeholder-opacity: 1;
   color: rgb(107 114 128 / var(--tw-placeholder-opacity));
@@ -3071,6 +3201,11 @@ video {
   --tw-shadow: var(--tw-shadow-colored);
 }
 
+.shadow-\[\#303232\]{
+  --tw-shadow-color: #303232;
+  --tw-shadow: var(--tw-shadow-colored);
+}
+
 .shadow-black{
   --tw-shadow-color: #000;
   --tw-shadow: var(--tw-shadow-colored);
@@ -3432,6 +3567,13 @@ html body {
   border-color: rgb(255 255 255 / var(--tw-border-opacity));
 }
 
+.hover\:scale-110:hover{
+  --tw-scale-x: 1.1;
+  --tw-scale-y: 1.1;
+  -webkit-transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
+          transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
+}
+
 .hover\:scale-95:hover{
   --tw-scale-x: .95;
   --tw-scale-y: .95;
@@ -3594,6 +3736,23 @@ html body {
           box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
 }
 
+.hover\:shadow-xl:hover{
+  --tw-shadow: 0 20px 25px -5px rgb(0 0 0 / 0.1), 0 8px 10px -6px rgb(0 0 0 / 0.1);
+  --tw-shadow-colored: 0 20px 25px -5px var(--tw-shadow-color), 0 8px 10px -6px var(--tw-shadow-color);
+  -webkit-box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
+          box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
+}
+
+.hover\:shadow-\[\#1a1b1b\]:hover{
+  --tw-shadow-color: #1a1b1b;
+  --tw-shadow: var(--tw-shadow-colored);
+}
+
+.hover\:shadow-\[\#303232\]:hover{
+  --tw-shadow-color: #303232;
+  --tw-shadow: var(--tw-shadow-colored);
+}
+
 .hover\:brightness-110:hover{
   --tw-brightness: brightness(1.1);
   -webkit-filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow);
@@ -3640,6 +3799,13 @@ html body {
   --tw-ring-opacity: 0.8;
 }
 
+.active\:scale-100:active{
+  --tw-scale-x: 1;
+  --tw-scale-y: 1;
+  -webkit-transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
+          transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
+}
+
 .active\:scale-75:active{
   --tw-scale-x: .75;
   --tw-scale-y: .75;