Ajout des categories

css/style.css

@@ -195,6 +195,22 @@ body > hr {
 	left: 5px;
 }
 
+@media screen and (max-width: 599.9px) {
+	#search-section:has(input:focus) {
+		position: fixed;
+		top: 25px;
+		left: 10px;
+		width: calc(100vw - 20px);
+		margin: 0;
+		height: min-content;
+		box-sizing: border-box;
+	}
+}
+
+#search-result {
+	min-height: 100vh;
+}
+
 #search-section input {
 	background: black;
 	font-size: 1em;
@@ -526,4 +542,47 @@ camp-talk[data-track-id="34"] {
 
 camp-talk.active {
 	animation: active-talk 1.5s alternate-reverse infinite linear;
+}
+
+/* EXPLORE NAV */
+
+#explore {
+	position: absolute;
+	bottom: 10px;
+	right: 10px;
+	width: min-content;
+}
+
+#explore:has( ~ dialog:not([open])) {
+	position: fixed;
+}
+
+#explore details {
+	display: flex;
+	flex-direction: column-reverse;
+	align-items: center;
+
+	row-gap: 15px;
+}
+
+#explore details > summary {
+	display: block;
+}
+
+#explore details > summary img {
+	height: calc(20px + 2em + 2ex);
+	display: block;
+}
+
+#explore details button {
+	display: block;
+	border: none;
+	background: none;
+	padding: 0;
+	margin: 0;
+	cursor: pointer;
+}
+
+#explore details > button img {
+	height: 2.7em;
 }