Merge pull request #932 from edyjoel/remove-header-line-in-internal-c…

…ombats

Eliminate the header line in the internal of the combats

src/components/Header.astro

@@ -26,6 +26,8 @@ const pages = [
 	...page,
 	active: page.active ?? normalizedPathName === page.href,
 }))
+
+const isCombatIntern = normalizedPathName.startsWith("/combates/")
 ---
 
 <header class="mb-10 h-16 max-w-[100vw] lg:h-24">
@@ -112,19 +114,22 @@ const pages = [
 	<div class="relative flex h-2 w-full flex-col items-center">
 		<div class="gridBottomBarContainer absolute grid w-full items-center justify-between">
 			<div
-				class="h-[2px] w-full rounded-l-[30%] border-t-0"
-				style="background:linear-gradient(to right, transparent 3%, white 35%, white 100%)"
+				class:list={[
+					"h-[2px] w-full rounded-l-[30%] border-t-0",
+					{ gridBottomBarContainerLineLeft: !isCombatIntern },
+				]}
 			>
 			</div>
 			<div class="focus-within-ring -ml-[8px] -mr-[4px]">
 				<a href="/" class="focus-visible:!ring-0">
 					<HeroLogo class:list={"h-auto w-full"} id="hero-logo-header" noEffect />
 				</a>
 			</div>
-
 			<div
-				class="h-[2px] w-full rounded-r-[30%] border-t-0 bg-white"
-				style="background:linear-gradient(to left, transparent 3%, white 35%, white 100%);"
+				class:list={[
+					"h-[2px] w-full rounded-l-[30%] border-t-0",
+					{ gridBottomBarContainerLineRight: !isCombatIntern },
+				]}
 			>
 			</div>
 		</div>
@@ -197,6 +202,14 @@ const pages = [
 		grid-template-rows: 4px;
 	}
 
+	.gridBottomBarContainerLineLeft {
+		background: linear-gradient(to right, transparent 3%, white 35%, white 100%);
+	}
+
+	.gridBottomBarContainerLineRight {
+		background: linear-gradient(to left, transparent 3%, white 35%, white 100%);
+	}
+
 	@media (min-width: 1024px) {
 		.gridBottomBarContainer {
 			grid-template-columns: 1fr 9rem 1fr;