@ansidev-oss/vitepress-theme-ansidev 1.0.12 → 1.1.0

package/src/client/styles/blog.css

@@ -0,0 +1,352 @@
+:root {
+  --vp-font-family-base: 'Inter', ui-sans-serif, system-ui, sans-serif;
+  --vp-font-family-mono: 'JetBrains Mono', ui-monospace, SFMono-Regular, Menlo, monospace;
+  /* Light palette, based on Dracula's Alucard variant */
+  --accent: #644ac9;
+  --accent-soft: #8668e0;
+  --green: #14710a;
+  --vp-c-bg: #fffbeb;
+  --vp-c-bg-alt: #f5f1df;
+  --vp-c-bg-elv: #ece8d3;
+  --vp-c-bg-soft: #f7f3e1;
+  --vp-c-divider: #d9d4bb;
+  --vp-c-gutter: #f5f1df;
+  --vp-c-text-1: #1f1f1f;
+  --vp-c-text-2: #4b4b52;
+  --vp-c-text-3: #6c664b;
+  --vp-c-brand-1: #644ac9;
+  --vp-c-brand-2: #7459d8;
+  --vp-c-brand-3: #644ac9;
+  --vp-c-brand-soft: rgba(100, 74, 201, 0.12);
+  /* theme utilities (link-alt, link) read these Tailwind variables with !important */
+  --color-primary: #644ac9;
+  --color-primary-alt: #4f39a8;
+  --color-primary-alt-dark: #8668e0;
+  --color-secondary: #3b2a8a;
+  --color-secondary-dark: #3b2a8a;
+  /* "Active" status badge: bg-green-100 / text-green-800 in light, swapped in dark */
+  --color-green-100: #d4f2cf;
+  --color-green-800: #14710a;
+}
+
+/* Dracula-inspired dark palette */
+.dark {
+  --accent: #bd93f9;
+  --accent-soft: #d6bcfa;
+  --green: #50fa7b;
+  --color-primary: #9d6ff0;
+  --color-primary-alt: #8a5cd8;
+  --color-primary-alt-dark: #d6bcfa;
+  --color-secondary: #f8f8f2;
+  --color-secondary-dark: #f8f8f2;
+  --color-green-100: #50fa7b;
+  --color-green-800: #1f4d33;
+  --vp-c-bg: #282a36;
+  --vp-c-bg-alt: #21222c;
+  --vp-c-bg-elv: #343746;
+  --vp-c-bg-soft: #2f3241;
+  --vp-c-divider: #44475a;
+  --vp-c-gutter: #21222c;
+  --vp-c-text-1: #f8f8f2;
+  --vp-c-text-2: #b6b8c9;
+  --vp-c-text-3: #8e94b3;
+  --vp-c-brand-1: var(--accent);
+  --vp-c-brand-2: var(--accent);
+  --vp-c-brand-3: #9d6ff0;
+  --vp-c-brand-soft: rgba(189, 147, 249, 0.16);
+}
+
+body {
+  letter-spacing: -0.005em;
+}
+
+/* Nav */
+.VPNav .VPNavBar,
+.VPNavBar .content-body {
+  backdrop-filter: saturate(180%) blur(12px);
+}
+.VPNavBar:not(.has-sidebar):not(.home.top) {
+  background-color: rgba(255, 251, 235, 0.85);
+}
+.dark .VPNavBar:not(.has-sidebar):not(.home.top) {
+  background-color: rgba(40, 42, 54, 0.8);
+}
+
+/* Cards (post list, project cards, term chips) */
+.component-border {
+  background: var(--vp-c-bg-soft);
+  border: 1px solid var(--vp-c-divider);
+  border-radius: 0;
+  transition: border-color 0.2s ease, box-shadow 0.2s ease, background-color 0.2s ease;
+}
+.component-border:hover,
+.component-border:focus-within {
+  border-color: color-mix(in srgb, var(--accent) 55%, transparent);
+  background: linear-gradient(180deg, color-mix(in srgb, var(--accent) 7%, var(--vp-c-bg-soft)), var(--vp-c-bg-soft));
+  box-shadow: 0 0 0 1px color-mix(in srgb, var(--accent) 18%, transparent), 0 8px 30px -12px color-mix(in srgb, var(--accent) 45%, transparent);
+}
+
+/* Titles inside cards: neutral text, accent on hover */
+.component-border > .pl-8 a.text-2xl,
+.component-border a.text-2xl {
+  color: var(--vp-c-text-1);
+  font-weight: 600;
+  letter-spacing: -0.02em;
+}
+/* Card hover only glows; the link itself gets its own hover/pressed feedback */
+.component-border a.text-2xl {
+  transition: color 0.15s ease, text-shadow 0.15s ease;
+}
+.component-border a.text-2xl:hover {
+  color: var(--accent);
+  text-shadow: 0 0 18px color-mix(in srgb, var(--accent) 45%, transparent);
+}
+.component-border a.text-2xl:active {
+  color: var(--accent-soft);
+  text-shadow: none;
+}
+
+/* Date block: mono, muted */
+.component-border .text-6xl {
+  font-family: var(--vp-font-family-mono);
+  font-weight: 500;
+  color: var(--vp-c-text-1);
+  font-size: 2.5rem;
+  line-height: 1;
+}
+
+/* Category / tech chips as pills */
+a.link-alt.uppercase,
+.component-border a.uppercase {
+  display: inline-block;
+  padding: 2px 10px;
+  margin-bottom: 4px;
+  border-radius: 0;
+  border: 1px solid var(--vp-c-divider);
+  background: var(--vp-c-bg-elv);
+  font-size: 0.7rem;
+  font-weight: 500;
+  letter-spacing: 0.04em;
+  transition: border-color 0.2s ease;
+}
+a.link-alt.uppercase:hover {
+  border-color: var(--accent);
+  background: color-mix(in srgb, var(--accent) 16%, var(--vp-c-bg-elv));
+}
+a.link-alt.uppercase:active {
+  background: color-mix(in srgb, var(--accent) 30%, var(--vp-c-bg-elv));
+  transform: translateY(1px);
+}
+
+/* Technology filter buttons on /projects */
+a.component-border {
+  border-radius: 0;
+}
+
+/* Links in content */
+.vp-doc a,
+.vp-doc a:hover {
+  color: var(--vp-c-brand-1);
+  text-decoration: none;
+  font-weight: 500;
+}
+.vp-doc a:hover {
+  color: var(--vp-c-brand-2);
+}
+
+/* No underlines on any link (VitePress adds one to .vp-doc a via its own rules) */
+a,
+a:hover,
+.vp-doc a,
+.vp-doc a:hover,
+.vp-doc .header-anchor {
+  text-decoration: none !important;
+}
+
+/* Post typography */
+.vp-doc h1 {
+  letter-spacing: -0.03em;
+  font-weight: 700;
+}
+.vp-doc h2 {
+  letter-spacing: -0.02em;
+  border-top-color: var(--vp-c-divider);
+}
+.vp-doc p,
+.vp-doc li {
+  line-height: 1.75;
+}
+.vp-doc :not(pre) > code {
+  color: var(--green);
+  font-family: var(--vp-font-family-mono);
+  font-size: 0.85em;
+  border: 1px solid var(--vp-c-divider);
+  border-radius: 0;
+}
+.vp-doc div[class*='language-'] {
+  border: 1px solid var(--vp-c-divider);
+  border-radius: 0;
+}
+
+/* Focus visibility */
+a:focus-visible,
+button:focus-visible {
+  outline: 2px solid var(--accent);
+  outline-offset: 2px;
+  border-radius: 0;
+}
+
+/* Home hero */
+.home-hero {
+  padding: 56px 0 8px;
+}
+.home-hero h1 {
+  margin: 0;
+  font-size: clamp(2rem, 5vw, 3.25rem);
+  line-height: 1.1;
+  font-weight: 700;
+  letter-spacing: -0.04em;
+}
+.home-hero h1 span {
+  background: linear-gradient(90deg, var(--vp-c-text-1), var(--accent-soft) 70%, var(--accent));
+  -webkit-background-clip: text;
+  background-clip: text;
+  color: transparent;
+}
+.home-hero p {
+  margin: 16px 0 0;
+  max-width: 36rem;
+  color: var(--vp-c-text-2);
+  font-size: 1.1rem;
+  line-height: 1.6;
+}
+
+@media (prefers-reduced-motion: reduce) {
+  .component-border,
+  a.link-alt.uppercase {
+    transition: none;
+  }
+}
+
+/* Square corners everywhere (theme uses Tailwind rounded-* utilities) */
+[class*='rounded'],
+.VPNavBarSearchButton,
+.vp-doc [class*='language-'],
+.vp-doc :not(pre) > code,
+.vp-doc img,
+.vp-doc table,
+.custom-block,
+.VPLocalSearchBox .results .result,
+.VPSkipLink,
+.keys,
+button.copy,
+.VPSwitch,
+.VPSwitch .check {
+  border-radius: 0 !important;
+}
+
+/* Technology filter buttons on /projects: roomier horizontal padding */
+p.flex.flex-wrap > a.border.m-1 {
+  padding: 0.25rem 0.875rem;
+  margin: 0.25rem;
+  transition: border-color 0.15s ease, background-color 0.15s ease;
+}
+p.flex.flex-wrap > a.border.m-1:hover {
+  border-color: var(--accent);
+  background-color: color-mix(in srgb, var(--accent) 14%, transparent);
+}
+
+/* Mobile */
+@media (max-width: 639px) {
+  /* Post cards: stack the date above the title instead of a fixed 80px side column */
+  .component-border.flex:has(> .text-center) {
+    flex-direction: column;
+  }
+  .component-border > .text-center {
+    min-width: 0 !important;
+    display: flex;
+    align-items: baseline;
+    gap: 0.5rem;
+    text-align: left;
+    margin-bottom: 0.5rem;
+  }
+  .component-border > .text-center .text-6xl {
+    font-size: 1.75rem;
+  }
+  .component-border > .pl-8 {
+    padding-left: 0;
+  }
+
+  /* Technology filter: one horizontally scrollable row instead of 40 wrapped buttons */
+  p.flex.flex-wrap:has(> a.border.m-1) {
+    flex-wrap: nowrap;
+    overflow-x: auto;
+    -webkit-overflow-scrolling: touch;
+    scrollbar-width: none;
+    margin-inline: -0.25rem;
+    padding-bottom: 0.25rem;
+  }
+  p.flex.flex-wrap:has(> a.border.m-1)::-webkit-scrollbar {
+    display: none;
+  }
+  p.flex.flex-wrap > a.border.m-1 {
+    flex: 0 0 auto;
+    white-space: nowrap;
+    min-height: 2.25rem;
+    display: inline-flex;
+    align-items: center;
+  }
+
+  /* Tighter gap under page headings (theme adds pt-6 pb-8 + mb-6) */
+  div.pt-6.pb-8 {
+    padding-top: 0.75rem;
+    padding-bottom: 0.5rem;
+  }
+  div.pt-6.pb-8 > h1.mb-6 {
+    margin-bottom: 0.75rem;
+  }
+
+  /* Larger tap targets for category / tech chips */
+  a.link-alt.uppercase,
+  .component-border a.uppercase {
+    padding: 6px 12px;
+    margin-bottom: 6px;
+  }
+}
+
+/* Donation buttons: equal-size slots, even spacing. The theme sets img width/height
+   inline with !important and uses space-y-4 (sidebar) or space-x-4 (home page, wraps
+   unevenly), so reset its margins and size the link box instead. */
+div.flex.flex-wrap.py-4.items-center.justify-center:has(> a[href*='ko-fi.com']) {
+  gap: 12px;
+}
+div.flex.flex-wrap.py-4.items-center.justify-center:has(> a[href*='ko-fi.com']) > a {
+  margin: 0 !important;
+  width: 200px;
+  height: 56px;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+}
+div.flex.flex-wrap.py-4.items-center.justify-center:has(> a[href*='ko-fi.com']) > a img {
+  max-width: 100%;
+  max-height: 100%;
+  object-fit: contain;
+}
+/* Sidebar variant: single column */
+div.flex.flex-wrap.py-4.items-center.justify-center.space-y-4:has(> a[href*='ko-fi.com']) {
+  flex-direction: column;
+  flex-wrap: nowrap;
+}
+
+/* Footer variant (home page): 2x2 grid of equal slots */
+div.flex.flex-wrap.py-4.items-center.justify-center.space-x-4:has(> a[href*='ko-fi.com']) {
+  display: grid;
+  grid-template-columns: repeat(2, 168px);
+  justify-content: center;
+  gap: 12px;
+}
+div.flex.flex-wrap.py-4.items-center.justify-center.space-x-4:has(> a[href*='ko-fi.com']) > a {
+  width: 168px;
+  height: 52px;
+}

