Merge pull request #274 from wpengine/code-figcaption-styling

Code Block style enhancements

Author: moonmeister

src/pages/global.css

@@ -190,6 +190,15 @@ code[data-line-numbers-max-digits="4"] > [data-line]::before {
 	width: 2.25rem;
 }
 
+figcaption + pre {
+	border-top-left-radius: 0;
+	border-top-right-radius: 0;
+}
+
+pre {
+	border: 1px solid #444c56;
+}
+
 /* Line highlights https://rehype-pretty.pages.dev/#highlight-lines*/
 span[data-highlighted-line] {
 	background-color: rgba(100, 123, 255, 0.2);
@@ -226,6 +235,15 @@ span[data-highlighted-line] {
 	color: red;
 }
 
+figcaption[data-language] {
+	border-top-left-radius: 0.375rem;
+	border-top-right-radius: 0.375rem;
+	border: 1px solid #444c56;
+	border-bottom: none;
+	padding: 0.8571429em 1.1428571em;
+	background-color: #1c2128;
+}
+
 figcaption[data-language]::after {
 	content: attr(data-language);
 	float: right;