chore(deps): update dependency vitest to v2

Merge pull request #18 from LoredDev/10-frontend-form-control
feat(frontend): form html and css fim do hiatus
2024-07-08 13:18:07 +00:00 · 2023-12-26 19:02:56 -03:00 · 2023-12-07 18:33:04 -03:00 · 2023-12-06 09:35:07 -03:00 · 2023-12-01 14:20:15 -03:00 · 2023-12-01 12:42:25 -03:00
4 changed files with 478 additions and 174 deletions
--- a/index.html
+++ b/index.html
@@ -5,14 +5,84 @@
 	<title></title>
 	<meta charset="UTF-8">
 	<meta name="viewport" content="width=device-width, initial-scale=1">
-	<link href="css/style.css" rel="stylesheet">
+	<link href="src/css/style.css" rel="stylesheet">
 	<!-- auto-refresh in dev -->
-	<!-- <script type="text/javascript" src="https://livejs.com/live.js"></script> -->
+	<script type="text/javascript" src="https://livejs.com/live.js"></script>
 	<script type="module" src="./packages/banners/src/index.js"></script>
 </head>
-
 <body>
-	<h1> Hello, world </h1>
+	<div class="container">
+		<div class="banner">
+
+		</div>
+		<div class="centralize-verticaly">
+			<div class="options">
+				<h1>Lored's Markdown</h1>
+				<form class="options-grid-container">
+					<input class="txt-input" type="text" id="title" name="banner-title" placeholder="Title">
+					<input class="txt-input" type="text" id="subtitle" name="banner-subtitle" placeholder="Subtitle">
+			
+					<input class="txt-input" type="url" id="icon" name="icon" placeholder="Icon name or link">
+					<input class="txt-input" type="url" id="bg-img-link" name="bg-img-link" placeholder="Background Image link">
+					<div class="style-layout">
+						<label for="layout">Layout</label>
+						<select class="txt-input" name="layout" id="layout">
+							<option value="horizontal">Horizontal</option>
+							<option value="vertical">Vertical</option>
+						</select>
+						<div class="center-txt-vertically">
+							<input type="checkbox" id="rtl" name="rtl">
+							<label for="rtl">Right-to-left</label>
+						</div>
+					</div>
+					<div class="style-layout">
+						<label for="bg-color">Background</label>
+						<input type="color" id="bg-color" name="bg-color">
+					</div>
+			
+					<div class="repo-wrapper">
+						<label for="repo-url">Repo-Info</label>
+						<input class="txt-input span-all" type="url" name="repo-url" id="repo-url" placeholder="Repository url">
+						<div class="list-of-items">
+							<label for="show-info">Show info:</label>
+							<div class="center-txt-vertically">
+								<input type="checkbox" id="issues" value="issues" name="show-info">
+								<label for="issues">Issues</label><br>
+							</div>
+							<div class="center-txt-vertically">
+								<input type="checkbox" id="prs" value="prs" name="show-info">
+								<label for="prs">Pull requests</label><br>
+							</div>
+							<div class="center-txt-vertically">
+								<input type="checkbox" id="contributors" value="contributors" name="show-info">
+								<label for="contributors">Contributors</label><br>
+							</div>
+							<br>
+						</div>
+					</div>
+					<div class="list-of-items">
+						<label for="deco">Event decoration:</label>
+						<div class="center-txt-vertically">
+							<input type="radio" id="halloween" value="halloween" name="deco">
+							<label for="halloween">Halloween</label><br>
+						</div>
+						<div class="center-txt-vertically">
+							<input type="radio" id="christmas" value="christmas" name="deco">
+						<label for="christmas">Christmas</label><br>
+						</div>
+						<div class="center-txt-vertically">
+							<input type="radio" id="easter" value="easter" name="deco">
+						<label for="easter">Easter</label><br>
+						</div>
+						<div class="center-txt-vertically">
+							<input type="radio" id="pride" value="pride" name="deco">
+							<label for="pride">Pride month</label><br>
+						</div>
+					</div>
+				</form>
+			</div>
+		</div>
+	</div>
 </body>

 </html>
--- a/package.json
+++ b/package.json
@@ -24,7 +24,7 @@
 		"husky": "^8.0.0",
 		"turbo": "^1.10.16",
 		"vercel": "^32.5.6",
