chore(deps): update actions/cache action to v4

Merge pull request #18 from LoredDev/10-frontend-form-control
feat(frontend): form html and css fim do hiatus
2024-01-17 17:38:28 +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
19 changed files with 2566 additions and 48 deletions
--- a/.changeset/hot-seals-enjoy.md
+++ b/.changeset/hot-seals-enjoy.md
@@ -0,0 +1,5 @@
+---
+"@LoredMarkdown/banners": minor
+---
+
+Created the banners layouts for the Banner Library.
--- a/.github/actions/pnpm-setup/action.yml
+++ b/.github/actions/pnpm-setup/action.yml
@@ -36,7 +36,7 @@ runs:
        echo "STORE_PATH=$(pnpm store path)" >> $GITHUB_OUTPUT

    - name: Setup pnpm cache
-      uses: actions/cache@v3
+      uses: actions/cache@v4
      with:
        path: ${{ steps.pnpm-cache.outputs.STORE_PATH }}
        key: ${{ runner.os }}-pnpm-store-${{ hashFiles('**/pnpm-lock.yaml') }}
--- a/.gitignore
+++ b/.gitignore
@@ -5,4 +5,5 @@ node_modules
 !.env.example
 .vercel
 .turbo
+*.inkscape.svg.*

--- 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/jsconfig.json
+++ b/jsconfig.json
@@ -10,13 +10,14 @@
 		"strict": true,
 		"module": "ES2022",
 		"target": "ES2022",
-		"alwaysStrict": true,
+		"alwaysStrict": true
 	},
 	"include": [
 		"./**/*.test.js",
 		"./src/**/*.js",
 		"./api/**/*.js",
 		"./packages/*/src/**/*.js",
+		"./packages/*/scripts/**/*.js",
 		"./commitlint.config.cjs",
 		"./eslint.config.js"
 	],
--- a/packages/banners/jsconfig.json
+++ b/packages/banners/jsconfig.json
@@ -0,0 +1,3 @@
+{
+	"extends": "../../jsconfig.json"
+}
--- a/packages/banners/package.json
+++ b/packages/banners/package.json
@@ -1,13 +1,20 @@
 {
 	"private": true,
-	"name": "banners",
+	"type": "module",
+	"name": "@LoredMarkdown/banners",
 	"version": "0.0.0",
 	"description": "",
 	"main": "index.js",
 	"scripts": {
-		"test": "echo \"Error: no test specified\" && exit 1"
+		"lint": "eslint .",
+		"scripts:banners": "node ./scripts/inkscape-convert.js ./static/horizontal.inkscape.svg ./static/horizontal-rtl.inkscape.svg ./static/vertical.inkscape.svg"
 	},
 	"keywords": [],
 	"author": "",
-	"license": "ISC"
+	"license": "ISC",
+	"devDependencies": {
+		"@types/node": "^20.10.0",
+		"eslint": "^8.54.0",
+		"linkedom": "^0.16.4"
+	}
 }
