Skip to content

Commit f63bc9e

Browse files
committed
Polish: Codeblocks overflow
1 parent e35bebd commit f63bc9e

File tree

1 file changed

+24
-11
lines changed

1 file changed

+24
-11
lines changed

assets/css/v2/style.css

Lines changed: 24 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,21 @@ 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+
/* Bottom Horizontal Line for Tabs */
985+
content: "";
986+
position: absolute;
987+
border-bottom: 1px solid black;
988+
left: calc(-1 * var(--overflow-gutter-extension));
989+
bottom: 0;
990+
width: calc(100% + (2 * var(--overflow-gutter-extension)));
991+
}
992+
991993
/* Codeblocks */
992994
.highlight {
993995
padding: 0 1rem 0 1rem;
@@ -1004,6 +1006,16 @@ blockquote.side-callout {
10041006
grid-column: 1;
10051007
}
10061008

1009+
.code-block .code-header:not(:has(.code-type)) {
1010+
/* Remove margin for codeblocks without a type */
1011+
margin-top: -1.5rem;
1012+
}
1013+
1014+
li .code-block {
1015+
/* For indented code blocks, move 1rem back to align code with text from heading */
1016+
margin-left: -1rem;
1017+
}
1018+
10071019
.icon-code-copy {
10081020
background-color: #f2f2f2;
10091021
border: none;
@@ -1016,11 +1028,12 @@ blockquote.side-callout {
10161028

10171029
.highlight-v2 {
10181030
padding: 0 1rem 0 0;
1019-
margin: 0 -1rem 1rem -1rem;
1031+
margin: 0 0 1rem 0;
10201032
border-top: 1px solid #cccccc;
10211033
border-bottom: 1px solid #cccccc;
10221034
overflow-x: scroll;
10231035
scrollbar-width: none;
1036+
width: calc(100% + var(--overflow-gutter-extension));
10241037
}
10251038

10261039
.highlight-v2.single-line {
@@ -1029,7 +1042,7 @@ blockquote.side-callout {
10291042
padding: 0 1rem 0 0;
10301043
border: 1px solid #cccccc;
10311044
overflow-x: scroll;
1032-
width: calc(100% + (2 * var(--overflow-gutter-extension)));
1045+
width: calc(100% + var(--overflow-gutter-extension));
10331046
}
10341047

10351048
.code-header {

0 commit comments

Comments
 (0)