package/src/client/styles/index.css

@@ -1,30 +1,3 @@
-@import "tailwindcss";
-@variant dark (&:where(.dark, .dark *));
-
-@theme {
-  --color-primary: rgb(59, 130, 246);
-  --color-primary-alt: rgb(29, 78, 216);
-  --color-primary-alt-dark: rgb(147, 197, 253);
-  --color-secondary: rgb(239, 68, 68);
-  --color-secondary-dark: rgb(234, 179, 8);
-}
-
-@utility component-border {
-  @apply border rounded-md border-gray-500 hover:border-secondary dark:hover:border-secondary-dark;
-}
-
-@utility link {
-  @apply no-underline hover:text-secondary dark:hover:text-secondary-dark;
-}
-
-@utility link-alt {
-  @apply text-primary-alt! dark:text-primary-alt-dark! link!;
-}
-
-:root {
-  --vp-c-brand-1: var(--color-primary);
-}
-
-.vp-doc a {
-  @apply link;
-}
+@import url("https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&family=JetBrains+Mono:wght@400;500&display=swap");
+@import "./base.css";
+@import "./blog.css";

package/src/vite-env.d.ts

@@ -2,6 +2,7 @@
 
 declare module '*.vue' {
   import type { Component } from 'vue'
+
   const component: Component
   export default component
 }

