mirror of
https://github.com/ChenQihan666/MyBlog-Next.git
synced 2026-08-14 11:01:42 +08:00
fix: solve invisible text code block issue in light-mode (#163)
* fix: pre > code font color Co-authored-by: Nomango <nomango@qq.com> Co-authored-by: shuaixr <1025sxr@gmail.com> * refactor: extend other css properties besides typography Update theme extend to include other properties like textColor etc, to clarify confusion. --------- Co-authored-by: shuaixr <1025sxr@gmail.com> Co-authored-by: Sat Naing <satnaingdev@gmail.com>
This commit is contained in:
+50
-40
@@ -17,49 +17,59 @@ module.exports = {
|
||||
sm: "640px",
|
||||
},
|
||||
|
||||
// Uncomment the following extend
|
||||
// if existing Tailwind color palette will be used
|
||||
extend: {
|
||||
textColor: {
|
||||
skin: {
|
||||
base: withOpacity("--color-text-base"),
|
||||
accent: withOpacity("--color-accent"),
|
||||
inverted: withOpacity("--color-fill"),
|
||||
},
|
||||
},
|
||||
backgroundColor: {
|
||||
skin: {
|
||||
fill: withOpacity("--color-fill"),
|
||||
accent: withOpacity("--color-accent"),
|
||||
inverted: withOpacity("--color-text-base"),
|
||||
card: withOpacity("--color-card"),
|
||||
"card-muted": withOpacity("--color-card-muted"),
|
||||
},
|
||||
},
|
||||
outlineColor: {
|
||||
skin: {
|
||||
fill: withOpacity("--color-accent"),
|
||||
},
|
||||
},
|
||||
borderColor: {
|
||||
skin: {
|
||||
line: withOpacity("--color-border"),
|
||||
fill: withOpacity("--color-text-base"),
|
||||
accent: withOpacity("--color-accent"),
|
||||
},
|
||||
},
|
||||
fill: {
|
||||
skin: {
|
||||
base: withOpacity("--color-text-base"),
|
||||
accent: withOpacity("--color-accent"),
|
||||
},
|
||||
transparent: "transparent",
|
||||
},
|
||||
fontFamily: {
|
||||
mono: ["IBM Plex Mono", "monospace"],
|
||||
},
|
||||
|
||||
// extend: {
|
||||
textColor: {
|
||||
skin: {
|
||||
base: withOpacity("--color-text-base"),
|
||||
accent: withOpacity("--color-accent"),
|
||||
inverted: withOpacity("--color-fill"),
|
||||
typography: {
|
||||
DEFAULT: {
|
||||
css: {
|
||||
pre: {
|
||||
color: false,
|
||||
},
|
||||
code: {
|
||||
color: false,
|
||||
},
|
||||
},
|
||||
},
|
||||
},
|
||||
},
|
||||
backgroundColor: {
|
||||
skin: {
|
||||
fill: withOpacity("--color-fill"),
|
||||
accent: withOpacity("--color-accent"),
|
||||
inverted: withOpacity("--color-text-base"),
|
||||
card: withOpacity("--color-card"),
|
||||
"card-muted": withOpacity("--color-card-muted"),
|
||||
},
|
||||
},
|
||||
outlineColor: {
|
||||
skin: {
|
||||
fill: withOpacity("--color-accent"),
|
||||
},
|
||||
},
|
||||
borderColor: {
|
||||
skin: {
|
||||
line: withOpacity("--color-border"),
|
||||
fill: withOpacity("--color-text-base"),
|
||||
accent: withOpacity("--color-accent"),
|
||||
},
|
||||
},
|
||||
fill: {
|
||||
skin: {
|
||||
base: withOpacity("--color-text-base"),
|
||||
accent: withOpacity("--color-accent"),
|
||||
},
|
||||
transparent: "transparent",
|
||||
},
|
||||
fontFamily: {
|
||||
mono: ["IBM Plex Mono", "monospace"],
|
||||
},
|
||||
// },
|
||||
},
|
||||
plugins: [require("@tailwindcss/typography")],
|
||||
};
|
||||
|
||||
Reference in New Issue
Block a user