Skip to content

Commit 8107548

Browse files
committed
Refactor code block styles: reduce border radius and border width
1 parent 318e83f commit 8107548

File tree

3 files changed

+9
-9
lines changed

3 files changed

+9
-9
lines changed

src/components/codeBlock/code-blocks.module.scss

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,7 @@
55

66
pre {
77
background-color: var(--code-background);
8-
border-radius: 0 0 8px 8px;
8+
border-radius: 0 0 6px 6px;
99
margin-top: 0;
1010
margin-bottom: 0;
1111
}
@@ -17,8 +17,8 @@
1717

1818
pre[class*='language-'] {
1919
font-size: 0.85rem;
20-
border: 3px solid white;
21-
border-radius: 8px;
20+
border: 1px solid var(--accent-11);
21+
border-radius: 6px;
2222
margin: 0;
2323
}
2424

src/components/codeHighlights/codeHighlights.tsx

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -132,9 +132,9 @@ const HighlightBlockContainer = styled('div')`
132132
background-color: rgba(239, 239, 239, 0.06);
133133
position: relative;
134134
135-
border: 3px solid white;
135+
border: 1px solid var(--accent-11);
136136
border-left: 4px solid var(--accent-purple);
137-
border-radius: 8px;
137+
border-radius: 6px;
138138
139139
.highlight-line {
140140
padding-left: 8px !important;

src/components/codeTabs.tsx

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -136,21 +136,21 @@ export function CodeTabs({children}: CodeTabProps) {
136136
const Container = styled('div')`
137137
pre[class*='language-'] {
138138
padding: 10px 12px;
139-
border-radius: 0 0 8px 8px;
140-
border: 3px solid white;
139+
border-radius: 0 0 6px 6px;
140+
border: 1px solid var(--accent-11);
141141
border-top: none;
142142
}
143143
`;
144144

145145
const TabBar = styled('div')`
146146
background: var(--code-background);
147-
border: 3px solid white;
147+
border: 1px solid var(--accent-11);
148148
border-bottom: 1px solid #40364a;
149149
height: 36px;
150150
display: flex;
151151
align-items: center;
152152
padding: 0 0.5rem;
153-
border-radius: 8px 8px 0 0;
153+
border-radius: 6px 6px 0 0;
154154
`;
155155

156156
const TabButton = styled('button')`

0 commit comments

Comments
 (0)