package/dist/client/Donation-D9Xn0MPt.js

@@ -1,76 +0,0 @@
-import { defineComponent as c, computed as d, openBlock as r, createElementBlock as l, createElementVNode as p, normalizeStyle as u, Fragment as f, renderList as g, createBlock as h, mergeProps as B } from "vue";
-const _ = {
-  buymeacoffee: {
-    donationBaseUrl: "https://buymeacoffee.com",
-    donationButtonImage: "https://cdn.buymeacoffee.com/buttons/v2/default-yellow.png",
-    donationButtonStyle: {
-      height: "60px !important",
-      width: "217px !important"
-    }
-  },
-  kofi: {
-    donationBaseUrl: "https://ko-fi.com",
-    donationButtonImage: "https://storage.ko-fi.com/cdn/brandasset/kofi_bg_tag_white.png",
-    donationButtonStyle: {
-      height: "60px !important"
-    }
-  },
-  paypal: {
-    donationBaseUrl: "https://paypal.me",
-    donationButtonImage: "https://paypalobjects.com/en_US/i/btn/btn_donateCC_LG.gif"
-  }
-}, y = ["href"], b = ["src", "alt"], k = /* @__PURE__ */ c({
-  __name: "DonationButton",
-  props: {
-    donationPlatform: {},
-    donationId: {},
-    donationBaseUrl: {},
-    donationButtonImage: {},
-    donationButtonStyle: {}
-  },
-  setup(t) {
-    const i = t, o = d(() => new URL(i.donationId, i.donationBaseUrl).toString());
-    return (s, e) => (r(), l("a", {
-      href: o.value,
-      target: "_blank"
-    }, [
-      p("img", {
-        src: t.donationButtonImage,
-        alt: t.donationPlatform,
-        style: u(t.donationButtonStyle)
-      }, null, 12, b)
-    ], 8, y));
-  }
-}), U = /* @__PURE__ */ c({
-  __name: "Donation",
-  props: {
-    donation: {}
-  },
-  setup(t) {
-    const o = t.donation, s = d(() => {
-      const e = {};
-      for (const n in o) {
-        if (n === "custom")
-          continue;
-        const a = o[n];
-        e[n] = {
-          ..._[n],
-          donationId: a
-        };
-      }
-      return {
-        ...e,
-        ...o.custom
-      };
-    });
-    return (e, n) => (r(!0), l(f, null, g(s.value, (a, m) => (r(), h(k, B({
-      key: a?.name,
-      ref_for: !0
-    }, a, {
-      "donation-platform": m
-    }), null, 16, ["donation-platform"]))), 128));
-  }
-});
-export {
-  U as default
-};

