Skip to content

Commit 4c1dd7c

Browse files
committed
Polish: Codeblocks overflow
1 parent e35bebd commit 4c1dd7c

File tree

1 file changed

+18
-11
lines changed

1 file changed

+18
-11
lines changed

assets/css/v2/style.css

Lines changed: 18 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -966,11 +966,7 @@ blockquote.side-callout {
966966
}
967967

968968
.tab-content {
969-
border-bottom: 1px solid black;
970-
971-
/* Lines extend 1rem into gutter on both sides */
972-
width: calc(100% + 2rem);
973-
margin-left: -1rem;
969+
position: relative;
974970

975971
.tab-pane {
976972
display: none;
@@ -979,15 +975,20 @@ blockquote.side-callout {
979975
margin-left: 1rem;
980976
}
981977

982-
.tab-pane * {
983-
margin-left: 0;
984-
}
985-
986978
.active {
987979
display: block !important;
988980
}
989981
}
990982

983+
.tab-content::after {
984+
content: "";
985+
position: absolute;
986+
border-bottom: 1px solid black;
987+
left: calc(-1 * var(--overflow-gutter-extension));
988+
bottom: 0;
989+
width: calc(100% + (2 * var(--overflow-gutter-extension)));
990+
}
991+
991992
/* Codeblocks */
992993
.highlight {
993994
padding: 0 1rem 0 1rem;
@@ -1004,6 +1005,11 @@ blockquote.side-callout {
10041005
grid-column: 1;
10051006
}
10061007

1008+
li .code-block {
1009+
/* For indented code blocks, move 1rem back to align code with text from heading */
1010+
margin-left: -1rem;
1011+
}
1012+
10071013
.icon-code-copy {
10081014
background-color: #f2f2f2;
10091015
border: none;
@@ -1016,11 +1022,12 @@ blockquote.side-callout {
10161022

10171023
.highlight-v2 {
10181024
padding: 0 1rem 0 0;
1019-
margin: 0 -1rem 1rem -1rem;
1025+
margin: 0 0 1rem 0;
10201026
border-top: 1px solid #cccccc;
10211027
border-bottom: 1px solid #cccccc;
10221028
overflow-x: scroll;
10231029
scrollbar-width: none;
1030+
width: calc(100% + var(--overflow-gutter-extension));
10241031
}
10251032

10261033
.highlight-v2.single-line {
@@ -1029,7 +1036,7 @@ blockquote.side-callout {
10291036
padding: 0 1rem 0 0;
10301037
border: 1px solid #cccccc;
10311038
overflow-x: scroll;
1032-
width: calc(100% + (2 * var(--overflow-gutter-extension)));
1039+
width: calc(100% + var(--overflow-gutter-extension));
10331040
}
10341041

10351042
.code-header {

0 commit comments

Comments
 (0)