Skip to content

Commit 19bc167

Browse files
committed
Fix emoji rendering in deployed documentation
Added CSS rules to ensure emojis (✅ ❌ etc.) render with proper color and size in deployed documentation. The issue was missing emoji font family declarations. Changes: - Added emoji font stack with color emoji support - Applied emoji fonts to headings, tables, and content - Ensured proper font-size for table emojis This fixes the issue where emojis showed too small and without color on the deployed site.
1 parent d34bb1b commit 19bc167

File tree

1 file changed

+20
-0
lines changed

1 file changed

+20
-0
lines changed

docs/.vitepress/theme/custom.css

Lines changed: 20 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -66,3 +66,23 @@ html:not(.dark) .diagram-light {
6666
margin-bottom: 0.5rem;
6767
}
6868
}
69+
70+
/* Ensure emojis render correctly with color and proper size */
71+
/* This fixes the issue where ✅ ❌ and other emojis show too small or without color */
72+
:root {
73+
/* Emoji font stack with color emoji support */
74+
--emoji-font-family: "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji", sans-serif;
75+
}
76+
77+
/* Apply emoji font to headings, tables, and general content */
78+
h1, h2, h3, h4, h5, h6,
79+
p, li, td, th,
80+
.vp-doc {
81+
font-family: var(--vp-font-family-base), var(--emoji-font-family);
82+
}
83+
84+
/* Ensure table emojis render at proper size */
85+
table td, table th {
86+
font-size: 1em;
87+
line-height: 1.5;
88+
}

0 commit comments

Comments
 (0)