{"id":20961703,"url":"https://github.com/woodbrettm/css-preflight","last_synced_at":"2025-04-11T20:04:25.596Z","repository":{"id":202824751,"uuid":"708200611","full_name":"woodbrettm/css-preflight","owner":"woodbrettm","description":"A CSS Browser Reset Derived From Tailwind’s Preflight, With Optional Added Enhancements and Utilities.","archived":false,"fork":false,"pushed_at":"2023-12-16T01:58:41.000Z","size":175,"stargazers_count":3,"open_issues_count":0,"forks_count":0,"subscribers_count":1,"default_branch":"main","last_synced_at":"2025-04-11T20:04:23.840Z","etag":null,"topics":["browser","css","normalize","normalizer","npm","package","preflight","reset"],"latest_commit_sha":null,"homepage":"","language":"CSS","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/woodbrettm.png","metadata":{"files":{"readme":"README.md","changelog":"CHANGELOG.md","contributing":null,"funding":null,"license":"LICENSE.md","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null,"zenodo":null}},"created_at":"2023-10-21T20:32:56.000Z","updated_at":"2024-12-11T12:36:57.000Z","dependencies_parsed_at":"2023-12-16T02:41:33.304Z","dependency_job_id":"97b194e3-626c-4ec5-af22-34030c3f1d1b","html_url":"https://github.com/woodbrettm/css-preflight","commit_stats":null,"previous_names":["woodbrettm/css-preflight"],"tags_count":10,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/woodbrettm%2Fcss-preflight","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/woodbrettm%2Fcss-preflight/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/woodbrettm%2Fcss-preflight/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/woodbrettm%2Fcss-preflight/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/woodbrettm","download_url":"https://codeload.github.com/woodbrettm/css-preflight/tar.gz/refs/heads/main","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":248473129,"owners_count":21109628,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["browser","css","normalize","normalizer","npm","package","preflight","reset"],"created_at":"2024-11-19T02:15:43.654Z","updated_at":"2025-04-11T20:04:25.570Z","avatar_url":"https://github.com/woodbrettm.png","language":"CSS","funding_links":[],"categories":[],"sub_categories":[],"readme":"# CSS Preflight\n\n[![npm](https://img.shields.io/npm/v/css-preflight?color=red)](https://www.npmjs.com/package/css-preflight)\n[![License: MIT](https://img.shields.io/badge/License-MIT-blue.svg)](https://github.com/woodbrettm/css-preflight/blob/main/LICENSE.md)\n\nThis is a CSS browser reset based on Tailwind's preflight, optimized for non-Tailwind projects. **Optional** enhancements like smooth scrolling and other utilities are also provided (see usage).\n\n## Preflight\n\nThe following adjustments have been made to Tailwind's preflight, located in `styles/preflight.css`:\n\n1. Tailwind-specific CSS variables removed.\n2. Tailwind postcss functions like `theme()` removed.\n3. Vendor prefixes (e.g. `-webkit-`, `-moz-`) from css properties have been removed, to avoid duplication\n   from autoprefixer when used. Inline comments in the `preflight.css` source code indicate which of\n   these have been adjusted and note the original existing prefix.\n4. system-ui fonts have been removed completely from `font-family` properties in exchange for\n   either websafe fonts (e.g. Courier New for monospace elements), or removed completely (in the case\n   of the original preflight's font-family on `:root`).\n\n#### Removing System UI Fonts\n\nsystem-ui fonts can be problematic as they not only depend on the OS version, but on the language\nsettings of the OS as well. These have been removed as it's felt they're too unpredictable to be\nleft in as a preflight, and better left for a dev to intentionally specify them.\n\n## Installation\n\n```bash\n#pnpm\npnpm add css-preflight\n\n#npm\nnpm install css-preflight\n```\n\n## Usage\n\nThe exports are broken down into 4 main CSS files. Completely\nunprocessed so it's up to the dev to pass them through optimizations like\nAutoprefixer and minification.\n\nSimply import these into the root layout file (like `Layout.astro` for example).\nThey should be imported first before any other CSS imports.\n\n#### Possible Imports\n\n```javascript\nimport 'css-preflight'; // styles/preflight.css\nimport 'css-preflight/preflight'; // ALIAS: styles/preflight.css\n\nimport 'css-preflight/enhancements'; // styles/enhancements.css\nimport 'css-preflight/smooth-scroll'; // styles/smooth-scroll.css\nimport 'css-preflight/rem-same-px'; // styles/rem-same-px.css\n```\n\n#### Typical Setup\n\n```javascript\nimport 'css-preflight';\nimport 'css-preflight/enhancements';\n```\n\n### Preflight\n\nTailwind preflight (with adjustments mentioned previously). Can either do a bare\n`css-preflight` import, or use the more verbose option of `css-preflight/preflight`.\nBoth are exactly the same.\n\n### Enhancements\n\nThese are small enhancements added to the main preflight:\n\n- Adds `text-wrap: balance` on h1-h6 and blockquote. Helps prevent hanging words on newlines.\n\n### Smooth Scroll\n\nEnables smooth scrolling to anchor points (e.g. #about). Disabled for `prefers-reduced-motion`.\n\n### Rem Same Px\n\nSets rem equal to 1px at the root for easier design-dev handoff. This calculation is done\nusing `%`, so the browser root font size will still affect fonts using `rem` for\naccessibility purposes.\n\n### License\n\nThe repo falls under MIT licensing, contained in the LICENSE.md file.\nUsage of the `preflight.css` file is also subject to Tailwind's licensing (MIT), which is included\nin the repo for reference.\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fwoodbrettm%2Fcss-preflight","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fwoodbrettm%2Fcss-preflight","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fwoodbrettm%2Fcss-preflight/lists"}