Improve code snippet styles in light and dark mode

This commit is contained in:
Oliver Davies 2020-12-16 22:11:33 +00:00
parent c8b737a537
commit 832b2897f3

View file

@ -28,10 +28,7 @@ module.exports = {
color: theme('colors.blue.500') color: theme('colors.blue.500')
}, },
code: { code: {
backgroundColor: theme('colors.gray.200'), backgroundColor: theme('colors.gray.150'),
borderColor: theme('colors.gray.400'),
borderStyle: 'solid',
borderWidth: '1px',
fontWeight: theme('fontWeight.normal'), fontWeight: theme('fontWeight.normal'),
paddingBottom: theme('spacing.px'), paddingBottom: theme('spacing.px'),
paddingLeft: theme('spacing.1'), paddingLeft: theme('spacing.1'),
@ -43,13 +40,10 @@ module.exports = {
marginTop: theme('spacing.8') marginTop: theme('spacing.8')
}, },
pre: { pre: {
backgroundColor: theme('colors.gray.200'), backgroundColor: theme('colors.gray.750'),
borderLeftColor: theme('colors.gray.400'),
borderLeftStyle: 'solid',
borderLeftWidth: '3px',
borderRadius: '0', borderRadius: '0',
color: theme('colors.gray.800'), color: theme('colors.gray.200'),
padding: theme('spacing.6') padding: theme('spacing.4')
}, },
'code::before': false, 'code::before': false,
'code::after': false, 'code::after': false,
@ -61,6 +55,11 @@ module.exports = {
css: { css: {
color: theme('colors.gray.200'), color: theme('colors.gray.200'),
code: {
backgroundColor: theme('colors.gray.750'),
color: theme('colors.gray.200')
},
'h2, h3': { 'h2, h3': {
color: theme('colors.white') color: theme('colors.white')
}, },
@ -78,6 +77,7 @@ module.exports = {
gray: { gray: {
50: "#f9f9f9", 50: "#f9f9f9",
100: "#f5f5f5", 100: "#f5f5f5",
150: '#eee',
200: "#aaa", 200: "#aaa",
700: "#36393e", 700: "#36393e",
750: "#2e3136", 750: "#2e3136",