Browse Source
[Beta] fix: gutter overlap with sandpack code on mobile (#5170)
* fix: gutter overlap
* chore: move horizontal scrollbar to code-content
main
Shanmughapriyan S
2 years ago
committed by
GitHub
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
1 changed files with
9 additions and
2 deletions
-
beta/src/styles/sandpack.css
|
|
@ -211,8 +211,14 @@ html.dark .sp-wrapper { |
|
|
-webkit-font-smoothing: auto; /* Improve the legibility */ |
|
|
-webkit-font-smoothing: auto; /* Improve the legibility */ |
|
|
} |
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
.sandpack .sp-code-editor .cm-content { |
|
|
|
|
|
overflow-x: auto; |
|
|
|
|
|
padding-bottom: 18px; |
|
|
|
|
|
} |
|
|
|
|
|
|
|
|
.sandpack--playground .sp-code-editor .cm-line { |
|
|
.sandpack--playground .sp-code-editor .cm-line { |
|
|
padding: 0 var(--sp-space-3); |
|
|
padding: 0 var(--sp-space-3); |
|
|
|
|
|
width: max-content; |
|
|
} |
|
|
} |
|
|
|
|
|
|
|
|
.sandpack--playground .sp-code-editor .cm-lineNumbers { |
|
|
.sandpack--playground .sp-code-editor .cm-lineNumbers { |
|
|
@ -250,8 +256,9 @@ html.dark .sp-wrapper { |
|
|
} |
|
|
} |
|
|
|
|
|
|
|
|
.sp-code-editor .sp-cm .cm-scroller { |
|
|
.sp-code-editor .sp-cm .cm-scroller { |
|
|
overflow: auto; |
|
|
overflow-x: hidden; |
|
|
padding: 18px 0; |
|
|
overflow-y: auto; |
|
|
|
|
|
padding-top: 18px; |
|
|
} |
|
|
} |
|
|
|
|
|
|
|
|
/** |
|
|
/** |
|
|
|
