Replace theme with Tailwind CSS + Alpine.js#22
Merged
drmowinckels merged 11 commits intomainfrom Mar 23, 2026
Merged
Conversation
Replace the Bootstrap 4 + jQuery theme with a modern stack: - Tailwind CSS 4 with CSS-first configuration and design tokens - Alpine.js for interactive components (nav, portfolio filter, testimonials) - Self-hosted fonts via @fontsource (Space Grotesk, Spectral) - FontAwesome compiled from SCSS, deferred loading - Vanilla JS for scroll reveal and counter animations - WebP image conversion throughout - Client-side publication fetching via OpenAlex API (replaces R/GH Action pipeline) Performance: Lighthouse homepage 53→89, team page 65→82 Accessibility: 100 on both pages Best Practices: 100 on both pages Removes gscholar_id from team member front matter (publications now fetched client-side using ORCID IDs from social links). Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
|
The PR has been deployed as a preview. |
- Remove R publication pipeline (scripts/get_pubs.R, weekly GH Action, data/team/pubs/) - Update CI workflows to install Node.js and theme npm deps - Remove weekly cron schedule (no longer needed without R fetching) - Remove libcurl system dependency (was only for R) - Fix misspelled config filename (langauges → languages) - Fix Norwegian language config YAML indentation - Add node_modules/ to .gitignore Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
|
The PR has been deployed as a preview. |
- About: larger hexagons (160px), teal headings, more card padding - Services: restore distinctive offset shadow, teal headings, muted icons - Counters: dark card boxes around each counter item - Add theme attribution to Themefisher's Timer theme in theme.toml Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
|
The PR has been deployed as a preview. |
- Remove hover effect from service blocks (no associated action) - Increase service block padding and soften offset shadow - Alternate bg-dark/bg-grey across homepage sections - Single-word section titles render in grey, not red accent - Counter cards with dark background boxes Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
|
The PR has been deployed as a preview. |
- Add SVG wave lines (primary red curves) to hero bottom, CTA edges, and footer top - Match original theme styling: larger hexagons, service offset shadows, counter cards - Portfolio cards with white image area, hover overlay with search circle, dark meta - Team cards with border, red highlight on hover - Section heading divider matches original (grey line with centered red bar) - Alternating section backgrounds (dark/grey) - Tighten footer spacing between waves and content Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
|
The PR has been deployed as a preview. |
The CTA section already has a "Book a consultation" button. Simplify contact to just the content text and address details. Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
Contact section now shows address details on the left and the booking card on the right. The markdown content with inline booking link is removed to avoid duplication. Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
|
The PR has been deployed as a preview. |
1 similar comment
|
The PR has been deployed as a preview. |
- Add interactive OpenStreetMap via Leaflet.js with red marker - Leaflet loaded on demand (no API key needed) - Team cards with subtle border, red on hover - Footer spacing tightened Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
|
The PR has been deployed as a preview. |
- Add leaflet as npm dependency - Sync Leaflet JS, CSS, and images via postinstall - Load from local vendor files with SRI integrity - Remove CDN loading from map.js Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
|
The PR has been deployed as a preview. |
Resolve conflict: langauges.no.yaml was renamed to languages.no.yaml in this branch and fixed in main. Keep the renamed version. Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
|
The PR has been deployed as a preview. |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
1 participant
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Summary
capro-twtheme replacing Bootstrap 4 + jQuery with Tailwind CSS 4 + Alpine.jsLighthouse scores (old → new)
*SEO dip is rel=canonical pointing to localhost in dev — resolves in production.
Eliminated dependencies
jQuery, Bootstrap 4 CSS+JS, Shuffle.js, Slick carousel, Magnific Popup, Lozad.js, Google Fonts CDN, R scholar package, weekly GitHub Action
Architecture
npm installinthemes/capro-tw/builds everything (postinstall)@sourcedirectiveTest plan
hugo buildsucceeds🤖 Generated with Claude Code