diff --git a/apps/rowboat/app/globals.css b/apps/rowboat/app/globals.css index a95e1df0..35f6b55b 100644 --- a/apps/rowboat/app/globals.css +++ b/apps/rowboat/app/globals.css @@ -10,12 +10,33 @@ @reference 'tailwindcss'; @layer utilities { + + /* for hig DPI windows display */ + *{ + box-sizing: border-box; + } + .text-balance { text-wrap: balance; } .custom-scrollbar { scrollbar-width: thin; scrollbar-color: rgba(156, 163, 175, 0.3) transparent; + + /* for different browsers */ + &::-webkit-scrollbar{ + width: 4px; + height: 4px; + } + + &::-webkit-scrollbar-track{ + background: transparent; + } + + &::-webkit-scrollbar-thumb{ + background-color: rgba(156, 163, 175, 0.3); + border-radius: 4px; + } } .custom-scrollbar::-webkit-scrollbar { @@ -121,8 +142,24 @@ html, body { html { font-family: 'Inter', system-ui, -apple-system, sans-serif; + + /*For Windows font smoothing and windows compatible*/ + -webkit-font-smoothing: antialiased; + -moz-osx-font-smoothing: grayscale; + text-rendering: optimizeLegibility; + + -webkit-text-size-adjust: 100%; + -ms-text-size-adjust: 100%; + text-size-adjust: 100%; } +/* Windows font rendering fix */ +@media screen and (-webkit-min-device-pixel-ratio: 0) { + body { + -webkit-font-smoothing: antialiased; + -webkit-font-smoothing: antialiased + } +} body { background: var(--background); color: var(--foreground);