The floating header's backdrop blur makes the pill a containing block
for fixed-position descendants, so the fullscreen mobile menu rendered
at the pill's height instead of filling the viewport. Lift the filter
while the menu is open. Fixes#3057.
Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
Darken burufugu primary-600 to pass 4.5:1 on white, bump the search
shortcut hint to neutral-500, and surface the language switcher in
the visible mobile header row instead of the menu dialog.
Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
Remove the obsolete min-width on thumbnail_card, a leftover from the
old fixed-size background thumbnail, so images shrink with the card
and object-cover crops them centered instead of clipping the right
side once columns drop below 300px.
Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
Tailwind v4.3 introduced built-in scrollbar utilities that conflicted
with the tailwind-scrollbar plugin, causing visual regressions.
Fixed by inlining the pre-v4.3 build output directly into main.css,
which also eliminates the need for the tailwind-scrollbar plugin.
- Add thumbnailAspectRatio site parameter (default '1.5')
- Use decimal values instead of fractions for Hugo compatibility
- Sanitize user input to extract only numeric characters
- Apply to article cards, related cards, and term cards
- Update both source and compiled CSS
Closes#2839
This allows users to customize Chroma CSS without building the TailwindCSS manually.
For example, add this to `custom.css`:
```
.chroma,
.chroma,
.chroma:is(.dark *),
.chroma:is(.dark *) * {
color: unset;
background-color: unset;
font-weight: unset;
}
```
Then use:
```
hugo gen chromastyles --style=github | sed 's/\./html.dark ./' >> assets/css/custom.css
hugo gen chromastyles --style=github | sed 's/\./html:not(.dark) ./' >> exampleSite/assets/css/custom.css
```
The previous method was not intuitive since there was nothing in the <a> tag,
and required group-xxx classes for every element.
The new pseudo element method fixes those problems, see:
https://kittygiraudel.com/2022/04/02/accessible-cards/
- Move out of line by using already defined css classes
- Move paddings out of line
- Move margins out of line
- Move z-indexes out of line
- Move center-relative-left out of line
Nour Agha