@eox/pages-theme-eox 1.5.0 → 1.6.0

package/CHANGELOG.md

@@ -1,5 +1,22 @@
 # Changelog
 
+# [1.6.0](https://gitlab.eox.at/eox/hub/eoxhub-portal/compare/v1.5.1...v1.6.0) (2026-04-30)
+
+### Bug Fixes
+
+- **style:** link display in sidebar and footer ([766d4f4](https://gitlab.eox.at/eox/hub/eoxhub-portal/commit/766d4f40ec9a185c270211f40280848b90c32fe5))
+- **style:** more compact footer layout ([b190cb9](https://gitlab.eox.at/eox/hub/eoxhub-portal/commit/b190cb9038887ad19cffc2419aea93762aee98a2))
+
+### Features
+
+- custom CTAs in pricing table ([8900a3c](https://gitlab.eox.at/eox/hub/eoxhub-portal/commit/8900a3c148630e86ef84cf433b7d8008daeba8f5))
+
+## [1.5.1](https://gitlab.eox.at/eox/hub/eoxhub-portal/compare/v1.5.0...v1.5.1) (2026-04-30)
+
+### Bug Fixes
+
+- **style:** positioning of outline marker ([e6ce573](https://gitlab.eox.at/eox/hub/eoxhub-portal/commit/e6ce5731eabac08dbb8efa5593e8c34a7e75fcf1))
+
 # [1.5.0](https://gitlab.eox.at/eox/hub/eoxhub-portal/compare/v1.4.0...v1.5.0) (2026-04-28)
 
 ### Features

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@eox/pages-theme-eox",
-  "version": "1.5.0",
+  "version": "1.6.0",
   "type": "module",
   "description": "Vitepress Theme with EOX branding",
   "main": "src/index.js",

package/src/components/Footer.vue

@@ -3,32 +3,34 @@
     <div class="holder large-padding">
       <div class="large-space"></div>
       <div class="grid">
-        <div class="s12 l6">
-          <img
-            :src="withBase(theme.logo.light)"
-            :alt="`${site.title} logo`"
-            class="logo"
-          />
-          <div class="small-space"></div>
-          <a
-            v-if="theme.nav.find((i) => i.link && i.link.includes('contact'))"
-            :href="
-              theme.nav.find((i) => i.link && i.link.includes('contact')).link
-            "
-            class="button small border no-margin"
-            style="color: var(--on-surface)"
-            @click="trackEvent(['CTA', 'Click', 'Footer', action.text])"
-            >{{
-              theme.nav.find((i) => i.link && i.link.includes("contact")).text
-            }}</a
-          >
-          <p v-html="theme.footer.message"></p>
-          <p v-html="theme.footer.copyright"></p>
+        <div class="s12 l6 footer-info">
+          <div class="footer-info-content">
+            <img
+              :src="withBase(theme.logo.light)"
+              :alt="`${site.title} logo`"
+              class="logo"
+            />
+            <div class="small-space"></div>
+            <a
+              v-if="theme.nav.find((i) => i.link && i.link.includes('contact'))"
+              :href="
+                theme.nav.find((i) => i.link && i.link.includes('contact')).link
+              "
+              class="button small border no-margin"
+              style="color: var(--on-surface)"
+              @click="trackEvent(['CTA', 'Click', 'Footer', action.text])"
+              >{{
+                theme.nav.find((i) => i.link && i.link.includes("contact")).text
+              }}</a
+            >
+            <p v-html="theme.footer.message"></p>
+          </div>
+          <p class="footer-copyright" v-html="theme.footer.copyright"></p>
         </div>
         <div class="s12 l6">
-          <div class="grid large-line">
+          <div class="footer-columns">
             <div
-              class="s6 l4"
+              class="footer-column-item"
               v-if="theme.nav.filter((i) => !i.action && i.link).length"
             >
               <p class="bold">{{ t("About", theme.i18n) }}</p>
@@ -42,7 +44,10 @@
                 >
               </p>
             </div>
-            <div class="s6 l4" v-for="item in theme.nav.filter((i) => i.items)">
+            <div
+              class="footer-column-item"
+              v-for="item in theme.nav.filter((i) => i.items)"
+            >
               <p class="bold">{{ item.text }}</p>
               <p v-for="subItem in getFlatList(item.items)">
                 <a
@@ -54,7 +59,7 @@
                 >
               </p>
             </div>
-            <div class="s6 l4">
+            <div class="footer-column-item">
               <p class="bold">{{ t("Legal", theme.i18n) }}</p>
               <p>
                 <a
@@ -123,9 +128,66 @@ const termsLinks = computed(() => {
 </script>
 
 <style>
-@media screen and (max-width: 600px) {
-  footer > .holder > .grid > div:first-child {
+footer .grid > div:not(:first-child) p,
+.footer-column-item p {
+  margin: 0 !important;
+}
+
+footer .link {
+  text-decoration: none;
+}
+
+.footer-columns {
+  columns: 1;
+  column-gap: 2rem;
+}
+
+.footer-column-item {
+  break-inside: avoid;
+  margin-bottom: 2rem;
+}
+
+@media screen and (min-width: 601px) {
+  .footer-columns {
+    columns: 2;
+  }
+}
+
+@media screen and (min-width: 993px) {
+  .footer-columns {
+    columns: 3;
+  }
+}
+
+.footer-info {
+  display: flex;
+  flex-direction: column;
+  justify-content: space-between;
+}
+
+@media screen and (max-width: 992px) {
+  footer .grid {
+    display: flex;
+    flex-direction: column;
+  }
+  .footer-info {
+    order: -1;
+    margin-bottom: 0;
+    display: contents;
+  }
+  .footer-info-content {
+    order: -2;
+    margin-bottom: 2rem;
+  }
+  .footer-columns {
     order: 1;
   }
+  .footer-copyright {
+    order: 2;
+    margin-top: 2rem !important;
+  }
+}
+
+@media screen and (max-width: 600px) {
 }
 </style>

package/src/components/PricingTable.vue

@@ -48,7 +48,11 @@
             :href="addPlanConfig(contactLink, plan)"
             class="button responsive bold margin-top-1 margin-bottom-2"
           >
-            {{ t("Contact us", theme.i18n) }}
+            {{
+              plan.salesCTA
+                ? t(plan.salesCTA, theme.i18n)
+                : t("Contact us", theme.i18n)
+            }}
           </a>
         </ClientOnly>
       </div>
@@ -159,7 +163,7 @@
       <div v-if="showDescriptionColumn" class="cell orig-col-1 l"></div>
       <div
         v-for="(plan, index) in localPlans"
-        :key="'cta-' + index"
+        :key="'features-' + index"
         :class="`surface-container-low cell bottom-cell orig-col-${index + 2} center-align`"
       >
         <a v-if="plan.link" :href="plan.link"
@@ -181,7 +185,7 @@
       <div
         v-if="showSales"
         v-for="(plan, index) in localPlans"
-        :key="'cta-' + index"
+        :key="'sales-' + index"
         :class="`surface-container-low cell bottom-cell orig-col-${index + 2} center-align`"
       >
         <ClientOnly>
@@ -189,8 +193,13 @@
             v-if="showSales"
             :href="addPlanConfig(contactLink, plan)"
             class="button responsive bold"
-            >{{ t("Contact us", theme.i18n) }}</a
           >
+            {{
+              plan.salesCTA
+                ? t(plan.salesCTA, theme.i18n)
+                : t("Contact us", theme.i18n)
+            }}
+          </a>
         </ClientOnly>
       </div>
     </div>
@@ -357,13 +366,13 @@ export default {
       this.$forceUpdate();
     },
     initializeData() {
-      this.title = this.config.title ?? this.title;
-      this.showSales = this.config.showSales ?? this.showSales;
-      this.contactLink = this.config.contactLink ?? this.contactLink;
-      this.showVAT = this.config.showVAT ?? this.showVAT;
-      this.localOptions = this.config.options ?? this.localOptions;
-      this.localPlans = this.config.plans ?? this.localPlans;
-      this.localDetails = this.config.details ?? this.localDetails;
+      this.title = this.config.title ?? "Pricing Options";
+      this.showSales = this.config.showSales ?? true;
+      this.contactLink = this.config.contactLink ?? "";
+      this.showVAT = this.config.showVAT ?? "2025-06-30";
+      this.localOptions = this.config.options ?? [];
+      this.localPlans = this.config.plans ?? [];
+      this.localDetails = this.config.details ?? [];
     },
     handleResize() {
       if (typeof window !== "undefined") {
@@ -386,35 +395,52 @@ export default {
       }
     },
     addPlanConfig(contactLink, plan) {
-      if (typeof document === "undefined") {
-        return contactLink; // Return original link as fallback
+      const baseLink = plan.salesLink || contactLink;
+      if (!baseLink) {
+        return "";
       }
-      const parts = contactLink.split("?");
-      let search = parts[1] || "";
+
+      const [url, ...searchParts] = baseLink.split("?");
+      let search = searchParts.join("?");
       const params = new URLSearchParams(search);
-      params.append("plan", plan.name);
-      const alternative = Object.entries(plan.details).find(
-        ([key, value]) => value.alternative,
-      );
-      if (alternative) {
-        const checked = document.querySelector(
-          `[id='${plan.name}-${alternative[0]}']`,
-        )?.checked;
-        if (checked) {
-          params.append("alternative", alternative[1].alternative.name);
+
+      // Only automatically add "plan" if it's the default contact link
+      // and not already present
+      if (!plan.salesLink && !params.has("plan") && plan.name) {
+        params.append("plan", plan.name);
+      }
+
+      // Add alternatives if they are checked
+      if (plan.details) {
+        Object.entries(plan.details).forEach(([key, value]) => {
+          if (
+            value &&
+            typeof value === "object" &&
+            value.alternative?.checked
+          ) {
+            params.append("alternative", value.alternative.name);
+          }
+        });
+      }
+
+      // Add global options
+      if (this.localOptions && this.localOptions.length > 0) {
+        this.localOptions.forEach((o) => {
+          if (o.checked) {
+            params.append("option", o.label);
+          }
+        });
+      }
+
+      // Add custom salesParams
+      if (plan.salesParams) {
+        for (const [key, value] of Object.entries(plan.salesParams)) {
+          params.set(key, value);
         }
       }
-      if (this.localOptions.length > 0)
-        [
-          this.localOptions.forEach((o) => {
-            const checked = document.querySelector(`input#${o.id}`)?.checked;
-            if (checked) {
-              params.append("option", o.label);
-            }
-          }),
-        ];
+
       search = params.toString();
-      return `${parts[0]}${search ? `?${search}` : ""}`;
+      return `${url}${search ? `?${search}` : ""}`;
     },
   },
   created() {
@@ -431,19 +457,7 @@ export default {
     window.removeEventListener("resize", this.handleResize);
   },
   watch: {
-    options: {
-      handler() {
-        this.initializeData();
-      },
-      deep: true,
-    },
-    plans: {
-      handler() {
-        this.initializeData();
-      },
-      deep: true,
-    },
-    details: {
+    config: {
       handler() {
         this.initializeData();
       },

package/src/style.css

@@ -201,7 +201,7 @@ details[open] > summary > i.mdi-chevron-down {
   top: var(--vp-nav-height) !important;
   padding-top: 0 !important;
   padding-left: 0 !important;
-  margin-top: -2px;
+  margin-top: -2px !important;
 }
 
 .VPSidebar > nav,
@@ -238,6 +238,11 @@ details[open] > summary > i.mdi-chevron-down {
   padding: 3px 0 !important;
   font-size: 14px;
   line-height: 20px;
+  text-decoration: none;
+}
+
+.VPSidebar .VPLink p {
+  margin: 0;
 }
 
 .social-links {
@@ -269,6 +274,43 @@ details[open] > summary > i.mdi-chevron-down {
   list-style: none;
 }
 
+/* VPDocAsideOutline Fixes */
+.VPDocAsideOutline ul {
+  display: block !important;
+  list-style: none !important;
+  margin: 0 !important;
+  padding: 0 !important;
+}
+
+.VPDocAsideOutline li {
+  list-style: none !important;
+  position: static !important;
+  margin: 0 !important;
+  padding: 0 !important;
+}
+
+.VPDocAsideOutline .outline-link {
+  display: block !important;
+  line-height: 32px !important;
+  font-size: 14px !important;
+}
+
+.VPDocAsideOutline .outline-marker {
+  width: 2px !important;
+  height: 18px !important;
+  transition:
+    top 0.25s cubic-bezier(0, 1, 0.5, 1),
+    background-color 0.5s,
+    opacity 0.25s !important;
+}
+
+.VPDocAsideOutline .outline-title {
+  display: block !important;
+  line-height: 32px !important;
+  font-size: 14px !important;
+  font-weight: 600 !important;
+}
+
 /* Doc layout fixes */
 .Layout.layout-doc .content-container,
 .VPDocFooter {