@knitli/docs-components 1.1.2 → 1.1.4

package/src/components/Footer.astro

@@ -12,235 +12,271 @@
 //   starlight({ components: { Footer: '@knitli/docs-components/Footer.astro' } })
 
 // @ts-expect-error: virtual modules are typed in virtual-internal.d.ts (not in Starlight's public exports map)
-import EditLink from 'virtual:starlight/components/EditLink';
+import EditLink from "virtual:starlight/components/EditLink";
 // @ts-expect-error
-import LastUpdated from 'virtual:starlight/components/LastUpdated';
+import LastUpdated from "virtual:starlight/components/LastUpdated";
 // @ts-expect-error
-import Pagination from 'virtual:starlight/components/Pagination';
+import Pagination from "virtual:starlight/components/Pagination";
 // @ts-expect-error
-import config from 'virtual:starlight/user-config';
-import { Icon } from '@astrojs/starlight/components';
+import config from "virtual:starlight/user-config";
+import { Icon } from "@astrojs/starlight/components";
 
 const currentYear = new Date().getFullYear();
 
-const shouldShowDocsHomeLink = Astro.url.pathname !== '/';
+const shouldShowDocsHomeLink = Astro.url.pathname !== "/";
 ---
 
 <footer class="sl-flex knitli-page-footer">