-		"vitest": "^0.34.6"
+		"vitest": "^2.0.0"
 	},
 	"dependencies": {
 		"@eslegant/js": "0.0.0-next-20230910004746"
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -37,8 +37,8 @@ importers:
        specifier: ^32.5.6
        version: 32.5.6
      vitest:
-        specifier: ^0.34.6
-        version: 0.34.6
+        specifier: ^2.0.0
+        version: 2.0.0(@types/node@14.18.33)

  packages/banners:
    devDependencies:
@@ -58,6 +58,14 @@ packages:
    resolution: {integrity: sha512-1Yjs2SvM8TflER/OD3cOjhWWOZb58A2t7wpE2S9XfBYTiIl+XFhQG2bjy4Pu1I+EAlCNUzRDYDdFwFYUKvXcIA==}
    engines: {node: '>=0.10.0'}

+  /@ampproject/remapping@2.3.0:
+    resolution: {integrity: sha512-30iZtAPgz+LTIYoeivqYo853f02jBYSd5uGnGpkFV0M3xOt9aN73erkgYAmZU43x4VfqcnLxW9Kpg3R5LC4YYw==}
+    engines: {node: '>=6.0.0'}
+    dependencies:
+      '@jridgewell/gen-mapping': 0.3.5
+      '@jridgewell/trace-mapping': 0.3.25
+    dev: true
+
  /@babel/code-frame@7.23.4:
    resolution: {integrity: sha512-r1IONyb6Ia+jYR2vvIDhdWdlTGhqbBoFqLTQidzZ4kepUFH15ejXvFHxCVbtl7BOXIudsIubf4E81xeA3h3IXA==}
    engines: {node: '>=6.9.0'}
@@ -621,15 +629,36 @@ packages:
      '@sinclair/typebox': 0.27.8
    dev: true

+  /@jridgewell/gen-mapping@0.3.5:
+    resolution: {integrity: sha512-IzL8ZoEDIBRWEzlCcRhOaCupYyN5gdIK+Q6fbFdPDg6HqX6jpkItn7DFIpW9LQzXG6Df9sA7+OKnq0qlz/GaQg==}
+    engines: {node: '>=6.0.0'}
+    dependencies:
+      '@jridgewell/set-array': 1.2.1
+      '@jridgewell/sourcemap-codec': 1.4.15
+      '@jridgewell/trace-mapping': 0.3.25
+    dev: true
+
  /@jridgewell/resolve-uri@3.1.1:
    resolution: {integrity: sha512-dSYZh7HhCDtCKm4QakX0xFpsRDqjjtZf/kjI/v3T3Nwt5r8/qz/M19F9ySyOqU94SXBmeG9ttTul+YnR4LOxFA==}
    engines: {node: '>=6.0.0'}
    dev: true

+  /@jridgewell/set-array@1.2.1:
+    resolution: {integrity: sha512-R8gLRTZeyp03ymzP/6Lil/28tGeGEzhx1q2k703KGWRAI1VdvPIXdG70VJc2pAMw3NA6JKL5hhFu1sJX0Mnn/A==}
+    engines: {node: '>=6.0.0'}
+    dev: true
+
  /@jridgewell/sourcemap-codec@1.4.15:
    resolution: {integrity: sha512-eF2rxCRulEKXHTRiDrDy6erMYWqNw4LPdQ8UQA4huuxaQsVeRPFl2oM8oDGxMFhJUWZf9McpLtJasDDZb/Bpeg==}
    dev: true

+  /@jridgewell/trace-mapping@0.3.25:
+    resolution: {integrity: sha512-vNk6aEwybGtawWmy/PzwnGDOjCkLWSD2wqvjGGAgOAwCGWySYXfYoxt00IJkTF+8Lb57DwOb3Aa0o9CApepiYQ==}
+    dependencies:
+      '@jridgewell/resolve-uri': 3.1.1
+      '@jridgewell/sourcemap-codec': 1.4.15
+    dev: true
+
  /@jridgewell/trace-mapping@0.3.9:
    resolution: {integrity: sha512-3Belt6tdc8bPgAtbcmdtNJlirVoTmEb5e2gC94PnkwEW9jI6CAHUeoG85tjWP5WquqfavoMtMwiG4P926ZKKuQ==}
    dependencies:
@@ -839,14 +868,8 @@ packages:
    resolution: {integrity: sha512-vxhUy4J8lyeyinH7Azl1pdd43GJhZH/tP2weN8TntQblOY+A0XbT8DJk1/oCPuOOyg/Ja757rG0CgHcWC8OfMA==}
    dev: true

-  /@types/chai-subset@1.3.5:
-    resolution: {integrity: sha512-c2mPnw+xHtXDoHmdtcCXGwyLMiauiAyxWMzhGpqHC4nqI/Y5G2XhTampslK2rb59kpcuHon03UH8W6iYUzw88A==}
-    dependencies:
-      '@types/chai': 4.3.11
-    dev: true
-
-  /@types/chai@4.3.11:
-    resolution: {integrity: sha512-qQR1dr2rGIHYlJulmr8Ioq3De0Le9E4MJ5AiaeAETJJpndT1uUNHsGFK3L/UIu+rbkQSdj8J/w2bCsBZc/Y5fQ==}
+  /@types/estree@1.0.5:
+    resolution: {integrity: sha512-/kYRxGDLWzHOB7q+wtSUQlFrtcdUccpfy+X+9iMBpHK8QLLhx2wIPYuS5DYtR9Wa/YlZAbIovy7qVdB1Aq6Lyw==}
    dev: true

  /@types/is-ci@3.0.4:
@@ -1261,41 +1284,41 @@ packages:
      ts-morph: 12.0.0
    dev: true

-  /@vitest/expect@0.34.6:
-    resolution: {integrity: sha512-QUzKpUQRc1qC7qdGo7rMK3AkETI7w18gTCUrsNnyjjJKYiuUB9+TQK3QnR1unhCnWRC0AbKv2omLGQDF/mIjOw==}
+  /@vitest/expect@2.0.0:
+    resolution: {integrity: sha512-5BSfZ0+dAVmC6uPF7s+TcKx0i7oyYHb1WQQL5gg6G2c+Qkaa5BNrdRM74sxDfUIZUgYCr6bfCqmJp+X5bfcNxQ==}
    dependencies:
-      '@vitest/spy': 0.34.6
-      '@vitest/utils': 0.34.6
-      chai: 4.3.10
+      '@vitest/spy': 2.0.0
+      '@vitest/utils': 2.0.0
+      chai: 5.1.1
    dev: true

-  /@vitest/runner@0.34.6:
-    resolution: {integrity: sha512-1CUQgtJSLF47NnhN+F9X2ycxUP0kLHQ/JWvNHbeBfwW8CzEGgeskzNnHDyv1ieKTltuR6sdIHV+nmR6kPxQqzQ==}
+  /@vitest/runner@2.0.0:
+    resolution: {integrity: sha512-OovFmlkfRmdhevbWImBUtn9IEM+CKac8O+m9p6W9jTATGVBnDJQ6/jb1gpHyWxsu0ALi5f+TLi+Uyst7AAimMw==}
    dependencies:
-      '@vitest/utils': 0.34.6
-      p-limit: 4.0.0
-      pathe: 1.1.1
+      '@vitest/utils': 2.0.0
+      pathe: 1.1.2
    dev: true

-  /@vitest/snapshot@0.34.6:
-    resolution: {integrity: sha512-B3OZqYn6k4VaN011D+ve+AA4whM4QkcwcrwaKwAbyyvS/NB1hCWjFIBQxAQQSQir9/RtyAAGuq+4RJmbn2dH4w==}
+  /@vitest/snapshot@2.0.0:
+    resolution: {integrity: sha512-B520cSAQwtWgocPpARadnNLslHCxFs5tf7SG2TT96qz+SZgsXqcB1xI3w3/S9kUzdqykEKrMLvW+sIIpMcuUdw==}
    dependencies:
-      magic-string: 0.30.5
-      pathe: 1.1.1
+      magic-string: 0.30.10
+      pathe: 1.1.2
      pretty-format: 29.7.0
    dev: true

-  /@vitest/spy@0.34.6:
-    resolution: {integrity: sha512-xaCvneSaeBw/cz8ySmF7ZwGvL0lBjfvqc1LpQ/vcdHEvpLn3Ff1vAvjw+CoGn0802l++5L/pxb7whwcWAw+DUQ==}
+  /@vitest/spy@2.0.0:
+    resolution: {integrity: sha512-0g7ho4wBK09wq8iNZFtUcQZcUcbPmbLWFotL0GXel0fvk5yPi4nTEKpIvZ+wA5eRyqPUCIfIUl10AWzLr67cmA==}
    dependencies:
-      tinyspy: 2.2.0
+      tinyspy: 3.0.0
    dev: true

-  /@vitest/utils@0.34.6:
-    resolution: {integrity: sha512-IG5aDD8S6zlvloDsnzHw0Ut5xczlF+kv2BOTo+iXfPr54Yhi5qbVOgGB1hZaVq4iJ4C/MZ2J0y15IlsV/ZcI0A==}
+  /@vitest/utils@2.0.0:
+    resolution: {integrity: sha512-t0jbx8VugWEP6A29NbyfQKVU68Vo6oUw0iX3a8BwO3nrZuivfHcFO4Y5UsqXlplX+83P9UaqEvC2YQhspC0JSA==}
    dependencies:
      diff-sequences: 29.6.3
-      loupe: 2.3.7
+      estree-walker: 3.0.3
+      loupe: 3.1.1
      pretty-format: 29.7.0
    dev: true

@@ -1490,8 +1513,9 @@ packages:
    engines: {node: '>=0.10.0'}
    dev: true

-  /assertion-error@1.1.0:
-    resolution: {integrity: sha512-jgsaNduz+ndvGyFt3uSuWqvy4lCnIJiovtouQN5JZHOKCS2QuhEdbcQHFhVksz2N2U9hXJo8odG7ETyWlEeuDw==}
+  /assertion-error@2.0.1:
+    resolution: {integrity: sha512-Izi8RQcffqCeNVgFigKli1ssklIbpHnCYc6AknXGYoB6grJqyeby7jv12JUQgmTAnIDnbck1uxksT4dzN3PWBA==}
+    engines: {node: '>=12'}
    dev: true

  /ast-metadata-inferer@0.8.0:
@@ -1636,17 +1660,15 @@ packages:
    resolution: {integrity: sha512-xrE//a3O7TP0vaJ8ikzkD2c2NgcVUvsEe2IvFTntV4Yd1Z9FVzh+gW+enX96L0psrbaFMcVcH2l90xNuGDWc8w==}
    dev: false

-  /chai@4.3.10:
-    resolution: {integrity: sha512-0UXG04VuVbruMUYbJ6JctvH0YnC/4q3/AkT18q4NaITo91CUm0liMS9VqzT9vZhVQ/1eqPanMWjBM+Juhfb/9g==}
-    engines: {node: '>=4'}
+  /chai@5.1.1:
+    resolution: {integrity: sha512-pT1ZgP8rPNqUgieVaEY+ryQr6Q4HXNg8Ei9UnLUrjN4IA7dvQC5JB+/kxVcPNDHyBcc/26CXPkbNzq3qwrOEKA==}
+    engines: {node: '>=12'}
    dependencies:
-      assertion-error: 1.1.0
-      check-error: 1.0.3
-      deep-eql: 4.1.3
-      get-func-name: 2.0.2
-      loupe: 2.3.7
-      pathval: 1.1.1
-      type-detect: 4.0.8
+      assertion-error: 2.0.1
+      check-error: 2.1.1
+      deep-eql: 5.0.2
+      loupe: 3.1.1
+      pathval: 2.0.0
    dev: true

  /chalk@2.4.2:
@@ -1668,10 +1690,9 @@ packages:
    resolution: {integrity: sha512-mT8iDcrh03qDGRRmoA2hmBJnxpllMR+0/0qlzjqZES6NdiWDcZkCNAk4rPFZ9Q85r27unkiNNg8ZOiwZXBHwcA==}
    dev: true

-  /check-error@1.0.3:
-    resolution: {integrity: sha512-iKEoDYaRmd1mxM90a2OEfWhjsjPpYPuQ+lMYsoxB126+t8fw7ySEO48nmDg5COTjxDI65/Y2OWpeEHk3ZOe8zg==}
-    dependencies:
-      get-func-name: 2.0.2
+  /check-error@2.1.1:
+    resolution: {integrity: sha512-OAlb+T7V4Op9OwdkjmguYRqncdlx5JiofwOAUkmTF+jNdHwzTaTs4sRAGpzLF3oOz5xAyDGrPgeIDFQmDOTiJw==}
+    engines: {node: '>= 16'}
    dev: true

  /chokidar@3.3.1:
@@ -1888,6 +1909,18 @@ packages:
    dependencies:
      ms: 2.1.2

+  /debug@4.3.5:
+    resolution: {integrity: sha512-pt0bNEmneDIvdL1Xsd9oDQ/wrQRkXDT4AUWlNZNPKvW5x/jyO9VFXkJUP07vQ2upmw5PlaITaPKc31jK13V+jg==}
+    engines: {node: '>=6.0'}
+    peerDependencies:
+      supports-color: '*'
+    peerDependenciesMeta:
+      supports-color:
+        optional: true
+    dependencies:
+      ms: 2.1.2
+    dev: true
+
  /decamelize-keys@1.1.1:
    resolution: {integrity: sha512-WiPxgEirIV0/eIOMcnFBA3/IJZAZqKnwAwWyvvdi4lsr1WCN22nhdf/3db3DoZcUjTV2SqfzIwNyp6y2xs3nmg==}
    engines: {node: '>=0.10.0'}
@@ -1901,11 +1934,9 @@ packages:
    engines: {node: '>=0.10.0'}
    dev: true

-  /deep-eql@4.1.3:
-    resolution: {integrity: sha512-WaEtAOpRA1MQ0eohqZjpGD8zdI0Ovsm8mmFhaDN8dvDZzyoUMcYDnf5Y6iu7HTXxf8JDS23qWa4a+hKCDyOPzw==}
+  /deep-eql@5.0.2:
+    resolution: {integrity: sha512-h5k/5U50IJJFpzfL6nO9jaaumfjO/f2NjK/oYB2Djzm4p9L+3T9qWpZqZ2hAbLPuuYq9wrU08WQyBTL5GbPk5Q==}
    engines: {node: '>=6'}
-    dependencies:
-      type-detect: 4.0.8
    dev: true

  /deep-is@0.1.4:
@@ -2749,6 +2780,12 @@ packages:
    resolution: {integrity: sha512-Rfkk/Mp/DL7JVje3u18FxFujQlTNR2q6QfMSMB7AvCBx91NGj/ba3kCfza0f6dVDbw7YlRf/nDrn7pQrCCyQ/w==}
    dev: true

+  /estree-walker@3.0.3:
+    resolution: {integrity: sha512-7RUKfXgSMMkzt6ZuXmqapOurLGPPfgj6l9uRZ7lRGolvk0y2yocc35LdcxKC5PQZdn2DMqioAQ2NoWcrTKmm6g==}
+    dependencies:
+      '@types/estree': 1.0.5
+    dev: true
+
  /esutils@2.0.3:
    resolution: {integrity: sha512-kVscqXk4OCp68SZ0dkgEKVi6/8ij300KBWTJq32P/dYeWTSwK41WyTxalN1eRmA5Z9UU/LX9D7FWSmV9SAYx6g==}
    engines: {node: '>=0.10.0'}
@@ -2778,6 +2815,21 @@ packages:
      strip-final-newline: 2.0.0
    dev: true

+  /execa@8.0.1:
+    resolution: {integrity: sha512-VyhnebXciFV2DESc+p6B+y0LjSm0krU4OgJN44qFAhBY0TJ+1V61tYD2+wHusZ6F9n5K+vl8k0sTy7PEfV4qpg==}
+    engines: {node: '>=16.17'}
+    dependencies:
+      cross-spawn: 7.0.3
+      get-stream: 8.0.1
+      human-signals: 5.0.0
+      is-stream: 3.0.0
+      merge-stream: 2.0.0
+      npm-run-path: 5.3.0
+      onetime: 6.0.0
+      signal-exit: 4.1.0
+      strip-final-newline: 3.0.0
+    dev: true
+
  /exit-hook@2.2.1:
    resolution: {integrity: sha512-eNTPlAD67BmP31LDINZ3U7HSF8l57TxOY2PmBJ1shpCvpnxBF93mWCE8YHBnXs8qiUZJc9WDcWIeC3a2HIAMfw==}
    engines: {node: '>=6'}
@@ -2998,6 +3050,11 @@ packages:
      pump: 3.0.0
    dev: true

+  /get-stream@8.0.1:
+    resolution: {integrity: sha512-VaUJspBffn/LMCJVoMvSAdmscJyS1auj5Zulnn5UoYcY531UWmdwhRWkcGKnGU93m5HSXP9LP2usOryrBtQowA==}
+    engines: {node: '>=16'}
+    dev: true
+
  /get-symbol-description@1.0.0:
    resolution: {integrity: sha512-2EmdH1YvIQiZpltCNgkuiUnyukzxM/R6NDJX31Ke3BG1Nq5b0S2PhX59UKi9vZpPDQVdqn+1IcaAwnzTT5vCjw==}
    engines: {node: '>= 0.4'}
@@ -3170,6 +3227,11 @@ packages:
    engines: {node: '>=8.12.0'}
    dev: true

+  /human-signals@5.0.0:
+    resolution: {integrity: sha512-AXcZb6vzzrFAUE61HnN4mpLqd/cSIwNQjtNWR0euPm6y0iqx3G4gOXaIDdtdDwZmhwe82LA6+zinmW4UBWVePQ==}
+    engines: {node: '>=16.17.0'}
+    dev: true
+
  /husky@8.0.3:
    resolution: {integrity: sha512-+dQSyqPh4x1hlO1swXBiNb2HzTDN1I2IGLQx1GrBuiqFJfoMrnZWwVmatvSiO+Iz8fBUnf+lekwNo4c2LlXItg==}
    engines: {node: '>=14'}
@@ -3341,6 +3403,11 @@ packages:
    engines: {node: '>=8'}
    dev: true

+  /is-stream@3.0.0:
+    resolution: {integrity: sha512-LnQR4bZ9IADDRSkvpqMGvt/tEJWclzklNgSw48V5EAaAeDd6qGvN8ei6k5p0tvxSR171VmGyHuTiAOfxAbr8kA==}
+    engines: {node: ^12.20.0 || ^14.13.1 || >=16.0.0}
+    dev: true
+
  /is-string@1.0.7:
    resolution: {integrity: sha512-tE2UXzivje6ofPW7l23cjDOMa09gb7xlAqG6jG5ej6uPV32TlWP3NKPigtaGeHNu9fohccRYvIiZMfOOnOYUtg==}
    engines: {node: '>= 0.4'}
@@ -3455,10 +3522,6 @@ packages:
    hasBin: true
    dev: false

-  /jsonc-parser@3.2.0:
-    resolution: {integrity: sha512-gfFQZrcTc8CnKXp6Y4/CBT3fTc0OVuDofpre4aEeEpSBPV5X5v4+Vmx+8snU7RLPrNHPKSgLxGo9YuQzz20o+w==}
-    dev: true
-
  /jsonfile@4.0.0:
    resolution: {integrity: sha512-m6F1R3z8jjlf2imQHS2Qez5sjKWQzbuuhuJ/FKYFRZvPE3PuHcSMVZzfsLhGVOkfd20obL5SWEBew5ShlquNxg==}
    optionalDependencies:
@@ -3518,11 +3581,6 @@ packages:
      strip-bom: 3.0.0
    dev: true

-  /local-pkg@0.4.3:
-    resolution: {integrity: sha512-SFppqq5p42fe2qcZQqqEOiVRXl+WCP1MdT6k7BDEW1j++sp5fIY+/fdRQitvKgB5BrBcmrs5m/L0v2FrU5MY1g==}
-    engines: {node: '>=14'}
-    dev: true
-
  /locate-path@5.0.0:
    resolution: {integrity: sha512-t7hw9pI+WvuwNJXwk5zVHpyhIqzg2qTlklJOf0mVxGSbe3Fp2VieZcduNYjaLDoy6p9uGpQEGWG87WpMKlNq8g==}
    engines: {node: '>=8'}
@@ -3550,8 +3608,8 @@ packages:
    resolution: {integrity: sha512-v2kDEe57lecTulaDIuNTPy3Ry4gLGJ6Z1O3vE1krgXZNrsQ+LFTGHVxVjcXPs17LhbZVGedAJv8XZ1tvj5FvSg==}
    dev: false

-  /loupe@2.3.7:
-    resolution: {integrity: sha512-zSMINGVYkdpYSOBmLi0D1Uo7JU9nVdQKrHxC8eYlV+9YKK9WePqAlL7lSlorG/U2Fw1w0hTBmaa/jrQ3UbPHtA==}
+  /loupe@3.1.1:
+    resolution: {integrity: sha512-edNu/8D5MKVfGVFRhFf8aAxiTM6Wumfz5XsaatSxlD3w4R1d/WEKUTydCdPGbl9K7QG/Ca3GnDV2sIKIpXRQcw==}
    dependencies:
      get-func-name: 2.0.2
    dev: true
@@ -3569,9 +3627,8 @@ packages:
    dependencies:
      yallist: 4.0.0

-  /magic-string@0.30.5:
-    resolution: {integrity: sha512-7xlpfBaQaP/T6Vh8MO/EqXSW5En6INHEvEXQiuff7Gku0PWjU3uf6w/j9o7O+SpB5fOAkrI5HeoNgwjEO0pFsA==}
-    engines: {node: '>=12'}
+  /magic-string@0.30.10:
+    resolution: {integrity: sha512-iIRwTIf0QKV3UAnYK4PU8uiEc4SRh5jX0mwpIwETPpHdhVM4f53RSwS/vXvN1JhGX+Cs7B8qIq3d6AH49O5fAQ==}
    dependencies:
      '@jridgewell/sourcemap-codec': 1.4.15
    dev: true
@@ -3644,6 +3701,11 @@ packages:
    engines: {node: '>=6'}
    dev: true

+  /mimic-fn@4.0.0:
+    resolution: {integrity: sha512-vqiC06CuhBTUdZH+RYl8sFrL096vA45Ok5ISO6sE/Mr1jRbGH4Csnhi8f3wKVl7x8mO4Au7Ir9D3Oyv1VYMFJw==}
+    engines: {node: '>=12'}
+    dev: true
+
  /min-indent@1.0.1:
    resolution: {integrity: sha512-I9jwMn07Sy/IwOj3zVkVik2JTvgpaykDZEigL6Rx6N9LbMywwUSMtxET+7lVoDLLd3O3IXwJwvuuns8UB/HeAg==}
    engines: {node: '>=4'}
@@ -3723,15 +3785,6 @@ packages:
    hasBin: true
    dev: true

-  /mlly@1.4.2:
-    resolution: {integrity: sha512-i/Ykufi2t1EZ6NaPLdfnZk2AX8cs0d+mTzVKuPfqPKPatxLApaBoxJQ9x1/uckXtrS/U5oisPMDkNs0yQTaBRg==}
-    dependencies:
-      acorn: 8.11.2
-      pathe: 1.1.1
-      pkg-types: 1.0.3
-      ufo: 1.3.2
-    dev: true
-
  /mri@1.2.0:
    resolution: {integrity: sha512-tzzskb3bG8LvYGFF/mDTpq3jpI6Q9wc3LEmBaghu+DdCssd1FakN7Bc0hVNmEyGq1bq3RgfkCb3cmQLpNPOroA==}
    engines: {node: '>=4'}
@@ -3830,6 +3883,13 @@ packages:
      path-key: 3.1.1
    dev: true

+  /npm-run-path@5.3.0:
+    resolution: {integrity: sha512-ppwTtiJZq0O/ai0z7yfudtBpWIoxM8yE6nHi1X47eFR2EWORqfbu6CnPlNsjeN683eT0qG6H/Pyf9fCcvjnnnQ==}
+    engines: {node: ^12.20.0 || ^14.13.1 || >=16.0.0}
+    dependencies:
+      path-key: 4.0.0
+    dev: true
+
  /npmlog@5.0.1:
    resolution: {integrity: sha512-AqZtDUWOMKs1G/8lwylVjrdYgqA4d9nu8hc+0gzRxlDb1I10+FHBGMXs6aiQHFdCUUlqH99MUMuLfzWDNDtfxw==}
    dependencies:
@@ -3911,6 +3971,13 @@ packages:
      mimic-fn: 2.1.0
    dev: true

+  /onetime@6.0.0:
+    resolution: {integrity: sha512-1FlR+gjXK7X+AsAHso35MnyN5KqGwJRi/31ft6x0M194ht7S+rWAvd7PHss9xSKMzE0asv1pyIHaJYq+BbacAQ==}
+    engines: {node: '>=12'}
+    dependencies:
+      mimic-fn: 4.0.0
+    dev: true
+
  /optionator@0.9.3:
    resolution: {integrity: sha512-JjCoypp+jKn1ttEFExxhetCKeJt9zhAgAve5FXHixTvFDW/5aEktX9bufBKLRRMdU7bNtpLfcGu94B3cdEJgjg==}
    engines: {node: '>= 0.8.0'}
@@ -3960,13 +4027,6 @@ packages:
    dependencies:
      yocto-queue: 0.1.0

-  /p-limit@4.0.0:
-    resolution: {integrity: sha512-5b0R4txpzjPWVw/cXXUResoD4hb6U/x9BH08L7nw+GN1sezDzPdxeRvpc9c433fZhBan/wusjbCsqwqm4EIBIQ==}
-    engines: {node: ^12.20.0 || ^14.13.1 || >=16.0.0}
-    dependencies:
-      yocto-queue: 1.0.0
-    dev: true
-
  /p-locate@4.1.0:
    resolution: {integrity: sha512-R79ZZ/0wAxKGu3oYMlz8jy/kbhsNrS7SKZ7PxEHBgJ5+F2mtFW2fK2cOtBh1cHYkQsbzFV7I+EoRKe6Yt0oK7A==}
    engines: {node: '>=8'}
@@ -4024,6 +4084,11 @@ packages:
    resolution: {integrity: sha512-ojmeN0qd+y0jszEtoY48r0Peq5dwMEkIlCOu6Q5f41lfkswXuKtYrhgoTpLnyIcHm24Uhqx+5Tqm2InSwLhE6Q==}
    engines: {node: '>=8'}

+  /path-key@4.0.0:
+    resolution: {integrity: sha512-haREypq7xkM7ErfgIyA0z+Bj4AGKlMSdlQE2jvJo6huWD1EdkKYV+G/T4nq0YEF2vgTT8kqMFKo1uHn950r4SQ==}
+    engines: {node: '>=12'}
+    dev: true
+
  /path-match@1.2.4:
    resolution: {integrity: sha512-UWlehEdqu36jmh4h5CWJ7tARp1OEVKGHKm6+dg9qMq5RKUTV5WJrGgaZ3dN2m7WFAXDbjlHzvJvL/IUpy84Ktw==}
    dependencies:
@@ -4052,12 +4117,13 @@ packages:
    resolution: {integrity: sha512-gDKb8aZMDeD/tZWs9P6+q0J9Mwkdl6xMV8TjnGP3qJVJ06bdMgkbBlLU8IdfOsIsFz2BW1rNVT3XuNEl8zPAvw==}
    engines: {node: '>=8'}

-  /pathe@1.1.1:
-    resolution: {integrity: sha512-d+RQGp0MAYTIaDBIMmOfMwz3E+LOZnxx1HZd5R18mmCZY0QBlK0LDZfPc8FW8Ed2DlvsuE6PRjroDY+wg4+j/Q==}
+  /pathe@1.1.2:
+    resolution: {integrity: sha512-whLdWMYL2TwI08hn8/ZqAbrVemu0LNaNNJZX73O6qaIdCTfXutsLhMkjdENX0qhsQ9uIimo4/aQOmXkoon2nDQ==}
    dev: true

-  /pathval@1.1.1:
-    resolution: {integrity: sha512-Dp6zGqpTdETdR63lehJYPeIOqpiNBNtc7BpWSLrOje7UaIsE5aY92r/AunQA7rsXvet3lrJ3JnZX29UPTKXyKQ==}
+  /pathval@2.0.0:
+    resolution: {integrity: sha512-vE7JKRyES09KiunauX7nd2Q9/L7lhok4smP9RZTDeD4MVs72Dp2qNFVz39Nz5a0FVEW0BJR6C0DYrq6unoziZA==}
+    engines: {node: '>= 14.16'}
    dev: true

  /pend@1.2.0:
@@ -4067,6 +4133,10 @@ packages:
  /picocolors@1.0.0:
    resolution: {integrity: sha512-1fygroTLlHu66zi26VoTDv8yRgm0Fccecssto+MhsZ0D/DGW2sm8E8AjW7NU5VVTRt5GxbeZ5qBuJr+HyLYkjQ==}

+  /picocolors@1.0.1:
+    resolution: {integrity: sha512-anP1Z8qwhkbmu7MFP5iTt+wQKXgwzf7zTyGlcdzabySa9vd0Xt392U0rVmz9poOaBj0uHJKyyo9/upk0HrEQew==}
+    dev: true
+
  /picomatch@2.3.1:
    resolution: {integrity: sha512-JU3teHTNjmE2VCGFzuY8EXzCDVwEqB2a8fsIvwaStHhAWJEeVd1o1QD80CU6+ZdEXXSLbSsuLwJjkCBWqRQUVA==}
    engines: {node: '>=8.6'}
@@ -4083,14 +4153,6 @@ packages:
      find-up: 4.1.0
    dev: true

-  /pkg-types@1.0.3:
-    resolution: {integrity: sha512-nN7pYi0AQqJnoLPC9eHFQ8AcyaixBUOwvqc5TDnIKCMEE6I0y8P7OKA7fPexsXGCGxQDl/cmrLAp26LhcwxZ4A==}
-    dependencies:
-      jsonc-parser: 3.2.0
-      mlly: 1.4.2
-      pathe: 1.1.1
-    dev: true
-
  /pluralize@8.0.0:
    resolution: {integrity: sha512-Nc3IT5yHzflTfbjgqWcCPpo7DaKy4FnpB0l/zCAW0Tc7jxAiuqSxHasntB3D7887LSrA93kDJ9IXovxJYxyLCA==}
    engines: {node: '>=4'}
@@ -4101,7 +4163,7 @@ packages:
    engines: {node: ^10 || ^12 || >=14}
    dependencies:
      nanoid: 3.3.7
-      picocolors: 1.0.0
+      picocolors: 1.0.1
      source-map-js: 1.0.2
    dev: true

@@ -4447,6 +4509,11 @@ packages:
    engines: {node: '>=14'}
    dev: true

+  /signal-exit@4.1.0:
+    resolution: {integrity: sha512-bzyZ1e88w9O1iNJbKnOlvYTrWPDl46O1bG0D3XInv+9tkPrxrN8jUUTiFlDkkmKWgn1M6CfIA13SuGqOa9Korw==}
+    engines: {node: '>=14'}
+    dev: true
+
  /slash@3.0.0:
    resolution: {integrity: sha512-g9Q1haeby36OSStwb4ntCGGGaKsaVSjQ68fBxoQcutl5fS1vuY18H3wSt3jFyFtrkx+Kz0V1G85A4MyAdDMi2Q==}
    engines: {node: '>=8'}
@@ -4511,8 +4578,8 @@ packages:
    engines: {node: '>= 0.6'}
    dev: true

-  /std-env@3.5.0:
-    resolution: {integrity: sha512-JGUEaALvL0Mf6JCfYnJOTcobY+Nc7sG/TemDRBqCA0wEr4DER7zDchaaixTlmOxAjG1uRJmX82EQcxwTQTkqVA==}
+  /std-env@3.7.0:
+    resolution: {integrity: sha512-JPbdCEQLj1w5GilpiHAx3qJvFndqybBysA3qUOnznweH4QbNYUsW/ea8QzSrnh0vNsezMMw5bcVool8lM0gwzg==}
    dev: true

  /stream-to-array@2.3.0:
@@ -4587,6 +4654,11 @@ packages:
    engines: {node: '>=6'}
    dev: true

+  /strip-final-newline@3.0.0:
+    resolution: {integrity: sha512-dOESqjYr96iWYylGObzd39EuNTa5VJxyvVAEm5Jnh7KGo75V43Hk1odPQkNDyXNmUR6k+gEiDVXnjB8HJ3crXw==}
+    engines: {node: '>=12'}
+    dev: true
+
  /strip-indent@3.0.0:
    resolution: {integrity: sha512-laJTa3Jb+VQpaC6DseHhF7dXVqHTfJPCRDaEbid/drOhgitgYku/letMUqOXFoWV0zIIUbjpdH2t+tYj4bQMRQ==}
    engines: {node: '>=8'}
@@ -4597,12 +4669,6 @@ packages:
    resolution: {integrity: sha512-6fPc+R4ihwqP6N/aIv2f1gMH8lOVtWQHoqC4yK6oSDVVocumAsfCqjkXnqiYMhmMwS/mEHLp7Vehlt3ql6lEig==}
    engines: {node: '>=8'}

-  /strip-literal@1.3.0:
-    resolution: {integrity: sha512-PugKzOsyXpArk0yWmUwqOZecSO0GH0bPoctLcqNDH9J04pVW3lflYE0ujElBGTloevcxF5MofAOZ7C5l2b+wLg==}
-    dependencies:
-      acorn: 8.11.2
-    dev: true
-
  /supports-color@5.5.0:
    resolution: {integrity: sha512-QjVjwdXIt408MIiAqCX4oUKsgU2EqAGzs2Ppkm4aQYbjm+ZEWEcW4SfFNTr4uMNZma0ey4f5lgLrkB0aX0QMow==}
    engines: {node: '>=4'}
@@ -4664,17 +4730,17 @@ packages:
      convert-hrtime: 3.0.0
    dev: true

-  /tinybench@2.5.1:
-    resolution: {integrity: sha512-65NKvSuAVDP/n4CqH+a9w2kTlLReS9vhsAP06MWx+/89nMinJyB2icyl58RIcqCmIggpojIGeuJGhjU1aGMBSg==}
+  /tinybench@2.8.0:
+    resolution: {integrity: sha512-1/eK7zUnIklz4JUUlL+658n58XO2hHLQfSk1Zf2LKieUjxidN16eKFEoDEfjHc3ohofSSqK3X5yO6VGb6iW8Lw==}
    dev: true

-  /tinypool@0.7.0:
-    resolution: {integrity: sha512-zSYNUlYSMhJ6Zdou4cJwo/p7w5nmAH17GRfU/ui3ctvjXFErXXkruT4MWW6poDeXgCaIBlGLrfU6TbTXxyGMww==}
-    engines: {node: '>=14.0.0'}
+  /tinypool@1.0.0:
+    resolution: {integrity: sha512-KIKExllK7jp3uvrNtvRBYBWBOAXSX8ZvoaD8T+7KB/QHIuoJW3Pmr60zucywjAlMb5TeXUkcs/MWeWLu0qvuAQ==}
+    engines: {node: ^18.0.0 || >=20.0.0}
    dev: true

-  /tinyspy@2.2.0:
-    resolution: {integrity: sha512-d2eda04AN/cPOR89F7Xv5bK/jrQEhmcLFe6HFldoeO9AJtps+fqEnh486vnT/8y4bw38pSyxDcTCAq+Ks2aJTg==}
+  /tinyspy@3.0.0:
+    resolution: {integrity: sha512-q5nmENpTHgiPVd1cJDDc9cVoYN5x4vCvwT3FMilvKPKneCBZAxn2YWQjDF0UMcE9k0Cay1gBiDfTMU0g+mPMQA==}
    engines: {node: '>=14.0.0'}
    dev: true

@@ -4864,11 +4930,6 @@ packages:
    dependencies:
      prelude-ls: 1.2.1

-  /type-detect@4.0.8:
-    resolution: {integrity: sha512-0fr/mIH1dlO+x7TlcMy+bIDqKPsw/70tVyeHW787goQjhmqaZe10uwLujubK9q9Lg6Fiho1KUKDYz0Z7k7g5/g==}
-    engines: {node: '>=4'}
-    dev: true
-
  /type-fest@0.13.1:
    resolution: {integrity: sha512-34R7HTnG0XIJcBSn5XhDd7nNFPRcXYRZrBB2O2jdKqYODldSzBAqzsWoZYYvduky73toYS/ESqxPvkDf/F0XMg==}
    engines: {node: '>=10'}
@@ -4932,10 +4993,6 @@ packages:
    hasBin: true
    dev: false

-  /ufo@1.3.2:
-    resolution: {integrity: sha512-o+ORpgGwaYQXgqGDwd+hkS4PuZ3QnmqMMxRuajK/a38L6fTpcE5GPIfrf+L/KemFzfUpeUQc1rRS1iDBozvnFA==}
-    dev: true
-
  /uhyphen@0.2.0:
    resolution: {integrity: sha512-qz3o9CHXmJJPGBdqzab7qAYuW8kQGKNEuoHFYrBwV6hWIMcpAmxDLXojcHfFr9US1Pe6zUswEIJIbLI610fuqA==}
    dev: true
@@ -5038,17 +5095,16 @@ packages:
      - supports-color
    dev: true

-  /vite-node@0.34.6(@types/node@20.10.0):
-    resolution: {integrity: sha512-nlBMJ9x6n7/Amaz6F3zJ97EBwR2FkzhBRxF5e+jE6LA3yi6Wtc2lyTij1OnDMIr34v5g/tVQtsVAzhT0jc5ygA==}
-    engines: {node: '>=v14.18.0'}
+  /vite-node@2.0.0(@types/node@14.18.33):
+    resolution: {integrity: sha512-jZtezmjcgZTkMisIi68TdY8w/PqPTxK2pbfTU9/4Gqus1K3AVZqkwH0z7Vshe3CD6mq9rJq8SpqmuefDMIqkfQ==}
+    engines: {node: ^18.0.0 || >=20.0.0}
    hasBin: true
    dependencies:
      cac: 6.7.14
-      debug: 4.3.4
-      mlly: 1.4.2
-      pathe: 1.1.1
-      picocolors: 1.0.0
-      vite: 5.0.2(@types/node@20.10.0)
+      debug: 4.3.5
+      pathe: 1.1.2
+      picocolors: 1.0.1
+      vite: 5.0.2(@types/node@14.18.33)
    transitivePeerDependencies:
      - '@types/node'
      - less
@@ -5060,7 +5116,7 @@ packages:
      - terser
    dev: true

-  /vite@5.0.2(@types/node@20.10.0):
+  /vite@5.0.2(@types/node@14.18.33):
    resolution: {integrity: sha512-6CCq1CAJCNM1ya2ZZA7+jS2KgnhbzvxakmlIjN24cF/PXhRMzpM/z8QgsVJA/Dm5fWUWnVEsmtBoMhmerPxT0g==}
    engines: {node: ^18.0.0 || >=20.0.0}
    hasBin: true
@@ -5088,7 +5144,7 @@ packages:
      terser:
        optional: true
    dependencies:
-      '@types/node': 20.10.0
+      '@types/node': 14.18.33
      esbuild: 0.19.8
      postcss: 8.4.31
      rollup: 4.6.0
@@ -5096,22 +5152,22 @@ packages:
      fsevents: 2.3.3
    dev: true

-  /vitest@0.34.6:
-    resolution: {integrity: sha512-+5CALsOvbNKnS+ZHMXtuUC7nL8/7F1F2DnHGjSsszX8zCjWSSviphCb/NuS9Nzf4Q03KyyDRBAXhF/8lffME4Q==}
-    engines: {node: '>=v14.18.0'}
+  /vitest@2.0.0(@types/node@14.18.33):
+    resolution: {integrity: sha512-NvccE2tZhIoPSq3o3AoTBmItwhHNjzIxvOgfdzILIscyzSGOtw2+A1d/JJbS86HDVbc6TS5HnckQuCgTfp0HDQ==}
+    engines: {node: ^18.0.0 || >=20.0.0}
    hasBin: true
    peerDependencies:
      '@edge-runtime/vm': '*'
-      '@vitest/browser': '*'
-      '@vitest/ui': '*'
+      '@types/node': ^18.0.0 || >=20.0.0
+      '@vitest/browser': 2.0.0
+      '@vitest/ui': 2.0.0
      happy-dom: '*'
      jsdom: '*'
-      playwright: '*'
-      safaridriver: '*'
-      webdriverio: '*'
    peerDependenciesMeta:
      '@edge-runtime/vm':
        optional: true
+      '@types/node':
+        optional: true
      '@vitest/browser':
        optional: true
      '@vitest/ui':
@@ -5120,36 +5176,25 @@ packages:
        optional: true
      jsdom:
        optional: true
-      playwright:
-        optional: true
-      safaridriver:
-        optional: true
-      webdriverio:
-        optional: true
    dependencies:
-      '@types/chai': 4.3.11
-      '@types/chai-subset': 1.3.5
-      '@types/node': 20.10.0
-      '@vitest/expect': 0.34.6
-      '@vitest/runner': 0.34.6
-      '@vitest/snapshot': 0.34.6
-      '@vitest/spy': 0.34.6
-      '@vitest/utils': 0.34.6
-      acorn: 8.11.2
-      acorn-walk: 8.3.0
-      cac: 6.7.14
-      chai: 4.3.10
-      debug: 4.3.4
-      local-pkg: 0.4.3
-      magic-string: 0.30.5
-      pathe: 1.1.1
-      picocolors: 1.0.0
-      std-env: 3.5.0
-      strip-literal: 1.3.0
-      tinybench: 2.5.1
-      tinypool: 0.7.0
-      vite: 5.0.2(@types/node@20.10.0)
-      vite-node: 0.34.6(@types/node@20.10.0)
+      '@ampproject/remapping': 2.3.0
+      '@types/node': 14.18.33
+      '@vitest/expect': 2.0.0
+      '@vitest/runner': 2.0.0
+      '@vitest/snapshot': 2.0.0
+      '@vitest/spy': 2.0.0
+      '@vitest/utils': 2.0.0
+      chai: 5.1.1
+      debug: 4.3.5
+      execa: 8.0.1
+      magic-string: 0.30.10
+      pathe: 1.1.2
+      picocolors: 1.0.1
+      std-env: 3.7.0
+      tinybench: 2.8.0
+      tinypool: 1.0.0
+      vite: 5.0.2(@types/node@14.18.33)
+      vite-node: 2.0.0(@types/node@14.18.33)
      why-is-node-running: 2.2.2
    transitivePeerDependencies:
      - less
@@ -5370,8 +5415,3 @@ packages:
  /yocto-queue@0.1.0:
    resolution: {integrity: sha512-rVksvsnNCdJ/ohGc6xgPwyN8eheCxsiLM8mxuE/t/mOVqJewPuO1miLpTHQiRgTKCLexL4MeAFVagts7HmNZ2Q==}
    engines: {node: '>=10'}
-
-  /yocto-queue@1.0.0:
-    resolution: {integrity: sha512-9bnSc/HEW2uRy67wc+T8UwauLuPJVn28jb+GtJY16iiKWyvmYJRXVT4UamsAEGQfPohgr2q4Tq0sQbQlxTfi1g==}
-    engines: {node: '>=12.20'}
-    dev: true
--- a/src/css/style.css
+++ b/src/css/style.css
@@ -0,0 +1,194 @@
+@import url('https://fonts.googleapis.com/css2?family=Roboto:ital,wght@0,100;0,300;0,400;0,500;0,700;0,900;1,100;1,300;1,400;1,500;1,700;1,900&display=swap');
+
+:root {
+	--banner-color: #b1b1b1;
+	--banner-bgc: #000;
+	--options-bgc: #0a0a0a;
+	--border-color: #404040;
+	--dark-txt-color: #404040;
+	--light-txt-color: #ffffff;
+}
+
+html, body {
+	font-family: 'Roboto', sans-serif;
+	height: 100%;
+	margin: 0;
+	padding: 0;
+}
+
+body {
+	min-height: 100%;
+}
+
+
+.container {
+	background-color: var(--banner-bgc);
+	display: grid;
+	height: 100%;
+	grid-template-columns: repeat(2, 50%);
+}
+
+
+.banner {
+	background-color: var(--banner-color);
+	height: 100px;
+	width: 300px;
+	align-self: center;
+	justify-self: center;
+	border-radius: 20px;
+	box-shadow: 0px 10px 20px 10px rgb(58, 58, 58);
+	margin: 40px;
+}
+
+.options {
+	/* background-color: var(--options-bgc); */
+	color: white;
+	padding: 70px;
+	overflow: auto;
+	overflow-x: hidden;
+}
+
+input::placeholder {
+	color: var(--dark-txt-color);
+	text-shadow: none;
+}
+
+label {
+	color: var(--dark-txt-color);
+	font-size: 1.5rem;
+	align-self: center;
+}
+
+h1 {
+	font-size: 2.5rem;
+}
+
+h1, input {
+	text-shadow: 0 0 5px #fff;
+}
+
+.txt-input, select, .style-layout > input[type="color"] {
+	background: var(--options-bgc);
+	border: solid 1px var(--border-color);
+	height: 3rem;
+	border-radius: 6px;
+	width: 20rem;
+	
+	padding-left: 1rem;
+	padding-right: 1rem;
+	font-size: 1.5rem;
+	color: var(--light-txt-color);
+	font-weight: 400;
+	transition: all .2s ease-in-out;
+	box-sizing: border-box;
+}
+
+input:focus, select:focus, .style-layout > input[type="color"]:focus {
+	outline: none !important;
+	border: solid 1px #a3a3a3 ;
+	box-shadow: 0px 0px 0px 4px #3f3f46;
+}
+
+.options-grid-container {
+	display: grid;
+	grid-template-columns: repeat(auto-fit, minmax(350px, 1fr));
+	align-items: start;
+	row-gap: 30px;
+}
+
+#layout {
+	color: var(--dark-txt-color);
+}
+
+input[type="radio"], input[type="checkbox"] {
+	-webkit-appearance: none;
+	appearance: none;
+	margin: 0;
+	background-color: #3c3c3c;
+	font: inherit;
+	color: currentColor;
+	width:2rem;
+	height: 2rem;
+	border-radius: 50%;
+
+}
+
+input[type="radio"]:focus, input[type="checkbox"]:focus {
+	border-style: none;
+	box-shadow: none;
+}
+
+input[type="radio"]:checked, input[type="checkbox"]:checked {
+	background-color: #fff;
+	transition: all .5s ease-out;
+	box-shadow: 0 0 10px 5px rgb(100, 100, 100);
+}
+
+input[type="radio"]:not(:checked), input[type="checkbox"]:not(:checked) {
+	transition: all .5s ease-out;
+	box-shadow: none;
+}
+
+.center-txt-vertically {
+	display: flex;
+	align-items: center;
+	gap: 10px;
+}
+
+.list-of-items {
+	display: grid;
+	align-items: start;
+	justify-content: start;
+	gap: 10px;
+} 
+
+.span-all {
+	grid-column: 1 / -1;
+}
+
+#bg-img-link {
+	align-self: center;
+}
+
+.style-layout, .repo-wrapper {
+	display: grid;
+	gap: 15px;
+}
+
+ .style-layout > input[type="color"] {
+	padding: 0;
+}
+
+@media only screen and (max-width: 800px) {
+	.container {
+		grid-template-columns: 100%;
+	}
+	.options-grid-container {
+		justify-items: center;
+	}
+	.options {
+		display: grid;
+		justify-content: center;
+		overflow-x: hidden;
+	}
+}
+
+.centralize-verticaly {
+	display: grid;
+	align-content: center;
+	background-color: var(--options-bgc);
+	overflow: auto;
+	overflow-x: hidden;
+}
+
+.repo-wrapper {
+	border: solid 1px var(--dark-txt-color);
+	border-radius: 6px;
+	padding: 1rem;
+	width: 20rem;
+	box-sizing: border-box;
+}
+
+.repo-wrapper > input {
+	width: 100%;
+}
Author	SHA1	Message	Date
renovate[bot]	7c3cbfb5a2	chore(deps): update dependency vitest to v2	2024-07-08 13:18:07 +00:00
sxpphickat	c19f4dd646	Merge pull request #18 from LoredDev/10-frontend-form-control feat(frontend): form html and css fim do hiatus	2023-12-26 19:02:56 -03:00
sxpphickat	31bca044ea	fix(front): 🐛 wrapping repo infos	2023-12-07 18:33:04 -03:00
sxpphickat	9d17f06732	fix(front): 🐛 aligning items better	2023-12-06 09:35:07 -03:00
sxpphickat	edd8c7edd1	fix(front): 🐛 layout and background input sizes	2023-12-01 14:20:15 -03:00
sxpphickat	157cc4bb7d	feat(front): ✨ responsive design	2023-12-01 12:42:25 -03:00
sxpphickat	0ad8ba8ef8	refactor(front): ♻️ change main design	2023-12-01 10:35:17 -03:00
sxpphickat	14a32d750c	feat(front): ✨ style.css base	2023-11-28 21:04:21 -03:00
sxpphickat	71bfabb32f	feat(front): ✨ index.html base	2023-11-28 21:02:43 -03:00