feat(whatislove-dev): add search html element to index page wd-275 (#653

)

* style(careers-whatislove-dev): edit lit eslint plugin style in config wd-275

* feat(whatislove-dev): add search html element to index page wd-275

apps/careers-whatislove-dev/eslint.config.js

@@ -17,7 +17,7 @@ let ignoresConfig = {
 /** @type {FlatConfig} */
 let litConfig = {
 	plugins: {
-		lit: lit,
+		lit,
 	},
 	rules: /** @type {RulesRecord} */ (lit.configs.all.rules),
 }

apps/whatislove-dev/.w3c-validator

@@ -1 +1,2 @@
 /When the “srcset” attribute has any image candidate string with a width descriptor, the “sizes” attribute must also be specified./
+/Element “search” not allowed as child of element “section” in this context./

apps/whatislove-dev/src/pages/index/index.njk

@@ -74,35 +74,42 @@ stickersCount: 0
 	<div class="main__row main__row--experience-stickers box">
 		<section class="experience">
 			<h2 class="experience__title">Experience</h2>
-			<form class="experience__form" action="/timeline">
-				<label class="experience__form-label">
-					<input
-						class="experience__form-control visually-hidden"
-						type="radio"
-						name="type"
-						value="position"
-						checked
-					/>
-					Positions
-				</label>
-				<label class="experience__form-label">
-					<input
-						class="experience__form-control visually-hidden"
-						type="radio"
-						name="type"
-						value="certificate"
-					/>
-					Certificates
-				</label>
-				<label class="experience__form-label">
-					<input class="experience__form-control visually-hidden" type="radio" name="type" value="meetup" />
-					Meetups
-				</label>
-				<label class="experience__form-label">
-					<input class="experience__form-control visually-hidden" type="radio" name="type" value="book" />
-					Book
-				</label>
-			</form>
+			<search class="experience__form-wrapper">
+				<form class="experience__form" action="/timeline">
+					<label class="experience__form-label">
+						<input
+							class="experience__form-control visually-hidden"
+							type="radio"
+							name="type"
+							value="position"
+							checked
+						/>
+						Positions
+					</label>
+					<label class="experience__form-label">
+						<input
+							class="experience__form-control visually-hidden"
+							type="radio"
+							name="type"
+							value="certificate"
+						/>
+						Certificates
+					</label>
+					<label class="experience__form-label">
+						<input
+							class="experience__form-control visually-hidden"
+							type="radio"
+							name="type"
+							value="meetup"
+						/>
+						Meetups
+					</label>
+					<label class="experience__form-label">
+						<input class="experience__form-control visually-hidden" type="radio" name="type" value="book" />
+						Book
+					</label>
+				</form>
+			</search>
 			<div class="experience__timeline-wrapper scroll-shadows">
 				<ul class="experience__timeline-list timeline timeline--loading timeline--columns"></ul>
 			</div>