package/dist/client/GoogleAnalytics-Dp3EGn1x.js

@@ -1,29 +0,0 @@
-import { defineComponent as c, onMounted as r } from "vue";
-const g = /* @__PURE__ */ c({
-  __name: "GoogleAnalytics",
-  props: {
-    googleAnalytics: {}
-  },
-  setup(o) {
-    const e = o.googleAnalytics;
-    let a = !1;
-    function i() {
-      if (!(window.dataLayer && window.gtag) && !a) {
-        a = !0;
-        const t = document.createElement("script");
-        t.src = `https://www.googletagmanager.com/gtag/js?id=${e.id}`, t.async = !0, document.head.appendChild(t);
-        const n = document.createElement("script");
-        n.textContent = `
-  window.dataLayer = window.dataLayer || [];
-  function gtag(){dataLayer.push(arguments);}
-  gtag('js', new Date());
-  gtag('config', '${e.id}');
-`, document.head.appendChild(n);
-      }
-    }
-    return e && r(i), (t, n) => null;
-  }
-});
-export {
-  g as default
-};

package/dist/client/Sharing-ZrU7YF-x.js

@@ -1,190 +0,0 @@
-import { defineComponent as h, computed as a, openBlock as l, createElementBlock as u, createBlock as b, unref as z, createCommentVNode as m, Fragment as w, createTextVNode as B, toDisplayString as y, normalizeClass as p, createElementVNode as v, renderList as U } from "vue";
-import { useData as L } from "vitepress";
-import { Icon as R } from "@iconify/vue";
-const _ = (s) => {
-  if (!s)
-    return "";
-  const t = encodeURIComponent, r = Object.keys(s);
-  return r.length < 1 ? "" : `?${r.filter((e) => s[e] !== void 0).map((e) => `${t(e)}=${t(s[e])}`).join("&")}`;
-}, P = ["href", "aria-label"], M = /* @__PURE__ */ h({
-  __name: "SharingButton",
-  props: {
-    url: {},
-    text: {},
-    network: {},
-    buttonSize: {},
-    iconStyle: {},
-    iconSize: { default: 32 },
-    displayMode: { default: "icon" }
-  },
-  setup(s) {
-    const t = s, r = a(() => {
-      switch (t.network) {
-        case "email":
-          return {
-            name: "E-mail",
-            shareBaseURL: "mailto:",
-            icon: "bi:envelope-fill",
-            params: { subject: t.text, body: t.url },
-            allowedParams: ["subject", "body"]
-          };
-        case "facebook":
-          return {
-            name: "Facebook",
-            shareBaseURL: "https://facebook.com/sharer/sharer.php",
-            icon: "bi:facebook",
-            params: { u: t.url },
-            allowedParams: ["u", "display", "redirect_uri"]
-          };
-        case "linkedin":
-          return {
-            name: "LinkedIn",
-            shareBaseURL: "https://www.linkedin.com/sharing/share-offsite",
-            icon: "bi:linkedin",
-            params: { url: t.url },
-            allowedParams: ["url"]
-          };
-        case "pinterest":
-          return {
-            name: "Pinterest",
-            shareBaseURL: "https://pinterest.com/pin/create/button",
-            icon: "bi:pinterest",
-            params: { posttype: "link", title: t.text, url: t.url },
-            allowedParams: ["posttype", "tags", "title", "content", "caption", "show-via", "canonicalUrl"]
-          };
-        case "reddit":
-          return {
-            name: "Reddit",
-            shareBaseURL: "https://www.reddit.com/submit",
-            icon: "bi:reddit",
-            params: { title: t.text, url: t.url },
-            allowedParams: ["title", "url"]
-          };
-        case "telegram":
-          return {
-            name: "Telegram",
-            shareBaseURL: "https://telegram.me/share/url",
-            icon: "bi:telegram",
-            params: { text: t.text, url: t.url },
-            allowedParams: ["text", "url"]
-          };
-        // case 'tumblr':
-        //   return {
-        //     name: 'Tumblr',
-        //     shareBaseURL: 'https://www.tumblr.com/widgets/share/tool',
-        //     icon: 'bi:tumblr',
-        //     params: { posttype: 'link', title: props.text, url: props.url },
-        //     allowedParams: ['posttype', 'tags', 'title', 'content', 'caption', 'show-via', 'canonicalUrl'],
-        //   }
-        case "twitter":
-          return {
-            name: "Twitter",
-            shareBaseURL: "https://twitter.com/intent/tweet",
-            icon: "bi:twitter",
-            params: { text: t.text, url: t.url },
-            allowedParams: ["text", "url", "hashtag", "via"]
-          };
-        // case 'vk':
-        //   return {
-        //     name: 'VK',
-        //     shareBaseURL: 'https://vk.com/share.php',
-        //     icon: 'vk-icon',
-        //     params: { title: props.text, url: props.url },
-        //     allowedParams: ['title', 'url'],
-        //   }
-        case "whatsapp":
-          return {
-            name: "WhatsApp",
-            shareBaseURL: "whatsapp://send",
-            icon: "bi:whatsapp",
-            params: { text: t.url },
-            allowedParams: ["text"]
-          };
-        default:
-          return {};
-      }
-    }), n = a(() => r.value.name), e = a(() => r.value.icon), c = a(() => {
-      const o = r.value.shareBaseURL, i = _(r.value.params);
-      return `${o}${i}`;
-    });
-    return (o, i) => (l(), u("a", {
-      href: c.value,
-      target: "_blank",
-      rel: "noopener",
-      "aria-label": n.value,
-      style: { "padding-left": "0.25rem", "padding-right": "0.25rem" }
-    }, [
-      ["icon", "both"].includes(t.displayMode) ? (l(), b(z(R), {
-        key: 0,
-        icon: e.value,
-        width: s.iconSize,
-        height: s.iconSize,
-        class: "fill-current text-gray-700 dark:text-gray-200 hover:text-blue-500 dark:hover:text-blue-400"
-      }, null, 8, ["icon", "width", "height"])) : m("", !0),
-      ["text", "both"].includes(t.displayMode) ? (l(), u(w, { key: 1 }, [
-        B(" " + y(n.value), 1)
-      ], 64)) : m("", !0)
-    ], 8, P));
-  }
-}), E = /* @__PURE__ */ h({
-  __name: "Sharing",
-  props: {
-    url: {},
-    text: {}
-  },
-  setup(s) {
-    const t = {
-      wrapperCssClass: "pl-4 py-4",
-      titleCssClass: "text-sm/[32px] font-semibold mb-2",
-      buttonCssClass: "flex flex-wrap space-x-1",
-      title: "Share",
-      networks: ["email", "facebook", "twitter", "telegram", "reddit", "linkedin", "whatsapp", "pinterest", "tumblr", "vk"],
-      buttonSize: 18,
-      iconSize: 20,
-      iconStyle: "solid",
-      displayMode: "both"
-    }, r = s, { theme: n } = L(), e = a(() => n.value.sharing || !1), c = a(
-      () => e.value && typeof e.value.wrapperCssClass == "string" ? e.value.wrapperCssClass : t.wrapperCssClass
-    ), o = a(
-      () => e.value && typeof e.value.title == "string" ? e.value.title : t.title
-    ), i = a(
-      () => e.value && typeof e.value.titleCssClass == "string" ? e.value.titleCssClass : t.titleCssClass
-    ), f = a(
-      () => e.value && typeof e.value.buttonCssClass == "string" ? e.value.buttonCssClass : t.buttonCssClass
-    ), C = a(
-      () => e.value && Array.isArray(e.value.networks) ? e.value.networks : t.networks
-    ), g = a(
-      () => e.value && Number.isInteger(e.value.buttonSize) && e.value.buttonSize > 0 ? e.value.buttonSize : t.buttonSize
-    ), k = a(
-      () => e.value && Number.isInteger(e.value.iconSize) && e.value.iconSize > 0 ? e.value.iconSize : t.iconSize
-    ), x = a(
-      () => e.value && typeof e.value.iconStyle == "string" ? e.value.iconStyle : t.iconStyle
-    ), S = a(
-      () => e.value && typeof e.value.displayMode == "string" ? e.value.displayMode : t.displayMode
-    );
-    return (I, N) => (l(), u("div", {
-      class: p(c.value)
-    }, [
-      v("p", {
-        class: p(i.value)
-      }, y(o.value), 3),
-      v("div", {
-        class: p(f.value)
-      }, [
-        (l(!0), u(w, null, U(C.value, (d) => (l(), b(M, {
-          key: d,
-          url: r.url,
-          text: r.text,
-          network: d,
-          "button-size": g.value,
-          "icon-size": k.value,
-          "icon-style": x.value,
-          "display-mode": S.value
-        }, null, 8, ["url", "text", "network", "button-size", "icon-size", "icon-style", "display-mode"]))), 128))
-      ], 2)
-    ], 2));
-  }
-});
-export {
-  E as default
-};