Skip to content

Improve card styling consistency and responsive UI behavior#768

Open
jankiluitel wants to merge 7 commits into
thoth-tech:mainfrom
jankiluitel:improve-planner-ui-config
Open

Improve card styling consistency and responsive UI behavior#768
jankiluitel wants to merge 7 commits into
thoth-tech:mainfrom
jankiluitel:improve-planner-ui-config

Conversation

@jankiluitel

@jankiluitel jankiluitel commented May 13, 2026

Copy link
Copy Markdown

Overview:

Enhanced card border radius and spacing; added smoother hover transitions and shadow effects; improved responsive card sizing; updated hover interactions for link cards; and improved overall visual consistency across website cards.

Testing:

  • Tested locally using npm run dev;
  • Verified hover animations and responsive behaviour;
  • Confirmed layouts render correctly across pages;
  • Ensured no existing functionality was affected

enhanced UI uniformity and website card design throughout SplashKit documentation pages.

Modifications Made

  • Improved card border spacing and radius
  • Smoother shadow effects and hover transitions were added.
  • More responsive card dimensions
  • Link card hover interactions have been updated.
  • Enhanced visual coherence throughout all website cards

Examining

  • Local testing was done with npm run dev.
  • Confirmed responsive behaviour and hover animations
  • Verified layouts appear correctly on all pages
  • Verified that no current functionality was impacted

Uploading image.png…

@netlify

netlify Bot commented May 13, 2026

Copy link
Copy Markdown

Deploy Preview for splashkit failed.

Name Link
🔨 Latest commit 095e126
🔍 Latest deploy log https://app.netlify.com/projects/splashkit/deploys/6a052cd94520c50008a84d7c

@222448082Ashen 222448082Ashen left a comment

Copy link
Copy Markdown

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Peer Review

I've reviewed the card styling consistency and responsive UI behavior changes (PR #768).

Overview

  • Files Modified
    2 CSS files, 1 config file, 1 new guide
  • Scope
    Card styling improvements + new Generative AI guide + sidebar navigation update

Checks

  • Card styling changes (border-radius, padding, transitions, shadows) applied correctly
  • Link card hover interactions updated and consistent
  • Responsive media query added for mobile (≤768px breakpoint)
  • CSS syntax is valid and follows existing conventions
  • PR scope includes unrelated changes (new Generative AI guide + sidebar navigation)
  • Unused imports detected in new guide file

Code Quality Issues Found

  1. Medium Scope Creep
    This PR bundles card styling WITH a new Generative AI guide and sidebar entry. These should be separate PRs for easier review/revert.

    • Sidebar navigation
      astro.config.mjs line 134
    • New guide file
      src/content/docs/guides/generative-ai/ai-prompt-helper-for-splashkit.mdx
    • Suggestion
      Split into two PRs or clarify intent in the description.
  2. Low Unused Import
    The new Generative AI guide imports Tabs and TabItem but never uses them.

    import { Tabs, TabItem } from "@astrojs/starlight/components";  //  Remove this line

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants