ViMaSter/hackertours-theme
Watch
0
0
Fork
You've already forked hackertours-theme
 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Use inline-size instead of width.

Browse source
This commit is contained in:
Fredrik Jonsson 2025-12-10 15:20:21 +01:00
commit 62e66c64ed
6 changed files with 10 additions and 10 deletions
Download patch file Download diff file Expand all files Collapse all files

2
assets/sass/base/forms/_forms.scss
View file

@ -59,7 +59,7 @@ input,
label,
textarea,
select {
max-width: var(--max-line-width);
max-inline-size: var(--max-line-width);
}
fieldset {

6
assets/sass/base/grouping/_grouping.scss
View file

@ -13,7 +13,7 @@ blockquote {
margin-inline: var(--indent-amount);
/* Set max text line width in main for readability. */
max-width: var(--max-line-width);
max-inline-size: var(--max-line-width);
}
/* Lists */
@ -58,7 +58,7 @@ li {
/* Set max text line width in main for readability. */
.main & {
max-width: var(--max-line-width);
max-inline-size: var(--max-line-width);
}
}
@ -83,7 +83,7 @@ p {
/* Set max text line width in main for readability. */
.main & {
max-width: var(--max-line-width);
max-inline-size: var(--max-line-width);
}
}

2
assets/sass/base/headings/_headings.scss
View file

@ -30,7 +30,7 @@ h6,
/* Set max text line width in main for readability. */
.main & {
max-width: var(--max-line-width);
max-inline-size: var(--max-line-width);
}
}

2
assets/sass/base/images/_images.scss
View file

@ -39,7 +39,7 @@ figure {
contain: inline-size;
/* Set max text line width in main for readability. */
max-width: var(--max-line-width);
max-inline-size: var(--max-line-width);
/* Nicer text wrap, e.g. no lone word on last line. */
text-wrap: pretty;

2
assets/sass/base/reset/_reset.scss
View file

@ -60,7 +60,7 @@ object {
img,
svg,
video {
max-width: 100%;
max-inline-size: 100%;
height: auto;
}

6
assets/sass/layouts/_layouts.scss
View file

@ -3,7 +3,7 @@
/* Initial layout setup. */
.layout {
&__page {
max-width: var(--max-page-width);
max-inline-size: var(--max-page-width);
@media (min-width: 666px) {
margin-inline: auto;
@ -22,7 +22,7 @@
&__page-bottom,
&__cookieconsent {
padding-inline: var(--gutters);
min-width: 0; /* With display grid defaults to auto, making <pre> overflow. */
min-inline-size: 0; /* With display grid defaults to auto, making <pre> overflow. */
}
}
@ -32,7 +32,7 @@
@if $max-page-width > $max-content-width {
.layout {
&__navigation > * {
max-width: var(--max-content-width);
max-inline-size: var(--max-content-width);
@media (min-width: 666px) {
margin-inline: auto;