chore: prepare page to ad news

docs/src/app/news/layout.tsx

@@ -0,0 +1,14 @@
+import type { Metadata } from "next";
+
+export const metadata: Metadata = {
+	title: "News Ad Page",
+	description: "News Ad Page for the Multiform Validator library.",
+};
+
+export default function RootLayout({
+	children,
+}: Readonly<{
+	children: React.ReactNode;
+}>) {
+	return <>{children}</>;
+}

docs/src/app/news/page.tsx

@@ -0,0 +1,34 @@
+import "@/css/news.css";
+import MainBg from "@/components/MainBg";
+
+export default function NewsPage() {
+	return (
+		<MainBg>
+			<div id="news-page">
+				<div className="div-ad div-ad1">
+					<h1>News1</h1>
+				</div>
+
+				<div className="div-ad div-ad2">
+					<h1>News2</h1>
+				</div>
+
+				<div className="div-ad div-ad3">
+					<h1>News3</h1>
+				</div>
+
+				<div className="div-ad div-ad4">
+					<h1>News4</h1>
+				</div>
+
+				<div className="div-ad div-ad5">
+					<h1>News5</h1>
+				</div>
+
+				<div className="div-ad div-ad6">
+					<h1>News6</h1>
+				</div>
+			</div>
+		</MainBg>
+	);
+}

docs/src/app/sitemap.ts

@@ -100,6 +100,12 @@ export default function sitemap(): MetadataRoute.Sitemap {
 			changeFrequency: "monthly",
 			priority: 0.5,
 		},
+		{
+			url: `${hostUrl}/news`,
+			lastModified: new Date(),
+			changeFrequency: "monthly",
+			priority: 0.2,
+		},
 		...generateJsMaps(),
 	];
 }

docs/src/css/news.css

@@ -0,0 +1,83 @@
+#news-page {
+  display: grid;
+  grid-auto-rows: minmax(180px, auto);
+  gap: 50px;
+}
+#news-page .div-ad {
+  border: 0.1px solid rgba(204, 204, 204, 0.4);
+  display: block;
+  border-radius: 5px;
+  width: 100%;
+  height: 100%;
+}
+#news-page .div-ad h1, #news-page .div-ad h2, #news-page .div-ad h3, #news-page .div-ad h4, #news-page .div-ad h5, #news-page .div-ad h6, #news-page .div-ad p {
+  color: #666;
+}
+#news-page .div-ad1 {
+  grid-column: 1;
+  grid-row: 1/span 2;
+}
+#news-page .div-ad2 {
+  grid-column: 1;
+  grid-row: 3/span 2;
+}
+#news-page .div-ad3 {
+  grid-column: 2;
+  grid-row: 1/span 4;
+  text-align: center;
+}
+#news-page .div-ad4 {
+  grid-column: 1/span 2;
+  grid-row: 5/span 2;
+}
+#news-page .div-ad5 {
+  grid-column: 1;
+  grid-row: 7/span 2;
+}
+#news-page .div-ad6 {
+  grid-column: 2;
+  grid-row: 7/span 2;
+}
+@media (max-width: 768px) {
+  #news-page {
+    gap: 20px;
+  }
+  #news-page .div-ad1 {
+    grid-column: 1;
+    grid-row: 1/span 2;
+  }
+  #news-page .div-ad2 {
+    grid-column: 2;
+    grid-row: 1/span 2;
+  }
+  #news-page .div-ad3 {
+    grid-column: 1/span 2;
+    grid-row: 3/span 2;
+  }
+}
+@media (max-width: 376px) {
+  #news-page .div-ad1 {
+    grid-column: 1/span 2;
+    grid-row: 1/span 2;
+  }
+  #news-page .div-ad2 {
+    grid-column: 1/span 2;
+    grid-row: 3/span 2;
+  }
+  #news-page .div-ad3 {
+    grid-column: 1/span 2;
+    grid-row: 5/span 2;
+  }
+  #news-page .div-ad4 {
+    grid-column: 1/span 2;
+    grid-row: 7/span 2;
+  }
+  #news-page .div-ad5 {
+    grid-column: 1;
+    grid-row: 9/span 2;
+  }
+  #news-page .div-ad6 {
+    grid-column: 2;
+    grid-row: 9/span 2;
+  }
+}/*# sourceMappingURL=news.css.map */

docs/src/css/news.scss

@@ -0,0 +1,99 @@
+#news-page {
+  display: grid;
+  grid-auto-rows: minmax(180px, auto); // Reduz o tamanho mínimo das linhas
+	gap: 50px;
+
+  .div-ad {
+    border: 0.1px solid #cccccc66;
+		display: block;
+		border-radius: 5px;
+		width: 100%;
+		height: 100%;
+
+    h1, h2, h3, h4, h5, h6, p {
+      color: #666;
+    }
+  }
+
+  .div-ad1 {
+    grid-column: 1;
+    grid-row: 1 / span 2;
+  }
+
+  .div-ad2 {
+    grid-column: 1;
+    grid-row: 3 / span 2;
+  }
+
+  .div-ad3 {
+    grid-column: 2;
+    grid-row: 1 / span 4;
+		text-align: center;
+  }
+
+  .div-ad4 {
+    grid-column: 1 / span 2;
+    grid-row: 5 / span 2;
+  }
+
+  .div-ad5 {
+    grid-column: 1;
+    grid-row: 7 / span 2;
+  }
+
+  .div-ad6 {
+    grid-column: 2;
+		grid-row: 7 / span 2;
+  }
+
+	@media (max-width: 768px) {
+		gap: 20px;
+
+		.div-ad1 {
+			grid-column: 1;
+			grid-row: 1 / span 2;
+		}
+
+		.div-ad2 {
+			grid-column: 2;
+			grid-row: 1 / span 2;
+		}
+
+		.div-ad3 {
+			grid-column: 1 / span 2;
+			grid-row: 3 / span 2;
+		}
+	}
+
+	@media (max-width: 376px) {
+		.div-ad1 {
+			grid-column: 1 / span 2;
+			grid-row: 1 / span 2;
+		}
+
+		.div-ad2 {
+			grid-column: 1 / span 2;
+			grid-row: 3 / span 2;
+		}
+
+		.div-ad3 {
+			grid-column: 1 / span 2;
+			grid-row: 5 / span 2;
+		}
+
+		.div-ad4 {
+			grid-column: 1 / span 2;
+			grid-row: 7 / span 2;
+		}
+
+		.div-ad5 {
+			grid-column: 1;
+			grid-row: 9 / span 2;
+		}
+
+		.div-ad6 {
+			grid-column: 2;
+			grid-row: 9 / span 2;
+		}
+	}
+}