Skip to content

Commit 47fe732

Browse files
adamwathanadamwathan
committed
Working on tweaks with Steve
1 parent 40b66fb commit 47fe732

File tree

3 files changed

+37
-100
lines changed

3 files changed

+37
-100
lines changed

‎docs/components/MarkdownSampleE.mdx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -47,7 +47,7 @@ You can [listen to the intro episode](https://jackmcdade.com/stuff/doing-it-anyw
4747

4848
I caught myself daydreaming. A lot. I could almost hear the voice of Guy Raz or Alex Blumberg promoting the show:
4949

50-
> "A groundbreaking new podcast takes you on a magical journey, a never-before-seen glimpse behind the scenes with the infamous man, the myth, the legend, the one and only Jack McDade — yes, he who who blew the world's collective mind hole with the most innovative and imaginative new game franchise in history..."
50+
> A groundbreaking new podcast takes you on a magical journey, a never-before-seen glimpse behind the scenes with the infamous man, the myth, the legend, the one and only Jack McDade
5151
5252
Yikes. It's embarrassing to remember.
5353

‎docs/pages/index.js

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -8,7 +8,7 @@ import MarkdownSampleE from '../components/MarkdownSampleE.mdx'
88

99
export default () => {
1010
const [size, setSize] = useState('default')
11-
const [sample, setSample] = useState('A')
11+
const [sample, setSample] = useState('B')
1212

1313
const SampleComponent = {
1414
A: MarkdownSample,

‎src/styles.js

Lines changed: 35 additions & 98 deletions
Original file line numberDiff line numberDiff line change
@@ -88,9 +88,14 @@ module.exports = {
8888
},
8989
code: {
9090
fontFamily: defaultTheme.fontFamily.mono.join(', '),
91-
backgroundColor: defaultTheme.colors.gray[100],
92-
borderColor: defaultTheme.colors.gray[300],
93-
borderWidth: defaultTheme.borderWidth.default,
91+
color: defaultTheme.colors.gray[900],
92+
fontWeight: '600',
93+
},
94+
'code::before': {
95+
content: '"`"',
96+
},
97+
'code::after': {
98+
content: '"`"',
9499
},
95100
pre: {
96101
color: defaultTheme.colors.gray[300],
@@ -103,11 +108,18 @@ module.exports = {
103108
borderWidth: '0',
104109
borderRadius: '0',
105110
padding: '0',
111+
fontWeight: '400',
106112
color: 'inherit',
107113
fontSize: 'inherit',
108114
fontFamily: 'inherit',
109115
lineHeight: 'inherit',
110116
},
117+
'pre code::before': {
118+
content: '""',
119+
},
120+
'pre code::after': {
121+
content: '""',
122+
},
111123
},
112124
{
113125
fontSize: rem(16),
@@ -123,8 +135,6 @@ module.exports = {
123135
marginBottom: em(24, 20),
124136
},
125137
blockquote: {
126-
fontSize: em(20, 16),
127-
lineHeight: round(32 / 20),
128138
marginTop: em(32, 20),
129139
marginBottom: em(32, 20),
130140
paddingLeft: em(20, 20),
@@ -174,25 +184,12 @@ module.exports = {
174184
},
175185
code: {
176186
fontSize: em(14, 16),
177-
borderRadius: rem(6),
178-
paddingTop: em(4, 14),
179-
paddingRight: em(6, 14),
180-
paddingBottom: em(4, 14),
181-
paddingLeft: em(6, 14),
182187
},
183188
'h2 code': {
184189
fontSize: em(21, 24),
185-
paddingTop: em(4, 21),
186-
paddingRight: em(6, 21),
187-
paddingBottom: em(4, 21),
188-
paddingLeft: em(6, 21),
189190
},
190191
'h3 code': {
191192
fontSize: em(18, 20),
192-
paddingTop: em(3, 18),
193-
paddingRight: em(5, 18),
194-
paddingBottom: em(3, 18),
195-
paddingLeft: em(5, 18),
196193
},
197194
pre: {
198195
fontSize: em(14, 16),
@@ -286,8 +283,6 @@ module.exports = {
286283
marginBottom: em(20, 18),
287284
},
288285
blockquote: {
289-
fontSize: em(18, 14),
290-
lineHeight: round(28 / 18),
291286
marginTop: em(24, 18),
292287
marginBottom: em(24, 18),
293288
paddingLeft: em(20, 18),
@@ -337,25 +332,12 @@ module.exports = {
337332
},
338333
code: {
339334
fontSize: em(12, 14),
340-
borderRadius: rem(4),
341-
paddingTop: em(2, 12),
342-
paddingRight: em(4, 12),
343-
paddingBottom: em(2, 12),
344-
paddingLeft: em(4, 12),
345335
},
346336
'h2 code': {
347337
fontSize: em(18, 20),
348-
paddingTop: em(3, 18),
349-
paddingRight: em(6, 18),
350-
paddingBottom: em(3, 18),
351-
paddingLeft: em(6, 18),
352338
},
353339
'h3 code': {
354340
fontSize: em(16, 18),
355-
paddingTop: em(3, 16),
356-
paddingRight: em(4, 16),
357-
paddingBottom: em(3, 16),
358-
paddingLeft: em(4, 16),
359341
},
360342
pre: {
361343
fontSize: em(12, 14),
@@ -448,8 +430,6 @@ module.exports = {
448430
marginBottom: em(28, 24),
449431
},
450432
blockquote: {
451-
fontSize: em(24, 18),
452-
lineHeight: round(36 / 24),
453433
marginTop: em(40, 24),
454434
marginBottom: em(40, 24),
455435
paddingLeft: em(24, 24),
@@ -499,36 +479,23 @@ module.exports = {
499479
},
500480
code: {
501481
fontSize: em(16, 18),
502-
borderRadius: rem(6),
503-
paddingTop: rem(4),
504-
paddingRight: rem(6),
505-
paddingBottom: rem(4),
506-
paddingLeft: rem(6),
507482
},
508483
'h2 code': {
509484
fontSize: em(26, 30),
510-
paddingTop: em(4, 26),
511-
paddingRight: em(6, 26),
512-
paddingBottom: em(4, 26),
513-
paddingLeft: em(6, 26),
514485
},
515486
'h3 code': {
516487
fontSize: em(21, 24),
517-
paddingTop: em(4, 21),
518-
paddingRight: em(6, 21),
519-
paddingBottom: em(4, 21),
520-
paddingLeft: em(6, 21),
521488
},
522489
pre: {
523490
fontSize: em(16, 18),
524491
lineHeight: round(28 / 16),
525492
marginTop: em(32, 16),
526493
marginBottom: em(32, 16),
527494
borderRadius: rem(6),
528-
paddingTop: em(20, 16),
529-
paddingRight: em(20, 16),
530-
paddingBottom: em(20, 16),
531-
paddingLeft: em(20, 16),
495+
paddingTop: em(16, 16),
496+
paddingRight: em(24, 16),
497+
paddingBottom: em(16, 16),
498+
paddingLeft: em(24, 16),
532499
},
533500
ol: {
534501
marginTop: em(24, 18),
@@ -610,8 +577,6 @@ module.exports = {
610577
marginBottom: em(28, 24),
611578
},
612579
blockquote: {
613-
fontSize: em(30, 20),
614-
lineHeight: round(40 / 30),
615580
marginTop: em(48, 30),
616581
marginBottom: em(48, 30),
617582
paddingLeft: em(32, 30),
@@ -661,35 +626,22 @@ module.exports = {
661626
},
662627
code: {
663628
fontSize: em(18, 20),
664-
borderRadius: rem(8),
665-
paddingTop: em(4, 18),
666-
paddingRight: em(6, 18),
667-
paddingBottom: em(4, 18),
668-
paddingLeft: em(6, 18),
669629
},
670630
'h2 code': {
671631
fontSize: em(31, 36),
672-
paddingTop: em(4, 31),
673-
paddingRight: em(6, 31),
674-
paddingBottom: em(4, 31),
675-
paddingLeft: em(6, 31),
676632
},
677633
'h3 code': {
678634
fontSize: em(27, 30),
679-
paddingTop: em(4, 27),
680-
paddingRight: em(6, 27),
681-
paddingBottom: em(4, 27),
682-
paddingLeft: em(6, 27),
683635
},
684636
pre: {
685637
fontSize: em(18, 20),
686638
lineHeight: round(32 / 18),
687639
marginTop: em(40, 18),
688640
marginBottom: em(40, 18),
689641
borderRadius: rem(8),
690-
paddingTop: em(24, 18),
642+
paddingTop: em(20, 18),
691643
paddingRight: em(24, 18),
692-
paddingBottom: em(24, 18),
644+
paddingBottom: em(20, 18),
693645
paddingLeft: em(24, 18),
694646
},
695647
ol: {
@@ -767,15 +719,13 @@ module.exports = {
767719
},
768720
'.lead': {
769721
fontSize: em(30, 24),
770-
lineHeight: round(48 / 30),
722+
lineHeight: round(44 / 30),
771723
marginTop: em(36, 30),
772724
marginBottom: em(36, 30),
773725
},
774726
blockquote: {
775-
fontSize: em(36, 24),
776-
lineHeight: round(48 / 36),
777-
marginTop: em(56, 36),
778-
marginBottom: em(56, 36),
727+
marginTop: em(64, 36),
728+
marginBottom: em(64, 36),
779729
paddingLeft: em(40, 36),
780730
},
781731
h1: {
@@ -786,15 +736,15 @@ module.exports = {
786736
},
787737
h2: {
788738
fontSize: em(48, 24),
789-
marginTop: em(64, 48),
739+
marginTop: em(72, 48),
790740
marginBottom: em(40, 48),
791-
lineHeight: round(40 / 48),
741+
lineHeight: round(52 / 48),
792742
},
793743
h3: {
794744
fontSize: em(36, 24),
795745
marginTop: em(56, 36),
796746
marginBottom: em(24, 36),
797-
lineHeight: round(40 / 36),
747+
lineHeight: round(44 / 36),
798748
},
799749
h4: {
800750
marginTop: em(48, 24),
@@ -823,35 +773,22 @@ module.exports = {
823773
},
824774
code: {
825775
fontSize: em(20, 24),
826-
borderRadius: rem(8),
827-
paddingTop: em(6, 20),
828-
paddingRight: em(8, 20),
829-
paddingBottom: em(6, 20),
830-
paddingLeft: em(8, 20),
831776
},
832777
'h2 code': {
833778
fontSize: em(42, 48),
834-
paddingTop: em(6, 42),
835-
paddingRight: em(8, 42),
836-
paddingBottom: em(6, 42),
837-
paddingLeft: em(8, 42),
838779
},
839780
'h3 code': {
840781
fontSize: em(32, 36),
841-
paddingTop: em(4, 32),
842-
paddingRight: em(6, 32),
843-
paddingBottom: em(4, 32),
844-
paddingLeft: em(6, 32),
845782
},
846783
pre: {
847784
fontSize: em(20, 24),
848785
lineHeight: round(36 / 20),
849786
marginTop: em(48, 20),
850787
marginBottom: em(48, 20),
851788
borderRadius: rem(8),
852-
paddingTop: em(32, 20),
789+
paddingTop: em(24, 20),
853790
paddingRight: em(32, 20),
854-
paddingBottom: em(32, 20),
791+
paddingBottom: em(24, 20),
855792
paddingLeft: em(32, 20),
856793
},
857794
ol: {
@@ -863,8 +800,8 @@ module.exports = {
863800
marginBottom: em(32, 24),
864801
},
865802
li: {
866-
marginTop: em(16, 24),
867-
marginBottom: em(16, 24),
803+
marginTop: em(12, 24),
804+
marginBottom: em(12, 24),
868805
},
869806
'ol > li': {
870807
paddingLeft: em(40, 24),
@@ -898,12 +835,12 @@ module.exports = {
898835
marginBottom: em(32, 24),
899836
},
900837
'ul ul, ul ol, ol ul, ol ol': {
901-
marginTop: em(20, 24),
902-
marginBottom: em(20, 24),
838+
marginTop: em(16, 24),
839+
marginBottom: em(16, 24),
903840
},
904841
hr: {
905-
marginTop: em(64, 24),
906-
marginBottom: em(64, 24),
842+
marginTop: em(72, 24),
843+
marginBottom: em(72, 24),
907844
},
908845
'hr + *': {
909846
marginTop: '0',

0 commit comments

Comments
 (0)