aboutsummaryrefslogtreecommitdiffstats
path: root/app/assets/stylesheets/content/_code.scss
diff options
context:
space:
mode:
authorsadbeast <sadbeast@sadbeast.com>2024-01-31 17:47:56 -0800
committersadbeast <sadbeast@sadbeast.com>2024-01-31 17:47:56 -0800
commit332ec93366315fa1ed7b4acd7a3407c96e8ddfa7 (patch)
tree6ae553317f12a7a6a29c849c8805ffab96436dc2 /app/assets/stylesheets/content/_code.scss
downloadtd-main.tar.gz
td-main.tar.bz2
initial mistakeHEADmain
Diffstat (limited to 'app/assets/stylesheets/content/_code.scss')
-rw-r--r--app/assets/stylesheets/content/_code.scss91
1 files changed, 91 insertions, 0 deletions
diff --git a/app/assets/stylesheets/content/_code.scss b/app/assets/stylesheets/content/_code.scss
new file mode 100644
index 0000000..e03b191
--- /dev/null
+++ b/app/assets/stylesheets/content/_code.scss
@@ -0,0 +1,91 @@
+/**
+ * Code
+ */
+
+// Reboot based on :
+// - normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css
+// - sanitize.css v13.0.0 | CC0 1.0 Universal | github.com/csstools/sanitize.css
+// ––––––––––––––––––––
+
+// 1. Correct the inheritance and scaling of font size in all browsers
+// 2. Correct the odd `em` font sizing in all browsers
+pre,
+code,
+kbd,
+samp {
+ font-size: 0.875em; // 2
+ font-family: var(--font-family); // 1
+}
+
+// Prevent overflow of the container in all browsers (opinionated)
+pre {
+ -ms-overflow-style: scrollbar;
+ overflow: auto;
+}
+
+// Pico
+// ––––––––––––––––––––
+
+pre,
+code,
+kbd {
+ border-radius: var(--border-radius);
+ background: var(--code-background-color);
+ color: var(--code-color);
+ font-weight: var(--font-weight);
+ line-height: initial;
+}
+
+code,
+kbd {
+ display: inline-block;
+ padding: 0.375rem 0.5rem;
+}
+
+pre {
+ display: block;
+ margin-bottom: var(--spacing);
+ overflow-x: auto;
+
+ > code {
+ display: block;
+ padding: var(--spacing);
+ background: none;
+ font-size: 14px;
+ line-height: var(--line-height);
+ }
+}
+
+// Code Syntax
+code {
+ // Tags
+ b {
+ color: var(--code-tag-color);
+ font-weight: var(--font-weight);
+ }
+
+ // Properties
+ i {
+ color: var(--code-property-color);
+ font-style: normal;
+ }
+
+ // Values
+ u {
+ color: var(--code-value-color);
+ text-decoration: none;
+ }
+
+ // Comments
+ em {
+ color: var(--code-comment-color);
+ font-style: normal;
+ }
+}
+
+// kbd
+kbd {
+ background-color: var(--code-kbd-background-color);
+ color: var(--code-kbd-color);
+ vertical-align: baseline;
+}