fix: mobile overflow — constrain pre blocks within viewport, allow internal scroll
This commit is contained in:
1 file changed
+11
-2
+11
-2
@@ -49,12 +49,21 @@
|
|||||||
border-radius: 3px;
|
border-radius: 3px;
|
||||||
}
|
}
|
||||||
|
|
||||||
/* All pre blocks: stay within viewport, scroll content */
|
/* Prevent any content from blowing out the viewport width */
|
||||||
|
body {
|
||||||
|
overflow-x: hidden;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Pre blocks scroll their own content horizontally */
|
||||||
pre {
|
pre {
|
||||||
max-width: 100%;
|
|
||||||
overflow-x: auto;
|
overflow-x: auto;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/* Flex children containing pre blocks must be allowed to shrink */
|
||||||
|
li > div {
|
||||||
|
min-width: 0;
|
||||||
|
}
|
||||||
|
|
||||||
/* Shiki code blocks — match site card background */
|
/* Shiki code blocks — match site card background */
|
||||||
.astro-code {
|
.astro-code {
|
||||||
background-color: var(--color-bg-card) !important;
|
background-color: var(--color-bg-card) !important;
|
||||||
|
|||||||
Reference in new issue
Block a user