Buckets:
| /* 1. Use a more-intuitive box-sizing model */ | |
| *, | |
| *::before, | |
| *::after { | |
| box-sizing: border-box; | |
| } | |
| /* 2. Remove default margin */ | |
| * { | |
| margin: 0; | |
| } | |
| /* 3. Enable keyword animations */ | |
| @media (prefers-reduced-motion: no-preference) { | |
| html { | |
| interpolate-size: allow-keywords; | |
| } | |
| } | |
| body { | |
| /* 4. Add accessible line-height */ | |
| line-height: 1.5; | |
| /* 5. Improve text rendering */ | |
| -webkit-font-smoothing: antialiased; | |
| } | |
| /* 6. Improve media defaults */ | |
| img, | |
| picture, | |
| video, | |
| canvas, | |
| svg { | |
| display: block; | |
| max-width: 100%; | |
| } | |
| /* 7. Inherit fonts for form controls */ | |
| input, | |
| button, | |
| textarea, | |
| select { | |
| font: inherit; | |
| } | |
| /* 8. Avoid text overflows */ | |
| p, | |
| h1, | |
| h2, | |
| h3, | |
| h4, | |
| h5, | |
| h6 { | |
| overflow-wrap: break-word; | |
| } | |
| /* 9. Improve line wrapping */ | |
| p { | |
| text-wrap: pretty; | |
| } | |
| h1, | |
| h2, | |
| h3, | |
| h4, | |
| h5, | |
| h6 { | |
| text-wrap: balance; | |
| } | |
| /* | |
| 10. Create a root stacking context | |
| */ | |
| #root, | |
| #__next { | |
| isolation: isolate; | |
| } | |
Xet Storage Details
- Size:
- 916 Bytes
- Xet hash:
- acb252576786fb39f07da5f7f71c3fd78044a4f583b634559583b6ae7c62e055
·
Xet efficiently stores files, intelligently splitting them into unique chunks and accelerating uploads and downloads. More info.