lightnet 4.5.1 → 4.6.0

package/src/components/VideoPlayer.astro

@@ -93,62 +93,60 @@ async function parseUrl(
 ---
 
 <div class="aspect-video w-full overflow-hidden bg-black md:rounded-lg">
-  {
-    host === "youtube" ? (
-      <iframe
-        class="h-full w-full"
-        src={`https://www.youtube-nocookie.com/embed/${id}`}
-        title={title}
-        allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share"
-        referrerpolicy="strict-origin-when-cross-origin"
-        allowfullscreen
-      />
-    ) : host === "vimeo" ? (
-      <iframe
-        class="h-full w-full"
-        title={title}
-        src={`https://player.vimeo.com/video/${id}`}
-        allow="autoplay; fullscreen; picture-in-picture"
-        allowfullscreen
-      />
-    ) : host === "mp4" ? (
-      <video class="h-full w-full" controls preload="auto" poster={image}>
-        <source src={id} type="video/mp4" />
-      </video>
-    ) : (
-      <a
-        class="group relative flex h-full w-full items-center justify-center focus:outline-none focus-visible:ring-2 focus-visible:ring-white/80 focus-visible:ring-offset-2 focus-visible:ring-offset-black"
-        {...getLinkAttributes(href ?? url)}
-      >
-        {imageMetadata ? (
-          <Image
-            src={imageMetadata}
-            alt={title ?? ""}
-            class="h-full w-full object-cover"
-          />
-        ) : (
-          <div class="flex h-full w-full items-center justify-center bg-gray-900 text-gray-200">
-            <span class="text-sm font-medium">{t("ln.external-link")}</span>
-          </div>
-        )}
-        <div class="absolute inset-0 z-10 bg-black/35 transition group-hover:bg-black/50" />
-        <div class="absolute inset-0 z-20 flex items-center justify-center">
-          <span class="flex h-14 w-14 items-center justify-center rounded-full bg-white/90 text-black shadow-lg transition group-hover:scale-105">
-            <svg
-              class="h-7 w-7"
-              viewBox="0 0 24 24"
-              fill="currentColor"
-              aria-hidden="true"
-            >
-              <path d="M8 5v14l11-7z" />
-            </svg>
-          </span>
+  {host === "youtube" ? (
+    <iframe
+      class="h-full w-full"
+      src={`https://www.youtube-nocookie.com/embed/${id}`}
+      title={title}
+      allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share"
+      referrerpolicy="strict-origin-when-cross-origin"
+      allowfullscreen
+    ></iframe>
+  ) : host === "vimeo" ? (
+    <iframe
+      class="h-full w-full"
+      title={title}
+      src={`https://player.vimeo.com/video/${id}`}
+      allow="autoplay; fullscreen; picture-in-picture"
+      allowfullscreen
+    ></iframe>
+  ) : host === "mp4" ? (
+    <video class="h-full w-full" controls preload="auto" poster={image}>
+      <source src={id} type="video/mp4" />
+    </video>
+  ) : (
+    <a
+      class="group relative flex h-full w-full items-center justify-center focus:outline-none focus-visible:ring-2 focus-visible:ring-white/80 focus-visible:ring-offset-2 focus-visible:ring-offset-black"
+      {...getLinkAttributes(href ?? url)}
+    >
+      {imageMetadata ? (
+        <Image
+          src={imageMetadata}
+          alt={title ?? ""}
+          class="h-full w-full object-cover"
+        />
+      ) : (
+        <div class="flex h-full w-full items-center justify-center bg-gray-900 text-gray-200">
+          <span class="text-sm font-medium">{t("ln.external-link")}</span>
         </div>
-        <div class="absolute bottom-0 end-0 start-0 z-20 flex items-center gap-2 rounded bg-black/70 px-4 py-4 text-sm font-medium text-white backdrop-blur md:text-sm">
-          <ExternalLinkIcon className="shrink-0 rtl:scale-x-[-1]" />
-          {t("ln.external-link")}
-        </div>
-      </a>
-    )
-  }
+      )}
+      <div class="absolute inset-0 z-10 bg-black/35 transition group-hover:bg-black/50" />
+      <div class="absolute inset-0 z-20 flex items-center justify-center">
+        <span class="flex h-14 w-14 items-center justify-center rounded-full bg-white/90 text-black shadow-lg transition group-hover:scale-105">
+          <svg
+            class="h-7 w-7"
+            viewBox="0 0 24 24"
+            fill="currentColor"
+            aria-hidden="true"
+          >
+            <path d="M8 5v14l11-7z" />
+          </svg>
+        </span>
+      </div>
+      <div class="absolute bottom-0 end-0 start-0 z-20 flex items-center gap-2 rounded bg-black/70 px-4 py-4 text-sm font-medium text-white backdrop-blur md:text-sm">
+        <ExternalLinkIcon className="shrink-0 rtl:scale-x-[-1]" />
+        {t("ln.external-link")}
+      </div>
+    </a>
+  )}
 </div>

package/src/layouts/MarkdownPage.astro

@@ -3,11 +3,12 @@ import Page, { type Props as PageProps } from "./Page.astro"
 
 type Props = PageProps & {
   className?: string
+  frontmatter: PageProps
 }
 const { className, ...pageProps } = Astro.props
 ---
 
-<Page {...pageProps}>
+<Page {...pageProps} {...pageProps.frontmatter}>
   <article
     class="prose mx-auto mt-8 max-w-screen-md px-4 prose-img:rounded-md sm:mt-16 md:px-8"
     class:list={[className]}

package/src/layouts/Page.astro

@@ -72,11 +72,9 @@ const { direction } = resolveLanguage(currentLocale)
   <head>
     <meta charset="UTF-8" />
     <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-    {
-      (disallowSearchIndexing ?? config.disallowSearchIndexing) && (
-        <meta name="robots" content="noindex" />
-      )
-    }
+    {(disallowSearchIndexing ?? config.disallowSearchIndexing) && (
+      <meta name="robots" content="noindex" />
+    )}
     {CustomHead && <CustomHead />}
     <title>{title ? `${title} | ${configTitle}` : configTitle}</title>
     {description && <meta name="description" content={description} />}
@@ -85,9 +83,7 @@ const { direction } = resolveLanguage(currentLocale)
     <Favicon />
     <ViewTransition />
   </head>
-  <body
-    class="flex min-h-screen flex-col overflow-y-scroll bg-gray-50 text-gray-900"
-  >
+  <body class="flex min-h-screen flex-col overflow-y-scroll bg-gray-50 text-gray-900">
     <Header />
     <main class={`grow pb-8 pt-14 sm:py-20 ${mainClass ?? ""}`}>
       <slot />

package/src/layouts/components/footer/Footer.astro

@@ -46,43 +46,40 @@ const footerItems = [
 <footer class="w-full border-t border-gray-200 bg-white text-sm text-gray-800">
   <div
     class="mx-auto flex w-full max-w-screen-xl px-4 py-4 md:px-8 md:py-6"
-    class:list={footerItems.length === 0
-      ? "flex-col justify-between gap-4 sm:flex-row sm:items-center"
-      : "flex-col gap-2"}
+    class:list={
+      footerItems.length === 0
+        ? "flex-col justify-between gap-4 sm:flex-row sm:items-center"
+        : "flex-col gap-2"
+    }
   >
     {shouldShowLanguageSelectionMenu && <LanguageSelectionMenu />}
-    {
-      (footerItems.length > 0 || config.credits) && (
-        <div class="flex shrink flex-col gap-6 md:flex-row md:items-start md:justify-between">
-          {footerItems.length > 0 && (
-            <div class="flex w-full min-w-0 flex-1 shrink flex-wrap">
-              {footerItems.map((item, index) => (
-                <span class="inline-flex">
-                  {item.type === "text" ? (
-                    <span>{item.label}</span>
-                  ) : (
-                    <a
-                      {...getLinkAttributes(item.href)}
-                      class="underline-offset-4 hover:underline"
-                    >
-                      {item.label}
-                    </a>
-                  )}
-                  {index !== footerItems.length - 1 && (
-                    <span
-                      class="shrink-0 px-2 text-gray-400"
-                      aria-hidden="true"
-                    >
-                      &middot;
-                    </span>
-                  )}
-                </span>
-              ))}
-            </div>
-          )}
-          {config.credits && <Credits />}
-        </div>
-      )
-    }
+    {(footerItems.length > 0 || config.credits) && (
+      <div class="flex shrink flex-col gap-6 md:flex-row md:items-start md:justify-between">
+        {footerItems.length > 0 && (
+          <div class="flex w-full min-w-0 flex-1 shrink flex-wrap">
+            {footerItems.map((item, index) => (
+              <span class="inline-flex">
+                {item.type === "text" ? (
+                  <span>{item.label}</span>
+                ) : (
+                  <a
+                    {...getLinkAttributes(item.href)}
+                    class="underline-offset-4 hover:underline"
+                  >
+                    {item.label}
+                  </a>
+                )}
+                {index !== footerItems.length - 1 && (
+                  <span class="shrink-0 px-2 text-gray-400" aria-hidden="true">
+                    &middot;
+                  </span>
+                )}
+              </span>
+            ))}
+          </div>
+        )}
+        {config.credits && <Credits />}
+      </div>
+    )}
   </div>
 </footer>

package/src/layouts/components/footer/LanguageSelectionMenu.astro

@@ -10,23 +10,23 @@ const { links: languageMenuItems } = getLanguageSelectionMenuItems({
   pathname: Astro.url.pathname,
   tConfigField,
 })
+const currentLanguage = languageMenuItems.find(({ active }) => active)
 ---
 
-<label class="inline-flex items-center gap-2 py-2 font-medium">
+<label class="relative inline-flex self-start items-center gap-2 rounded py-2 font-medium focus-within:ring-2 focus-within:ring-gray-900 focus-within:ring-offset-2">
   <GlobeIcon className="h-5 w-5 shrink-0 text-gray-600" aria-hidden="true" />
+  <span aria-hidden="true">{currentLanguage?.label}</span>
   <span class="sr-only">{t("ln.select-language")}</span>
   <select
-    class="min-w-0 cursor-pointer appearance-none border-0 bg-transparent p-0 pr-0 outline-none focus:ring-0"
+    class="absolute inset-0 h-full w-full cursor-pointer appearance-none opacity-0"
     aria-label={t("ln.select-language")}
     data-footer-language-select
   >
-    {
-      languageMenuItems.map(({ href, label, locale, active }) => (
-        <option value={href} selected={active} lang={locale}>
-          {label}
-        </option>
-      ))
-    }
+    {languageMenuItems.map(({ href, label, locale, active }) => (
+      <option value={href} selected={active} lang={locale}>
+        {label}
+      </option>
+    ))}
   </select>
 </label>
 <script>

package/src/layouts/components/header/LanguageSelectionMenu.astro

@@ -20,15 +20,13 @@ const {
 const disabled = !hasLocale && currentPath !== "/"
 ---
 
-{
-  translations.length > 1 && (
-    <Menu disabled={disabled} label="ln.select-language">
-      <GlobeIcon slot="icon" />
-      {translations.map(({ label, locale, active, href }) => (
-        <MenuItem href={href} hreflang={locale} active={active}>
-          {label}
-        </MenuItem>
-      ))}
-    </Menu>
-  )
-}
+{translations.length > 1 && (
+  <Menu disabled={disabled} label="ln.select-language">
+    <GlobeIcon slot="icon" />
+    {translations.map(({ label, locale, active, href }) => (
+      <MenuItem href={href} hreflang={locale} active={active}>
+        {label}
+      </MenuItem>
+    ))}
+  </Menu>
+)}

package/src/layouts/components/header/PageNavigation.astro

@@ -40,39 +40,35 @@ const items = (config.mainMenu ?? []).map(({ href, label, requiresLocale }) => {
   >
     <SquarePenIcon />
   </a>
-  {
-    !config.searchPage?.hideHeaderSearchIcon && (
-      <a
-        class="flex p-3 text-gray-600 hover:text-primary"
-        aria-label={t("ln.search.title")}
-        data-astro-prefetch="viewport"
-        href={searchPagePath(currentLocale)}
-      >
-        <SearchIcon />
-      </a>
-    )
-  }
+  {!config.searchPage?.hideHeaderSearchIcon && (
+    <a
+      class="flex p-3 text-gray-600 hover:text-primary"
+      aria-label={t("ln.search.title")}
+      data-astro-prefetch="viewport"
+      href={searchPagePath(currentLocale)}
+    >
+      <SearchIcon />
+    </a>
+  )}
 
   <LanguageSelectionMenu />
 
-  {
-    !!items.length && (
-      <Menu label="ln.header.open-main-menu">
-        <MenuIcon slot="icon" />
-        {items.map(({ labelText, href, isActive, isExternal }) => (
-          <MenuItem href={href} active={isActive}>
-            {labelText}
-            {isExternal && (
-              <ExternalLinkIcon
-                size="1.2rem"
-                className="shrink-0 rtl:scale-x-[-1]"
-              />
-            )}
-          </MenuItem>
-        ))}
-      </Menu>
-    )
-  }
+  {!!items.length && (
+    <Menu label="ln.header.open-main-menu">
+      <MenuIcon slot="icon" />
+      {items.map(({ labelText, href, isActive, isExternal }) => (
+        <MenuItem href={href} active={isActive}>
+          {labelText}
+          {isExternal && (
+            <ExternalLinkIcon
+              size="1.2rem"
+              className="shrink-0 rtl:scale-x-[-1]"
+            />
+          )}
+        </MenuItem>
+      ))}
+    </Menu>
+  )}
 </nav>
 <script>
   const initAdminButton = () => {

package/src/layouts/components/header/PageTitle.astro

@@ -31,23 +31,18 @@ const logoAlt = (() => {
   class="flex items-center gap-3 font-bold text-gray-600 md:text-lg"
   href={localizePath(currentLocale, "/")}
 >
-  {
-    logo &&
-      (logo.format === "svg" ? (
-        <img
-          src={logo.src}
-          alt={logoAlt}
-          style={`width:${getWidth(logo)}px;`}
-        />
-      ) : (
-        <Image
-          src={logo}
-          alt={logoAlt}
-          style={`width:${getWidth(logo)}px;`}
-          width={getWidth(logo)}
-          densities={[1.5, 2, 3]}
-          loading="eager"
-        />
-      ))
-  }{!config.logo?.replacesTitle && tConfigField(config.title, config)}</a
->
+  {logo &&
+    (logo.format === "svg" ? (
+      <img src={logo.src} alt={logoAlt} style={`width:${getWidth(logo)}px;`} />
+    ) : (
+      <Image
+        src={logo}
+        alt={logoAlt}
+        style={`width:${getWidth(logo)}px;`}
+        width={getWidth(logo)}
+        densities={[1.5, 2, 3]}
+        loading="eager"
+      />
+    ))}
+  {!config.logo?.replacesTitle && tConfigField(config.title, config)}
+</a>

package/src/layouts/components/meta/Favicon.astro

@@ -25,8 +25,6 @@ const favicons = config.favicon?.map((favicon) => {
 })
 ---
 
-{
-  favicons?.map(({ rel, type, href, sizes }) => (
-    <link rel={rel} type={type} href={href} sizes={sizes} />
-  ))
-}
+{favicons?.map(({ rel, type, href, sizes }) => (
+  <link rel={rel} type={type} href={href} sizes={sizes} />
+))}

package/src/layouts/components/meta/ViewTransition.astro

@@ -1,5 +1,4 @@
 ---
-
 ---
 
 <style is:global>

package/src/pages/404Route.astro

@@ -11,7 +11,8 @@ import { localizePath } from "../utils/paths"
     <a
       href={localizePath(Astro.locals.i18n.defaultLocale, "/")}
       class="rounded-2xl bg-gray-200 px-8 py-4 text-sm font-bold transition-colors ease-in-out hover:bg-gray-400"
-      >{Astro.locals.i18n.t("ln.404.go-to-the-home-page")}</a
     >
+      {Astro.locals.i18n.t("ln.404.go-to-the-home-page")}
+    </a>
   </div>
 </Page>

package/src/pages/details-page/DetailsPageRoute.astro

@@ -41,11 +41,9 @@ if (detailsPage?.layout === "custom") {
 }
 ---
 
-{
-  layout === "default" && (
-    <DefaultDetailsPage mediaId={mediaId} {...detailsPage} />
-  )
-}
+{layout === "default" && (
+  <DefaultDetailsPage mediaId={mediaId} {...detailsPage} />
+)}
 {layout === "video" && <VideoDetailsPage mediaId={mediaId} {...detailsPage} />}
 {layout === "audio" && <AudioDetailsPage mediaId={mediaId} {...detailsPage} />}
 {CustomDetails && <CustomDetails mediaId={mediaId} {...detailsPage} />}

package/src/pages/details-page/components/AudioPanel.astro

@@ -26,14 +26,12 @@ const content = item.data.content.map(({ url, label }) =>
   class:list={[className]}
   id="audio-panel"
 >
-  {
-    content.map((c) => (
-      <li>
-        {content.length > 1 && <div class="mb-3 font-bold">{c.labelText}</div>}
-        <AudioPlayer className="w-full" src={c.url} />
-      </li>
-    ))
-  }
+  {content.map((c) => (
+    <li>
+      {content.length > 1 && <div class="mb-3 font-bold">{c.labelText}</div>}
+      <AudioPlayer className="w-full" src={c.url} />
+    </li>
+  ))}
 </ol>
 <script>
   const audioPanel = document.getElementById("audio-panel")

package/src/pages/details-page/components/AudioPlayer.astro

@@ -15,38 +15,36 @@ const audioExtension = normalizedSrc.split("?")[0].split("#")[0].toLowerCase()
 const isMp3 = audioExtension.endsWith(".mp3")
 ---
 
-{
-  isMp3 ? (
-    <audio class="rounded-2xl" class:list={[className]} src={src} controls />
-  ) : (
-    <a
-      class="group flex w-full items-center gap-4 rounded-2xl border border-gray-200 bg-white px-4 py-4 shadow-sm transition hover:border-gray-300 hover:bg-gray-50 focus:outline-none focus-visible:ring-2 focus-visible:ring-gray-900/70"
-      class:list={[className]}
-      {...getLinkAttributes(src)}
-      aria-label={t("ln.external-link")}
-    >
-      <span class="flex h-12 w-12 items-center justify-center rounded-full border border-gray-700 text-gray-700 shadow-sm transition group-hover:scale-105">
-        <svg
-          class="h-6 w-6"
-          viewBox="0 0 24 24"
-          fill="currentColor"
-          aria-hidden="true"
-        >
-          <path d="M8 5v14l11-7z" />
-        </svg>
+{isMp3 ? (
+  <audio class="rounded-2xl" class:list={[className]} src={src} controls />
+) : (
+  <a
+    class="group flex w-full items-center gap-4 rounded-2xl border border-gray-200 bg-white px-4 py-4 shadow-sm transition hover:border-gray-300 hover:bg-gray-50 focus:outline-none focus-visible:ring-2 focus-visible:ring-gray-900/70"
+    class:list={[className]}
+    {...getLinkAttributes(src)}
+    aria-label={t("ln.external-link")}
+  >
+    <span class="flex h-12 w-12 items-center justify-center rounded-full border border-gray-700 text-gray-700 shadow-sm transition group-hover:scale-105">
+      <svg
+        class="h-6 w-6"
+        viewBox="0 0 24 24"
+        fill="currentColor"
+        aria-hidden="true"
+      >
+        <path d="M8 5v14l11-7z" />
+      </svg>
+    </span>
+    <div class="flex h-full grow flex-col gap-3">
+      <span class="flex items-center gap-2 font-semibold text-gray-900">
+        <ExternalLinkIcon className="shrink-0 rtl:scale-x-[-1]" />
+        {t("ln.external-link")}
       </span>
-      <div class="flex h-full grow flex-col gap-3">
-        <span class="flex items-center gap-2 font-semibold text-gray-900">
-          <ExternalLinkIcon className="shrink-0 rtl:scale-x-[-1]" />
-          {t("ln.external-link")}
-        </span>
-        <div class="h-2 w-full rounded-full bg-gray-200">
-          <div class="h-full w-2 rounded-full bg-gray-400" />
-        </div>
+      <div class="h-2 w-full rounded-full bg-gray-200">
+        <div class="h-full w-2 rounded-full bg-gray-400" />
       </div>
-    </a>
-  )
-}
+    </div>
+  </a>
+)}
 
 <style>
   audio::-webkit-media-controls-enclosure {

package/src/pages/details-page/components/ContentSection.astro

@@ -51,48 +51,44 @@ const typeIcons: Record<UrlType, LucideIcon> = {
 const iconDirectionClass = direction === "rtl" ? "scale-x-[-1]" : ""
 ---
 
-<ol
-  class="mx-auto mt-16 max-w-screen-md overflow-hidden bg-gray-200 md:mt-20 md:rounded-xl"
->
-  {
-    content.map(({ extension, labelText, type, isDownload, url }, index) => {
-      const TypeIcon = typeIcons[type]
+<ol class="mx-auto mt-16 max-w-screen-md overflow-hidden bg-gray-200 md:mt-20 md:rounded-xl">
+  {content.map(({ extension, labelText, type, isDownload, url }, index) => {
+    const TypeIcon = typeIcons[type]
 
-      return (
-        <li class="group -mt-px px-4 transition-colors ease-in-out hover:bg-gray-300 md:px-8">
-          <a
-            {...getLinkAttributes(url)}
-            class="flex items-center justify-between py-8"
-          >
-            <span class="flex h-10 w-10 shrink-0 items-center justify-center rounded-full bg-gray-800 text-gray-200">
-              <TypeIcon size="1.2rem" />
-            </span>
+    return (
+      <li class="group -mt-px px-4 transition-colors ease-in-out hover:bg-gray-300 md:px-8">
+        <a
+          {...getLinkAttributes(url)}
+          class="flex items-center justify-between py-8"
+        >
+          <span class="flex h-10 w-10 shrink-0 items-center justify-center rounded-full bg-gray-800 text-gray-200">
+            <TypeIcon size="1.2rem" />
+          </span>
 
-            <div class="ms-4 line-clamp-1 shrink grow overflow-hidden sm:ms-8">
-              {labelText}
-            </div>
-            <div class="me-4 ms-2 shrink-0 font-bold uppercase text-gray-600 sm:me-8">
-              {extension}
-            </div>
-            {isDownload ? (
-              <>
-                <DownloadIcon className="shrink-0 text-gray-600 group-hover:text-gray-800" />
-                <span class="sr-only">{t("ln.details.download")}</span>
-              </>
-            ) : (
-              <>
-                <ChevronRightIcon
-                  className={`shrink-0 text-gray-600 group-hover:text-gray-800 ${iconDirectionClass}`}
-                />
-                <span class="sr-only">{t("ln.details.open")}</span>
-              </>
-            )}
-          </a>
-          {index !== content.length - 1 && (
-            <div class="h-px w-full bg-gray-300" />
+          <div class="ms-4 line-clamp-1 shrink grow overflow-hidden sm:ms-8">
+            {labelText}
+          </div>
+          <div class="me-4 ms-2 shrink-0 font-bold uppercase text-gray-600 sm:me-8">
+            {extension}
+          </div>
+          {isDownload ? (
+            <>
+              <DownloadIcon className="shrink-0 text-gray-600 group-hover:text-gray-800" />
+              <span class="sr-only">{t("ln.details.download")}</span>
+            </>
+          ) : (
+            <>
+              <ChevronRightIcon
+                className={`shrink-0 text-gray-600 group-hover:text-gray-800 ${iconDirectionClass}`}
+              />
+              <span class="sr-only">{t("ln.details.open")}</span>
+            </>
           )}
-        </li>
-      )
-    })
-  }
+        </a>
+        {index !== content.length - 1 && (
+          <div class="h-px w-full bg-gray-300" />
+        )}
+      </li>
+    )
+  })}
 </ol>