From b6f70d29c947406a35c5863295ec5dc11d00c058 Mon Sep 17 00:00:00 2001
From: Vincent Taverna <vinnymac@gmail.com>
Date: Tue, 10 Feb 2026 19:23:44 -0500
Subject: [PATCH] fix: overlapping watermark with rotated labels

---
 app/components/Package/VersionDistribution.vue | 6 ++----
 app/composables/useChartWatermark.ts           | 2 +-
 2 files changed, 3 insertions(+), 5 deletions(-)

diff --git a/app/components/Package/VersionDistribution.vue b/app/components/Package/VersionDistribution.vue
index 1b94aaf57..b234b95a0 100644
--- a/app/components/Package/VersionDistribution.vue
+++ b/app/components/Package/VersionDistribution.vue
@@ -102,7 +102,7 @@ const chartConfig = computed(() => {
       padding: {
         top: 24,
         right: 24,
-        bottom: xAxisLabels.value.length > 10 ? 100 : 88, // Space for rotated labels + watermark
+        bottom: xAxisLabels.value.length > 10 ? 84 : 72, // Space for rotated labels + watermark
         left: isMobile.value ? 60 : 80,
       },
       userOptions: {
@@ -429,9 +429,7 @@ const endDate = computed(() => {
               <!-- Inject npmx logo & tagline during SVG and PNG print -->
               <g
                 v-if="svg.isPrintingSvg || svg.isPrintingImg"
-                v-html="
-                  drawNpmxLogoAndTaglineWatermark(svg, watermarkColors, $t, 'belowDrawingArea')
-                "
+                v-html="drawNpmxLogoAndTaglineWatermark(svg, watermarkColors, $t, 'bottom')"
               />
             </template>
 
diff --git a/app/composables/useChartWatermark.ts b/app/composables/useChartWatermark.ts
index 36c267ce1..0cad48d64 100644
--- a/app/composables/useChartWatermark.ts
+++ b/app/composables/useChartWatermark.ts
@@ -64,7 +64,7 @@ export function drawNpmxLogoAndTaglineWatermark(
   // Position watermark based on the positioning strategy
   const watermarkY =
     positioning === 'belowDrawingArea'
-      ? svg.drawingArea.top + svg.drawingArea.height + 48
+      ? svg.drawingArea.top + svg.drawingArea.height + 58
       : svg.height - npmxLogoHeight
 
   const taglineY =