Update buttons on landing page#864
Conversation
Signed-off-by: Bozhidara Hristova <bozhidara.hristova@sap.com>
Signed-off-by: Bozhidara Hristova <bozhidara.hristova@sap.com>
📝 WalkthroughWalkthroughChanges promote the "Podrick and the Infinite Garden" story and update landing page navigation. Demo navigation entry removed from header config, homepage button text and link updated to highlight the Podrick story, CSS styling added for the Podrick button, and subtitle added to the story documentation. Changes
Estimated code review effort🎯 2 (Simple) | ⏱️ ~8 minutes Poem
🚥 Pre-merge checks | ✅ 5✅ Passed checks (5 passed)
✏️ Tip: You can configure your own custom pre-merge checks in the settings. ✨ Finishing Touches
🧪 Generate unit tests (beta)
Comment |
🧹 Preview RemovedThe preview for this PR is no longer available since the PR has been closed. |
There was a problem hiding this comment.
Actionable comments posted: 1
🤖 Prompt for all review comments with AI agents
Verify each finding against the current code and only fix it if needed.
Inline comments:
In @.vitepress/theme/style.css:
- Around line 76-93: The CSS uses background-image: url('/podrick.png') in the
.VPButton.alt[href*="podrick"] and .VPButton.alt[href*="podrick"]::after
selectors which won't resolve because the asset lives at
website/public/podrick.png and will be emitted to hugo/public/podrick.png; fix
by either setting VitePress's publicDir to point to that output (add publicDir:
'hugo/public' in your VitePress config) or change the CSS to use a path that
matches the built asset location (e.g., a relative path that resolves to
hugo/public/podrick.png or the site root where the asset is served).
| .VPButton.alt[href*="podrick"]::after { | ||
| content: ''; | ||
| display: inline-block; | ||
| width: 35px; | ||
| height: 35px; | ||
| margin-left: 8px; | ||
| margin-right: -4px; | ||
| background-image: url('/podrick.png'); | ||
| background-size: contain; | ||
| background-repeat: no-repeat; | ||
| background-position: center; | ||
| vertical-align: middle; | ||
| } | ||
|
|
||
| .VPButton.alt[href*="podrick"] { | ||
| display: inline-flex; | ||
| align-items: center; | ||
| } |
There was a problem hiding this comment.
🧩 Analysis chain
🏁 Script executed:
#!/bin/bash
# Search for podrick.png in the repository
fd -t f "podrick.png"
# Also check common VitePress public directories
echo "--- Checking common public directories ---"
ls -la website/public/podrick.png 2>/dev/null || echo "Not found in website/public/"
ls -la public/podrick.png 2>/dev/null || echo "Not found in public/"
ls -la .vitepress/public/podrick.png 2>/dev/null || echo "Not found in .vitepress/public/"Repository: gardener/documentation
Length of output: 266
🏁 Script executed:
#!/bin/bash
# Find VitePress config files
fd -t f "config\." .vitepress/
# Check directory structure - where is the VitePress root?
echo "--- Repository structure ---"
ls -la | head -20
# Check if website/ is meant to be the VitePress root
echo "--- website/ directory ---"
ls -la website/
# Look for any VitePress config that might define public paths
echo "--- VitePress config.js/ts content ---"
cat .vitepress/config.* 2>/dev/null | head -50Repository: gardener/documentation
Length of output: 4073
🏁 Script executed:
#!/bin/bash
# Read the complete config file
cat .vitepress/config.mts
# Also check if there's a root public directory
echo "--- Root public directory ---"
ls -la public/ 2>/dev/null || echo "No public/ at root"Repository: gardener/documentation
Length of output: 17851
🏁 Script executed:
#!/bin/bash
# List contents of website/public/
ls -la website/public/
# Check if there's any build or configuration that copies website/public to a root public directory
echo "--- Checking Makefile for build processes ---"
grep -A 5 -B 5 "public" Makefile || echo "No public-related entries"
# Check if there's a Dockerfile that might handle this
echo "--- Checking Dockerfile ---"
cat Dockerfile | grep -A 5 -B 5 "public" || echo "No public references"Repository: gardener/documentation
Length of output: 1803
🏁 Script executed:
#!/bin/bash
# Check for symlinks
echo "--- Checking for symlinks ---"
ls -la | grep "public"
# Check git status for any symlinks in the repo
echo "--- Git ls-files for public directories ---"
git ls-files | grep "public" | head -20
# Check if website/public is a git submodule
echo "--- Git submodule configuration ---"
cat .gitmodules 2>/dev/null || echo "No .gitmodules file"
# Check CI/CD workflows
echo "--- GitHub workflows ---"
find .github -name "*.yml" -o -name "*.yaml" | xargs grep -l "public\|vitepress\|build" 2>/dev/null | head -5Repository: gardener/documentation
Length of output: 1089
🏁 Script executed:
#!/bin/bash
# Check the deploy workflow
echo "--- deploy-github-pages.yaml ---"
cat .github/workflows/deploy-github-pages.yaml
# Also check PR preview
echo -e "\n--- pr-preview.yaml ---"
cat .github/workflows/pr-preview.yamlRepository: gardener/documentation
Length of output: 14584
🏁 Script executed:
#!/bin/bash
# Check Makefile for ci-build and build targets
echo "--- Makefile ci-build and build targets ---"
grep -A 10 "^ci-build:\|^build:" Makefile
# Check if there's a vite.config.ts or similar that might configure publicDir
echo -e "\n--- Looking for vite config files ---"
fd -t f "vite\.config\." .vitepress/
# Check .vitepress directory for any additional config
echo -e "\n--- .vitepress directory structure ---"
find .vitepress -type f -name "*.ts" -o -name "*.js" -o -name "*.mts" -o -name "*.mjs" | head -20Repository: gardener/documentation
Length of output: 958
🏁 Script executed:
#!/bin/bash
# Check Makefile for post-process target
echo "--- Makefile post-process target ---"
grep -A 5 "^post-process:" Makefile
# Look for post-processing scripts
echo -e "\n--- Post-processing scripts ---"
find . -name "*post*process*" -o -name "post-*.js" -o -name "post-*.ts" 2>/dev/null | head -20
# Check if there's a public symlink or mount
echo -e "\n--- Checking for public symlink in .vitepress ---"
ls -la .vitepress/ | grep -E "public|link"Repository: gardener/documentation
Length of output: 386
🏁 Script executed:
#!/bin/bash
# List post-processing scripts
echo "--- Post-processing directory contents ---"
ls -la post-processing/
# Check post-processing scripts for public directory handling
echo -e "\n--- Searching for 'public' in post-processing scripts ---"
rg "public" post-processing/ 2>/dev/null | head -20
# Also check if there's a symlink created during build
echo -e "\n--- Checking main post-processing script ---"
head -50 post-processing/part-1.js 2>/dev/null || head -50 post-processing/part-1.sh 2>/dev/null || ls post-processing/Repository: gardener/documentation
Length of output: 2510
🏁 Script executed:
#!/bin/bash
# Search for publicDir in the entire .vitepress directory
echo "--- Searching for publicDir configuration ---"
rg "publicDir" .vitepress/
# Check if vitepress is configured to use website/public
echo -e "\n--- Checking full config.mts for any publicDir or public path config ---"
grep -i "publicDir\|public" .vitepress/config.mts
# Check if there's a symlink created during npm install or build
echo -e "\n--- Checking if public is a symlink anywhere ---"
find . -maxdepth 3 -type l 2>/dev/null
# Let's also check node_modules to see if vitepress is installed
echo -e "\n--- Checking vitepress version and default publicDir ---"
cat package.json | grep -A 5 -B 5 "vitepress"Repository: gardener/documentation
Length of output: 990
🏁 Script executed:
#!/bin/bash
# Look for any vite.config files
echo "--- Searching for vite.config files in root ---"
find . -maxdepth 2 -name "vite.config.*" 2>/dev/null
# Check if there's a vite alias or config in the main config.mts getViteConfig function
echo -e "\n--- Checking getViteConfig() function implementation ---"
grep -A 50 "function getViteConfig()" .vitepress/config.mts
# Check if website/public might be copied to public during build
echo -e "\n--- Checking Makefile for any cp/copy commands ---"
grep -i "cp\|copy\|ln\|link" Makefile | head -20Repository: gardener/documentation
Length of output: 1765
🏁 Script executed:
#!/bin/bash
# Check package.json for any scripts related to build or public
echo "--- package.json scripts ---"
grep -A 20 '"scripts"' package.json
# Also verify if docforge might be handling website/ content
echo -e "\n--- Checking docforge config ---"
cat .docforge/config.yaml | head -30Repository: gardener/documentation
Length of output: 699
🏁 Script executed:
#!/bin/bash
# Check the full docforge hugo.yaml manifest
echo "--- Full .docforge/hugo.yaml ---"
cat .docforge/hugo.yaml | grep -A 20 "sources:" | head -40
# Check if there's any reference to website/public in docforge config
echo -e "\n--- Searching for website/public references in docforge ---"
grep -r "website/public\|website/static" .docforge/
# Let's check what docforge actually downloads
echo -e "\n--- Checking hugo directory structure ---"
ls -la hugo/ | head -20Repository: gardener/documentation
Length of output: 329
🏁 Script executed:
#!/bin/bash
# Check the website.yaml docforge configuration
echo "--- .docforge/website.yaml ---"
cat .docforge/website.yaml
# Check if there's a mapping that puts website/public into the public directory
echo -e "\n--- Checking for any references to 'public' in docforge configs ---"
grep -r "public" .docforge/Repository: gardener/documentation
Length of output: 1421
🏁 Script executed:
#!/bin/bash
# Docforge is configured to copy website/public to hugo/public
# Let's verify where VitePress expects to find the public directory
# Check if there's a symlink or copy step after docforge
echo "--- Checking if public is created as symlink or copy during build ---"
grep -A 5 "docforge" Makefile | head -15
# Let's trace through the build: docforge creates hugo/public, but where does VitePress look?
# According to VitePress docs, publicDir defaults to 'public' relative to project root
echo -e "\n--- Verifying VitePress publicDir behavior ---"
echo "VitePress default publicDir is 'public' at project root level (where .vitepress is)"
echo "Current structure:"
echo " - .vitepress/config.mts (no publicDir specified)"
echo " - website/public/ (contains podrick.png)"
echo " - After docforge: hugo/public/ (will contain podrick.png copy)"
echo ""
echo "Problem: CSS references url('/podrick.png') which expects public/ at project root"
echo "But docforge places assets at hugo/public/ (relative to dest), not at project root"Repository: gardener/documentation
Length of output: 1373
🏁 Script executed:
#!/bin/bash
# Check if install step creates symlinks or if post-process handles this
echo "--- Checking npm install and build flow ---"
grep -B 5 -A 5 "install:" Makefile
# Check if there's anything that copies from hugo/public to public
echo -e "\n--- Searching for any file operations in post-processing ---"
rg "website/public|hugo/public" post-processing/
# Let's confirm the actual state by checking what docforge outputs
echo -e "\n--- Checking docforge documentation or config for destination ---"
grep -i "destination\|dest" .docforge/config.yamlRepository: gardener/documentation
Length of output: 416
🏁 Script executed:
#!/bin/bash
# The docforge config shows:
# - destination: hugo
# - dir: public -> fileTree: ../website/public
# This means website/public gets copied to hugo/public
# VitePress has srcDir: 'hugo/content' but no publicDir specified
# Let's verify the actual behavior by checking if there's any symlink or alias
echo "--- Verifying the final resolution ---"
echo "Docforge copies website/public → hugo/public"
echo "VitePress srcDir = hugo/content"
echo "VitePress publicDir = (not specified, defaults to 'public' at project root)"
echo ""
echo "This means the build expects:"
echo " - Project root/public/podrick.png"
echo ""
echo "But docforge places assets at:"
echo " - hugo/public/podrick.png"
echo ""
# Let's check if there's a symlink or configuration that handles this
echo "--- Checking if there's a symlink setup in CI ---"
cat .github/workflows/deploy-github-pages.yaml | grep -A 3 "name: Build"
# The workflow runs 'make ci-build' which runs docforge, then vitepress build
# If VitePress is configured to look at hugo/public, we need to verify that
echo -e "\n--- Final verification: Check if vitepress might use srcDir/../public ---"
grep -i "srcDir\|publicDir" .vitepress/config.mtsRepository: gardener/documentation
Length of output: 654
Configure the public directory path for VitePress or adjust the CSS asset reference.
The podrick.png asset exists at website/public/podrick.png, but the CSS path url('/podrick.png') won't resolve correctly. After the docforge build, the asset will be at hugo/public/podrick.png, while VitePress's default publicDir is public at the project root. Either add publicDir: 'hugo/public' to the VitePress config, or use a relative path in the CSS that properly references the asset location.
🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed.
In @.vitepress/theme/style.css around lines 76 - 93, The CSS uses
background-image: url('/podrick.png') in the .VPButton.alt[href*="podrick"] and
.VPButton.alt[href*="podrick"]::after selectors which won't resolve because the
asset lives at website/public/podrick.png and will be emitted to
hugo/public/podrick.png; fix by either setting VitePress's publicDir to point to
that output (add publicDir: 'hugo/public' in your VitePress config) or change
the CSS to use a path that matches the built asset location (e.g., a relative
path that resolves to hugo/public/podrick.png or the site root where the asset
is served).
|
/assign |
|
@klocke-io, @hendrikKahl You have pull request review open invite, please check |
Signed-off-by: Bozhidara Hristova <bozhidara.hristova@sap.com>
Signed-off-by: Bozhidara Hristova <bozhidara.hristova@sap.com>
klocke-io
left a comment
There was a problem hiding this comment.
/lgtm just waiting for the preview to deploy again, to validate that the image is displayed correctly.
|
LGTM label has been added. DetailsGit tree hash: 751acef422d1da50f4095149b0e0e435cb6fff8e |
|
[APPROVALNOTIFIER] This PR is APPROVED This pull-request has been approved by: klocke-io The full list of commands accepted by this bot can be found here. The pull request process is described here DetailsNeeds approval from an approver in each of these files:
Approvers can indicate their approval by writing |
How to categorize this PR?
/kind enhancement
What this PR does / why we need it:
The current landing page contains duplicate links to the "Adopters" page and to the Gardener demo - once in the top navigation and again in the action buttons.
This PR introduces the following changes:
Which issue(s) this PR fixes:
Fixes #830
Special notes for your reviewer:
/cc @hendrikKahl @klocke-io
Summary by CodeRabbit
Updates
Documentation