Fix inconsistent blurry text across Chrome and Firefox
- Disable font smoothing completely with 'none' - Use optimizeSpeed text rendering for crispness - Force Tahoma font (classic Windows XP UI font) - Remove all transforms and 3D perspective - Use integer pixel font sizes This should make all buttons, especially dynamically created ones like transcript toggles, render consistently crisp across all browsers. 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <noreply@anthropic.com>
This commit is contained in:
parent
06c830607f
commit
60e2c49811
@ -1,25 +1,36 @@
|
|||||||
/* Custom styles for XP.css integration */
|
/* Custom styles for XP.css integration */
|
||||||
|
|
||||||
/* Fix blurry text rendering - use native subpixel rendering */
|
/* Fix blurry text rendering - override XP.css font smoothing */
|
||||||
|
.window,
|
||||||
|
.window *,
|
||||||
button,
|
button,
|
||||||
input,
|
input,
|
||||||
select,
|
select,
|
||||||
|
textarea {
|
||||||
|
-webkit-font-smoothing: none !important;
|
||||||
|
-moz-osx-font-smoothing: unset !important;
|
||||||
|
font-smooth: auto !important;
|
||||||
|
text-rendering: optimizeSpeed !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Use classic Windows fonts for crisp rendering */
|
||||||
|
button {
|
||||||
|
font-family: "Tahoma", "MS Sans Serif", sans-serif;
|
||||||
|
font-size: 11px;
|
||||||
|
line-height: normal;
|
||||||
|
transform: none !important;
|
||||||
|
filter: none !important;
|
||||||
|
backface-visibility: visible !important;
|
||||||
|
perspective: none !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Ensure all form controls use same font */
|
||||||
|
input,
|
||||||
|
select,
|
||||||
textarea,
|
textarea,
|
||||||
label {
|
label {
|
||||||
-webkit-font-smoothing: subpixel-antialiased;
|
font-family: "Tahoma", "MS Sans Serif", sans-serif;
|
||||||
-moz-osx-font-smoothing: auto;
|
font-size: 11px;
|
||||||
font-smooth: never;
|
|
||||||
-webkit-font-feature-settings: "liga" 0;
|
|
||||||
font-feature-settings: "liga" 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* Ensure buttons don't have filters or transforms that cause blur */
|
|
||||||
button {
|
|
||||||
filter: none !important;
|
|
||||||
will-change: auto;
|
|
||||||
image-rendering: crisp-edges;
|
|
||||||
image-rendering: -moz-crisp-edges;
|
|
||||||
image-rendering: -webkit-optimize-contrast;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
body {
|
body {
|
||||||
|
|||||||
Loading…
x
Reference in New Issue
Block a user