-
-	<!-- Starlight's native page-level footer: edit link, last updated, pagination, optional credits -->
-	<div class="sl-flex page-actions">
-		<div class="meta sl-flex">
-			<EditLink />
-			<LastUpdated />
-		</div>
-		<Pagination />
-		{config.credits && (
+  <!-- Starlight's native page-level footer: edit link, last updated, pagination, optional credits -->
+  <div class="sl-flex page-actions">
+    <div class="meta sl-flex">
+      <EditLink/>
+      <LastUpdated/>
+    </div>
+    <Pagination/>
+    {
+		config.credits && (
 			<a class="kudos sl-flex" href="https://starlight.astro.build">
-				<Icon name="starlight" /> {Astro.locals.t('builtWithStarlight.label')}
+				
+				<Icon name="starlight" /> {
+				// @ts-ignore: 2339
+				Astro.locals.t('builtWithStarlight.label')}
 			</a>
 		)}
-	</div>
-
-	<!-- Knitli site footer -->
-	<div class="site-footer sl-flex">
-		<div class="footer-content sl-flex">
-
-			<div class="footer-brand">
-				<p class="copyright">© {currentYear} Knitli, Inc. All rights reserved.</p>
-				<div class="social-links sl-flex">
-					<a href="https://github.com/knitli" aria-label="GitHub" class="social-link" target="_blank" rel="noopener noreferrer">
-						<Icon name="github" size="1.1rem" />
-					</a>
-					<a href="https://x.com/knitli_inc" aria-label="X" class="social-link" target="_blank" rel="noopener noreferrer">
-						<Icon name="x.com" size="1.1rem" />
-					</a>
-					<a href="https://bsky.app/profile/knitli.com" aria-label="Bluesky" class="social-link" target="_blank" rel="noopener noreferrer">
-						<Icon name="blueSky" size="1.1rem" />
-					</a>
-					<a href="https://linkedin.com/company/knitli" aria-label="LinkedIn" class="social-link" target="_blank" rel="noopener noreferrer">
-						<Icon name="linkedin" size="1.1rem" />
-					</a>
-				</div>
-			</div>
-
-			<nav class="footer-nav" aria-label="Knitli">
-				<p class="nav-heading">Knitli</p>
-				<ul>
-					<li><a href="https://knitli.com">knitli.com</a></li>
-					<li><a href="https://blog.knitli.com">Blog</a></li>
-				</ul>
-			</nav>
-
-			<nav class="footer-nav" aria-label="Documentation">
-				<p class="nav-heading">Docs</p>
-				<ul>
-					{shouldShowDocsHomeLink && <li><a href="https://docs.knitli.com">Developer Docs</a></li>}
-					<li><a href="https://docs.knitli.com/ReCoco">ReCoco</a></li>
-					<li>
-						<span class="link-disabled">
-							CodeWeaver
-							<span class="soon-badge">soon</span>
-						</span>
-					</li>
-					<li>
-						<a href="https://docs.rs/thread" target="_blank" rel="noopener noreferrer">
-							Thread ↗
-						</a>
-					</li>
-				</ul>
-			</nav>
-
-		</div>
-	</div>
-
+  </div>
+
+  <!-- Knitli site footer -->
+  <div class="site-footer sl-flex">
+    <div class="footer-content sl-flex">
+      <div class="footer-brand">
+        <p class="copyright">
+          © {currentYear}Knitli, Inc. All rights reserved.
+        </p>
+        <div class="social-links sl-flex">
+          <a
+            href="https://github.com/knitli"
+            aria-label="GitHub"
+            class="social-link"
+            target="_blank"
+            rel="noopener noreferrer"
+          >
+            <Icon name="github" size="1.1rem"/>
+          </a>
+          <a
+            href="https://x.com/knitli_inc"
+            aria-label="X"
+            class="social-link"
+            target="_blank"
+            rel="noopener noreferrer"
+          >
+            <Icon name="x.com" size="1.1rem"/>
+          </a>
+          <a
+            href="https://bsky.app/profile/knitli.com"
+            aria-label="Bluesky"
+            class="social-link"
+            target="_blank"
+            rel="noopener noreferrer"
+          >
+            <Icon name="blueSky" size="1.1rem"/>
+          </a>
+          <a
+            href="https://linkedin.com/company/knitli"
+            aria-label="LinkedIn"
+            class="social-link"
+            target="_blank"
+            rel="noopener noreferrer"
+          >
+            <Icon name="linkedin" size="1.1rem"/>
+          </a>
+        </div>
+      </div>
+
+      <nav class="footer-nav" aria-label="Knitli">
+        <p class="nav-heading">Knitli</p>
+        <ul>
+          <li>
+            <a href="https://knitli.com">knitli.com</a>
+          </li>
+          <li>
+            <a href="https://blog.knitli.com">Blog</a>
+          </li>
+        </ul>
+      </nav>
+
+      <nav class="footer-nav" aria-label="Documentation">
+        <p class="nav-heading">Docs</p>
+        <ul>
+          {shouldShowDocsHomeLink && <li><a href="https://docs.knitli.com">Developer Docs</a></li>}
+          <li>
+            <a href="https://docs.knitli.com/Recoco">Recoco</a>
+          </li>
+          <li>
+            <span class="link-disabled">
+              CodeWeaver
+              <span class="soon-badge">soon</span>
+            </span>
+          </li>
+          <li>
+            <a
+              href="https://docs.rs/thread"
+              target="_blank"
+              rel="noopener noreferrer"
+            >
+              Thread ↗
+            </a>
+          </li>
+        </ul>
+      </nav>
+    </div>
+  </div>
 </footer>
 
 <style>
-	@layer starlight.core {
-		/* ---- Outer wrapper ---- */
-		.knitli-page-footer {
-			flex-direction: column;
-			gap: 0;
-		}
-
-		/* ---- Starlight native page actions (replicated from Starlight's Footer) ---- */
-		.page-actions {
-			flex-direction: column;
-			gap: 1.5rem;
-		}
-
-		.meta {
-			gap: 0.75rem 3rem;
-			justify-content: space-between;
-			flex-wrap: wrap;
-			margin-top: 3rem;
-			font-size: var(--sl-text-sm);
-			color: var(--sl-color-gray-3);
-		}
-
-		.meta > :global(p:only-child) {
-			margin-inline-start: auto;
-		}
-
-		.kudos {
-			align-items: center;
-			gap: 0.5em;
-			margin: 1.5rem auto;
-			font-size: var(--sl-text-xs);
-			text-decoration: none;
-			color: var(--sl-color-gray-3);
-		}
-
-		.kudos:hover {
-			color: var(--sl-color-white);
-		}
-
-		/* ---- Knitli site footer ---- */
-		.site-footer {
-			flex-direction: column;
-			border-top: 1px solid var(--sl-color-gray-5);
-			padding-top: 2rem;
-			margin-top: 2rem;
-			gap: 1.5rem;
-		}
-
-		.footer-content {
-			flex-wrap: wrap;
-			gap: 2rem 4rem;
-			align-items: flex-start;
-		}
-
-		.footer-brand {
-			flex: 1;
-			min-width: 200px;
-			display: flex;
-			flex-direction: column;
-			gap: 0.75rem;
-		}
-
-		.copyright {
-			margin: 0;
-			font-size: var(--sl-text-sm);
-			color: var(--sl-color-gray-3);
-		}
-
-		.social-links {
-			gap: 0.75rem;
-			align-items: center;
-		}
-
-		.social-link {
-			display: flex;
-			align-items: center;
-			color: var(--sl-color-gray-3);
-			text-decoration: none;
-			transition: color 0.2s ease;
-		}
-
-		.social-link:hover {
-			color: var(--sl-color-accent-high);
-		}
-
-		.footer-nav {
-			display: flex;
-			flex-direction: column;
-			gap: 0.5rem;
-		}
-
-		.nav-heading {
-			margin: 0 0 0.5rem;
-			font-size: var(--sl-text-xs);
-			font-weight: 600;
-			text-transform: uppercase;
-			letter-spacing: 0.08em;
-			color: var(--sl-color-accent);
-		}
-
-		.footer-nav ul {
-			list-style: none;
-			padding: 0;
-			margin: 0;
-			display: flex;
-			flex-direction: column;
-			gap: 0.4rem;
-		}
-
-		.footer-nav a {
-			font-size: var(--sl-text-sm);
-			color: var(--sl-color-gray-2);
-			text-decoration: none;
-			transition: color 0.2s ease;
-		}
-
-		.footer-nav a:hover {
-			color: var(--sl-color-accent-high);
-		}
-
-		.link-disabled {
-			font-size: var(--sl-text-sm);
-			color: var(--sl-color-gray-4);
-			display: flex;
-			align-items: center;
-			gap: 0.4rem;
-		}
-
-		.soon-badge {
-			font-size: var(--sl-text-xs);
-			padding: 0.1em 0.4em;
-			border-radius: 3px;
-			background: var(--sl-color-accent-low);
-			color: var(--sl-color-accent-high);
-			font-weight: 600;
-			letter-spacing: 0.05em;
-			text-transform: uppercase;
-		}
-	}
-
-	@layer starlight.components {
-		/* Starlight icon color in the kudos link */
-		.kudos :global(svg) {
-			color: var(--sl-color-orange);
-		}
-	}
+@layer starlight.core {
+  /* ---- Outer wrapper ---- */
+  .knitli-page-footer {
+    flex-direction: column;
+    gap: 0;
+  }
+
+  /* ---- Starlight native page actions (replicated from Starlight's Footer) ---- */
+  .page-actions {
+    flex-direction: column;
+    gap: 1.5rem;
+  }
+
+  .meta {
+    gap: 0.75rem 3rem;
+    justify-content: space-between;
+    flex-wrap: wrap;
+    margin-top: 3rem;
+    font-size: var(--sl-text-sm);
+    color: var(--sl-color-gray-3);
+  }
+
+  .meta > :global(p:only-child) {
+    margin-inline-start: auto;
+  }
+
+  .kudos {
+    align-items: center;
+    gap: 0.5em;
+    margin: 1.5rem auto;
+    font-size: var(--sl-text-xs);
+    text-decoration: none;
+    color: var(--sl-color-gray-3);
+  }
+
+  .kudos:hover {
+    color: var(--sl-color-white);
+  }
+
+  /* ---- Knitli site footer ---- */
+  .site-footer {
+    flex-direction: column;
+    border-top: 1px solid var(--sl-color-gray-5);
+    padding-top: 2rem;
+    margin-top: 2rem;
+    gap: 1.5rem;
+  }
+
+  .footer-content {
+    flex-wrap: wrap;
+    gap: 2rem 4rem;
+    align-items: flex-start;
+  }
+
+  .footer-brand {
+    flex: 1;
+    min-width: 200px;
+    display: flex;
+    flex-direction: column;
+    gap: 0.75rem;
+  }
+
+  .copyright {
+    margin: 0;
+    font-size: var(--sl-text-sm);
+    color: var(--sl-color-gray-3);
+  }
+
+  .social-links {
+    gap: 0.75rem;
+    align-items: center;
+  }
+
+  .social-link {
+    display: flex;
+    align-items: center;
+    color: var(--sl-color-gray-3);
+    text-decoration: none;
+    transition: color 0.2s ease;
+  }
+
+  .social-link:hover {
+    color: var(--sl-color-accent-high);
+  }
+
+  .footer-nav {
+    display: flex;
+    flex-direction: column;
+    gap: 0.5rem;
+  }
+
+  .nav-heading {
+    margin: 0 0 0.5rem;
+    font-size: var(--sl-text-xs);
+    font-weight: 600;
+    text-transform: uppercase;
+    letter-spacing: 0.08em;
+    color: var(--sl-color-accent);
+  }
+
+  .footer-nav ul {
+    list-style: none;
+    padding: 0;
+    margin: 0;
+    display: flex;
+    flex-direction: column;
+    gap: 0.4rem;
+  }
+
+  .footer-nav a {
+    font-size: var(--sl-text-sm);
+    color: var(--sl-color-gray-2);
+    text-decoration: none;
+    transition: color 0.2s ease;
+  }
+
+  .footer-nav a:hover {
+    color: var(--sl-color-accent-high);
+  }
+
+  .link-disabled {
+    font-size: var(--sl-text-sm);
+    color: var(--sl-color-gray-4);
+    display: flex;
+    align-items: center;
+    gap: 0.4rem;
+  }
+
+  .soon-badge {
+    font-size: var(--sl-text-xs);
+    padding: 0.1em 0.4em;
+    border-radius: 3px;
+    background: var(--sl-color-accent-low);
+    color: var(--sl-color-accent-high);
+    font-weight: 600;
+    letter-spacing: 0.05em;
+    text-transform: uppercase;
+  }
+}
+
+@layer starlight.components {
+  /* Starlight icon color in the kudos link */
+  .kudos :global(svg) {
+    color: var(--sl-color-orange);
+  }
+}
 </style>