Several style improvements#111
Merged
Merged
Conversation
laravdiemen
requested review from
Rovasch,
ShunLuk,
SimonvanWijhe,
dtakken,
ictbeheer,
mvdhoek1 and
rivanuff
![claude[bot]](https://avatars.githubusercontent.com/in/1236702?s=60&v=4){kind=small}
There was a problem hiding this comment.
Code review is billed via overage credits. To resume reviews, an organization admin can raise the monthly limit at claude.ai/admin-settings/claude-code.
Once credits are available, reopen this pull request to trigger a review.
laravdiemen
requested review from
FreakyWizard,
JasperS20,
WybeBosch,
Yannicvanveen and
YvetteNikolov
laravdiemen
commented
May 7, 2026
Comment on lines
+132
to
+134
| &.fs-open .fs-label-wrap { | ||
| @apply rounded-b-none; | ||
| } |
Contributor
There was a problem hiding this comment.
Pull request overview
This PR makes small frontend style refinements across the Sage theme by introducing additional CSS custom properties (for easier future theming), tweaking a few component class strings, and removing now-unused CSS.
Changes:
- Added/expanded CSS variables for button, tabs, and collapse blocks to make typography/shape easier to override.
- Updated a few Blade components’ utility classes (breadcrumbs truncation, mobile menu trigger simplification, mobile filters sticky actions).
- Removed unused footer menu CSS and made minor FacetWP styling adjustments.
Reviewed changes
Copilot reviewed 11 out of 11 changed files in this pull request and generated no comments.
Show a summary per file
| File | Description |
|---|---|
| web/app/themes/sage/resources/views/components/layout/index.blade.php | Breadcrumb class tweaks (alignment, truncation, hover/focus styling). |
| web/app/themes/sage/resources/views/components/header/mobile-menu.blade.php | Simplifies hamburger trigger markup/classes. |
| web/app/themes/sage/resources/views/components/facetwp/mobile-filters.blade.php | Adjusts mobile filter trigger stacking and sticky bottom action bar styling. |
| web/app/themes/sage/resources/styles/components/footer.css | Removes unused .footer-menu styling. |
| web/app/themes/sage/resources/styles/components/facetwp.css | Small refinement for open-state rounding in fs-select UI. |
| web/app/themes/sage/resources/styles/blocks/tabs/shared.css | Adds new tabs CSS vars and applies them for font sizing/weights and icon radius. |
| web/app/themes/sage/resources/styles/blocks/tabs/editor.css | Aligns editor styles with new tabs vars and row-end utility usage. |
| web/app/themes/sage/resources/styles/blocks/collapse/shared.css | Adds font-weight var and aligns line-height to base typography variable. |
| web/app/themes/sage/resources/styles/blocks/collapse/editor.css | Uses new collapse typography vars in editor input. |
| web/app/themes/sage/resources/styles/blocks/button/shared.css | Adds button vars (font size/weight, border width, after icon color) and hover border color change. |
| web/app/themes/sage/resources/styles/base/utilities.css | Updates is-button utility to rely on the new button vars and makes after-icon color hoverable via CSS var. |
Yannicvanveen
approved these changes
May 7, 2026
WybeBosch
reviewed
May 7, 2026
|
|
||
| @utility is-button { | ||
| @apply inline-flex cursor-pointer items-center gap-(--button-gap) rounded-(--button-radius) border border-(--button-border-color) bg-(--button-bg-color) px-(--button-padding-x) py-(--button-padding-y) leading-snug! break-words text-(--button-color) no-underline transition-colors select-none; | ||
| @apply inline-flex cursor-pointer items-center gap-(--button-gap) rounded-(--button-radius) border-(length:--button-border-width) border-(--button-border-color) bg-(--button-bg-color) px-(--button-padding-x) py-(--button-padding-y) text-(length:--button-font-size) leading-snug! font-(--button-font-weight) wrap-break-word text-(--button-color) no-underline transition-colors select-none; |
WybeBosch
reviewed
May 7, 2026
Comment on lines
-13
to
-38
|
|
||
| .footer-menu { | ||
| .menu-item { | ||
| @apply text-sm; | ||
|
|
||
| &::before { | ||
| @apply mr-3 content-['|']; | ||
| } | ||
|
|
||
| &:first-child::before { | ||
| @apply content-none; | ||
| } | ||
|
|
||
| a { | ||
| @apply text-black no-underline; | ||
|
|
||
| @variant hocus { | ||
| @apply underline; | ||
| } | ||
| } | ||
| } | ||
| } | ||
|
|
||
| .cky-banner-element + .footer-menu .menu-item:first-child::before { | ||
| @apply content-['|']; | ||
| } |
Contributor
There was a problem hiding this comment.
was dit code van het oude widgets footer menu?
Contributor
Author
There was a problem hiding this comment.
Dit was voordat we navi gebruikte
WybeBosch
reviewed
May 7, 2026
| @php(the_content()) | ||
| @else | ||
| <x-brave-breadcrumb class="container py-3 text-sm" listClass="items-center flex flex-wrap" | ||
| itemClass="flex not-last:after:content-['|'] after:mx-2 text-gray-500 [&>span]:block [&>span]:max-w-[200px] [&>span]:overflow-hidden [&>span]:text-ellipsis [&>span]:whitespace-nowrap" |
Contributor
There was a problem hiding this comment.
wow ik wist niet dat je [&>] kon gebruiken in tailwind??? wat vet. heb het nog niet eerder nodig gehad.
WybeBosch
approved these changes
May 7, 2026
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
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.
Een aantal kleine dingen doorgevoerd. Voornamelijk wat css variabele toegevoegd zodat het aanpassen nog makkelijker wordt. Ook wat ongebruikte code weggehaald.