Repository navigation
Gemensamt avstånd för länkar efter text och lägre kort på Systemutveckling - #58
Open
matsygfors wants to merge 2 commits into
Open
matsygfors wants to merge 2 commits into
matsygfors wants to merge 2 commits into
Conversation
Links sat too close to the text above them, and how close depended on where they were: 16 px in the hero, 18 px in the light callouts, 24 px in the dark ones, and 0 px at the end of the "profile" and "benefits" text sections (Jobba, Konsultnätverket), where the link touched the last paragraph or list. One variable, --link-gap (24 px, base.scss), now sets the space between a paragraph and a link that follows it, used by: - the hero link row (.hero-actions), - callout links, light and dark alike, via .join-grid > div > p:has(+ :is(.text-link, .callout-links)) in place of the old rule that only applied to dark callouts, - a link that closes a text section (.large-prose + .text-link), - the existing .work-intro link, which was already 24 px. The audience cards on the AI page are left alone: their link already has about 30 px above it from the feature list. README describes the new gap and where to change it. Build, npm test (18/18) and npm run check (255 pages) pass; not checked visually. Co-Authored-By: Claude Sonnet 5.5 <noreply@anthropic.com>
.focus-grid article had min-height: 290px, left over from when these cards carried a number and a 52 px margin above the heading. The numbers are gone, so the fixed minimum height only added empty space under the text. Removing it sizes each card to its heading and paragraph plus the shared card padding. Cards in a row stay equal in height because the grid stretches the row to its tallest card. Only Systemutveckling uses this card type, so no other page changes. Build, npm test (18/18) and npm run check (255 pages) pass; not checked visually. Co-Authored-By: Claude Sonnet 5.5 <noreply@anthropic.com>
Member
Author
|
Någon som vill kolla denna PR? |
This branch has not been deployed
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.
Vad
Två små layoutjusteringar ovanpå den mergade webbdesignen (#54):
--link-gap(24 px,base.scss), styr nu avståndet på alla de ställena. Målgruppskorten på AI-sidan är orörda, eftersom deras länk redan har cirka 30 px över sig.min-height: 290pxvar kvar från när korten hade ett nummer och en stor marginal över rubriken. Numren är borta, så minimihöjden gav bara tomrum under texten. Höjden bestäms nu av innehållet. Korten i samma rad är fortfarande lika höga.README beskriver det nya länkavståndet och var det ändras.
Varför
Länkarna kändes för nära texten, och korten på Systemutveckling kändes onödigt höga.
Att veta för granskaren
npm test(18/18) ochnpm run check(255 sidor) går igenom, men jag har inte tittat på sidorna. Värt att titta på: hero-länkarna på Systemutveckling, Teknikgranskning och AI-labbet, länkarna sist i textsektionerna på Jobba och Konsultnätverket, och korten på Systemutveckling.--link-gapibase.scss, så följer alla ställen med.:has()används för att hitta stycket före en callout-länk. Det finns redan i koden och stöds i alla aktuella webbläsare.main. De gäller beroenden och inte den här PR:n.🤖 Generated with Claude Code