Browse Source

fix(CSS) Re-style code blocks

Joe Richardson 4 months ago
parent
commit
7d7f8d6011
2 changed files with 8 additions and 18 deletions
  1. 1
    0
      .gitignore
  2. 7
    18
      src/css/main.css

+ 1
- 0
.gitignore View File

@@ -3,3 +3,4 @@ dist/
3 3
 /npm-debug.log
4 4
 yarn-error.log
5 5
 .DS_Store
6
+*.swp

+ 7
- 18
src/css/main.css View File

@@ -12,6 +12,8 @@
12 12
 
13 13
   --font-weight-regular: 400;
14 14
   --font-weight-bold: 600;
15
+
16
+  --inline-code-bg: rgba(255,141,178, 0.2);
15 17
 }
16 18
 
17 19
 * {
@@ -108,29 +110,16 @@ pre code {
108 110
 }
109 111
 
110 112
 code {
111
-  white-space: pre-wrap;
112
-  font-family: var(--base-font-family);
113 113
   font-size: 16px;
114
-  font-weight: var(--font-weight-bold);
115 114
   letter-spacing: 0;
116 115
   position: relative;
117
-  color: var(--color-white);
116
+  font-family: var(--base-font-family-mono);
118 117
 }
119 118
 
120
-p > code::before {
121
-  position: absolute;
122
-  top: 0;
123
-  left: 0;
124
-  bottom: 0;
125
-  right: 0;
126
-  margin: auto;
127
-  width: 100%;
128
-  height: 100%;
129
-  background: var(--color-accent);
130
-  content: "";
131
-  z-index: -9999;
132
-  transform: skew(-2deg, -2deg);
133
-  padding: 2px;
119
+p > code {
120
+  background: var(--inline-code-bg);
121
+  white-space: normal;
122
+  padding: 2px 3px;
134 123
 }
135 124
 
136 125
 .ellipsis {