fix(notes): rullebjælken svævede midt i arket
Det er `.page`, der ruller — og det var også `.page`, der blev smallere for at holde linjelængden nede. Så bjælken fulgte med ind til tekstsøjlens kant og stod med en håndflade tom rude til højre for sig, en tredjedel inde i ruden. Grænsen sættes som polstring i stedet for som bredde. Elementet er lige så bredt som ruden — bjælken bliver ved kanten, hvor den hører til — og teksten er nøjagtig lige så bred som før. `max()` mod nul, fordi en smal rude ellers ville få negativ polstring, og `border-box` er sat globalt, så bredden er hele boksen og ikke boksen plus polstringen; uden det ville det give en vandret rullebjælke. Kildevisningen deler `.page` med editoren og havde samme fejl. Den følger med. Målt: elementet slutter nu på rudens indholdskant i stedet for 74 px inde, og `scrollWidth - clientWidth` er nul. Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>
This commit is contained in:
co-authored by
Claude Opus 5
parent
6b4448b245
commit
8ecefbbdc2
@@ -884,8 +884,20 @@
|
|||||||
* clamp frem for et tal: en smal rude får det hele, en bred får en
|
* clamp frem for et tal: en smal rude får det hele, en bred får en
|
||||||
* linjelængde, øjet kan finde tilbage i. Øvre grænse omkring 68rem, hvor en
|
* linjelængde, øjet kan finde tilbage i. Øvre grænse omkring 68rem, hvor en
|
||||||
* linje er lang nok til at rumme en kommando og kort nok til at læse. */
|
* linje er lang nok til at rumme en kommando og kort nok til at læse. */
|
||||||
max-width: clamp(38rem, 92%, 68rem);
|
/* Grænsen sættes som polstring og ikke som bredde, og det er rullebjælken,
|
||||||
|
* der afgør det.
|
||||||
|
*
|
||||||
|
* Det er *dette* element, der ruller. Var det også det, der blev smallere,
|
||||||
|
* fulgte rullebjælken med ind: den stod ved tekstsøjlens kant med en
|
||||||
|
* håndflade tom rude til højre for sig og svævede midt i arket. Med
|
||||||
|
* polstring er elementet lige så bredt som ruden — bjælken bliver ved
|
||||||
|
* kanten, hvor den hører til — og teksten er nøjagtig lige så bred som før.
|
||||||
|
*
|
||||||
|
* `max()` mod nul, fordi en smal rude ellers ville få negativ polstring, og
|
||||||
|
* `border-box` er sat globalt, så bredden er hele boksen og ikke boksen plus
|
||||||
|
* polstringen. Uden det ville det her give en vandret rullebjælke. */
|
||||||
width: 100%;
|
width: 100%;
|
||||||
|
padding-right: max(0px, calc(100% - clamp(38rem, 92%, 68rem)));
|
||||||
}
|
}
|
||||||
|
|
||||||
.hidden {
|
.hidden {
|
||||||
|
|||||||
Reference in New Issue
Block a user