--- a/packages/banners/pnpm-lock.yaml
+++ b/packages/banners/pnpm-lock.yaml
@@ -0,0 +1,764 @@
+lockfileVersion: '6.0'
+
+settings:
+  autoInstallPeers: true
+  excludeLinksFromLockfile: false
+
+devDependencies:
+  '@types/node':
+    specifier: ^20.10.0
+    version: 20.10.0
+  eslint:
+    specifier: ^8.54.0
+    version: 8.54.0
+  linkedom:
+    specifier: ^0.16.4
+    version: 0.16.4
+
+packages:
+
+  /@aashutoshrathi/word-wrap@1.2.6:
+    resolution: {integrity: sha512-1Yjs2SvM8TflER/OD3cOjhWWOZb58A2t7wpE2S9XfBYTiIl+XFhQG2bjy4Pu1I+EAlCNUzRDYDdFwFYUKvXcIA==}
+    engines: {node: '>=0.10.0'}
+    dev: true
+
+  /@eslint-community/eslint-utils@4.4.0(eslint@8.54.0):
+    resolution: {integrity: sha512-1/sA4dwrzBAyeUoQ6oxahHKmrZvsnLCg4RfxW3ZFGGmQkSNQPFNLV9CUEFQP1x9EYXHTo5p6xdhZM1Ne9p/AfA==}
+    engines: {node: ^12.22.0 || ^14.17.0 || >=16.0.0}
+    peerDependencies:
+      eslint: ^6.0.0 || ^7.0.0 || >=8.0.0
+    dependencies:
+      eslint: 8.54.0
+      eslint-visitor-keys: 3.4.3
+    dev: true
+
+  /@eslint-community/regexpp@4.10.0:
+    resolution: {integrity: sha512-Cu96Sd2By9mCNTx2iyKOmq10v22jUVQv0lQnlGNy16oE9589yE+QADPbrMGCkA51cKZSg3Pu/aTJVTGfL/qjUA==}
+    engines: {node: ^12.0.0 || ^14.0.0 || >=16.0.0}
+    dev: true
+
+  /@eslint/eslintrc@2.1.3:
+    resolution: {integrity: sha512-yZzuIG+jnVu6hNSzFEN07e8BxF3uAzYtQb6uDkaYZLo6oYZDCq454c5kB8zxnzfCYyP4MIuyBn10L0DqwujTmA==}
+    engines: {node: ^12.22.0 || ^14.17.0 || >=16.0.0}
+    dependencies:
+      ajv: 6.12.6
+      debug: 4.3.4
+      espree: 9.6.1
+      globals: 13.23.0
+      ignore: 5.3.0
+      import-fresh: 3.3.0
+      js-yaml: 4.1.0
+      minimatch: 3.1.2
+      strip-json-comments: 3.1.1
+    transitivePeerDependencies:
+      - supports-color
+    dev: true
+
+  /@eslint/js@8.54.0:
+    resolution: {integrity: sha512-ut5V+D+fOoWPgGGNj83GGjnntO39xDy6DWxO0wb7Jp3DcMX0TfIqdzHF85VTQkerdyGmuuMD9AKAo5KiNlf/AQ==}
+    engines: {node: ^12.22.0 || ^14.17.0 || >=16.0.0}
+    dev: true
+
+  /@humanwhocodes/config-array@0.11.13:
+    resolution: {integrity: sha512-JSBDMiDKSzQVngfRjOdFXgFfklaXI4K9nLF49Auh21lmBWRLIK3+xTErTWD4KU54pb6coM6ESE7Awz/FNU3zgQ==}
+    engines: {node: '>=10.10.0'}
+    dependencies:
+      '@humanwhocodes/object-schema': 2.0.1
+      debug: 4.3.4
+      minimatch: 3.1.2
+    transitivePeerDependencies:
+      - supports-color
+    dev: true
+
+  /@humanwhocodes/module-importer@1.0.1:
+    resolution: {integrity: sha512-bxveV4V8v5Yb4ncFTT3rPSgZBOpCkjfK0y4oVVVJwIuDVBRMDXrPyXRL988i5ap9m9bnyEEjWfm5WkBmtffLfA==}
+    engines: {node: '>=12.22'}
+    dev: true
+
+  /@humanwhocodes/object-schema@2.0.1:
+    resolution: {integrity: sha512-dvuCeX5fC9dXgJn9t+X5atfmgQAzUOWqS1254Gh0m6i8wKd10ebXkfNKiRK+1GWi/yTvvLDHpoxLr0xxxeslWw==}
+    dev: true
+
+  /@nodelib/fs.scandir@2.1.5:
+    resolution: {integrity: sha512-vq24Bq3ym5HEQm2NKCr3yXDwjc7vTsEThRDnkp2DK9p1uqLR+DHurm/NOTo0KG7HYHU7eppKZj3MyqYuMBf62g==}
+    engines: {node: '>= 8'}
+    dependencies:
+      '@nodelib/fs.stat': 2.0.5
+      run-parallel: 1.2.0
+    dev: true
+
+  /@nodelib/fs.stat@2.0.5:
+    resolution: {integrity: sha512-RkhPPp2zrqDAQA/2jNhnztcPAlv64XdhIp7a7454A5ovI7Bukxgt7MX7udwAu3zg1DcpPU0rz3VV1SeaqvY4+A==}
+    engines: {node: '>= 8'}
+    dev: true
+
+  /@nodelib/fs.walk@1.2.8:
+    resolution: {integrity: sha512-oGB+UxlgWcgQkgwo8GcEGwemoTFt3FIO9ababBmaGwXIoBKZ+GTy0pP185beGg7Llih/NSHSV2XAs1lnznocSg==}
+    engines: {node: '>= 8'}
+    dependencies:
+      '@nodelib/fs.scandir': 2.1.5
+      fastq: 1.15.0
+    dev: true
+
+  /@types/node@20.10.0:
+    resolution: {integrity: sha512-D0WfRmU9TQ8I9PFx9Yc+EBHw+vSpIub4IDvQivcp26PtPrdMGAq5SDcpXEo/epqa/DXotVpekHiLNTg3iaKXBQ==}
+    dependencies:
+      undici-types: 5.26.5
+    dev: true
+
+  /@ungap/structured-clone@1.2.0:
+    resolution: {integrity: sha512-zuVdFrMJiuCDQUMCzQaD6KL28MjnqqN8XnAqiEq9PNm/hCPTSGfrXCOfwj1ow4LFb/tNymJPwsNbVePc1xFqrQ==}
+    dev: true
+
+  /acorn-jsx@5.3.2(acorn@8.11.2):
+    resolution: {integrity: sha512-rq9s+JNhf0IChjtDXxllJ7g41oZk5SlXtp0LHwyA5cejwn7vKmKp4pPri6YEePv2PU65sAsegbXtIinmDFDXgQ==}
+    peerDependencies:
+      acorn: ^6.0.0 || ^7.0.0 || ^8.0.0
+    dependencies:
+      acorn: 8.11.2
+    dev: true
+
+  /acorn@8.11.2:
+    resolution: {integrity: sha512-nc0Axzp/0FILLEVsm4fNwLCwMttvhEI263QtVPQcbpfZZ3ts0hLsZGOpE6czNlid7CJ9MlyH8reXkpsf3YUY4w==}
+    engines: {node: '>=0.4.0'}
+    hasBin: true
+    dev: true
+
+  /ajv@6.12.6:
+    resolution: {integrity: sha512-j3fVLgvTo527anyYyJOGTYJbG+vnnQYvE0m5mmkc1TK+nxAppkCLMIL0aZ4dblVCNoGShhm+kzE4ZUykBoMg4g==}
+    dependencies:
+      fast-deep-equal: 3.1.3
+      fast-json-stable-stringify: 2.1.0
+      json-schema-traverse: 0.4.1
+      uri-js: 4.4.1
+    dev: true
+
+  /ansi-regex@5.0.1:
+    resolution: {integrity: sha512-quJQXlTSUGL2LH9SUXo8VwsY4soanhgo6LNSm84E1LBcE8s3O0wpdiRzyR9z/ZZJMlMWv37qOOb9pdJlMUEKFQ==}
+    engines: {node: '>=8'}
+    dev: true
+
+  /ansi-styles@4.3.0:
+    resolution: {integrity: sha512-zbB9rCJAT1rbjiVDb2hqKFHNYLxgtk8NURxZ3IZwD3F6NtxbXZQCnnSi1Lkx+IDohdPlFp222wVALIheZJQSEg==}
+    engines: {node: '>=8'}
+    dependencies:
+      color-convert: 2.0.1
+    dev: true
+
+  /argparse@2.0.1:
+    resolution: {integrity: sha512-8+9WqebbFzpX9OR+Wa6O29asIogeRMzcGtAINdpMHHyAg10f05aSFVBbcEqGf/PXw1EjAZ+q2/bEBg3DvurK3Q==}
+    dev: true
+
+  /balanced-match@1.0.2:
+    resolution: {integrity: sha512-3oSeUO0TMV67hN1AmbXsK4yaqU7tjiHlbxRDZOpH0KW9+CeX4bRAaX0Anxt0tx2MrpRpWwQaPwIlISEJhYU5Pw==}
+    dev: true
+
+  /boolbase@1.0.0:
+    resolution: {integrity: sha512-JZOSA7Mo9sNGB8+UjSgzdLtokWAky1zbztM3WRLCbZ70/3cTANmQmOdR7y2g+J0e2WXywy1yS468tY+IruqEww==}
+    dev: true
+
+  /brace-expansion@1.1.11:
+    resolution: {integrity: sha512-iCuPHDFgrHX7H2vEI/5xpz07zSHB00TpugqhmYtVmMO6518mCuRMoOYFldEBl0g187ufozdaHgWKcYFb61qGiA==}
+    dependencies:
+      balanced-match: 1.0.2
+      concat-map: 0.0.1
+    dev: true
+
+  /callsites@3.1.0:
+    resolution: {integrity: sha512-P8BjAsXvZS+VIDUI11hHCQEv74YT67YUi5JJFNWIqL235sBmjX4+qx9Muvls5ivyNENctx46xQLQ3aTuE7ssaQ==}
+    engines: {node: '>=6'}
+    dev: true
+
+  /chalk@4.1.2:
+    resolution: {integrity: sha512-oKnbhFyRIXpUuez8iBMmyEa4nbj4IOQyuhc/wy9kY7/WVPcwIO9VA668Pu8RkO7+0G76SLROeyw9CpQ061i4mA==}
+    engines: {node: '>=10'}
+    dependencies:
+      ansi-styles: 4.3.0
+      supports-color: 7.2.0
+    dev: true
+
+  /color-convert@2.0.1:
+    resolution: {integrity: sha512-RRECPsj7iu/xb5oKYcsFHSppFNnsj/52OVTRKb4zP5onXwVF3zVmmToNcOfGC+CRDpfK/U584fMg38ZHCaElKQ==}
+    engines: {node: '>=7.0.0'}
+    dependencies:
+      color-name: 1.1.4
+    dev: true
+
+  /color-name@1.1.4:
+    resolution: {integrity: sha512-dOy+3AuW3a2wNbZHIuMZpTcgjGuLU/uBL/ubcZF9OXbDo8ff4O8yVp5Bf0efS8uEoYo5q4Fx7dY9OgQGXgAsQA==}
+    dev: true
+
+  /concat-map@0.0.1:
+    resolution: {integrity: sha512-/Srv4dswyQNBfohGpz9o6Yb3Gz3SrUDqBH5rTuhGR7ahtlbYKnVxw2bCFMRljaA7EXHaXZ8wsHdodFvbkhKmqg==}
+    dev: true
+
+  /cross-spawn@7.0.3:
+    resolution: {integrity: sha512-iRDPJKUPVEND7dHPO8rkbOnPpyDygcDFtWjpeWNCgy8WP2rXcxXL8TskReQl6OrB2G7+UJrags1q15Fudc7G6w==}
+    engines: {node: '>= 8'}
+    dependencies:
+      path-key: 3.1.1
+      shebang-command: 2.0.0
+      which: 2.0.2
+    dev: true
+
+  /css-select@5.1.0:
+    resolution: {integrity: sha512-nwoRF1rvRRnnCqqY7updORDsuqKzqYJ28+oSMaJMMgOauh3fvwHqMS7EZpIPqK8GL+g9mKxF1vP/ZjSeNjEVHg==}
+    dependencies:
+      boolbase: 1.0.0
+      css-what: 6.1.0
+      domhandler: 5.0.3
+      domutils: 3.1.0
+      nth-check: 2.1.1
+    dev: true
+
+  /css-what@6.1.0:
+    resolution: {integrity: sha512-HTUrgRJ7r4dsZKU6GjmpfRK1O76h97Z8MfS1G0FozR+oF2kG6Vfe8JE6zwrkbxigziPHinCJ+gCPjA9EaBDtRw==}
+    engines: {node: '>= 6'}
+    dev: true
+
+  /cssom@0.5.0:
+    resolution: {integrity: sha512-iKuQcq+NdHqlAcwUY0o/HL69XQrUaQdMjmStJ8JFmUaiiQErlhrmuigkg/CU4E2J0IyUKUrMAgl36TvN67MqTw==}
+    dev: true
+
+  /debug@4.3.4:
+    resolution: {integrity: sha512-PRWFHuSU3eDtQJPvnNY7Jcket1j0t5OuOsFzPPzsekD52Zl8qUfFIPEiswXqIvHWGVHOgX+7G/vCNNhehwxfkQ==}
+    engines: {node: '>=6.0'}
+    peerDependencies:
+      supports-color: '*'
+    peerDependenciesMeta:
+      supports-color:
+        optional: true
+    dependencies:
+      ms: 2.1.2
+    dev: true
+
+  /deep-is@0.1.4:
+    resolution: {integrity: sha512-oIPzksmTg4/MriiaYGO+okXDT7ztn/w3Eptv/+gSIdMdKsJo0u4CfYNFJPy+4SKMuCqGw2wxnA+URMg3t8a/bQ==}
+    dev: true
+
+  /doctrine@3.0.0:
+    resolution: {integrity: sha512-yS+Q5i3hBf7GBkd4KG8a7eBNNWNGLTaEwwYWUijIYM7zrlYDM0BFXHjjPWlWZ1Rg7UaddZeIDmi9jF3HmqiQ2w==}
+    engines: {node: '>=6.0.0'}
+    dependencies:
+      esutils: 2.0.3
+    dev: true
+
+  /dom-serializer@2.0.0:
+    resolution: {integrity: sha512-wIkAryiqt/nV5EQKqQpo3SToSOV9J0DnbJqwK7Wv/Trc92zIAYZ4FlMu+JPFW1DfGFt81ZTCGgDEabffXeLyJg==}
+    dependencies:
+      domelementtype: 2.3.0
+      domhandler: 5.0.3
+      entities: 4.5.0
+    dev: true
+
+  /domelementtype@2.3.0:
+    resolution: {integrity: sha512-OLETBj6w0OsagBwdXnPdN0cnMfF9opN69co+7ZrbfPGrdpPVNBUj02spi6B1N7wChLQiPn4CSH/zJvXw56gmHw==}
+    dev: true
+
+  /domhandler@5.0.3:
+    resolution: {integrity: sha512-cgwlv/1iFQiFnU96XXgROh8xTeetsnJiDsTc7TYCLFd9+/WNkIqPTxiM/8pSd8VIrhXGTf1Ny1q1hquVqDJB5w==}
+    engines: {node: '>= 4'}
+    dependencies:
+      domelementtype: 2.3.0
+    dev: true
+
+  /domutils@3.1.0:
+    resolution: {integrity: sha512-H78uMmQtI2AhgDJjWeQmHwJJ2bLPD3GMmO7Zja/ZZh84wkm+4ut+IUnUdRa8uCGX88DiVx1j6FRe1XfxEgjEZA==}
+    dependencies:
+      dom-serializer: 2.0.0
+      domelementtype: 2.3.0
+      domhandler: 5.0.3
+    dev: true
+
+  /entities@4.5.0:
+    resolution: {integrity: sha512-V0hjH4dGPh9Ao5p0MoRY6BVqtwCjhz6vI5LT8AJ55H+4g9/4vbHx1I54fS0XuclLhDHArPQCiMjDxjaL8fPxhw==}
+    engines: {node: '>=0.12'}
+    dev: true
+
+  /escape-string-regexp@4.0.0:
+    resolution: {integrity: sha512-TtpcNJ3XAzx3Gq8sWRzJaVajRs0uVxA2YAkdb1jm2YkPz4G6egUFAyA3n5vtEIZefPk5Wa4UXbKuS5fKkJWdgA==}
+    engines: {node: '>=10'}
+    dev: true
+
+  /eslint-scope@7.2.2:
+    resolution: {integrity: sha512-dOt21O7lTMhDM+X9mB4GX+DZrZtCUJPL/wlcTqxyrx5IvO0IYtILdtrQGQp+8n5S0gwSVmOf9NQrjMOgfQZlIg==}
+    engines: {node: ^12.22.0 || ^14.17.0 || >=16.0.0}
+    dependencies:
+      esrecurse: 4.3.0
+      estraverse: 5.3.0
+    dev: true
+
+  /eslint-visitor-keys@3.4.3:
+    resolution: {integrity: sha512-wpc+LXeiyiisxPlEkUzU6svyS1frIO3Mgxj1fdy7Pm8Ygzguax2N3Fa/D/ag1WqbOprdI+uY6wMUl8/a2G+iag==}
+    engines: {node: ^12.22.0 || ^14.17.0 || >=16.0.0}
+    dev: true
+
+  /eslint@8.54.0:
+    resolution: {integrity: sha512-NY0DfAkM8BIZDVl6PgSa1ttZbx3xHgJzSNJKYcQglem6CppHyMhRIQkBVSSMaSRnLhig3jsDbEzOjwCVt4AmmA==}
+    engines: {node: ^12.22.0 || ^14.17.0 || >=16.0.0}
+    hasBin: true
+    dependencies:
+      '@eslint-community/eslint-utils': 4.4.0(eslint@8.54.0)
+      '@eslint-community/regexpp': 4.10.0
+      '@eslint/eslintrc': 2.1.3
+      '@eslint/js': 8.54.0
+      '@humanwhocodes/config-array': 0.11.13
+      '@humanwhocodes/module-importer': 1.0.1
+      '@nodelib/fs.walk': 1.2.8
+      '@ungap/structured-clone': 1.2.0
+      ajv: 6.12.6
+      chalk: 4.1.2
+      cross-spawn: 7.0.3
+      debug: 4.3.4
+      doctrine: 3.0.0
+      escape-string-regexp: 4.0.0
+      eslint-scope: 7.2.2
+      eslint-visitor-keys: 3.4.3
+      espree: 9.6.1
+      esquery: 1.5.0
+      esutils: 2.0.3
+      fast-deep-equal: 3.1.3
+      file-entry-cache: 6.0.1
+      find-up: 5.0.0
+      glob-parent: 6.0.2
+      globals: 13.23.0
+      graphemer: 1.4.0
+      ignore: 5.3.0
+      imurmurhash: 0.1.4
+      is-glob: 4.0.3
+      is-path-inside: 3.0.3
+      js-yaml: 4.1.0
+      json-stable-stringify-without-jsonify: 1.0.1
+      levn: 0.4.1
+      lodash.merge: 4.6.2
+      minimatch: 3.1.2
+      natural-compare: 1.4.0
+      optionator: 0.9.3
+      strip-ansi: 6.0.1
+      text-table: 0.2.0
+    transitivePeerDependencies:
+      - supports-color
+    dev: true
+
+  /espree@9.6.1:
+    resolution: {integrity: sha512-oruZaFkjorTpF32kDSI5/75ViwGeZginGGy2NoOSg3Q9bnwlnmDm4HLnkl0RE3n+njDXR037aY1+x58Z/zFdwQ==}
+    engines: {node: ^12.22.0 || ^14.17.0 || >=16.0.0}
+    dependencies:
+      acorn: 8.11.2
+      acorn-jsx: 5.3.2(acorn@8.11.2)
+      eslint-visitor-keys: 3.4.3
+    dev: true
+
+  /esquery@1.5.0:
+    resolution: {integrity: sha512-YQLXUplAwJgCydQ78IMJywZCceoqk1oH01OERdSAJc/7U2AylwjhSCLDEtqwg811idIS/9fIU5GjG73IgjKMVg==}
+    engines: {node: '>=0.10'}
+    dependencies:
+      estraverse: 5.3.0
+    dev: true
+
+  /esrecurse@4.3.0:
+    resolution: {integrity: sha512-KmfKL3b6G+RXvP8N1vr3Tq1kL/oCFgn2NYXEtqP8/L3pKapUA4G8cFVaoF3SU323CD4XypR/ffioHmkti6/Tag==}
+    engines: {node: '>=4.0'}
+    dependencies:
+      estraverse: 5.3.0
+    dev: true
+
+  /estraverse@5.3.0:
+    resolution: {integrity: sha512-MMdARuVEQziNTeJD8DgMqmhwR11BRQ/cBP+pLtYdSTnf3MIO8fFeiINEbX36ZdNlfU/7A9f3gUw49B3oQsvwBA==}
+    engines: {node: '>=4.0'}
+    dev: true
+
+  /esutils@2.0.3:
+    resolution: {integrity: sha512-kVscqXk4OCp68SZ0dkgEKVi6/8ij300KBWTJq32P/dYeWTSwK41WyTxalN1eRmA5Z9UU/LX9D7FWSmV9SAYx6g==}
+    engines: {node: '>=0.10.0'}
+    dev: true
+
+  /fast-deep-equal@3.1.3:
+    resolution: {integrity: sha512-f3qQ9oQy9j2AhBe/H9VC91wLmKBCCU/gDOnKNAYG5hswO7BLKj09Hc5HYNz9cGI++xlpDCIgDaitVs03ATR84Q==}
+    dev: true
+
+  /fast-json-stable-stringify@2.1.0:
+    resolution: {integrity: sha512-lhd/wF+Lk98HZoTCtlVraHtfh5XYijIjalXck7saUtuanSDyLMxnHhSXEDJqHxD7msR8D0uCmqlkwjCV8xvwHw==}
+    dev: true
+
+  /fast-levenshtein@2.0.6:
+    resolution: {integrity: sha512-DCXu6Ifhqcks7TZKY3Hxp3y6qphY5SJZmrWMDrKcERSOXWQdMhU9Ig/PYrzyw/ul9jOIyh0N4M0tbC5hodg8dw==}
+    dev: true
+
+  /fastq@1.15.0:
+    resolution: {integrity: sha512-wBrocU2LCXXa+lWBt8RoIRD89Fi8OdABODa/kEnyeyjS5aZO5/GNvI5sEINADqP/h8M29UHTHUb53sUu5Ihqdw==}
+    dependencies:
+      reusify: 1.0.4
+    dev: true
+
+  /file-entry-cache@6.0.1:
+    resolution: {integrity: sha512-7Gps/XWymbLk2QLYK4NzpMOrYjMhdIxXuIvy2QBsLE6ljuodKvdkWs/cpyJJ3CVIVpH0Oi1Hvg1ovbMzLdFBBg==}
+    engines: {node: ^10.12.0 || >=12.0.0}
+    dependencies:
+      flat-cache: 3.2.0
+    dev: true
+
+  /find-up@5.0.0:
+    resolution: {integrity: sha512-78/PXT1wlLLDgTzDs7sjq9hzz0vXD+zn+7wypEe4fXQxCmdmqfGsEPQxmiCSQI3ajFV91bVSsvNtrJRiW6nGng==}
+    engines: {node: '>=10'}
+    dependencies:
+      locate-path: 6.0.0
+      path-exists: 4.0.0
+    dev: true
+
+  /flat-cache@3.2.0:
+    resolution: {integrity: sha512-CYcENa+FtcUKLmhhqyctpclsq7QF38pKjZHsGNiSQF5r4FtoKDWabFDl3hzaEQMvT1LHEysw5twgLvpYYb4vbw==}
+    engines: {node: ^10.12.0 || >=12.0.0}
+    dependencies:
+      flatted: 3.2.9
+      keyv: 4.5.4
+      rimraf: 3.0.2
+    dev: true
+
+  /flatted@3.2.9:
+    resolution: {integrity: sha512-36yxDn5H7OFZQla0/jFJmbIKTdZAQHngCedGxiMmpNfEZM0sdEeT+WczLQrjK6D7o2aiyLYDnkw0R3JK0Qv1RQ==}
+    dev: true
+
+  /fs.realpath@1.0.0:
+    resolution: {integrity: sha512-OO0pH2lK6a0hZnAdau5ItzHPI6pUlvI7jMVnxUQRtw4owF2wk8lOSabtGDCTP4Ggrg2MbGnWO9X8K1t4+fGMDw==}
+    dev: true
+
+  /glob-parent@6.0.2:
+    resolution: {integrity: sha512-XxwI8EOhVQgWp6iDL+3b0r86f4d6AX6zSU55HfB4ydCEuXLXc5FcYeOu+nnGftS4TEju/11rt4KJPTMgbfmv4A==}
+    engines: {node: '>=10.13.0'}
+    dependencies:
+      is-glob: 4.0.3
+    dev: true
+
+  /glob@7.2.3:
+    resolution: {integrity: sha512-nFR0zLpU2YCaRxwoCJvL6UvCH2JFyFVIvwTLsIf21AuHlMskA1hhTdk+LlYJtOlYt9v6dvszD2BGRqBL+iQK9Q==}
+    dependencies:
+      fs.realpath: 1.0.0
+      inflight: 1.0.6
+      inherits: 2.0.4
+      minimatch: 3.1.2
+      once: 1.4.0
+      path-is-absolute: 1.0.1
+    dev: true
+
+  /globals@13.23.0:
+    resolution: {integrity: sha512-XAmF0RjlrjY23MA51q3HltdlGxUpXPvg0GioKiD9X6HD28iMjo2dKC8Vqwm7lne4GNr78+RHTfliktR6ZH09wA==}
+    engines: {node: '>=8'}
+    dependencies:
+      type-fest: 0.20.2
+    dev: true
+
+  /graphemer@1.4.0:
+    resolution: {integrity: sha512-EtKwoO6kxCL9WO5xipiHTZlSzBm7WLT627TqC/uVRd0HKmq8NXyebnNYxDoBi7wt8eTWrUrKXCOVaFq9x1kgag==}
+    dev: true
+
+  /has-flag@4.0.0:
+    resolution: {integrity: sha512-EykJT/Q1KjTWctppgIAgfSO0tKVuZUjhgMr17kqTumMl6Afv3EISleU7qZUzoXDFTAHTDC4NOoG/ZxU3EvlMPQ==}
+    engines: {node: '>=8'}
+    dev: true
+
+  /html-escaper@3.0.3:
+    resolution: {integrity: sha512-RuMffC89BOWQoY0WKGpIhn5gX3iI54O6nRA0yC124NYVtzjmFWBIiFd8M0x+ZdX0P9R4lADg1mgP8C7PxGOWuQ==}
+    dev: true
+
+  /htmlparser2@9.0.0:
+    resolution: {integrity: sha512-uxbSI98wmFT/G4P2zXx4OVx04qWUmyFPrD2/CNepa2Zo3GPNaCaaxElDgwUrwYWkK1nr9fft0Ya8dws8coDLLQ==}
+    dependencies:
+      domelementtype: 2.3.0
+      domhandler: 5.0.3
+      domutils: 3.1.0
+      entities: 4.5.0
+    dev: true
+
+  /ignore@5.3.0:
+    resolution: {integrity: sha512-g7dmpshy+gD7mh88OC9NwSGTKoc3kyLAZQRU1mt53Aw/vnvfXnbC+F/7F7QoYVKbV+KNvJx8wArewKy1vXMtlg==}
+    engines: {node: '>= 4'}
+    dev: true
+
+  /import-fresh@3.3.0:
+    resolution: {integrity: sha512-veYYhQa+D1QBKznvhUHxb8faxlrwUnxseDAbAp457E0wLNio2bOSKnjYDhMj+YiAq61xrMGhQk9iXVk5FzgQMw==}
+    engines: {node: '>=6'}
+    dependencies:
+      parent-module: 1.0.1
+      resolve-from: 4.0.0
+    dev: true
+
+  /imurmurhash@0.1.4:
+    resolution: {integrity: sha512-JmXMZ6wuvDmLiHEml9ykzqO6lwFbof0GG4IkcGaENdCRDDmMVnny7s5HsIgHCbaq0w2MyPhDqkhTUgS2LU2PHA==}
+    engines: {node: '>=0.8.19'}
+    dev: true
+
+  /inflight@1.0.6:
+    resolution: {integrity: sha512-k92I/b08q4wvFscXCLvqfsHCrjrF7yiXsQuIVvVE7N82W3+aqpzuUdBbfhWcy/FZR3/4IgflMgKLOsvPDrGCJA==}
+    dependencies:
+      once: 1.4.0
+      wrappy: 1.0.2
+    dev: true
+
+  /inherits@2.0.4:
+    resolution: {integrity: sha512-k/vGaX4/Yla3WzyMCvTQOXYeIHvqOKtnqBduzTHpzpQZzAskKMhZ2K+EnBiSM9zGSoIFeMpXKxa4dYeZIQqewQ==}
+    dev: true
+
+  /is-extglob@2.1.1:
+    resolution: {integrity: sha512-SbKbANkN603Vi4jEZv49LeVJMn4yGwsbzZworEoyEiutsN3nJYdbO36zfhGJ6QEDpOZIFkDtnq5JRxmvl3jsoQ==}
+    engines: {node: '>=0.10.0'}
+    dev: true
+
+  /is-glob@4.0.3:
+    resolution: {integrity: sha512-xelSayHH36ZgE7ZWhli7pW34hNbNl8Ojv5KVmkJD4hBdD3th8Tfk9vYasLM+mXWOZhFkgZfxhLSnrwRr4elSSg==}
+    engines: {node: '>=0.10.0'}
+    dependencies:
+      is-extglob: 2.1.1
+    dev: true
+
+  /is-path-inside@3.0.3:
+    resolution: {integrity: sha512-Fd4gABb+ycGAmKou8eMftCupSir5lRxqf4aD/vd0cD2qc4HL07OjCeuHMr8Ro4CoMaeCKDB0/ECBOVWjTwUvPQ==}
+    engines: {node: '>=8'}
+    dev: true
+
+  /isexe@2.0.0:
+    resolution: {integrity: sha512-RHxMLp9lnKHGHRng9QFhRCMbYAcVpn69smSGcq3f36xjgVVWThj4qqLbTLlq7Ssj8B+fIQ1EuCEGI2lKsyQeIw==}
+    dev: true
+
+  /js-yaml@4.1.0:
+    resolution: {integrity: sha512-wpxZs9NoxZaJESJGIZTyDEaYpl0FKSA+FB9aJiyemKhMwkxQg63h4T1KJgUGHpTqPDNRcmmYLugrRjJlBtWvRA==}
+    hasBin: true
+    dependencies:
+      argparse: 2.0.1
+    dev: true
+
+  /json-buffer@3.0.1:
+    resolution: {integrity: sha512-4bV5BfR2mqfQTJm+V5tPPdf+ZpuhiIvTuAB5g8kcrXOZpTT/QwwVRWBywX1ozr6lEuPdbHxwaJlm9G6mI2sfSQ==}
+    dev: true
+
+  /json-schema-traverse@0.4.1:
+    resolution: {integrity: sha512-xbbCH5dCYU5T8LcEhhuh7HJ88HXuW3qsI3Y0zOZFKfZEHcpWiHU/Jxzk629Brsab/mMiHQti9wMP+845RPe3Vg==}
+    dev: true
+
+  /json-stable-stringify-without-jsonify@1.0.1:
+    resolution: {integrity: sha512-Bdboy+l7tA3OGW6FjyFHWkP5LuByj1Tk33Ljyq0axyzdk9//JSi2u3fP1QSmd1KNwq6VOKYGlAu87CisVir6Pw==}
+    dev: true
+
+  /keyv@4.5.4:
+    resolution: {integrity: sha512-oxVHkHR/EJf2CNXnWxRLW6mg7JyCCUcG0DtEGmL2ctUo1PNTin1PUil+r/+4r5MpVgC/fn1kjsx7mjSujKqIpw==}
+    dependencies:
+      json-buffer: 3.0.1
+    dev: true
+
+  /levn@0.4.1:
+    resolution: {integrity: sha512-+bT2uH4E5LGE7h/n3evcS/sQlJXCpIp6ym8OWJ5eV6+67Dsql/LaaT7qJBAt2rzfoa/5QBGBhxDix1dMt2kQKQ==}
+    engines: {node: '>= 0.8.0'}
+    dependencies:
+      prelude-ls: 1.2.1
+      type-check: 0.4.0
+    dev: true
+
+  /linkedom@0.16.4:
+    resolution: {integrity: sha512-SykvDVh/jAnaO+WiPqH5vX3QpZrIRImuppzYhIHons3RXPhDwqN2dOyfopOVaHleqWtoS+3vWCqen+m8M3HToQ==}
+    dependencies:
+      css-select: 5.1.0
+      cssom: 0.5.0
+      html-escaper: 3.0.3
+      htmlparser2: 9.0.0
+      uhyphen: 0.2.0
+    dev: true
+
+  /locate-path@6.0.0:
+    resolution: {integrity: sha512-iPZK6eYjbxRu3uB4/WZ3EsEIMJFMqAoopl3R+zuq0UjcAm/MO6KCweDgPfP3elTztoKP3KtnVHxTn2NHBSDVUw==}
+    engines: {node: '>=10'}
+    dependencies:
+      p-locate: 5.0.0
+    dev: true
+
+  /lodash.merge@4.6.2:
+    resolution: {integrity: sha512-0KpjqXRVvrYyCsX1swR/XTK0va6VQkQM6MNo7PqW77ByjAhoARA8EfrP1N4+KlKj8YS0ZUCtRT/YUuhyYDujIQ==}
+    dev: true
+
+  /minimatch@3.1.2:
+    resolution: {integrity: sha512-J7p63hRiAjw1NDEww1W7i37+ByIrOWO5XQQAzZ3VOcL0PNybwpfmV/N05zFAzwQ9USyEcX6t3UO+K5aqBQOIHw==}
+    dependencies:
+      brace-expansion: 1.1.11
+    dev: true
+
+  /ms@2.1.2:
+    resolution: {integrity: sha512-sGkPx+VjMtmA6MX27oA4FBFELFCZZ4S4XqeGOXCv68tT+jb3vk/RyaKWP0PTKyWtmLSM0b+adUTEvbs1PEaH2w==}
+    dev: true
+
+  /natural-compare@1.4.0:
+    resolution: {integrity: sha512-OWND8ei3VtNC9h7V60qff3SVobHr996CTwgxubgyQYEpg290h9J0buyECNNJexkFm5sOajh5G116RYA1c8ZMSw==}
+    dev: true
+
+  /nth-check@2.1.1:
+    resolution: {integrity: sha512-lqjrjmaOoAnWfMmBPL+XNnynZh2+swxiX3WUE0s4yEHI6m+AwrK2UZOimIRl3X/4QctVqS8AiZjFqyOGrMXb/w==}
+    dependencies:
+      boolbase: 1.0.0
+    dev: true
+
+  /once@1.4.0:
+    resolution: {integrity: sha512-lNaJgI+2Q5URQBkccEKHTQOPaXdUxnZZElQTZY0MFUAuaEqe1E+Nyvgdz/aIyNi6Z9MzO5dv1H8n58/GELp3+w==}
+    dependencies:
+      wrappy: 1.0.2
+    dev: true
+
+  /optionator@0.9.3:
+    resolution: {integrity: sha512-JjCoypp+jKn1ttEFExxhetCKeJt9zhAgAve5FXHixTvFDW/5aEktX9bufBKLRRMdU7bNtpLfcGu94B3cdEJgjg==}
+    engines: {node: '>= 0.8.0'}
+    dependencies:
+      '@aashutoshrathi/word-wrap': 1.2.6
+      deep-is: 0.1.4
+      fast-levenshtein: 2.0.6
+      levn: 0.4.1
+      prelude-ls: 1.2.1
+      type-check: 0.4.0
+    dev: true
+
+  /p-limit@3.1.0:
+    resolution: {integrity: sha512-TYOanM3wGwNGsZN2cVTYPArw454xnXj5qmWF1bEoAc4+cU/ol7GVh7odevjp1FNHduHc3KZMcFduxU5Xc6uJRQ==}
+    engines: {node: '>=10'}
+    dependencies:
+      yocto-queue: 0.1.0
+    dev: true
+
+  /p-locate@5.0.0:
+    resolution: {integrity: sha512-LaNjtRWUBY++zB5nE/NwcaoMylSPk+S+ZHNB1TzdbMJMny6dynpAGt7X/tl/QYq3TIeE6nxHppbo2LGymrG5Pw==}
+    engines: {node: '>=10'}
+    dependencies:
+      p-limit: 3.1.0
+    dev: true
+
+  /parent-module@1.0.1:
+    resolution: {integrity: sha512-GQ2EWRpQV8/o+Aw8YqtfZZPfNRWZYkbidE9k5rpl/hC3vtHHBfGm2Ifi6qWV+coDGkrUKZAxE3Lot5kcsRlh+g==}
+    engines: {node: '>=6'}
+    dependencies:
+      callsites: 3.1.0
+    dev: true
+
+  /path-exists@4.0.0:
+    resolution: {integrity: sha512-ak9Qy5Q7jYb2Wwcey5Fpvg2KoAc/ZIhLSLOSBmRmygPsGwkVVt0fZa0qrtMz+m6tJTAHfZQ8FnmB4MG4LWy7/w==}
+    engines: {node: '>=8'}
+    dev: true
+
+  /path-is-absolute@1.0.1:
+    resolution: {integrity: sha512-AVbw3UJ2e9bq64vSaS9Am0fje1Pa8pbGqTTsmXfaIiMpnr5DlDhfJOuLj9Sf95ZPVDAUerDfEk88MPmPe7UCQg==}
+    engines: {node: '>=0.10.0'}
+    dev: true
+
+  /path-key@3.1.1:
+    resolution: {integrity: sha512-ojmeN0qd+y0jszEtoY48r0Peq5dwMEkIlCOu6Q5f41lfkswXuKtYrhgoTpLnyIcHm24Uhqx+5Tqm2InSwLhE6Q==}
+    engines: {node: '>=8'}
+    dev: true
+
+  /prelude-ls@1.2.1:
+    resolution: {integrity: sha512-vkcDPrRZo1QZLbn5RLGPpg/WmIQ65qoWWhcGKf/b5eplkkarX0m9z8ppCat4mlOqUsWpyNuYgO3VRyrYHSzX5g==}
+    engines: {node: '>= 0.8.0'}
+    dev: true
+
+  /punycode@2.3.1:
+    resolution: {integrity: sha512-vYt7UD1U9Wg6138shLtLOvdAu+8DsC/ilFtEVHcH+wydcSpNE20AfSOduf6MkRFahL5FY7X1oU7nKVZFtfq8Fg==}
+    engines: {node: '>=6'}
+    dev: true
+
+  /queue-microtask@1.2.3:
+    resolution: {integrity: sha512-NuaNSa6flKT5JaSYQzJok04JzTL1CA6aGhv5rfLW3PgqA+M2ChpZQnAC8h8i4ZFkBS8X5RqkDBHA7r4hej3K9A==}
+    dev: true
+
+  /resolve-from@4.0.0:
+    resolution: {integrity: sha512-pb/MYmXstAkysRFx8piNI1tGFNQIFA3vkE3Gq4EuA1dF6gHp/+vgZqsCGJapvy8N3Q+4o7FwvquPJcnZ7RYy4g==}
+    engines: {node: '>=4'}
+    dev: true
+
+  /reusify@1.0.4:
+    resolution: {integrity: sha512-U9nH88a3fc/ekCF1l0/UP1IosiuIjyTh7hBvXVMHYgVcfGvt897Xguj2UOLDeI5BG2m7/uwyaLVT6fbtCwTyzw==}
+    engines: {iojs: '>=1.0.0', node: '>=0.10.0'}
+    dev: true
+
+  /rimraf@3.0.2:
+    resolution: {integrity: sha512-JZkJMZkAGFFPP2YqXZXPbMlMBgsxzE8ILs4lMIX/2o0L9UBw9O/Y3o6wFw/i9YLapcUJWwqbi3kdxIPdC62TIA==}
+    hasBin: true
+    dependencies:
+      glob: 7.2.3
+    dev: true
+
+  /run-parallel@1.2.0:
+    resolution: {integrity: sha512-5l4VyZR86LZ/lDxZTR6jqL8AFE2S0IFLMP26AbjsLVADxHdhB/c0GUsH+y39UfCi3dzz8OlQuPmnaJOMoDHQBA==}
+    dependencies:
+      queue-microtask: 1.2.3
+    dev: true
+
+  /shebang-command@2.0.0:
+    resolution: {integrity: sha512-kHxr2zZpYtdmrN1qDjrrX/Z1rR1kG8Dx+gkpK1G4eXmvXswmcE1hTWBWYUzlraYw1/yZp6YuDY77YtvbN0dmDA==}
+    engines: {node: '>=8'}
+    dependencies:
+      shebang-regex: 3.0.0
+    dev: true
+
+  /shebang-regex@3.0.0:
+    resolution: {integrity: sha512-7++dFhtcx3353uBaq8DDR4NuxBetBzC7ZQOhmTQInHEd6bSrXdiEyzCvG07Z44UYdLShWUyXt5M/yhz8ekcb1A==}
+    engines: {node: '>=8'}
+    dev: true
+
+  /strip-ansi@6.0.1:
+    resolution: {integrity: sha512-Y38VPSHcqkFrCpFnQ9vuSXmquuv5oXOKpGeT6aGrr3o3Gc9AlVa6JBfUSOCnbxGGZF+/0ooI7KrPuUSztUdU5A==}
+    engines: {node: '>=8'}
+    dependencies:
+      ansi-regex: 5.0.1
+    dev: true
+
+  /strip-json-comments@3.1.1:
+    resolution: {integrity: sha512-6fPc+R4ihwqP6N/aIv2f1gMH8lOVtWQHoqC4yK6oSDVVocumAsfCqjkXnqiYMhmMwS/mEHLp7Vehlt3ql6lEig==}
+    engines: {node: '>=8'}
+    dev: true
+
+  /supports-color@7.2.0:
+    resolution: {integrity: sha512-qpCAvRl9stuOHveKsn7HncJRvv501qIacKzQlO/+Lwxc9+0q2wLyv4Dfvt80/DPn2pqOBsJdDiogXGR9+OvwRw==}
+    engines: {node: '>=8'}
+    dependencies:
+      has-flag: 4.0.0
+    dev: true
+
+  /text-table@0.2.0:
+    resolution: {integrity: sha512-N+8UisAXDGk8PFXP4HAzVR9nbfmVJ3zYLAWiTIoqC5v5isinhr+r5uaO8+7r3BMfuNIufIsA7RdpVgacC2cSpw==}
+    dev: true
+
+  /type-check@0.4.0:
+    resolution: {integrity: sha512-XleUoc9uwGXqjWwXaUTZAmzMcFZ5858QA2vvx1Ur5xIcixXIP+8LnFDgRplU30us6teqdlskFfu+ae4K79Ooew==}
+    engines: {node: '>= 0.8.0'}
+    dependencies:
+      prelude-ls: 1.2.1
+    dev: true
+
+  /type-fest@0.20.2:
+    resolution: {integrity: sha512-Ne+eE4r0/iWnpAxD852z3A+N0Bt5RN//NjJwRd2VFHEmrywxf5vsZlh4R6lixl6B+wz/8d+maTSAkN1FIkI3LQ==}
+    engines: {node: '>=10'}
+    dev: true
+
+  /uhyphen@0.2.0:
+    resolution: {integrity: sha512-qz3o9CHXmJJPGBdqzab7qAYuW8kQGKNEuoHFYrBwV6hWIMcpAmxDLXojcHfFr9US1Pe6zUswEIJIbLI610fuqA==}
+    dev: true
+
+  /undici-types@5.26.5:
+    resolution: {integrity: sha512-JlCMO+ehdEIKqlFxk6IfVoAUVmgz7cU7zD/h9XZ0qzeosSHmUJVOzSQvvYSYWXkFXC+IfLKSIffhv0sVZup6pA==}
+    dev: true
+
+  /uri-js@4.4.1:
+    resolution: {integrity: sha512-7rKUyy33Q1yc98pQ1DAmLtwX109F7TIfWlW1Ydo8Wl1ii1SeHieeh0HHfPeL2fMXK6z0s8ecKs9frCuLJvndBg==}
+    dependencies:
+      punycode: 2.3.1
+    dev: true
+
+  /which@2.0.2:
+    resolution: {integrity: sha512-BLI3Tl1TW3Pvl70l3yq3Y64i+awpwXqsGBYWkkqMtnbXgrMD+yj7rhW0kuEDxzJaYXGjEW5ogapKNMEKNMjibA==}
+    engines: {node: '>= 8'}
+    hasBin: true
+    dependencies:
+      isexe: 2.0.0
+    dev: true
+
+  /wrappy@1.0.2:
+    resolution: {integrity: sha512-l4Sp/DRseor9wL6EvV2+TuQn63dMkPjZ/sp9XkghTEbV9KlPS1xUsZ3u7/IQO4wxtcFB4bgpQPRcR3QCvezPcQ==}
+    dev: true
+
+  /yocto-queue@0.1.0:
+    resolution: {integrity: sha512-rVksvsnNCdJ/ohGc6xgPwyN8eheCxsiLM8mxuE/t/mOVqJewPuO1miLpTHQiRgTKCLexL4MeAFVagts7HmNZ2Q==}
+    engines: {node: '>=10'}
+    dev: true
--- a/packages/banners/scripts/inkscape-convert.js
+++ b/packages/banners/scripts/inkscape-convert.js
@@ -0,0 +1,90 @@
+// eslint-disable-next-line jsdoc/no-bad-blocks
+/* eslint-disable
+@typescript-eslint/no-unsafe-argument,
+@typescript-eslint/no-unsafe-member-access,
+@typescript-eslint/no-unsafe-assignment,
+@typescript-eslint/no-unsafe-call,
+*/
+
+import process from 'node:process';
+import fs from 'node:fs/promises';
+import path from 'node:path';
+
+import { parseHTML } from 'linkedom';
+
+/** @type {string[]} */
+const paths = process.argv
+	.filter(a => a.endsWith('.inkscape.svg'))
+	.map(a => (a.startsWith('/') ? a : path.join(process.cwd(), a)));
+
+/**
+ * @typedef {import('linkedom').HTMLElement} HTMLElement
+ * @param {HTMLElement} el - The element to crawl on.
+ * @param {(el: HTMLElement) => HTMLElement | void} callback
+ * - Callback function to be run on each element.
+ */
+function crawl(el, callback) {
+	for (const child of el.childNodes) {
+		callback(child);
+		if (child.nodeType === child.ELEMENT_NODE)
+			crawl(child, callback);
+	}
+}
+
+/**
+ * @param {string} file - Files string to be converted.
+ * @returns {string} - The converted file string content.
+ */
+function covert(file) {
+	const { document } = parseHTML(file);
+	// @ts-expect-error - because SVGElement is different from HTMLElement
+	const el =/** @type {HTMLElement} */ (document.querySelector('svg'));
+
+	crawl(el, (e) => {
+		if (e.tagName === undefined || !e.hasAttributes()) return;
+
+		/** @type {string | null } */
+		const label = e.getAttribute('inkscape:label');
+		if (!label)	return;
+
+		e.setAttribute('data-banner-class', label);
+
+		for (const attr of e.attributes) {
+			// eslint-disable-next-line max-len
+			if (attr.name.startsWith('inkscape:'))
+				e.removeAttribute(attr.name);
+			/* eslint-enable */
+		}
+	});
+
+	const tmp = document.createElement('template');
+	// @ts-expect-error el is type HTMLElement and not Node.
+	tmp.appendChild(el);
+
+	const capitalizedElements = [
+		'linearGradient',
+		'feFlood',
+		'feGaussianBlur',
+		'feOffset',
+		'feComposite',
+	];
+
+	let htmlString = tmp.innerHTML;
+	for (const e of capitalizedElements) {
+		htmlString = htmlString.replaceAll(`<${e.toLowerCase()}`, `<${e}`);
+		htmlString = htmlString.replaceAll(`</${e.toLowerCase()}`, `</${e}`);
+	}
+
+	return htmlString;
+}
+
+/* eslint-disable no-await-in-loop, security/detect-non-literal-fs-filename */
+for (const p of paths) {
+	const file = await fs.readFile(p);
+	const svg = covert(file.toString());
+
+	await fs.writeFile(p.replaceAll('.inkscape.svg', '.svg'), svg);
+	// eslint-disable-next-line no-console
+	console.log(`File ${p.replace(process.cwd(), '')} converted!`);
+}
+
--- a/packages/banners/static/design.inkscape.svg
+++ b/packages/banners/static/design.inkscape.svg
@@ -0,0 +1,630 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<!-- Created with Inkscape (http://www.inkscape.org/) -->
+
+<svg
+   width="162.68884mm"
+   height="48.491169mm"
+   viewBox="0 0 162.68884 48.491168"
+   version="1.1"
+   id="svg1"
+   xml:space="preserve"
+   sodipodi:docname="design.inkscape.svg"
+   inkscape:version="1.3.1 (91b66b0783, 2023-11-16, custom)"
+   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
+   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+   xmlns:xlink="http://www.w3.org/1999/xlink"
+   xmlns="http://www.w3.org/2000/svg"
+   xmlns:svg="http://www.w3.org/2000/svg"><sodipodi:namedview
+     id="namedview1"
+     pagecolor="#505050"
+     bordercolor="#eeeeee"
+     borderopacity="1"
+     inkscape:showpageshadow="0"
+     inkscape:pageopacity="0"
+     inkscape:pagecheckerboard="0"
+     inkscape:deskcolor="#505050"
+     inkscape:document-units="mm"
+     inkscape:zoom="1.1011145"
+     inkscape:cx="155.75129"
+     inkscape:cy="-119.42446"
+     inkscape:window-width="2540"
+     inkscape:window-height="1023"
+     inkscape:window-x="0"
+     inkscape:window-y="0"
+     inkscape:window-maximized="1"
+     inkscape:current-layer="layer2"
+     showgrid="false"
+     inkscape:export-bgcolor="#ffffff00"><inkscape:page
+       x="0"
+       y="0"
+       width="162.68884"
+       height="48.491169"
+       id="page18"
+       margin="0"
+       bleed="0" /><inkscape:page
+       x="0"
+       y="-115.57619"
+       width="162.68883"
+       height="42.772179"
+       id="page19"
+       margin="0"
+       bleed="0" /><inkscape:page
+       x="0"
+       y="-56.02528"
+       width="162.68884"
+       height="42.772182"
+       id="page20"
+       margin="0"
+       bleed="0" /></sodipodi:namedview><defs
+     id="defs1"><inkscape:path-effect
+       effect="fillet_chamfer"
+       id="path-effect21"
+       is_visible="true"
+       lpeversion="1"
+       nodesatellites_param="F,0,0,1,0,4.2465822e-06,0,1 @ F,0,0,1,0,3.6765092,0,1 @ F,0,0,1,0,4.2465822e-06,0,1 @ F,0,0,1,0,4.2465822e-06,0,1 @ F,0,0,1,0,4.2465821e-06,0,1 @ F,0,0,1,0,4.2465821e-06,0,1 @ F,0,0,1,0,4.2465821e-06,0,1 @ F,0,0,1,0,4.2465821e-06,0,1"
+       radius="1.6050074e-05"
+       unit="px"
+       method="auto"
+       mode="F"
+       chamfer_steps="1"
+       flexible="false"
+       use_knot_distance="true"
+       apply_no_radius="true"
+       apply_with_radius="true"
+       only_selected="false"
+       hide_knots="false" /><inkscape:path-effect
+       effect="fillet_chamfer"
+       id="path-effect20"
+       is_visible="true"
+       lpeversion="1"
+       nodesatellites_param=""
+       radius="0"
+       unit="px"
+       method="auto"
+       mode="F"
+       chamfer_steps="1"
+       flexible="false"
+       use_knot_distance="true"
+       apply_no_radius="true"
+       apply_with_radius="true"
+       only_selected="false"
+       hide_knots="false" /><linearGradient
+       id="linearGradient55"
+       inkscape:collect="always"
+       inkscape:label="background-gradient"><stop
+         style="stop-color:#ffffff;stop-opacity:1;"
+         offset="0.30320638"
+         id="stop54" /><stop
+         style="stop-color:#ffffff;stop-opacity:0;"
+         offset="1"
+         id="stop55" /></linearGradient><clipPath
+       clipPathUnits="userSpaceOnUse"
+       id="clipPath25"><rect
+         style="fill:#ff0000;stroke:none;stroke-width:3;stroke-linecap:square;stroke-linejoin:miter;paint-order:stroke markers fill;stop-color:#000000"
+         id="rect25-8"
+         width="78"
+         height="45.033199"
+         x="763.61322"
+         y="452.82422" /></clipPath><clipPath
+       clipPathUnits="userSpaceOnUse"
+       id="clipPath47"><path
+         id="path47"
+         style="stroke-width:0.1;stroke-linecap:square;paint-order:markers fill stroke;stop-color:#000000"
+         d="M 438.25066,553.76374 H 1298.1212 V 755.15928 H 438.25066 Z"
+         sodipodi:nodetypes="ccccc" /></clipPath><clipPath
+       clipPathUnits="userSpaceOnUse"
+       id="clipPath33"><rect
+         style="fill:#000000;stroke:#000000;stroke-width:0;stroke-linejoin:bevel;paint-order:stroke markers fill;stop-color:#000000"
+         id="rect5-4"
+         width="20"
+         height="200"
+         x="530"
+         y="595" /></clipPath><clipPath
+       clipPathUnits="userSpaceOnUse"
+       id="clipPath23"><path
+         id="path23"
+         style="stroke-width:0.1;stroke-linecap:square;paint-order:markers fill stroke;stop-color:#000000"
+         d="m -880.82767,-187.29769 h 1640.84 v 73.28155 h -1640.84 z" /></clipPath><clipPath
+       clipPathUnits="userSpaceOnUse"
+       id="clipPath52"><path
+         id="path52"
+         style="stroke-width:0.1;stroke-linecap:square;paint-order:markers fill stroke;stop-color:#000000"
+         d="m -880.82767,-187.29769 h 1640.84 v 73.28155 h -1640.84 z" /></clipPath><clipPath
+       clipPathUnits="userSpaceOnUse"
+       id="clipPath5"><path
+         id="path5"
+         style="stroke-width:0.1;stroke-linecap:square;paint-order:markers fill stroke;stop-color:#000000"
+         d="M 438.25066,553.76374 H 1298.1212 V 755.15928 H 438.25066 Z"
+         sodipodi:nodetypes="ccccc" /></clipPath><linearGradient
+       id="linearGradient14"
+       inkscape:collect="always"
+       inkscape:label="background-image-mask-gradient"><stop
+         style="stop-color:#000000;stop-opacity:1;"
+         offset="0.30320638"
+         id="stop14" /><stop
+         style="stop-color:#ffffff;stop-opacity:1;"
+         offset="1"
+         id="stop15" /></linearGradient><inkscape:path-effect
+       effect="fillet_chamfer"
+       id="path-effect4"
+       is_visible="true"
+       lpeversion="1"
+       nodesatellites_param="F,0,0,1,0,0,0,1 @ F,0,0,1,0,0,0,1 @ F,0,0,1,0,0,0,1 @ F,0,0,1,0,0,0,1 @ F,0,0,1,0,0,0,1 @ F,0,0,1,0,0,0,1 @ F,0,0,1,0,0,0,1 @ F,0,0,1,0,0,0,1"
+       radius="0"
+       unit="px"
+       method="auto"
+       mode="F"
+       chamfer_steps="1"
+       flexible="false"
+       use_knot_distance="true"
+       apply_no_radius="true"
+       apply_with_radius="true"
+       only_selected="false"
+       hide_knots="false" /><inkscape:path-effect
+       effect="fillet_chamfer"
+       id="path-effect3"
+       is_visible="true"
+       lpeversion="1"
+       nodesatellites_param="F,0,0,1,0,0,0,1 @ F,0,0,1,0,0,0,1 @ F,0,0,1,0,0,0,1 @ F,0,0,1,0,0,0,1 @ F,0,0,1,0,0,0,1 @ F,0,0,1,0,0,0,1 @ F,0,0,1,0,0,0,1 @ F,0,0,1,0,0,0,1"
+       radius="0"
+       unit="px"
+       method="auto"
+       mode="F"
+       chamfer_steps="1"
+       flexible="false"
+       use_knot_distance="true"
+       apply_no_radius="true"
+       apply_with_radius="true"
+       only_selected="false"
+       hide_knots="false" /><inkscape:path-effect
+       effect="fillet_chamfer"
+       id="path-effect1"
+       is_visible="true"
+       lpeversion="1"
+       nodesatellites_param="F,0,0,1,0,0,0,1 @ F,0,0,1,0,0,0,1 @ F,0,0,1,0,0,0,1 @ F,0,0,1,0,0,0,1 @ F,0,0,1,0,0,0,1 @ F,0,0,1,0,0,0,1 @ F,0,0,1,0,0,0,1 @ F,0,0,1,0,0,0,1"
+       radius="0"
+       unit="px"
+       method="auto"
+       mode="F"
+       chamfer_steps="1"
+       flexible="false"
+       use_knot_distance="true"
+       apply_no_radius="true"
+       apply_with_radius="true"
+       only_selected="false"
+       hide_knots="false" /><linearGradient
+       inkscape:collect="always"
+       xlink:href="#linearGradient82-2"
+       id="linearGradient5"
+       x1="18.784613"
+       y1="57.455349"
+       x2="159.75043"
+       y2="57.455349"
+       gradientUnits="userSpaceOnUse"
+       gradientTransform="translate(310.57446,-12.675088)" /><linearGradient
+       id="linearGradient82-2"
+       inkscape:label="color-stripe-gradient"><stop
+         style="stop-color:#ff0000;stop-opacity:1;"
+         offset="0"
+         id="stop104" /><stop
+         style="stop-color:#ffff00;stop-opacity:1;"
+         offset="0.18269952"
+         id="stop105" /><stop
+         style="stop-color:#00ff00;stop-opacity:1;"
+         offset="0.39030838"
+         id="stop106" /><stop
+         style="stop-color:#00ffff;stop-opacity:1;"
+         offset="0.59760052"
+         id="stop107" /><stop
+         style="stop-color:#0000ff;stop-opacity:1;"
+         offset="0.79487675"
+         id="stop108" /><stop
+         style="stop-color:#ff00ff;stop-opacity:1;"
+         offset="1"
+         id="stop109" /></linearGradient><clipPath
+       clipPathUnits="userSpaceOnUse"
+       id="clipPath107-6"><path
+         d="M 0,1674.565 H 2453.522 V 0 H 0 Z"
+         transform="translate(-1479.7665,-631.83924)"
+         id="path107-1" /></clipPath><linearGradient
+       inkscape:collect="always"
+       xlink:href="#linearGradient55"
+       id="linearGradient15"
+       x1="12.732515"
+       y1="45.720142"
+       x2="165.80252"
+       y2="15.906352"
+       gradientUnits="userSpaceOnUse"
+       gradientTransform="matrix(1,0,0,0.78569196,0.91790394,-0.86860867)" /><mask
+       maskUnits="userSpaceOnUse"
+       id="mask2"><path
+         id="path2"
+         style="display:inline;opacity:1;fill:url(#linearGradient3);stroke-width:0.303146;paint-order:fill markers stroke"
+         inkscape:label="mask"
+         d="M 16.447515,24.244587 H 162.08752 c 2.05812,0 3.71501,1.65689 3.71501,3.715001 v 23.139473 c 0,2.058112 -1.65689,3.715002 -3.71501,3.715002 H 16.447515 c -2.05811,0 -3.715,-1.65689 -3.715,-3.715002 V 27.959588 c 0,-2.058111 1.65689,-3.715001 3.715,-3.715001 z" /></mask><linearGradient
+       inkscape:collect="always"
+       xlink:href="#linearGradient14"
+       id="linearGradient3"
+       gradientUnits="userSpaceOnUse"
+       gradientTransform="matrix(1,0,0,0.78569196,-1e-8,11.747095)"
+       x1="12.732515"
+       y1="45.720142"
+       x2="165.80252"
+       y2="15.906352" /><linearGradient
+       inkscape:collect="always"
+       xlink:href="#linearGradient82-2"
+       id="linearGradient10"
+       gradientUnits="userSpaceOnUse"
+       gradientTransform="translate(309.94657,46.282782)"
+       x1="18.784613"
+       y1="57.455349"
+       x2="159.75043"
+       y2="57.455349" /><linearGradient
+       inkscape:collect="always"
+       xlink:href="#linearGradient55"
+       id="linearGradient11"
+       gradientUnits="userSpaceOnUse"
+       gradientTransform="matrix(1,0,0,0.78569196,0.91790394,-0.86860867)"
+       x1="12.732515"
+       y1="45.720142"
+       x2="165.80252"
+       y2="15.906352" /><linearGradient
+       inkscape:collect="always"
+       xlink:href="#linearGradient82-2"
+       id="linearGradient19"
+       gradientUnits="userSpaceOnUse"
+       gradientTransform="translate(309.94661,59.369176)"
+       x1="18.784613"
+       y1="57.455349"
+       x2="159.75043"
+       y2="57.455349" /><linearGradient
+       inkscape:collect="always"
+       xlink:href="#linearGradient55"
+       id="linearGradient2"
+       x1="90.18544"
+       y1="96.020027"
+       x2="90.18544"
+       y2="59.73156"
+       gradientUnits="userSpaceOnUse" /><mask
+       maskUnits="userSpaceOnUse"
+       id="mask13"><path
+         id="path14"
+         style="opacity:1;fill:url(#linearGradient16);stroke-width:0.342;paint-order:fill markers stroke"
+         inkscape:label="mask"
+         d="M 163.04842,11.667375 H 17.322411 c -2.034292,0 -3.672002,1.637713 -3.672002,3.671999 v 28.944467 c 0,2.034288 1.63771,3.672001 3.672002,3.672001 H 163.04842 c 2.03429,0 3.672,-1.637713 3.672,-3.672001 V 15.339374 c 0,-2.034286 -1.63771,-3.671999 -3.672,-3.671999 z" /></mask><linearGradient
+       inkscape:collect="always"
+       xlink:href="#linearGradient14"
+       id="linearGradient16"
+       gradientUnits="userSpaceOnUse"
+       gradientTransform="matrix(-1,0,0,1,180.37085,-48.064185)"
+       x1="90.18544"
+       y1="95.033531"
+       x2="90.18544"
+       y2="47.599419" /><mask
+       maskUnits="userSpaceOnUse"
+       id="mask17"><path
+         id="path18"
+         style="display:inline;opacity:1;fill:url(#linearGradient18);stroke-width:0.303146;paint-order:fill markers stroke"
+         inkscape:label="mask"
+         d="M 16.447515,24.244587 H 162.08752 c 2.05812,0 3.71501,1.65689 3.71501,3.715001 v 23.139473 c 0,2.058112 -1.65689,3.715002 -3.71501,3.715002 H 16.447515 c -2.05811,0 -3.715,-1.65689 -3.715,-3.715002 V 27.959588 c 0,-2.058111 1.65689,-3.715001 3.715,-3.715001 z" /></mask><linearGradient
+       inkscape:collect="always"
+       xlink:href="#linearGradient14"
+       id="linearGradient18"
+       gradientUnits="userSpaceOnUse"
+       gradientTransform="matrix(1,0,0,0.78569196,-1e-8,11.747095)"
+       x1="12.732515"
+       y1="45.720142"
+       x2="165.80252"
+       y2="15.906352" /><filter
+       style="color-interpolation-filters:sRGB"
+       inkscape:label="Drop Shadow"
+       id="filter56"
+       x="-0.031419724"
+       y="-0.15732744"
+       width="1.0628394"
+       height="1.3991793"><feFlood
+         result="flood"
+         in="SourceGraphic"
+         flood-opacity="0.200000"
+         flood-color="rgb(0,0,0)"
+         id="feFlood55" /><feGaussianBlur
+         result="blur"
+         in="SourceGraphic"
+         stdDeviation="2.003924"
+         id="feGaussianBlur55" /><feOffset
+         result="offset"
+         in="blur"
+         dx="0.000000"
+         dy="2.583867"
+         id="feOffset55" /><feComposite
+         result="comp1"
+         operator="in"
+         in="flood"
+         in2="offset"
+         id="feComposite55" /><feComposite
+         result="comp2"
+         operator="over"
+         in="SourceGraphic"
+         in2="comp1"
+         id="feComposite56" /></filter><filter
+       style="color-interpolation-filters:sRGB"
+       inkscape:label="Drop Shadow"
+       id="filter63"
+       x="-0.031419723"
+       y="-0.13253295"
+       width="1.0628394"
+       height="1.3362694"><feFlood
+         result="flood"
+         in="SourceGraphic"
+         flood-opacity="0.200000"
+         flood-color="rgb(0,0,0)"
+         id="feFlood62" /><feGaussianBlur
+         result="blur"
+         in="SourceGraphic"
+         stdDeviation="2.003924"
+         id="feGaussianBlur62" /><feOffset
+         result="offset"
+         in="blur"
+         dx="0.000000"
+         dy="2.583867"
+         id="feOffset62" /><feComposite
+         result="comp1"
+         operator="in"
+         in="flood"
+         in2="offset"
+         id="feComposite62" /><feComposite
+         result="comp2"
+         operator="over"
+         in="SourceGraphic"
+         in2="comp1"
+         id="feComposite63" /></filter></defs><g
+     inkscape:label="horizontal"
+     inkscape:groupmode="layer"
+     id="layer1"
+     inkscape:export-filename="horizontal.inkscape.svg"
+     inkscape:export-xdpi="318.59933"
+     inkscape:export-ydpi="318.59933"
+     transform="translate(-318.49757,-124.93908)"><path
+       id="path20"
+       style="display:inline;opacity:1;fill:#ffffff;fill-opacity:1;stroke-width:0.303146;paint-order:fill markers stroke;filter:url(#filter56)"
+       inkscape:label="shadow"
+       d="M 17.365414,11.590389 H 163.00542 c 2.05811,0 3.715,1.65689 3.715,3.715 v 23.139475 c 0,2.05811 -1.65689,3.715 -3.715,3.715 H 17.365414 c -2.05811,0 -3.715,-1.65689 -3.715,-3.715 V 15.305389 c 0,-2.05811 1.65689,-3.715 3.715,-3.715 z"
+       transform="translate(309.65655,2.5819009)" /><path
+       id="color-stripe"
+       style="fill:url(#linearGradient5);stroke-width:0.0784105;paint-order:fill markers stroke"
+       inkscape:label="color-stripe"
+       d="m 330.84692,43.669859 h 137.9901 c 0.82427,0 1.48786,0.49524 1.48786,1.1104 0,0.61516 -0.66359,1.1104 -1.48786,1.1104 h -137.9901 c -0.82427,0 -1.48785,-0.49524 -1.48785,-1.1104 0,-0.61516 0.66358,-1.1104 1.48785,-1.1104 z" /><g
+       id="background"
+       inkscape:label="background"
+       transform="translate(309.65655,2.5819009)"><path
+         id="fallback"
+         style="display:inline;opacity:1;fill:#ffffff;stroke-width:0.302511;paint-order:fill markers stroke"
+         inkscape:label="fallback"
+         d="M 17.416924,11.667379 H 162.95393 c 2.05665,0 3.71237,1.652718 3.71237,3.705644 v 23.081198 c 0,2.052926 -1.65572,3.705643 -3.71237,3.705643 H 17.416924 c -2.056654,0 -3.712372,-1.652717 -3.712372,-3.705643 V 15.373023 c 0,-2.052926 1.655718,-3.705644 3.712372,-3.705644 z" /><g
+         id="image"
+         inkscape:label="image"><image
+           width="134.7771"
+           height="89.851387"
+           preserveAspectRatio="none"
+           xlink:href="../../../../../Downloads/alexandre-debieve-FO7JIlwjOtU-unsplash.jpg"
+           id="embed"
+           x="60.238495"
+           y="-3.5220199"
+           inkscape:label="embed"
+           mask="url(#mask17)"
+           transform="translate(0.91790394,-12.615704)"
+           style="image-rendering:optimizeSpeed"
+           inkscape:svg-dpi="1"
+           inkscape:export-filename="horizontal.svg"
+           inkscape:export-xdpi="96"
+           inkscape:export-ydpi="96" /></g><path
+         id="gradient"
+         style="display:inline;opacity:1;fill:url(#linearGradient15);stroke-width:0.303146;paint-order:fill markers stroke"
+         inkscape:label="gradient"
+         d="M 17.365419,11.628884 H 163.00543 c 2.05811,0 3.715,1.65689 3.715,3.715 v 23.139475 c 0,2.05811 -1.65689,3.715 -3.715,3.715 H 17.365419 c -2.05811,0 -3.715,-1.65689 -3.715,-3.715 V 15.343884 c 0,-2.05811 1.65689,-3.715 3.715,-3.715 z" /><path
+         id="solid-color"
+         style="display:inline;opacity:1;fill:#ffffff;stroke-width:0.303146;paint-order:fill markers stroke"
+         inkscape:label="solid-color"
+         d="M 17.365414,11.590389 H 163.00542 c 2.05811,0 3.715,1.65689 3.715,3.715 v 23.139475 c 0,2.05811 -1.65689,3.715 -3.715,3.715 H 17.365414 c -2.05811,0 -3.715,-1.65689 -3.715,-3.715 V 15.305389 c 0,-2.05811 1.65689,-3.715 3.715,-3.715 z" /></g><g
+       id="content"
+       inkscape:label="content"
+       transform="translate(310.57445,-10.033803)"><title
+         id="title11">content</title><text
+         xml:space="preserve"
+         style="font-style:normal;font-variant:normal;font-weight:600;font-stretch:normal;font-size:3.4638px;font-family:'Cal Sans';-inkscape-font-specification:'Cal Sans, Semi-Bold';font-variant-ligatures:normal;font-variant-caps:normal;font-variant-numeric:normal;font-variant-east-asian:normal;opacity:1;fill:#000000;fill-opacity:1;stroke-width:0.133036;paint-order:fill markers stroke"
+         x="38.497089"
+         y="43.932247"
+         id="subtitle"
+         inkscape:label="subtitle"><title
+           id="title12">subtitle</title><tspan
+           sodipodi:role="line"
+           id="tspan4"
+           style="font-style:normal;font-variant:normal;font-weight:600;font-stretch:normal;font-size:3.4638px;font-family:'Cal Sans';-inkscape-font-specification:'Cal Sans, Semi-Bold';font-variant-ligatures:normal;font-variant-caps:normal;font-variant-numeric:normal;font-variant-east-asian:normal;fill:#000000;fill-opacity:1;stroke-width:0.133036"
+           x="38.497089"
+           y="43.932247">Subtitle placeholder</tspan></text><text
+         xml:space="preserve"
+         style="font-style:normal;font-variant:normal;font-weight:600;font-stretch:normal;font-size:5.05275px;font-family:'Cal Sans';-inkscape-font-specification:'Cal Sans, Semi-Bold';font-variant-ligatures:normal;font-variant-caps:normal;font-variant-numeric:normal;font-variant-east-asian:normal;opacity:1;fill:#000000;fill-opacity:1;stroke-width:0.194064;paint-order:fill markers stroke"
+         x="38.455933"
+         y="38.518772"
+         id="title"
+         inkscape:label="title"><tspan
+           sodipodi:role="line"
+           id="tspan3"
+           style="font-style:normal;font-variant:normal;font-weight:600;font-stretch:normal;font-size:5.05275px;font-family:'Cal Sans';-inkscape-font-specification:'Cal Sans, Semi-Bold';font-variant-ligatures:normal;font-variant-caps:normal;font-variant-numeric:normal;font-variant-east-asian:normal;fill:#000000;fill-opacity:1;stroke-width:0.194064"
+           x="38.455933"
+           y="38.518772">Title placeholder</tspan></text><g
+         id="icon"
+         inkscape:label="icon"><path
+           fill="currentColor"
+           d="m 25.227101,34.205286 c -0.235876,0.06157 -0.387336,0.148721 -0.505541,0.264214 -0.166159,0.16342 -0.274563,0.392234 -0.333944,0.82424 -0.06095,0.445075 -0.06219,1.034514 -0.06219,1.879454 v 4.66868 a 2.2727811,2.2727811 0 0 1 0.70765,-0.323048 1.7922937,1.7922937 0 0 1 0.193956,-0.03922 v -7.274315 z m 0.901602,7.238362 h 6.913129 V 37.17374 c 0,-0.845486 -10e-4,-1.434925 -0.06219,-1.88 -0.05929,-0.432006 -0.167805,-0.660808 -0.333943,-0.82424 -0.166777,-0.162884 -0.399875,-0.269115 -0.841133,-0.326862 -0.454332,-0.05992 -1.055759,-0.061 -1.918675,-0.061 h -2.404613 c -0.545855,0 -0.987134,0 -1.352664,0.01585 z m 0.751773,0.883071 h -0.662432 c -0.588352,0 -0.793735,0.0036 -0.95172,0.04521 a 1.3423135,1.3423135 0 0 0 -0.924479,0.837858 c 0.0083,0.208103 0.02347,0.391689 0.04572,0.555118 0.05929,0.432006 0.167806,0.660808 0.333945,0.82424 0.166776,0.162884 0.399853,0.269115 0.841132,0.326862 0.454333,0.05992 1.055759,0.061 1.918675,0.061 h 2.404613 c 0.862917,0 1.464878,-10e-4 1.918676,-0.06047 0.441258,-0.0583 0.674973,-0.164512 0.841132,-0.327408 0.166159,-0.163419 0.274564,-0.392233 0.333945,-0.824235 0.05003,-0.362818 0.05992,-0.822603 0.06157,-1.438194 h -3.756205 v 1.638125 c 0,0.162349 0,0.243512 -0.05724,0.276199 -0.05724,0.03269 -0.135068,-0.0039 -0.290912,-0.07627 L 28.19057,43.817203 c -0.05334,-0.02452 -0.07948,-0.0365 -0.107886,-0.0365 -0.02842,0 -0.05456,0.01194 -0.107885,0.0365 l -0.746338,0.347566 c -0.156276,0.07245 -0.234249,0.108958 -0.291447,0.07626 -0.05662,-0.03268 -0.05662,-0.114397 -0.05662,-0.276199 z"
+           id="icon-svg"
+           style="stroke-width:0.544769"
+           inkscape:label="icon-svg" /></g></g></g><g
+     inkscape:groupmode="layer"
+     id="layer2"
+     inkscape:label="horizontal-rtl"
+     inkscape:highlight-color="#3645a9"
+     inkscape:export-filename="./horizontal-rtl.inkscape.svg"
+     inkscape:export-xdpi="318.5993"
+     inkscape:export-ydpi="318.5993"
+     transform="translate(-317.8697,-124.34603)"><path
+       id="path56"
+       style="display:inline;opacity:1;fill:#ffffff;fill-opacity:1;stroke-width:0.303146;paint-order:fill markers stroke;filter:url(#filter56)"
+       inkscape:label="shadow"
+       d="m 326.3941,73.13016 h 145.64001 c 2.05811,0 3.715,1.65689 3.715,3.715 v 23.139475 c 0,2.058115 -1.65689,3.715005 -3.715,3.715005 H 326.3941 c -2.05811,0 -3.715,-1.65689 -3.715,-3.715005 V 76.84516 c 0,-2.05811 1.65689,-3.715 3.715,-3.715 z" /><path
+       id="path3"
+       style="fill:url(#linearGradient10);stroke-width:0.0784105;paint-order:fill markers stroke"
+       inkscape:label="color-stripe"
+       d="m 330.21904,102.62773 h 137.9901 c 0.82427,0 1.48786,0.49524 1.48786,1.1104 0,0.61516 -0.66359,1.1104 -1.48786,1.1104 h -137.9901 c -0.82427,0 -1.48785,-0.49524 -1.48785,-1.1104 0,-0.61516 0.66358,-1.1104 1.48785,-1.1104 z" /><g
+       id="g7"
+       inkscape:label="background"
+       transform="matrix(-1,0,0,1,489.39952,61.539771)"><path
+         id="path4"
+         style="display:inline;opacity:1;fill:#ffffff;stroke-width:0.302511;paint-order:fill markers stroke"
+         inkscape:label="fallback"
+         d="M 17.416924,11.667379 H 162.95393 c 2.05665,0 3.71237,1.652718 3.71237,3.705644 v 23.081198 c 0,2.052926 -1.65572,3.705643 -3.71237,3.705643 H 17.416924 c -2.056654,0 -3.712372,-1.652717 -3.712372,-3.705643 V 15.373023 c 0,-2.052926 1.655718,-3.705644 3.712372,-3.705644 z" /><g
+         id="g4"
+         inkscape:label="image"><image
+           width="134.7771"
+           height="89.851387"
+           preserveAspectRatio="none"
+           xlink:href="../../../../../Downloads/alexandre-debieve-FO7JIlwjOtU-unsplash.jpg"
+           id="image4"
+           x="60.238495"
+           y="-3.5220199"
+           inkscape:label="embed"
+           mask="url(#mask2)"
+           transform="translate(0.91790394,-12.615704)"
+           style="image-rendering:optimizeSpeed"
+           inkscape:svg-dpi="1"
+           inkscape:export-filename="horizontal.svg"
+           inkscape:export-xdpi="96"
+           inkscape:export-ydpi="96" /></g><path
+         id="path6"
+         style="display:inline;opacity:1;fill:url(#linearGradient11);stroke-width:0.303146;paint-order:fill markers stroke"
+         inkscape:label="gradient"
+         d="M 17.365419,11.628884 H 163.00543 c 2.05811,0 3.715,1.65689 3.715,3.715 v 23.139475 c 0,2.05811 -1.65689,3.715 -3.715,3.715 H 17.365419 c -2.05811,0 -3.715,-1.65689 -3.715,-3.715 V 15.343884 c 0,-2.05811 1.65689,-3.715 3.715,-3.715 z" /><path
+         id="path7"
+         style="display:inline;opacity:1;fill:#ffffff;stroke-width:0.303146;paint-order:fill markers stroke"
+         inkscape:label="solid-color"
+         d="M 17.365414,11.590389 H 163.00542 c 2.05811,0 3.715,1.65689 3.715,3.715 v 23.139475 c 0,2.05811 -1.65689,3.715 -3.715,3.715 H 17.365414 c -2.05811,0 -3.715,-1.65689 -3.715,-3.715 V 15.305389 c 0,-2.05811 1.65689,-3.715 3.715,-3.715 z" /></g><g
+       id="g9"
+       inkscape:label="content"
+       transform="matrix(-1,0,0,1,488.48162,48.924067)"><text
+         xml:space="preserve"
+         style="font-style:normal;font-variant:normal;font-weight:600;font-stretch:normal;font-size:3.4638px;font-family:'Cal Sans';-inkscape-font-specification:'Cal Sans, Semi-Bold';font-variant-ligatures:normal;font-variant-caps:normal;font-variant-numeric:normal;font-variant-east-asian:normal;text-align:end;text-anchor:end;opacity:1;fill:#000000;fill-opacity:1;stroke-width:0.133036;paint-order:fill markers stroke"
+         x="-38.566364"
+         y="43.932247"
+         id="text7"
+         inkscape:label="subtitle"
+         transform="scale(-1,1)"><tspan
+           sodipodi:role="line"
+           id="tspan7"
+           style="font-style:normal;font-variant:normal;font-weight:600;font-stretch:normal;font-size:3.4638px;font-family:'Cal Sans';-inkscape-font-specification:'Cal Sans, Semi-Bold';font-variant-ligatures:normal;font-variant-caps:normal;font-variant-numeric:normal;font-variant-east-asian:normal;text-align:end;text-anchor:end;fill:#000000;fill-opacity:1;stroke-width:0.133036"
+           x="-38.566364"
+           y="43.932247">Subtitle placeholder</tspan></text><text
+         xml:space="preserve"
+         style="font-style:normal;font-variant:normal;font-weight:600;font-stretch:normal;font-size:5.05275px;font-family:'Cal Sans';-inkscape-font-specification:'Cal Sans, Semi-Bold';font-variant-ligatures:normal;font-variant-caps:normal;font-variant-numeric:normal;font-variant-east-asian:normal;text-align:end;text-anchor:end;opacity:1;fill:#000000;fill-opacity:1;stroke-width:0.194064;paint-order:fill markers stroke"
+         x="-38.607517"
+         y="38.518772"
+         id="text8"
+         inkscape:label="title"
+         transform="scale(-1,1)"><tspan
+           sodipodi:role="line"
+           id="tspan8"
+           style="font-style:normal;font-variant:normal;font-weight:600;font-stretch:normal;font-size:5.05275px;font-family:'Cal Sans';-inkscape-font-specification:'Cal Sans, Semi-Bold';font-variant-ligatures:normal;font-variant-caps:normal;font-variant-numeric:normal;font-variant-east-asian:normal;text-align:end;text-anchor:end;fill:#000000;fill-opacity:1;stroke-width:0.194064"
+           x="-38.607517"
+           y="38.518772">Title placeholder</tspan></text><g
+         id="g8"
+         inkscape:label="icon"
+         transform="matrix(-1,0,0,1,57.367258,0)"><path
+           fill="currentColor"
+           d="m 25.227101,34.205286 c -0.235876,0.06157 -0.387336,0.148721 -0.505541,0.264214 -0.166159,0.16342 -0.274563,0.392234 -0.333944,0.82424 -0.06095,0.445075 -0.06219,1.034514 -0.06219,1.879454 v 4.66868 a 2.2727811,2.2727811 0 0 1 0.70765,-0.323048 1.7922937,1.7922937 0 0 1 0.193956,-0.03922 v -7.274315 z m 0.901602,7.238362 h 6.913129 V 37.17374 c 0,-0.845486 -10e-4,-1.434925 -0.06219,-1.88 -0.05929,-0.432006 -0.167805,-0.660808 -0.333943,-0.82424 -0.166777,-0.162884 -0.399875,-0.269115 -0.841133,-0.326862 -0.454332,-0.05992 -1.055759,-0.061 -1.918675,-0.061 h -2.404613 c -0.545855,0 -0.987134,0 -1.352664,0.01585 z m 0.751773,0.883071 h -0.662432 c -0.588352,0 -0.793735,0.0036 -0.95172,0.04521 a 1.3423135,1.3423135 0 0 0 -0.924479,0.837858 c 0.0083,0.208103 0.02347,0.391689 0.04572,0.555118 0.05929,0.432006 0.167806,0.660808 0.333945,0.82424 0.166776,0.162884 0.399853,0.269115 0.841132,0.326862 0.454333,0.05992 1.055759,0.061 1.918675,0.061 h 2.404613 c 0.862917,0 1.464878,-10e-4 1.918676,-0.06047 0.441258,-0.0583 0.674973,-0.164512 0.841132,-0.327408 0.166159,-0.163419 0.274564,-0.392233 0.333945,-0.824235 0.05003,-0.362818 0.05992,-0.822603 0.06157,-1.438194 h -3.756205 v 1.638125 c 0,0.162349 0,0.243512 -0.05724,0.276199 -0.05724,0.03269 -0.135068,-0.0039 -0.290912,-0.07627 L 28.19057,43.817203 c -0.05334,-0.02452 -0.07948,-0.0365 -0.107886,-0.0365 -0.02842,0 -0.05456,0.01194 -0.107885,0.0365 l -0.746338,0.347566 c -0.156276,0.07245 -0.234249,0.108958 -0.291447,0.07626 -0.05662,-0.03268 -0.05662,-0.114397 -0.05662,-0.276199 z"
+           id="path8"
+           style="stroke-width:0.544769"
+           inkscape:label="icon-svg" /></g></g></g><g
+     inkscape:groupmode="layer"
+     id="g19"
+     inkscape:label="vertical"
+     inkscape:highlight-color="#a99e36"
+     transform="translate(-317.8697,-75.726641)"
+     inkscape:export-filename="vertical.inkscape.svg"
+     inkscape:export-xdpi="318.5993"
+     inkscape:export-ydpi="318.5993"><path
+       id="path62"
+       style="display:inline;opacity:1;fill:#ffffff;stroke-width:0.342;paint-order:fill markers stroke;filter:url(#filter63)"
+       inkscape:label="shadow"
+       d="m 326.35112,80.536055 h 145.72601 c 2.03429,0 3.672,1.637712 3.672,3.672 v 28.944465 c 0,2.03429 -1.63771,3.672 -3.672,3.672 H 326.35112 c -2.03429,0 -3.672,-1.63771 -3.672,-3.672 V 84.208055 c 0,-2.034288 1.63771,-3.672 3.672,-3.672 z" /><path
+       id="path12"
+       style="fill:url(#linearGradient19);stroke-width:0.0784105;paint-order:fill markers stroke"
+       inkscape:label="color-stripe"
+       d="m 330.21907,115.71413 h 137.9901 c 0.82427,0 1.48786,0.49523 1.48786,1.11039 0,0.61516 -0.66359,1.1104 -1.48786,1.1104 h -137.9901 c -0.82427,0 -1.48785,-0.49524 -1.48785,-1.1104 0,-0.61516 0.66358,-1.11039 1.48785,-1.11039 z" /><g
+       id="g15"
+       inkscape:label="background"
+       transform="matrix(-1,0,0,1,489.39954,68.86868)"><path
+         id="rect12"
+         style="display:inline;opacity:1;fill:#ffffff;stroke-width:0.341536;paint-order:fill markers stroke"
+         inkscape:label="fallback"
+         transform="scale(-1,1)"
+         d="m -162.97125,11.691942 h 145.528694 c 2.031534,0 3.667028,1.635495 3.667028,3.667028 v 28.905275 c 0,2.031533 -1.635494,3.667028 -3.667028,3.667028 H -162.97125 c -2.03153,0 -3.66703,-1.635495 -3.66703,-3.667028 V 15.35897 c 0,-2.031533 1.6355,-3.667028 3.66703,-3.667028 z" /><g
+         id="g5"
+         inkscape:label="image"><image
+           width="153.07002"
+           height="102.04668"
+           preserveAspectRatio="none"
+           xlink:href="../../../../../Downloads/alexandre-debieve-FO7JIlwjOtU-unsplash.jpg"
+           id="image13"
+           x="13.650405"
+           y="-21.211729"
+           inkscape:label="embed"
+           mask="url(#mask13)"
+           style="image-rendering:optimizeSpeed"
+           inkscape:svg-dpi="1"
+           inkscape:export-filename="horizontal.svg"
+           inkscape:export-xdpi="96"
+           inkscape:export-ydpi="96" /></g><path
+         id="rect20"
+         style="display:inline;opacity:1;fill:url(#linearGradient2);stroke-width:0.342;paint-order:fill markers stroke"
+         inkscape:label="gradient"
+         transform="matrix(-1,0,0,1,180.37085,-48.064185)"
+         d="m 17.32243,59.73156 h 145.72601 c 2.03429,0 3.672,1.637712 3.672,3.672 v 28.944467 c 0,2.034288 -1.63771,3.672 -3.672,3.672 H 17.32243 c -2.034288,0 -3.672,-1.637712 -3.672,-3.672 V 63.40356 c 0,-2.034288 1.637712,-3.672 3.672,-3.672 z" /><path
+         id="rect1"
+         style="display:inline;opacity:1;fill:#ffffff;stroke-width:0.342;paint-order:fill markers stroke"
+         inkscape:label="solid-color"
+         transform="matrix(-1,0,0,1,180.37085,-48.064185)"
+         d="m 17.32243,59.73156 h 145.72601 c 2.03429,0 3.672,1.637712 3.672,3.672 v 28.944467 c 0,2.034288 -1.63771,3.672 -3.672,3.672 H 17.32243 c -2.034288,0 -3.672,-1.637712 -3.672,-3.672 V 63.40356 c 0,-2.034288 1.637712,-3.672 3.672,-3.672 z" /></g><g
+       id="g17"
+       inkscape:label="content"
+       transform="matrix(-1,0,0,1,461.33439,62.953888)"><text
+         xml:space="preserve"
+         style="font-style:normal;font-variant:normal;font-weight:600;font-stretch:normal;font-size:2.95147px;font-family:'Cal Sans';-inkscape-font-specification:'Cal Sans, Semi-Bold';font-variant-ligatures:normal;font-variant-caps:normal;font-variant-numeric:normal;font-variant-east-asian:normal;text-align:center;text-anchor:middle;opacity:1;fill:#000000;fill-opacity:1;stroke-width:0.113359;paint-order:fill markers stroke"
+         x="-62.127644"
+         y="42.596745"
+         id="text15"
+         inkscape:label="subtitle"
+         transform="scale(-1,1)"><tspan
+           sodipodi:role="line"
+           id="tspan15"
+           style="font-style:normal;font-variant:normal;font-weight:600;font-stretch:normal;font-size:2.95147px;font-family:'Cal Sans';-inkscape-font-specification:'Cal Sans, Semi-Bold';font-variant-ligatures:normal;font-variant-caps:normal;font-variant-numeric:normal;font-variant-east-asian:normal;text-align:center;text-anchor:middle;fill:#000000;fill-opacity:1;stroke-width:0.113359"
+           x="-62.127644"
+           y="42.596745">Subtitle placeholder</tspan></text><text
+         xml:space="preserve"
+         style="font-style:normal;font-variant:normal;font-weight:600;font-stretch:normal;font-size:4.3054px;font-family:'Cal Sans';-inkscape-font-specification:'Cal Sans, Semi-Bold';font-variant-ligatures:normal;font-variant-caps:normal;font-variant-numeric:normal;font-variant-east-asian:normal;text-align:center;text-anchor:middle;opacity:1;fill:#000000;fill-opacity:1;stroke-width:0.16536;paint-order:fill markers stroke"
+         x="-62.141792"
+         y="38.374268"
+         id="text16"
+         inkscape:label="title"
+         transform="scale(-1,1)"><tspan
+           sodipodi:role="line"
+           id="tspan16"
+           style="font-style:normal;font-variant:normal;font-weight:600;font-stretch:normal;font-size:4.3054px;font-family:'Cal Sans';-inkscape-font-specification:'Cal Sans, Semi-Bold';font-variant-ligatures:normal;font-variant-caps:normal;font-variant-numeric:normal;font-variant-east-asian:normal;text-align:center;text-anchor:middle;fill:#000000;fill-opacity:1;stroke-width:0.16536"
+           x="-62.141792"
+           y="38.374268">Title placeholder</tspan></text><g
+         id="g16"
+         inkscape:label="icon"
+         transform="matrix(-0.85209125,0,0,0.85209125,86.561334,-5.292951)"><path
+           fill="currentColor"
+           d="m 25.227101,34.205286 c -0.235876,0.06157 -0.387336,0.148721 -0.505541,0.264214 -0.166159,0.16342 -0.274563,0.392234 -0.333944,0.82424 -0.06095,0.445075 -0.06219,1.034514 -0.06219,1.879454 v 4.66868 a 2.2727811,2.2727811 0 0 1 0.70765,-0.323048 1.7922937,1.7922937 0 0 1 0.193956,-0.03922 v -7.274315 z m 0.901602,7.238362 h 6.913129 V 37.17374 c 0,-0.845486 -10e-4,-1.434925 -0.06219,-1.88 -0.05929,-0.432006 -0.167805,-0.660808 -0.333943,-0.82424 -0.166777,-0.162884 -0.399875,-0.269115 -0.841133,-0.326862 -0.454332,-0.05992 -1.055759,-0.061 -1.918675,-0.061 h -2.404613 c -0.545855,0 -0.987134,0 -1.352664,0.01585 z m 0.751773,0.883071 h -0.662432 c -0.588352,0 -0.793735,0.0036 -0.95172,0.04521 a 1.3423135,1.3423135 0 0 0 -0.924479,0.837858 c 0.0083,0.208103 0.02347,0.391689 0.04572,0.555118 0.05929,0.432006 0.167806,0.660808 0.333945,0.82424 0.166776,0.162884 0.399853,0.269115 0.841132,0.326862 0.454333,0.05992 1.055759,0.061 1.918675,0.061 h 2.404613 c 0.862917,0 1.464878,-10e-4 1.918676,-0.06047 0.441258,-0.0583 0.674973,-0.164512 0.841132,-0.327408 0.166159,-0.163419 0.274564,-0.392233 0.333945,-0.824235 0.05003,-0.362818 0.05992,-0.822603 0.06157,-1.438194 h -3.756205 v 1.638125 c 0,0.162349 0,0.243512 -0.05724,0.276199 -0.05724,0.03269 -0.135068,-0.0039 -0.290912,-0.07627 L 28.19057,43.817203 c -0.05334,-0.02452 -0.07948,-0.0365 -0.107886,-0.0365 -0.02842,0 -0.05456,0.01194 -0.107885,0.0365 l -0.746338,0.347566 c -0.156276,0.07245 -0.234249,0.108958 -0.291447,0.07626 -0.05662,-0.03268 -0.05662,-0.114397 -0.05662,-0.276199 z"
+           id="path16"
+           style="stroke-width:0.544769"
+           inkscape:label="icon-svg" /></g></g></g></svg>
--- a/packages/banners/static/horizontal-rtl.inkscape.svg
+++ b/packages/banners/static/horizontal-rtl.inkscape.svg
@@ -0,0 +1,233 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<!-- Created with Inkscape (http://www.inkscape.org/) -->
+
+<svg
+   width="162.68884mm"
+   height="42.772182mm"
+   viewBox="0 0 162.68884 42.772182"
+   version="1.1"
+   id="svg1"
+   xml:space="preserve"
+   sodipodi:docname="design.inkscape.svg"
+   inkscape:version="1.3.1 (91b66b0783, 2023-11-16, custom)"
+   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
+   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+   xmlns:xlink="http://www.w3.org/1999/xlink"
+   xmlns="http://www.w3.org/2000/svg"
+   xmlns:svg="http://www.w3.org/2000/svg"><sodipodi:namedview
+     id="namedview1"
+     pagecolor="#505050"
+     bordercolor="#eeeeee"
+     borderopacity="1"
+     inkscape:showpageshadow="0"
+     inkscape:pageopacity="0"
+     inkscape:pagecheckerboard="0"
+     inkscape:deskcolor="#505050"
+     inkscape:document-units="mm"
+     inkscape:zoom="1.1011145"
+     inkscape:cx="155.75129"
+     inkscape:cy="-119.42446"
+     inkscape:window-width="2540"
+     inkscape:window-height="1023"
+     inkscape:window-x="0"
+     inkscape:window-y="0"
+     inkscape:window-maximized="1"
+     inkscape:current-layer="layer2"
+     showgrid="false"
+     inkscape:export-bgcolor="#ffffff00"><inkscape:page
+       x="0"
+       y="5.1822312e-08"
+       width="162.68884"
+       height="42.772182"
+       id="page20"
+       margin="0"
+       bleed="0"
+       inkscape:export-filename="horizontal.inkscape.svg"
+       inkscape:export-xdpi="318.59933"
+       inkscape:export-ydpi="318.59933" /></sodipodi:namedview><defs
+     id="defs1"><linearGradient
+       id="linearGradient55"
+       inkscape:collect="always"
+       inkscape:label="background-gradient"><stop
+         style="stop-color:#ffffff;stop-opacity:1;"
+         offset="0.30320638"
+         id="stop54" /><stop
+         style="stop-color:#ffffff;stop-opacity:0;"
+         offset="1"
+         id="stop55" /></linearGradient><linearGradient
+       id="linearGradient14"
+       inkscape:collect="always"
+       inkscape:label="background-image-mask-gradient"><stop
+         style="stop-color:#000000;stop-opacity:1;"
+         offset="0.30320638"
+         id="stop14" /><stop
+         style="stop-color:#ffffff;stop-opacity:1;"
+         offset="1"
+         id="stop15" /></linearGradient><linearGradient
+       id="linearGradient82-2"
+       inkscape:label="color-stripe-gradient"><stop
+         style="stop-color:#ff0000;stop-opacity:1;"
+         offset="0"
+         id="stop104" /><stop
+         style="stop-color:#ffff00;stop-opacity:1;"
+         offset="0.18269952"
+         id="stop105" /><stop
+         style="stop-color:#00ff00;stop-opacity:1;"
+         offset="0.39030838"
+         id="stop106" /><stop
+         style="stop-color:#00ffff;stop-opacity:1;"
+         offset="0.59760052"
+         id="stop107" /><stop
+         style="stop-color:#0000ff;stop-opacity:1;"
+         offset="0.79487675"
+         id="stop108" /><stop
+         style="stop-color:#ff00ff;stop-opacity:1;"
+         offset="1"
+         id="stop109" /></linearGradient><mask
+       maskUnits="userSpaceOnUse"
+       id="mask2"><path
+         id="path2"
+         style="display:inline;opacity:1;fill:url(#linearGradient3);stroke-width:0.303146;paint-order:fill markers stroke"
+         inkscape:label="mask"
+         d="M 16.447515,24.244587 H 162.08752 c 2.05812,0 3.71501,1.65689 3.71501,3.715001 v 23.139473 c 0,2.058112 -1.65689,3.715002 -3.71501,3.715002 H 16.447515 c -2.05811,0 -3.715,-1.65689 -3.715,-3.715002 V 27.959588 c 0,-2.058111 1.65689,-3.715001 3.715,-3.715001 z" /></mask><linearGradient
+       inkscape:collect="always"
+       xlink:href="#linearGradient14"
+       id="linearGradient3"
+       gradientUnits="userSpaceOnUse"
+       gradientTransform="matrix(1,0,0,0.78569196,-1e-8,11.747095)"
+       x1="12.732515"
+       y1="45.720142"
+       x2="165.80252"
+       y2="15.906352" /><linearGradient
+       inkscape:collect="always"
+       xlink:href="#linearGradient82-2"
+       id="linearGradient10"
+       gradientUnits="userSpaceOnUse"
+       gradientTransform="translate(309.94657,46.282782)"
+       x1="18.784613"
+       y1="57.455349"
+       x2="159.75043"
+       y2="57.455349" /><linearGradient
+       inkscape:collect="always"
+       xlink:href="#linearGradient55"
+       id="linearGradient11"
+       gradientUnits="userSpaceOnUse"
+       gradientTransform="matrix(1,0,0,0.78569196,0.91790394,-0.86860867)"
+       x1="12.732515"
+       y1="45.720142"
+       x2="165.80252"
+       y2="15.906352" /><filter
+       style="color-interpolation-filters:sRGB"
+       inkscape:label="Drop Shadow"
+       id="filter56"
+       x="-0.031419724"
+       y="-0.15732744"
+       width="1.0628394"
+       height="1.3991793"><feFlood
+         result="flood"
+         in="SourceGraphic"
+         flood-opacity="0.200000"
+         flood-color="rgb(0,0,0)"
+         id="feFlood55" /><feGaussianBlur
+         result="blur"
+         in="SourceGraphic"
+         stdDeviation="2.003924"
+         id="feGaussianBlur55" /><feOffset
+         result="offset"
+         in="blur"
+         dx="0.000000"
+         dy="2.583867"
+         id="feOffset55" /><feComposite
+         result="comp1"
+         operator="in"
+         in="flood"
+         in2="offset"
+         id="feComposite55" /><feComposite
+         result="comp2"
+         operator="over"
+         in="SourceGraphic"
+         in2="comp1"
+         id="feComposite56" /></filter></defs><g
+     inkscape:groupmode="layer"
+     id="layer2"
+     inkscape:label="horizontal-rtl"
+     inkscape:highlight-color="#3645a9"
+     inkscape:export-filename="./horizontal-rtl.inkscape.svg"
+     inkscape:export-xdpi="318.5993"
+     inkscape:export-ydpi="318.5993"
+     transform="translate(-317.8697,-68.320748)"><path
+       id="path56"
+       style="display:inline;opacity:1;fill:#ffffff;fill-opacity:1;stroke-width:0.303146;paint-order:fill markers stroke;filter:url(#filter56)"
+       inkscape:label="shadow"
+       d="m 326.3941,73.13016 h 145.64001 c 2.05811,0 3.715,1.65689 3.715,3.715 v 23.139475 c 0,2.058115 -1.65689,3.715005 -3.715,3.715005 H 326.3941 c -2.05811,0 -3.715,-1.65689 -3.715,-3.715005 V 76.84516 c 0,-2.05811 1.65689,-3.715 3.715,-3.715 z" /><path
+       id="path3"
+       style="fill:url(#linearGradient10);stroke-width:0.0784105;paint-order:fill markers stroke"
+       inkscape:label="color-stripe"
+       d="m 330.21904,102.62773 h 137.9901 c 0.82427,0 1.48786,0.49524 1.48786,1.1104 0,0.61516 -0.66359,1.1104 -1.48786,1.1104 h -137.9901 c -0.82427,0 -1.48785,-0.49524 -1.48785,-1.1104 0,-0.61516 0.66358,-1.1104 1.48785,-1.1104 z" /><g
+       id="g7"
+       inkscape:label="background"
+       transform="matrix(-1,0,0,1,489.39952,61.539771)"><path
+         id="path4"
+         style="display:inline;opacity:1;fill:#ffffff;stroke-width:0.302511;paint-order:fill markers stroke"
+         inkscape:label="fallback"
+         d="M 17.416924,11.667379 H 162.95393 c 2.05665,0 3.71237,1.652718 3.71237,3.705644 v 23.081198 c 0,2.052926 -1.65572,3.705643 -3.71237,3.705643 H 17.416924 c -2.056654,0 -3.712372,-1.652717 -3.712372,-3.705643 V 15.373023 c 0,-2.052926 1.655718,-3.705644 3.712372,-3.705644 z" /><g
+         id="g4"
+         inkscape:label="image"><image
+           width="134.7771"
+           height="89.851387"
+           preserveAspectRatio="none"
+           xlink:href="../../../../../Downloads/alexandre-debieve-FO7JIlwjOtU-unsplash.jpg"
+           id="image4"
+           x="60.238495"
+           y="-3.5220199"
+           inkscape:label="embed"
+           mask="url(#mask2)"
+           transform="translate(0.91790394,-12.615704)"
+           style="image-rendering:optimizeSpeed"
+           inkscape:svg-dpi="1"
+           inkscape:export-filename="horizontal.svg"
+           inkscape:export-xdpi="96"
+           inkscape:export-ydpi="96" /></g><path
+         id="path6"
+         style="display:inline;opacity:1;fill:url(#linearGradient11);stroke-width:0.303146;paint-order:fill markers stroke"
+         inkscape:label="gradient"
+         d="M 17.365419,11.628884 H 163.00543 c 2.05811,0 3.715,1.65689 3.715,3.715 v 23.139475 c 0,2.05811 -1.65689,3.715 -3.715,3.715 H 17.365419 c -2.05811,0 -3.715,-1.65689 -3.715,-3.715 V 15.343884 c 0,-2.05811 1.65689,-3.715 3.715,-3.715 z" /><path
+         id="path7"
+         style="display:inline;opacity:1;fill:#ffffff;stroke-width:0.303146;paint-order:fill markers stroke"
+         inkscape:label="solid-color"
+         d="M 17.365414,11.590389 H 163.00542 c 2.05811,0 3.715,1.65689 3.715,3.715 v 23.139475 c 0,2.05811 -1.65689,3.715 -3.715,3.715 H 17.365414 c -2.05811,0 -3.715,-1.65689 -3.715,-3.715 V 15.305389 c 0,-2.05811 1.65689,-3.715 3.715,-3.715 z" /></g><g
+       id="g9"
+       inkscape:label="content"
+       transform="matrix(-1,0,0,1,488.48162,48.924067)"><text
+         xml:space="preserve"
+         style="font-style:normal;font-variant:normal;font-weight:600;font-stretch:normal;font-size:3.4638px;font-family:'Cal Sans';-inkscape-font-specification:'Cal Sans, Semi-Bold';font-variant-ligatures:normal;font-variant-caps:normal;font-variant-numeric:normal;font-variant-east-asian:normal;text-align:end;text-anchor:end;opacity:1;fill:#000000;fill-opacity:1;stroke-width:0.133036;paint-order:fill markers stroke"
+         x="-38.566364"
+         y="43.932247"
+         id="text7"
+         inkscape:label="subtitle"
+         transform="scale(-1,1)"><tspan
+           sodipodi:role="line"
+           id="tspan7"
+           style="font-style:normal;font-variant:normal;font-weight:600;font-stretch:normal;font-size:3.4638px;font-family:'Cal Sans';-inkscape-font-specification:'Cal Sans, Semi-Bold';font-variant-ligatures:normal;font-variant-caps:normal;font-variant-numeric:normal;font-variant-east-asian:normal;text-align:end;text-anchor:end;fill:#000000;fill-opacity:1;stroke-width:0.133036"
+           x="-38.566364"
+           y="43.932247">Subtitle placeholder</tspan></text><text
+         xml:space="preserve"
+         style="font-style:normal;font-variant:normal;font-weight:600;font-stretch:normal;font-size:5.05275px;font-family:'Cal Sans';-inkscape-font-specification:'Cal Sans, Semi-Bold';font-variant-ligatures:normal;font-variant-caps:normal;font-variant-numeric:normal;font-variant-east-asian:normal;text-align:end;text-anchor:end;opacity:1;fill:#000000;fill-opacity:1;stroke-width:0.194064;paint-order:fill markers stroke"
+         x="-38.607517"
+         y="38.518772"
+         id="text8"
+         inkscape:label="title"
+         transform="scale(-1,1)"><tspan
+           sodipodi:role="line"
+           id="tspan8"
+           style="font-style:normal;font-variant:normal;font-weight:600;font-stretch:normal;font-size:5.05275px;font-family:'Cal Sans';-inkscape-font-specification:'Cal Sans, Semi-Bold';font-variant-ligatures:normal;font-variant-caps:normal;font-variant-numeric:normal;font-variant-east-asian:normal;text-align:end;text-anchor:end;fill:#000000;fill-opacity:1;stroke-width:0.194064"
+           x="-38.607517"
+           y="38.518772">Title placeholder</tspan></text><g
+         id="g8"
+         inkscape:label="icon"
+         transform="matrix(-1,0,0,1,57.367258,0)"><path
+           fill="currentColor"
+           d="m 25.227101,34.205286 c -0.235876,0.06157 -0.387336,0.148721 -0.505541,0.264214 -0.166159,0.16342 -0.274563,0.392234 -0.333944,0.82424 -0.06095,0.445075 -0.06219,1.034514 -0.06219,1.879454 v 4.66868 a 2.2727811,2.2727811 0 0 1 0.70765,-0.323048 1.7922937,1.7922937 0 0 1 0.193956,-0.03922 v -7.274315 z m 0.901602,7.238362 h 6.913129 V 37.17374 c 0,-0.845486 -10e-4,-1.434925 -0.06219,-1.88 -0.05929,-0.432006 -0.167805,-0.660808 -0.333943,-0.82424 -0.166777,-0.162884 -0.399875,-0.269115 -0.841133,-0.326862 -0.454332,-0.05992 -1.055759,-0.061 -1.918675,-0.061 h -2.404613 c -0.545855,0 -0.987134,0 -1.352664,0.01585 z m 0.751773,0.883071 h -0.662432 c -0.588352,0 -0.793735,0.0036 -0.95172,0.04521 a 1.3423135,1.3423135 0 0 0 -0.924479,0.837858 c 0.0083,0.208103 0.02347,0.391689 0.04572,0.555118 0.05929,0.432006 0.167806,0.660808 0.333945,0.82424 0.166776,0.162884 0.399853,0.269115 0.841132,0.326862 0.454333,0.05992 1.055759,0.061 1.918675,0.061 h 2.404613 c 0.862917,0 1.464878,-10e-4 1.918676,-0.06047 0.441258,-0.0583 0.674973,-0.164512 0.841132,-0.327408 0.166159,-0.163419 0.274564,-0.392233 0.333945,-0.824235 0.05003,-0.362818 0.05992,-0.822603 0.06157,-1.438194 h -3.756205 v 1.638125 c 0,0.162349 0,0.243512 -0.05724,0.276199 -0.05724,0.03269 -0.135068,-0.0039 -0.290912,-0.07627 L 28.19057,43.817203 c -0.05334,-0.02452 -0.07948,-0.0365 -0.107886,-0.0365 -0.02842,0 -0.05456,0.01194 -0.107885,0.0365 l -0.746338,0.347566 c -0.156276,0.07245 -0.234249,0.108958 -0.291447,0.07626 -0.05662,-0.03268 -0.05662,-0.114397 -0.05662,-0.276199 z"
+           id="path8"
+           style="stroke-width:0.544769"
+           inkscape:label="icon-svg" /></g></g></g></svg>
--- a/packages/banners/static/horizontal-rtl.svg
+++ b/packages/banners/static/horizontal-rtl.svg
--- a/packages/banners/static/horizontal.inkscape.svg
+++ b/packages/banners/static/horizontal.inkscape.svg
@@ -0,0 +1,116 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<!-- Created with Inkscape (http://www.inkscape.org/) -->
+
+<svg width="162.68883mm" height="42.772179mm" viewBox="0 0 162.68882 42.772178" version="1.1" id="svg1"
+	xml:space="preserve" sodipodi:docname="design.inkscape.svg"
+	inkscape:version="1.3.1 (91b66b0783, 2023-11-16, custom)"
+	xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
+	xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd" xmlns:xlink="http://www.w3.org/1999/xlink"
+	xmlns="http://www.w3.org/2000/svg" xmlns:svg="http://www.w3.org/2000/svg">
+	<sodipodi:namedview id="namedview1" pagecolor="#505050" bordercolor="#eeeeee" borderopacity="1"
+		inkscape:showpageshadow="0" inkscape:pageopacity="0" inkscape:pagecheckerboard="0" inkscape:deskcolor="#505050"
+		inkscape:document-units="mm" inkscape:zoom="1.1011145" inkscape:cx="155.75129" inkscape:cy="-119.42446"
+		inkscape:window-width="2540" inkscape:window-height="1023" inkscape:window-x="0" inkscape:window-y="0"
+		inkscape:window-maximized="1" inkscape:current-layer="layer2" showgrid="false"
+		inkscape:export-bgcolor="#ffffff00">
+		<inkscape:page x="0" y="0" width="162.68883" height="42.772179" id="page19" margin="0" bleed="0" />
+	</sodipodi:namedview>
+	<defs id="defs1">
+		<linearGradient id="linearGradient55" inkscape:collect="always" inkscape:label="background-gradient">
+			<stop style="stop-color:#ffffff;stop-opacity:1;" offset="0.30320638" id="stop54" />
+			<stop style="stop-color:#ffffff;stop-opacity:0;" offset="1" id="stop55" />
+		</linearGradient>
+		<linearGradient id="linearGradient14" inkscape:collect="always" inkscape:label="background-image-mask-gradient">
+			<stop style="stop-color:#000000;stop-opacity:1;" offset="0.30320638" id="stop14" />
+			<stop style="stop-color:#ffffff;stop-opacity:1;" offset="1" id="stop15" />
+		</linearGradient>
+		<linearGradient inkscape:collect="always" xlink:href="#linearGradient82-2" id="linearGradient5" x1="18.784613"
+			y1="57.455349" x2="159.75043" y2="57.455349" gradientUnits="userSpaceOnUse"
+			gradientTransform="translate(310.57446,-12.675088)" />
+		<linearGradient id="linearGradient82-2" inkscape:label="color-stripe-gradient">
+			<stop style="stop-color:#ff0000;stop-opacity:1;" offset="0" id="stop104" />
+			<stop style="stop-color:#ffff00;stop-opacity:1;" offset="0.18269952" id="stop105" />
+			<stop style="stop-color:#00ff00;stop-opacity:1;" offset="0.39030838" id="stop106" />
+			<stop style="stop-color:#00ffff;stop-opacity:1;" offset="0.59760052" id="stop107" />
+			<stop style="stop-color:#0000ff;stop-opacity:1;" offset="0.79487675" id="stop108" />
+			<stop style="stop-color:#ff00ff;stop-opacity:1;" offset="1" id="stop109" />
+		</linearGradient>
+		<linearGradient inkscape:collect="always" xlink:href="#linearGradient55" id="linearGradient15" x1="12.732515"
+			y1="45.720142" x2="165.80252" y2="15.906352" gradientUnits="userSpaceOnUse"
+			gradientTransform="matrix(1,0,0,0.78569196,0.91790394,-0.86860867)" />
+		<mask maskUnits="userSpaceOnUse" id="mask17">
+			<path id="path18"
+				style="display:inline;opacity:1;fill:url(#linearGradient18);stroke-width:0.303146;paint-order:fill markers stroke"
+				inkscape:label="mask"
+				d="M 16.447515,24.244587 H 162.08752 c 2.05812,0 3.71501,1.65689 3.71501,3.715001 v 23.139473 c 0,2.058112 -1.65689,3.715002 -3.71501,3.715002 H 16.447515 c -2.05811,0 -3.715,-1.65689 -3.715,-3.715002 V 27.959588 c 0,-2.058111 1.65689,-3.715001 3.715,-3.715001 z" />
+		</mask>
+		<linearGradient inkscape:collect="always" xlink:href="#linearGradient14" id="linearGradient18"
+			gradientUnits="userSpaceOnUse" gradientTransform="matrix(1,0,0,0.78569196,-1e-8,11.747095)" x1="12.732515"
+			y1="45.720142" x2="165.80252" y2="15.906352" />
+		<filter style="color-interpolation-filters:sRGB" inkscape:label="Drop Shadow" id="filter56" x="-0.031419724"
+			y="-0.15732744" width="1.0628394" height="1.3991793">
+			<feFlood result="flood" in="SourceGraphic" flood-opacity="0.200000" flood-color="rgb(0,0,0)"
+				id="feFlood55" />
+			<feGaussianBlur result="blur" in="SourceGraphic" stdDeviation="2.003924" id="feGaussianBlur55" />
+			<feOffset result="offset" in="blur" dx="0.000000" dy="2.583867" id="feOffset55" />
+			<feComposite result="comp1" operator="in" in="flood" in2="offset" id="feComposite55" />
+			<feComposite result="comp2" operator="over" in="SourceGraphic" in2="comp1" id="feComposite56" />
+		</filter>
+	</defs>
+	<g inkscape:label="horizontal" inkscape:groupmode="layer" id="layer1"
+		inkscape:export-filename="horizontal.inkscape.svg" inkscape:export-xdpi="318.59933"
+		inkscape:export-ydpi="318.59933" transform="translate(-318.49757,-9.3628894)">
+		<path id="path20"
+			style="display:inline;opacity:1;fill:#ffffff;fill-opacity:1;stroke-width:0.303146;paint-order:fill markers stroke;filter:url(#filter56)"
+			inkscape:label="shadow"
+			d="M 17.365414,11.590389 H 163.00542 c 2.05811,0 3.715,1.65689 3.715,3.715 v 23.139475 c 0,2.05811 -1.65689,3.715 -3.715,3.715 H 17.365414 c -2.05811,0 -3.715,-1.65689 -3.715,-3.715 V 15.305389 c 0,-2.05811 1.65689,-3.715 3.715,-3.715 z"
+			transform="translate(309.65655,2.5819009)" />
+		<path id="color-stripe"
+			style="fill:url(#linearGradient5);stroke-width:0.0784105;paint-order:fill markers stroke"
+			inkscape:label="color-stripe"
+			d="m 330.84692,43.669859 h 137.9901 c 0.82427,0 1.48786,0.49524 1.48786,1.1104 0,0.61516 -0.66359,1.1104 -1.48786,1.1104 h -137.9901 c -0.82427,0 -1.48785,-0.49524 -1.48785,-1.1104 0,-0.61516 0.66358,-1.1104 1.48785,-1.1104 z" />
+		<g id="background" inkscape:label="background" transform="translate(309.65655,2.5819009)">
+			<path id="fallback"
+				style="display:inline;opacity:1;fill:#ffffff;stroke-width:0.302511;paint-order:fill markers stroke"
+				inkscape:label="fallback"
+				d="M 17.416924,11.667379 H 162.95393 c 2.05665,0 3.71237,1.652718 3.71237,3.705644 v 23.081198 c 0,2.052926 -1.65572,3.705643 -3.71237,3.705643 H 17.416924 c -2.056654,0 -3.712372,-1.652717 -3.712372,-3.705643 V 15.373023 c 0,-2.052926 1.655718,-3.705644 3.712372,-3.705644 z" />
+			<g id="image" inkscape:label="image">
+				<image width="134.7771" height="89.851387" preserveAspectRatio="none"
+					xlink:href="../../../../../Downloads/alexandre-debieve-FO7JIlwjOtU-unsplash.jpg" id="embed"
+					x="60.238495" y="-3.5220199" inkscape:label="embed" mask="url(#mask17)"
+					transform="translate(0.91790394,-12.615704)" style="image-rendering:optimizeSpeed"
+					inkscape:svg-dpi="1" inkscape:export-filename="horizontal.svg" inkscape:export-xdpi="96"
+					inkscape:export-ydpi="96" />
+			</g>
+			<path id="gradient"
+				style="display:inline;opacity:1;fill:url(#linearGradient15);stroke-width:0.303146;paint-order:fill markers stroke"
+				inkscape:label="gradient"
+				d="M 17.365419,11.628884 H 163.00543 c 2.05811,0 3.715,1.65689 3.715,3.715 v 23.139475 c 0,2.05811 -1.65689,3.715 -3.715,3.715 H 17.365419 c -2.05811,0 -3.715,-1.65689 -3.715,-3.715 V 15.343884 c 0,-2.05811 1.65689,-3.715 3.715,-3.715 z" />
+			<path id="solid-color"
+				style="display:inline;opacity:1;fill:#ffffff;stroke-width:0.303146;paint-order:fill markers stroke"
+				inkscape:label="solid-color"
+				d="M 17.365414,11.590389 H 163.00542 c 2.05811,0 3.715,1.65689 3.715,3.715 v 23.139475 c 0,2.05811 -1.65689,3.715 -3.715,3.715 H 17.365414 c -2.05811,0 -3.715,-1.65689 -3.715,-3.715 V 15.305389 c 0,-2.05811 1.65689,-3.715 3.715,-3.715 z" />
+		</g>
+		<g id="content" inkscape:label="content" transform="translate(310.57445,-10.033803)">
+			<title id="title11">content</title><text xml:space="preserve"
+				style="font-style:normal;font-variant:normal;font-weight:600;font-stretch:normal;font-size:3.4638px;font-family:'Cal Sans';-inkscape-font-specification:'Cal Sans, Semi-Bold';font-variant-ligatures:normal;font-variant-caps:normal;font-variant-numeric:normal;font-variant-east-asian:normal;opacity:1;fill:#000000;fill-opacity:1;stroke-width:0.133036;paint-order:fill markers stroke"
+				x="38.497089" y="43.932247" id="subtitle" inkscape:label="subtitle">
+				<title id="title12">subtitle</title>
+				<tspan sodipodi:role="line" id="tspan4"
+					style="font-style:normal;font-variant:normal;font-weight:600;font-stretch:normal;font-size:3.4638px;font-family:'Cal Sans';-inkscape-font-specification:'Cal Sans, Semi-Bold';font-variant-ligatures:normal;font-variant-caps:normal;font-variant-numeric:normal;font-variant-east-asian:normal;fill:#000000;fill-opacity:1;stroke-width:0.133036"
+					x="38.497089" y="43.932247">Subtitle placeholder</tspan>
+			</text><text xml:space="preserve"
+				style="font-style:normal;font-variant:normal;font-weight:600;font-stretch:normal;font-size:5.05275px;font-family:'Cal Sans';-inkscape-font-specification:'Cal Sans, Semi-Bold';font-variant-ligatures:normal;font-variant-caps:normal;font-variant-numeric:normal;font-variant-east-asian:normal;opacity:1;fill:#000000;fill-opacity:1;stroke-width:0.194064;paint-order:fill markers stroke"
+				x="38.455933" y="38.518772" id="title" inkscape:label="title">
+				<tspan sodipodi:role="line" id="tspan3"
+					style="font-style:normal;font-variant:normal;font-weight:600;font-stretch:normal;font-size:5.05275px;font-family:'Cal Sans';-inkscape-font-specification:'Cal Sans, Semi-Bold';font-variant-ligatures:normal;font-variant-caps:normal;font-variant-numeric:normal;font-variant-east-asian:normal;fill:#000000;fill-opacity:1;stroke-width:0.194064"
+					x="38.455933" y="38.518772">Title placeholder</tspan>
+			</text>
+			<g id="icon" inkscape:label="icon">
+				<path fill="currentColor"
+					d="m 25.227101,34.205286 c -0.235876,0.06157 -0.387336,0.148721 -0.505541,0.264214 -0.166159,0.16342 -0.274563,0.392234 -0.333944,0.82424 -0.06095,0.445075 -0.06219,1.034514 -0.06219,1.879454 v 4.66868 a 2.2727811,2.2727811 0 0 1 0.70765,-0.323048 1.7922937,1.7922937 0 0 1 0.193956,-0.03922 v -7.274315 z m 0.901602,7.238362 h 6.913129 V 37.17374 c 0,-0.845486 -10e-4,-1.434925 -0.06219,-1.88 -0.05929,-0.432006 -0.167805,-0.660808 -0.333943,-0.82424 -0.166777,-0.162884 -0.399875,-0.269115 -0.841133,-0.326862 -0.454332,-0.05992 -1.055759,-0.061 -1.918675,-0.061 h -2.404613 c -0.545855,0 -0.987134,0 -1.352664,0.01585 z m 0.751773,0.883071 h -0.662432 c -0.588352,0 -0.793735,0.0036 -0.95172,0.04521 a 1.3423135,1.3423135 0 0 0 -0.924479,0.837858 c 0.0083,0.208103 0.02347,0.391689 0.04572,0.555118 0.05929,0.432006 0.167806,0.660808 0.333945,0.82424 0.166776,0.162884 0.399853,0.269115 0.841132,0.326862 0.454333,0.05992 1.055759,0.061 1.918675,0.061 h 2.404613 c 0.862917,0 1.464878,-10e-4 1.918676,-0.06047 0.441258,-0.0583 0.674973,-0.164512 0.841132,-0.327408 0.166159,-0.163419 0.274564,-0.392233 0.333945,-0.824235 0.05003,-0.362818 0.05992,-0.822603 0.06157,-1.438194 h -3.756205 v 1.638125 c 0,0.162349 0,0.243512 -0.05724,0.276199 -0.05724,0.03269 -0.135068,-0.0039 -0.290912,-0.07627 L 28.19057,43.817203 c -0.05334,-0.02452 -0.07948,-0.0365 -0.107886,-0.0365 -0.02842,0 -0.05456,0.01194 -0.107885,0.0365 l -0.746338,0.347566 c -0.156276,0.07245 -0.234249,0.108958 -0.291447,0.07626 -0.05662,-0.03268 -0.05662,-0.114397 -0.05662,-0.276199 z"
+					id="icon-svg" style="stroke-width:0.544769" inkscape:label="icon-svg" />
+			</g>
+		</g>
+	</g>
+</svg>
--- a/packages/banners/static/horizontal.svg
+++ b/packages/banners/static/horizontal.svg
@@ -0,0 +1,59 @@
+<svg width="162.68883mm" height="42.772179mm" viewBox="0 0 162.68882 42.772178" version="1.1" id="svg1" xml:space="preserve" sodipodi:docname="design.inkscape.svg" inkscape:version="1.3.1 (91b66b0783, 2023-11-16, custom)" xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape" xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns="http://www.w3.org/2000/svg" xmlns:svg="http://www.w3.org/2000/svg">
+	<sodipodi:namedview id="namedview1" pagecolor="#505050" bordercolor="#eeeeee" borderopacity="1" inkscape:showpageshadow="0" inkscape:pageopacity="0" inkscape:pagecheckerboard="0" inkscape:deskcolor="#505050" inkscape:document-units="mm" inkscape:zoom="1.1011145" inkscape:cx="155.75129" inkscape:cy="-119.42446" inkscape:window-width="2540" inkscape:window-height="1023" inkscape:window-x="0" inkscape:window-y="0" inkscape:window-maximized="1" inkscape:current-layer="layer2" showgrid="false" inkscape:export-bgcolor="#ffffff00">
+		<inkscape:page x="0" y="0" width="162.68883" height="42.772179" id="page19" margin="0" bleed="0" />
+	</sodipodi:namedview>
+	<defs id="defs1">
+		<linearGradient data-banner-class="background-gradient" id="linearGradient55">
+			<stop style="stop-color:#ffffff;stop-opacity:1;" offset="0.30320638" id="stop54" />
+			<stop style="stop-color:#ffffff;stop-opacity:0;" offset="1" id="stop55" />
+		</linearGradient>
+		<linearGradient data-banner-class="background-image-mask-gradient" id="linearGradient14">
+			<stop style="stop-color:#000000;stop-opacity:1;" offset="0.30320638" id="stop14" />
+			<stop style="stop-color:#ffffff;stop-opacity:1;" offset="1" id="stop15" />
+		</linearGradient>
+		<linearGradient inkscape:collect="always" xlink:href="#linearGradient82-2" id="linearGradient5" x1="18.784613" y1="57.455349" x2="159.75043" y2="57.455349" gradientUnits="userSpaceOnUse" gradientTransform="translate(310.57446,-12.675088)" />
+		<linearGradient data-banner-class="color-stripe-gradient" id="linearGradient82-2">
+			<stop style="stop-color:#ff0000;stop-opacity:1;" offset="0" id="stop104" />
+			<stop style="stop-color:#ffff00;stop-opacity:1;" offset="0.18269952" id="stop105" />
+			<stop style="stop-color:#00ff00;stop-opacity:1;" offset="0.39030838" id="stop106" />
+			<stop style="stop-color:#00ffff;stop-opacity:1;" offset="0.59760052" id="stop107" />
+			<stop style="stop-color:#0000ff;stop-opacity:1;" offset="0.79487675" id="stop108" />
+			<stop style="stop-color:#ff00ff;stop-opacity:1;" offset="1" id="stop109" />
+		</linearGradient>
+		<linearGradient inkscape:collect="always" xlink:href="#linearGradient55" id="linearGradient15" x1="12.732515" y1="45.720142" x2="165.80252" y2="15.906352" gradientUnits="userSpaceOnUse" gradientTransform="matrix(1,0,0,0.78569196,0.91790394,-0.86860867)" />
+		<mask maskUnits="userSpaceOnUse" id="mask17">
+			<path data-banner-class="mask" id="path18" style="display:inline;opacity:1;fill:url(#linearGradient18);stroke-width:0.303146;paint-order:fill markers stroke" d="M 16.447515,24.244587 H 162.08752 c 2.05812,0 3.71501,1.65689 3.71501,3.715001 v 23.139473 c 0,2.058112 -1.65689,3.715002 -3.71501,3.715002 H 16.447515 c -2.05811,0 -3.715,-1.65689 -3.715,-3.715002 V 27.959588 c 0,-2.058111 1.65689,-3.715001 3.715,-3.715001 z" />
+		</mask>
+		<linearGradient inkscape:collect="always" xlink:href="#linearGradient14" id="linearGradient18" gradientUnits="userSpaceOnUse" gradientTransform="matrix(1,0,0,0.78569196,-1e-8,11.747095)" x1="12.732515" y1="45.720142" x2="165.80252" y2="15.906352" />
+		<filter data-banner-class="Drop Shadow" style="color-interpolation-filters:sRGB" id="filter56" x="-0.031419724" y="-0.15732744" width="1.0628394" height="1.3991793">
+			<feFlood result="flood" in="SourceGraphic" flood-opacity="0.200000" flood-color="rgb(0,0,0)" id="feFlood55" />
+			<feGaussianBlur result="blur" in="SourceGraphic" stdDeviation="2.003924" id="feGaussianBlur55" />
+			<feOffset result="offset" in="blur" dx="0.000000" dy="2.583867" id="feOffset55" />
+			<feComposite result="comp1" operator="in" in="flood" in2="offset" id="feComposite55" />
+			<feComposite result="comp2" operator="over" in="SourceGraphic" in2="comp1" id="feComposite56" />
+		</filter>
+	</defs>
+	<g data-banner-class="horizontal" id="layer1" transform="translate(-318.49757,-9.3628894)">
+		<path data-banner-class="shadow" id="path20" style="display:inline;opacity:1;fill:#ffffff;fill-opacity:1;stroke-width:0.303146;paint-order:fill markers stroke;filter:url(#filter56)" d="M 17.365414,11.590389 H 163.00542 c 2.05811,0 3.715,1.65689 3.715,3.715 v 23.139475 c 0,2.05811 -1.65689,3.715 -3.715,3.715 H 17.365414 c -2.05811,0 -3.715,-1.65689 -3.715,-3.715 V 15.305389 c 0,-2.05811 1.65689,-3.715 3.715,-3.715 z" transform="translate(309.65655,2.5819009)" />
+		<path data-banner-class="color-stripe" id="color-stripe" style="fill:url(#linearGradient5);stroke-width:0.0784105;paint-order:fill markers stroke" d="m 330.84692,43.669859 h 137.9901 c 0.82427,0 1.48786,0.49524 1.48786,1.1104 0,0.61516 -0.66359,1.1104 -1.48786,1.1104 h -137.9901 c -0.82427,0 -1.48785,-0.49524 -1.48785,-1.1104 0,-0.61516 0.66358,-1.1104 1.48785,-1.1104 z" />
+		<g data-banner-class="background" id="background" transform="translate(309.65655,2.5819009)">
+			<path data-banner-class="fallback" id="fallback" style="display:inline;opacity:1;fill:#ffffff;stroke-width:0.302511;paint-order:fill markers stroke" d="M 17.416924,11.667379 H 162.95393 c 2.05665,0 3.71237,1.652718 3.71237,3.705644 v 23.081198 c 0,2.052926 -1.65572,3.705643 -3.71237,3.705643 H 17.416924 c -2.056654,0 -3.712372,-1.652717 -3.712372,-3.705643 V 15.373023 c 0,-2.052926 1.655718,-3.705644 3.712372,-3.705644 z" />
+			<g data-banner-class="image" id="image">
+				<image data-banner-class="embed" width="134.7771" height="89.851387" preserveAspectRatio="none" xlink:href="../../../../../Downloads/alexandre-debieve-FO7JIlwjOtU-unsplash.jpg" id="embed" x="60.238495" y="-3.5220199" mask="url(#mask17)" transform="translate(0.91790394,-12.615704)" style="image-rendering:optimizeSpeed" />
+			</g>
+			<path data-banner-class="gradient" id="gradient" style="display:inline;opacity:1;fill:url(#linearGradient15);stroke-width:0.303146;paint-order:fill markers stroke" d="M 17.365419,11.628884 H 163.00543 c 2.05811,0 3.715,1.65689 3.715,3.715 v 23.139475 c 0,2.05811 -1.65689,3.715 -3.715,3.715 H 17.365419 c -2.05811,0 -3.715,-1.65689 -3.715,-3.715 V 15.343884 c 0,-2.05811 1.65689,-3.715 3.715,-3.715 z" />
+			<path data-banner-class="solid-color" id="solid-color" style="display:inline;opacity:1;fill:#ffffff;stroke-width:0.303146;paint-order:fill markers stroke" d="M 17.365414,11.590389 H 163.00542 c 2.05811,0 3.715,1.65689 3.715,3.715 v 23.139475 c 0,2.05811 -1.65689,3.715 -3.715,3.715 H 17.365414 c -2.05811,0 -3.715,-1.65689 -3.715,-3.715 V 15.305389 c 0,-2.05811 1.65689,-3.715 3.715,-3.715 z" />
+		</g>
+		<g data-banner-class="content" id="content" transform="translate(310.57445,-10.033803)">
+			<title id="title11">content</title><text data-banner-class="subtitle" xml:space="preserve" style="font-style:normal;font-variant:normal;font-weight:600;font-stretch:normal;font-size:3.4638px;font-family:'Cal Sans';-inkscape-font-specification:'Cal Sans, Semi-Bold';font-variant-ligatures:normal;font-variant-caps:normal;font-variant-numeric:normal;font-variant-east-asian:normal;opacity:1;fill:#000000;fill-opacity:1;stroke-width:0.133036;paint-order:fill markers stroke" x="38.497089" y="43.932247" id="subtitle">
+				<title id="title12">subtitle</title>
+				<tspan sodipodi:role="line" id="tspan4" style="font-style:normal;font-variant:normal;font-weight:600;font-stretch:normal;font-size:3.4638px;font-family:'Cal Sans';-inkscape-font-specification:'Cal Sans, Semi-Bold';font-variant-ligatures:normal;font-variant-caps:normal;font-variant-numeric:normal;font-variant-east-asian:normal;fill:#000000;fill-opacity:1;stroke-width:0.133036" x="38.497089" y="43.932247">Subtitle placeholder</tspan>
+			</text><text data-banner-class="title" xml:space="preserve" style="font-style:normal;font-variant:normal;font-weight:600;font-stretch:normal;font-size:5.05275px;font-family:'Cal Sans';-inkscape-font-specification:'Cal Sans, Semi-Bold';font-variant-ligatures:normal;font-variant-caps:normal;font-variant-numeric:normal;font-variant-east-asian:normal;opacity:1;fill:#000000;fill-opacity:1;stroke-width:0.194064;paint-order:fill markers stroke" x="38.455933" y="38.518772" id="title">
+				<tspan sodipodi:role="line" id="tspan3" style="font-style:normal;font-variant:normal;font-weight:600;font-stretch:normal;font-size:5.05275px;font-family:'Cal Sans';-inkscape-font-specification:'Cal Sans, Semi-Bold';font-variant-ligatures:normal;font-variant-caps:normal;font-variant-numeric:normal;font-variant-east-asian:normal;fill:#000000;fill-opacity:1;stroke-width:0.194064" x="38.455933" y="38.518772">Title placeholder</tspan>
+			</text>
+			<g data-banner-class="icon" id="icon">
+				<path data-banner-class="icon-svg" fill="currentColor" d="m 25.227101,34.205286 c -0.235876,0.06157 -0.387336,0.148721 -0.505541,0.264214 -0.166159,0.16342 -0.274563,0.392234 -0.333944,0.82424 -0.06095,0.445075 -0.06219,1.034514 -0.06219,1.879454 v 4.66868 a 2.2727811,2.2727811 0 0 1 0.70765,-0.323048 1.7922937,1.7922937 0 0 1 0.193956,-0.03922 v -7.274315 z m 0.901602,7.238362 h 6.913129 V 37.17374 c 0,-0.845486 -10e-4,-1.434925 -0.06219,-1.88 -0.05929,-0.432006 -0.167805,-0.660808 -0.333943,-0.82424 -0.166777,-0.162884 -0.399875,-0.269115 -0.841133,-0.326862 -0.454332,-0.05992 -1.055759,-0.061 -1.918675,-0.061 h -2.404613 c -0.545855,0 -0.987134,0 -1.352664,0.01585 z m 0.751773,0.883071 h -0.662432 c -0.588352,0 -0.793735,0.0036 -0.95172,0.04521 a 1.3423135,1.3423135 0 0 0 -0.924479,0.837858 c 0.0083,0.208103 0.02347,0.391689 0.04572,0.555118 0.05929,0.432006 0.167806,0.660808 0.333945,0.82424 0.166776,0.162884 0.399853,0.269115 0.841132,0.326862 0.454333,0.05992 1.055759,0.061 1.918675,0.061 h 2.404613 c 0.862917,0 1.464878,-10e-4 1.918676,-0.06047 0.441258,-0.0583 0.674973,-0.164512 0.841132,-0.327408 0.166159,-0.163419 0.274564,-0.392233 0.333945,-0.824235 0.05003,-0.362818 0.05992,-0.822603 0.06157,-1.438194 h -3.756205 v 1.638125 c 0,0.162349 0,0.243512 -0.05724,0.276199 -0.05724,0.03269 -0.135068,-0.0039 -0.290912,-0.07627 L 28.19057,43.817203 c -0.05334,-0.02452 -0.07948,-0.0365 -0.107886,-0.0365 -0.02842,0 -0.05456,0.01194 -0.107885,0.0365 l -0.746338,0.347566 c -0.156276,0.07245 -0.234249,0.108958 -0.291447,0.07626 -0.05662,-0.03268 -0.05662,-0.114397 -0.05662,-0.276199 z" id="icon-svg" style="stroke-width:0.544769" />
+			</g>
+		</g>
+	</g>
+</svg>
--- a/packages/banners/static/vertical.inkscape.svg
+++ b/packages/banners/static/vertical.inkscape.svg
@@ -0,0 +1,231 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<!-- Created with Inkscape (http://www.inkscape.org/) -->
+
+<svg
+   width="162.68884mm"
+   height="48.491169mm"
+   viewBox="0 0 162.68884 48.491168"
+   version="1.1"
+   id="svg1"
+   xml:space="preserve"
+   sodipodi:docname="design.inkscape.svg"
+   inkscape:version="1.3.1 (91b66b0783, 2023-11-16, custom)"
+   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
+   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+   xmlns:xlink="http://www.w3.org/1999/xlink"
+   xmlns="http://www.w3.org/2000/svg"
+   xmlns:svg="http://www.w3.org/2000/svg"><sodipodi:namedview
+     id="namedview1"
+     pagecolor="#505050"
+     bordercolor="#eeeeee"
+     borderopacity="1"
+     inkscape:showpageshadow="0"
+     inkscape:pageopacity="0"
+     inkscape:pagecheckerboard="0"
+     inkscape:deskcolor="#505050"
+     inkscape:document-units="mm"
+     inkscape:zoom="1.1011145"
+     inkscape:cx="155.75129"
+     inkscape:cy="-119.42446"
+     inkscape:window-width="2540"
+     inkscape:window-height="1023"
+     inkscape:window-x="0"
+     inkscape:window-y="0"
+     inkscape:window-maximized="1"
+     inkscape:current-layer="layer2"
+     showgrid="false"
+     inkscape:export-bgcolor="#ffffff00"><inkscape:page
+       x="0"
+       y="0"
+       width="162.68884"
+       height="48.491169"
+       id="page18"
+       margin="0"
+       bleed="0" /></sodipodi:namedview><defs
+     id="defs1"><linearGradient
+       id="linearGradient55"
+       inkscape:collect="always"
+       inkscape:label="background-gradient"><stop
+         style="stop-color:#ffffff;stop-opacity:1;"
+         offset="0.30320638"
+         id="stop54" /><stop
+         style="stop-color:#ffffff;stop-opacity:0;"
+         offset="1"
+         id="stop55" /></linearGradient><linearGradient
+       id="linearGradient14"
+       inkscape:collect="always"
+       inkscape:label="background-image-mask-gradient"><stop
+         style="stop-color:#000000;stop-opacity:1;"
+         offset="0.30320638"
+         id="stop14" /><stop
+         style="stop-color:#ffffff;stop-opacity:1;"
+         offset="1"
+         id="stop15" /></linearGradient><linearGradient
+       id="linearGradient82-2"
+       inkscape:label="color-stripe-gradient"><stop
+         style="stop-color:#ff0000;stop-opacity:1;"
+         offset="0"
+         id="stop104" /><stop
+         style="stop-color:#ffff00;stop-opacity:1;"
+         offset="0.18269952"
+         id="stop105" /><stop
+         style="stop-color:#00ff00;stop-opacity:1;"
+         offset="0.39030838"
+         id="stop106" /><stop
+         style="stop-color:#00ffff;stop-opacity:1;"
+         offset="0.59760052"
+         id="stop107" /><stop
+         style="stop-color:#0000ff;stop-opacity:1;"
+         offset="0.79487675"
+         id="stop108" /><stop
+         style="stop-color:#ff00ff;stop-opacity:1;"
+         offset="1"
+         id="stop109" /></linearGradient><linearGradient
+       inkscape:collect="always"
+       xlink:href="#linearGradient82-2"
+       id="linearGradient19"
+       gradientUnits="userSpaceOnUse"
+       gradientTransform="translate(309.94661,59.369176)"
+       x1="18.784613"
+       y1="57.455349"
+       x2="159.75043"
+       y2="57.455349" /><linearGradient
+       inkscape:collect="always"
+       xlink:href="#linearGradient55"
+       id="linearGradient2"
+       x1="90.18544"
+       y1="96.020027"
+       x2="90.18544"
+       y2="59.73156"
+       gradientUnits="userSpaceOnUse" /><mask
+       maskUnits="userSpaceOnUse"
+       id="mask13"><path
+         id="path14"
+         style="opacity:1;fill:url(#linearGradient16);stroke-width:0.342;paint-order:fill markers stroke"
+         inkscape:label="mask"
+         d="M 163.04842,11.667375 H 17.322411 c -2.034292,0 -3.672002,1.637713 -3.672002,3.671999 v 28.944467 c 0,2.034288 1.63771,3.672001 3.672002,3.672001 H 163.04842 c 2.03429,0 3.672,-1.637713 3.672,-3.672001 V 15.339374 c 0,-2.034286 -1.63771,-3.671999 -3.672,-3.671999 z" /></mask><linearGradient
+       inkscape:collect="always"
+       xlink:href="#linearGradient14"
+       id="linearGradient16"
+       gradientUnits="userSpaceOnUse"
+       gradientTransform="matrix(-1,0,0,1,180.37085,-48.064185)"
+       x1="90.18544"
+       y1="95.033531"
+       x2="90.18544"
+       y2="47.599419" /><filter
+       style="color-interpolation-filters:sRGB"
+       inkscape:label="Drop Shadow"
+       id="filter63"
+       x="-0.031419723"
+       y="-0.13253295"
+       width="1.0628394"
+       height="1.3362694"><feFlood
+         result="flood"
+         in="SourceGraphic"
+         flood-opacity="0.200000"
+         flood-color="rgb(0,0,0)"
+         id="feFlood62" /><feGaussianBlur
+         result="blur"
+         in="SourceGraphic"
+         stdDeviation="2.003924"
+         id="feGaussianBlur62" /><feOffset
+         result="offset"
+         in="blur"
+         dx="0.000000"
+         dy="2.583867"
+         id="feOffset62" /><feComposite
+         result="comp1"
+         operator="in"
+         in="flood"
+         in2="offset"
+         id="feComposite62" /><feComposite
+         result="comp2"
+         operator="over"
+         in="SourceGraphic"
+         in2="comp1"
+         id="feComposite63" /></filter></defs><g
+     inkscape:groupmode="layer"
+     id="g19"
+     inkscape:label="vertical"
+     inkscape:highlight-color="#a99e36"
+     transform="translate(-317.8697,-75.726641)"
+     inkscape:export-filename="vertical.inkscape.svg"
+     inkscape:export-xdpi="318.5993"
+     inkscape:export-ydpi="318.5993"><path
+       id="path62"
+       style="display:inline;opacity:1;fill:#ffffff;stroke-width:0.342;paint-order:fill markers stroke;filter:url(#filter63)"
+       inkscape:label="shadow"
+       d="m 326.35112,80.536055 h 145.72601 c 2.03429,0 3.672,1.637712 3.672,3.672 v 28.944465 c 0,2.03429 -1.63771,3.672 -3.672,3.672 H 326.35112 c -2.03429,0 -3.672,-1.63771 -3.672,-3.672 V 84.208055 c 0,-2.034288 1.63771,-3.672 3.672,-3.672 z" /><path
+       id="path12"
+       style="fill:url(#linearGradient19);stroke-width:0.0784105;paint-order:fill markers stroke"
+       inkscape:label="color-stripe"
+       d="m 330.21907,115.71413 h 137.9901 c 0.82427,0 1.48786,0.49523 1.48786,1.11039 0,0.61516 -0.66359,1.1104 -1.48786,1.1104 h -137.9901 c -0.82427,0 -1.48785,-0.49524 -1.48785,-1.1104 0,-0.61516 0.66358,-1.11039 1.48785,-1.11039 z" /><g
+       id="g15"
+       inkscape:label="background"
+       transform="matrix(-1,0,0,1,489.39954,68.86868)"><path
+         id="rect12"
+         style="display:inline;opacity:1;fill:#ffffff;stroke-width:0.341536;paint-order:fill markers stroke"
+         inkscape:label="fallback"
+         transform="scale(-1,1)"
+         d="m -162.97125,11.691942 h 145.528694 c 2.031534,0 3.667028,1.635495 3.667028,3.667028 v 28.905275 c 0,2.031533 -1.635494,3.667028 -3.667028,3.667028 H -162.97125 c -2.03153,0 -3.66703,-1.635495 -3.66703,-3.667028 V 15.35897 c 0,-2.031533 1.6355,-3.667028 3.66703,-3.667028 z" /><g
+         id="g5"
+         inkscape:label="image"><image
+           width="153.07002"
+           height="102.04668"
+           preserveAspectRatio="none"
+           xlink:href="../../../../../Downloads/alexandre-debieve-FO7JIlwjOtU-unsplash.jpg"
+           id="image13"
+           x="13.650405"
+           y="-21.211729"
+           inkscape:label="embed"
+           mask="url(#mask13)"
+           style="image-rendering:optimizeSpeed"
+           inkscape:svg-dpi="1"
+           inkscape:export-filename="horizontal.svg"
+           inkscape:export-xdpi="96"
+           inkscape:export-ydpi="96" /></g><path
+         id="rect20"
+         style="display:inline;opacity:1;fill:url(#linearGradient2);stroke-width:0.342;paint-order:fill markers stroke"
+         inkscape:label="gradient"
+         transform="matrix(-1,0,0,1,180.37085,-48.064185)"
+         d="m 17.32243,59.73156 h 145.72601 c 2.03429,0 3.672,1.637712 3.672,3.672 v 28.944467 c 0,2.034288 -1.63771,3.672 -3.672,3.672 H 17.32243 c -2.034288,0 -3.672,-1.637712 -3.672,-3.672 V 63.40356 c 0,-2.034288 1.637712,-3.672 3.672,-3.672 z" /><path
+         id="rect1"
+         style="display:inline;opacity:1;fill:#ffffff;stroke-width:0.342;paint-order:fill markers stroke"
+         inkscape:label="solid-color"
+         transform="matrix(-1,0,0,1,180.37085,-48.064185)"
+         d="m 17.32243,59.73156 h 145.72601 c 2.03429,0 3.672,1.637712 3.672,3.672 v 28.944467 c 0,2.034288 -1.63771,3.672 -3.672,3.672 H 17.32243 c -2.034288,0 -3.672,-1.637712 -3.672,-3.672 V 63.40356 c 0,-2.034288 1.637712,-3.672 3.672,-3.672 z" /></g><g
+       id="g17"
+       inkscape:label="content"
+       transform="matrix(-1,0,0,1,461.33439,62.953888)"><text
+         xml:space="preserve"
+         style="font-style:normal;font-variant:normal;font-weight:600;font-stretch:normal;font-size:2.95147px;font-family:'Cal Sans';-inkscape-font-specification:'Cal Sans, Semi-Bold';font-variant-ligatures:normal;font-variant-caps:normal;font-variant-numeric:normal;font-variant-east-asian:normal;text-align:center;text-anchor:middle;opacity:1;fill:#000000;fill-opacity:1;stroke-width:0.113359;paint-order:fill markers stroke"
+         x="-62.127644"
+         y="42.596745"
+         id="text15"
+         inkscape:label="subtitle"
+         transform="scale(-1,1)"><tspan
+           sodipodi:role="line"
+           id="tspan15"
+           style="font-style:normal;font-variant:normal;font-weight:600;font-stretch:normal;font-size:2.95147px;font-family:'Cal Sans';-inkscape-font-specification:'Cal Sans, Semi-Bold';font-variant-ligatures:normal;font-variant-caps:normal;font-variant-numeric:normal;font-variant-east-asian:normal;text-align:center;text-anchor:middle;fill:#000000;fill-opacity:1;stroke-width:0.113359"
+           x="-62.127644"
+           y="42.596745">Subtitle placeholder</tspan></text><text
+         xml:space="preserve"
+         style="font-style:normal;font-variant:normal;font-weight:600;font-stretch:normal;font-size:4.3054px;font-family:'Cal Sans';-inkscape-font-specification:'Cal Sans, Semi-Bold';font-variant-ligatures:normal;font-variant-caps:normal;font-variant-numeric:normal;font-variant-east-asian:normal;text-align:center;text-anchor:middle;opacity:1;fill:#000000;fill-opacity:1;stroke-width:0.16536;paint-order:fill markers stroke"
+         x="-62.141792"
+         y="38.374268"
+         id="text16"
+         inkscape:label="title"
+         transform="scale(-1,1)"><tspan
+           sodipodi:role="line"
+           id="tspan16"
+           style="font-style:normal;font-variant:normal;font-weight:600;font-stretch:normal;font-size:4.3054px;font-family:'Cal Sans';-inkscape-font-specification:'Cal Sans, Semi-Bold';font-variant-ligatures:normal;font-variant-caps:normal;font-variant-numeric:normal;font-variant-east-asian:normal;text-align:center;text-anchor:middle;fill:#000000;fill-opacity:1;stroke-width:0.16536"
+           x="-62.141792"
+           y="38.374268">Title placeholder</tspan></text><g
+         id="g16"
+         inkscape:label="icon"
+         transform="matrix(-0.85209125,0,0,0.85209125,86.561334,-5.292951)"><path
+           fill="currentColor"
+           d="m 25.227101,34.205286 c -0.235876,0.06157 -0.387336,0.148721 -0.505541,0.264214 -0.166159,0.16342 -0.274563,0.392234 -0.333944,0.82424 -0.06095,0.445075 -0.06219,1.034514 -0.06219,1.879454 v 4.66868 a 2.2727811,2.2727811 0 0 1 0.70765,-0.323048 1.7922937,1.7922937 0 0 1 0.193956,-0.03922 v -7.274315 z m 0.901602,7.238362 h 6.913129 V 37.17374 c 0,-0.845486 -10e-4,-1.434925 -0.06219,-1.88 -0.05929,-0.432006 -0.167805,-0.660808 -0.333943,-0.82424 -0.166777,-0.162884 -0.399875,-0.269115 -0.841133,-0.326862 -0.454332,-0.05992 -1.055759,-0.061 -1.918675,-0.061 h -2.404613 c -0.545855,0 -0.987134,0 -1.352664,0.01585 z m 0.751773,0.883071 h -0.662432 c -0.588352,0 -0.793735,0.0036 -0.95172,0.04521 a 1.3423135,1.3423135 0 0 0 -0.924479,0.837858 c 0.0083,0.208103 0.02347,0.391689 0.04572,0.555118 0.05929,0.432006 0.167806,0.660808 0.333945,0.82424 0.166776,0.162884 0.399853,0.269115 0.841132,0.326862 0.454333,0.05992 1.055759,0.061 1.918675,0.061 h 2.404613 c 0.862917,0 1.464878,-10e-4 1.918676,-0.06047 0.441258,-0.0583 0.674973,-0.164512 0.841132,-0.327408 0.166159,-0.163419 0.274564,-0.392233 0.333945,-0.824235 0.05003,-0.362818 0.05992,-0.822603 0.06157,-1.438194 h -3.756205 v 1.638125 c 0,0.162349 0,0.243512 -0.05724,0.276199 -0.05724,0.03269 -0.135068,-0.0039 -0.290912,-0.07627 L 28.19057,43.817203 c -0.05334,-0.02452 -0.07948,-0.0365 -0.107886,-0.0365 -0.02842,0 -0.05456,0.01194 -0.107885,0.0365 l -0.746338,0.347566 c -0.156276,0.07245 -0.234249,0.108958 -0.291447,0.07626 -0.05662,-0.03268 -0.05662,-0.114397 -0.05662,-0.276199 z"
+           id="path16"
+           style="stroke-width:0.544769"
+           inkscape:label="icon-svg" /></g></g></g></svg>
--- a/packages/banners/static/vertical.svg
+++ b/packages/banners/static/vertical.svg
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -4,39 +4,53 @@ settings:
  autoInstallPeers: true
  excludeLinksFromLockfile: false

-dependencies:
-  '@eslegant/js':
-    specifier: 0.0.0-next-20230910004746
-    version: 0.0.0-next-20230910004746(eslint-plugin-import@2.29.0)(eslint@8.54.0)(typescript@5.3.2)
+importers:

-devDependencies:
-  '@changesets/cli':
-    specifier: ^2.26.2
-    version: 2.26.2
-  '@commitlint/config-conventional':
-    specifier: ^18.4.3
-    version: 18.4.3
-  '@commitlint/types':
-    specifier: ^18.4.3
-    version: 18.4.3
-  '@vercel/node':
-    specifier: ^3.0.11
-    version: 3.0.11
-  eslint:
-    specifier: ^8.54.0
-    version: 8.54.0
-  husky:
-    specifier: ^8.0.0
-    version: 8.0.3
-  turbo:
-    specifier: ^1.10.16
-    version: 1.10.16
-  vercel:
-    specifier: ^32.5.6
-    version: 32.5.6
-  vitest:
-    specifier: ^0.34.6
-    version: 0.34.6
+  .:
+    dependencies:
+      '@eslegant/js':
+        specifier: 0.0.0-next-20230910004746
+        version: 0.0.0-next-20230910004746(eslint-plugin-import@2.29.0)(eslint@8.54.0)(typescript@5.3.2)
+    devDependencies:
+      '@changesets/cli':
+        specifier: ^2.26.2
+        version: 2.26.2
+      '@commitlint/config-conventional':
+        specifier: ^18.4.3
+        version: 18.4.3
+      '@commitlint/types':
+        specifier: ^18.4.3
+        version: 18.4.3
+      '@vercel/node':
+        specifier: ^3.0.11
+        version: 3.0.11
+      eslint:
+        specifier: ^8.54.0
+        version: 8.54.0
+      husky:
+        specifier: ^8.0.0
+        version: 8.0.3
+      turbo:
+        specifier: ^1.10.16
+        version: 1.10.16
+      vercel:
+        specifier: ^32.5.6
+        version: 32.5.6
+      vitest:
+        specifier: ^0.34.6
+        version: 0.34.6
+
+  packages/banners:
+    devDependencies:
+      '@types/node':
+        specifier: ^20.10.0
+        version: 20.10.0
+      eslint:
+        specifier: ^8.54.0
+        version: 8.54.0
+      linkedom:
+        specifier: ^0.16.4
+        version: 0.16.4

 packages:

@@ -860,6 +874,12 @@ packages:
    resolution: {integrity: sha512-qelS/Ra6sacc4loe/3MSjXNL1dNQ/GjxNHVzuChwMfmk7HuycRLVQN2qNY3XahK+fZc5E2szqQSKUyAF0E+2bg==}
    dev: true

+  /@types/node@20.10.0:
+    resolution: {integrity: sha512-D0WfRmU9TQ8I9PFx9Yc+EBHw+vSpIub4IDvQivcp26PtPrdMGAq5SDcpXEo/epqa/DXotVpekHiLNTg3iaKXBQ==}
+    dependencies:
+      undici-types: 5.26.5
+    dev: true
+
  /@types/normalize-package-data@2.4.4:
    resolution: {integrity: sha512-37i+OaWTh9qeK4LSHPsyRC7NahnGotNuZvjLSgcPzblpHB3rrCJxAOgI5gCdKm7coonsaX1Of0ILiTcnZjbfxA==}

@@ -1523,6 +1543,10 @@ packages:
      file-uri-to-path: 1.0.0
    dev: true

+  /boolbase@1.0.0:
+    resolution: {integrity: sha512-JZOSA7Mo9sNGB8+UjSgzdLtokWAky1zbztM3WRLCbZ70/3cTANmQmOdR7y2g+J0e2WXywy1yS468tY+IruqEww==}
+    dev: true
+
  /brace-expansion@1.1.11:
    resolution: {integrity: sha512-iCuPHDFgrHX7H2vEI/5xpz07zSHB00TpugqhmYtVmMO6518mCuRMoOYFldEBl0g187ufozdaHgWKcYFb61qGiA==}
    dependencies:
@@ -1789,6 +1813,25 @@ packages:
      shebang-command: 2.0.0
      which: 2.0.2

+  /css-select@5.1.0:
+    resolution: {integrity: sha512-nwoRF1rvRRnnCqqY7updORDsuqKzqYJ28+oSMaJMMgOauh3fvwHqMS7EZpIPqK8GL+g9mKxF1vP/ZjSeNjEVHg==}
+    dependencies:
+      boolbase: 1.0.0
+      css-what: 6.1.0
+      domhandler: 5.0.3
+      domutils: 3.1.0
+      nth-check: 2.1.1
+    dev: true
+
+  /css-what@6.1.0:
+    resolution: {integrity: sha512-HTUrgRJ7r4dsZKU6GjmpfRK1O76h97Z8MfS1G0FozR+oF2kG6Vfe8JE6zwrkbxigziPHinCJ+gCPjA9EaBDtRw==}
+    engines: {node: '>= 6'}
+    dev: true
+
+  /cssom@0.5.0:
+    resolution: {integrity: sha512-iKuQcq+NdHqlAcwUY0o/HL69XQrUaQdMjmStJ8JFmUaiiQErlhrmuigkg/CU4E2J0IyUKUrMAgl36TvN67MqTw==}
+    dev: true
+
  /csv-generate@3.4.3:
    resolution: {integrity: sha512-w/T+rqR0vwvHqWs/1ZyMDWtHHSJaN06klRqJXBEpDJaM/+dZkso0OKh1VcuuYvK3XM53KysVNq8Ko/epCK8wOw==}
    dev: true
@@ -1938,6 +1981,33 @@ packages:
    dependencies:
      esutils: 2.0.3

+  /dom-serializer@2.0.0:
+    resolution: {integrity: sha512-wIkAryiqt/nV5EQKqQpo3SToSOV9J0DnbJqwK7Wv/Trc92zIAYZ4FlMu+JPFW1DfGFt81ZTCGgDEabffXeLyJg==}
+    dependencies:
+      domelementtype: 2.3.0
+      domhandler: 5.0.3
+      entities: 4.5.0
+    dev: true
+
+  /domelementtype@2.3.0:
+    resolution: {integrity: sha512-OLETBj6w0OsagBwdXnPdN0cnMfF9opN69co+7ZrbfPGrdpPVNBUj02spi6B1N7wChLQiPn4CSH/zJvXw56gmHw==}
+    dev: true
+
+  /domhandler@5.0.3:
+    resolution: {integrity: sha512-cgwlv/1iFQiFnU96XXgROh8xTeetsnJiDsTc7TYCLFd9+/WNkIqPTxiM/8pSd8VIrhXGTf1Ny1q1hquVqDJB5w==}
+    engines: {node: '>= 4'}
+    dependencies:
+      domelementtype: 2.3.0
+    dev: true
+
+  /domutils@3.1.0:
+    resolution: {integrity: sha512-H78uMmQtI2AhgDJjWeQmHwJJ2bLPD3GMmO7Zja/ZZh84wkm+4ut+IUnUdRa8uCGX88DiVx1j6FRe1XfxEgjEZA==}
+    dependencies:
+      dom-serializer: 2.0.0
+      domelementtype: 2.3.0
+      domhandler: 5.0.3
+    dev: true
+
  /dot-prop@5.3.0:
    resolution: {integrity: sha512-QM8q3zDe58hqUqjraQOmzZ1LIH9SWQJTlEKCH4kJ2oQvLZk7RbQXvtDM2XEq3fwkV9CCvvH4LA0AV+ogFsBM2Q==}
    engines: {node: '>=8'}
@@ -1997,6 +2067,11 @@ packages:
      strip-ansi: 6.0.1
    dev: true

+  /entities@4.5.0:
+    resolution: {integrity: sha512-V0hjH4dGPh9Ao5p0MoRY6BVqtwCjhz6vI5LT8AJ55H+4g9/4vbHx1I54fS0XuclLhDHArPQCiMjDxjaL8fPxhw==}
+    engines: {node: '>=0.12'}
+    dev: true
+
  /error-ex@1.3.2:
    resolution: {integrity: sha512-7dFHNmqeFSEt2ZBsCriorKnn3Z2pj+fd9kmI6QoWw4//DL+icEBfc0U7qJCisqrTsKTjw4fNFy2pW9OqStD84g==}
    dependencies:
@@ -3044,6 +3119,19 @@ packages:
  /hosted-git-info@2.8.9:
    resolution: {integrity: sha512-mxIDAb9Lsm6DoOJ7xH+5+X4y1LU/4Hi50L9C5sIswK3JzULS4bwk1FvjdBgvYR4bzT4tuUQiC15FE2f5HbLvYw==}

+  /html-escaper@3.0.3:
+    resolution: {integrity: sha512-RuMffC89BOWQoY0WKGpIhn5gX3iI54O6nRA0yC124NYVtzjmFWBIiFd8M0x+ZdX0P9R4lADg1mgP8C7PxGOWuQ==}
+    dev: true
+
+  /htmlparser2@9.0.0:
+    resolution: {integrity: sha512-uxbSI98wmFT/G4P2zXx4OVx04qWUmyFPrD2/CNepa2Zo3GPNaCaaxElDgwUrwYWkK1nr9fft0Ya8dws8coDLLQ==}
+    dependencies:
+      domelementtype: 2.3.0
+      domhandler: 5.0.3
+      domutils: 3.1.0
+      entities: 4.5.0
+    dev: true
+
  /http-errors@1.4.0:
    resolution: {integrity: sha512-oLjPqve1tuOl5aRhv8GK5eHpqP1C9fb+Ol+XTLjKfLltE44zdDbEdjPSbU7Ch5rSNsVFqZn97SrMmZLdu1/YMw==}
    engines: {node: '>= 0.6'}
@@ -3410,6 +3498,16 @@ packages:
  /lines-and-columns@1.2.4:
    resolution: {integrity: sha512-7ylylesZQ/PV29jhEDl3Ufjo6ZX7gCqJr5F7PKrqc93v7fzSymt1BpwEU8nAUXs8qzzvqhbjhK5QZg6Mt/HkBg==}

+  /linkedom@0.16.4:
+    resolution: {integrity: sha512-SykvDVh/jAnaO+WiPqH5vX3QpZrIRImuppzYhIHons3RXPhDwqN2dOyfopOVaHleqWtoS+3vWCqen+m8M3HToQ==}
+    dependencies:
+      css-select: 5.1.0
+      cssom: 0.5.0
+      html-escaper: 3.0.3
+      htmlparser2: 9.0.0
+      uhyphen: 0.2.0
+    dev: true
+
  /load-yaml-file@0.2.0:
    resolution: {integrity: sha512-OfCBkGEw4nN6JLtgRidPX6QxjBQGQf72q3si2uvqyFEMbycSFFHwAZeXx6cJgFM9wmLrf9zBwCP3Ivqa+LLZPw==}
    engines: {node: '>=6'}
@@ -3741,6 +3839,12 @@ packages:
      set-blocking: 2.0.0
    dev: true

+  /nth-check@2.1.1:
+    resolution: {integrity: sha512-lqjrjmaOoAnWfMmBPL+XNnynZh2+swxiX3WUE0s4yEHI6m+AwrK2UZOimIRl3X/4QctVqS8AiZjFqyOGrMXb/w==}
+    dependencies:
+      boolbase: 1.0.0
+    dev: true
+
  /object-assign@4.1.1:
    resolution: {integrity: sha512-rJgTQnkUnH1sFw8yT6VSU3zD3sWmu6sZhIseY8VX+GRu3P6F7Fu+JNDoXfklElbLJSnc3FUQHVe4cU5hj+BcUg==}
    engines: {node: '>=0.10.0'}
@@ -4832,6 +4936,10 @@ packages:
    resolution: {integrity: sha512-o+ORpgGwaYQXgqGDwd+hkS4PuZ3QnmqMMxRuajK/a38L6fTpcE5GPIfrf+L/KemFzfUpeUQc1rRS1iDBozvnFA==}
    dev: true

+  /uhyphen@0.2.0:
+    resolution: {integrity: sha512-qz3o9CHXmJJPGBdqzab7qAYuW8kQGKNEuoHFYrBwV6hWIMcpAmxDLXojcHfFr9US1Pe6zUswEIJIbLI610fuqA==}
+    dev: true
+
  /uid-promise@1.0.0:
    resolution: {integrity: sha512-R8375j0qwXyIu/7R0tjdF06/sElHqbmdmWC9M2qQHpEVbvE4I5+38KJI7LUUmQMp7NVq4tKHiBMkT0NFM453Ig==}
    dev: true
@@ -4844,6 +4952,10 @@ packages:
      has-symbols: 1.0.3
      which-boxed-primitive: 1.0.2

+  /undici-types@5.26.5:
+    resolution: {integrity: sha512-JlCMO+ehdEIKqlFxk6IfVoAUVmgz7cU7zD/h9XZ0qzeosSHmUJVOzSQvvYSYWXkFXC+IfLKSIffhv0sVZup6pA==}
+    dev: true
+
  /undici@5.26.5:
    resolution: {integrity: sha512-cSb4bPFd5qgR7qr2jYAi0hlX9n5YKK2ONKkLFkxl+v/9BvC0sOpZjBHDBSXc5lWAf5ty9oZdRXytBIHzgUcerw==}
    engines: {node: '>=14.0'}
@@ -4926,7 +5038,7 @@ packages:
      - supports-color
    dev: true

-  /vite-node@0.34.6(@types/node@14.18.33):
+  /vite-node@0.34.6(@types/node@20.10.0):
    resolution: {integrity: sha512-nlBMJ9x6n7/Amaz6F3zJ97EBwR2FkzhBRxF5e+jE6LA3yi6Wtc2lyTij1OnDMIr34v5g/tVQtsVAzhT0jc5ygA==}
    engines: {node: '>=v14.18.0'}
    hasBin: true
@@ -4936,7 +5048,7 @@ packages:
      mlly: 1.4.2
      pathe: 1.1.1
      picocolors: 1.0.0
-      vite: 5.0.2(@types/node@14.18.33)
+      vite: 5.0.2(@types/node@20.10.0)
    transitivePeerDependencies:
      - '@types/node'
      - less
@@ -4948,7 +5060,7 @@ packages:
      - terser
    dev: true

-  /vite@5.0.2(@types/node@14.18.33):
+  /vite@5.0.2(@types/node@20.10.0):
    resolution: {integrity: sha512-6CCq1CAJCNM1ya2ZZA7+jS2KgnhbzvxakmlIjN24cF/PXhRMzpM/z8QgsVJA/Dm5fWUWnVEsmtBoMhmerPxT0g==}
    engines: {node: ^18.0.0 || >=20.0.0}
    hasBin: true
@@ -4976,7 +5088,7 @@ packages:
      terser:
        optional: true
    dependencies:
-      '@types/node': 14.18.33
+      '@types/node': 20.10.0
      esbuild: 0.19.8
      postcss: 8.4.31
      rollup: 4.6.0
@@ -5017,7 +5129,7 @@ packages:
    dependencies:
      '@types/chai': 4.3.11
      '@types/chai-subset': 1.3.5
-      '@types/node': 14.18.33
+      '@types/node': 20.10.0
      '@vitest/expect': 0.34.6
      '@vitest/runner': 0.34.6
      '@vitest/snapshot': 0.34.6
@@ -5036,8 +5148,8 @@ packages:
      strip-literal: 1.3.0
      tinybench: 2.5.1
      tinypool: 0.7.0
-      vite: 5.0.2(@types/node@14.18.33)
-      vite-node: 0.34.6(@types/node@14.18.33)
+      vite: 5.0.2(@types/node@20.10.0)
+      vite-node: 0.34.6(@types/node@20.10.0)
      why-is-node-running: 2.2.2
    transitivePeerDependencies:
      - less
--- a/pnpm-workspaces.yaml
+++ b/pnpm-workspaces.yaml
--- 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]	66f4a5e93c	chore(deps): update actions/cache action to v4	2024-01-17 17:38:28 +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
Guz013	41587354aa	revert: fix(ci) install command for monorepo	2023-11-29 10:31:00 -03:00
Guz013	599cb5f202	fix: 🐛 project structure and pnpm workspaces	2023-11-29 10:29:24 -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
Guz013	dd845fc550	chore: 🔧 add missing changeset	2023-11-28 17:45:02 -03:00
Guz013	de8964f1f3	Merge branch 'dev' of github.com:LoredDev/LoredMarkdown into dev	2023-11-28 17:41:12 -03:00
Guz	ccd30e609b	chore: merge pull request #16 from LoredDev/8-feat-banner-layouts Merge pull request, adding the new banner layouts.	2023-11-28 17:40:43 -03:00
Guz013	ca7e58d453	fix(ci): 🐛 👷 install command for monorepo	2023-11-28 17:38:03 -03:00
Guz013	c4434a5c3e	refactor: ♻️ remove in between code eslint-disable comments	2023-11-28 17:33:24 -03:00
Guz013	0761b45d56	chore: 🔧 create script for converting the banners	2023-11-28 17:20:40 -03:00
Guz013	aa95cb5366	chore: 🔧 export banners to their repective files	2023-11-28 17:19:30 -03:00
Guz013	d3f63086f8	refactor: ♻️ place banners in different pages Orgnanized the banners in the design file, now each is on a different page/canvas. This also fixes the exported SVGs having the other banners code in them.	2023-11-28 17:18:22 -03:00
Guz013	3ed39f18b2	chore: 🔧 ignore Inkscape backup files	2023-11-28 13:32:20 -03:00
Guz013	df77a46db6	feat: ✨ inkscape svg files for the banners These files will be converted to standard SVG files using a script. So things like Inkscape's labels can be converted to IDs (because Inkscape doesn't support duplicated IDs on the design.inkscape.svg file).	2023-11-28 13:30:21 -03:00
Guz013	c5c036d4da	feat(banners-lib): ✨ horizontal banner layouts Created the basic layout SVG file in Inkscape. The exported SVG needs to have specific ids for each element, so it can be edited programically later.	2023-11-28 10:47:20 -03:00