{"id":22994870,"url":"https://github.com/scriptype/uscss","last_synced_at":"2025-08-13T22:32:09.251Z","repository":{"id":16852736,"uuid":"19612654","full_name":"scriptype/USCSS","owner":"scriptype","description":"United States of CSS Elements","archived":false,"fork":false,"pushed_at":"2014-06-10T01:53:10.000Z","size":2036,"stargazers_count":11,"open_issues_count":2,"forks_count":0,"subscribers_count":4,"default_branch":"master","last_synced_at":"2024-12-10T17:31:21.383Z","etag":null,"topics":[],"latest_commit_sha":null,"homepage":null,"language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":null,"status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/scriptype.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":null,"code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null}},"created_at":"2014-05-09T13:50:20.000Z","updated_at":"2021-05-07T13:48:44.000Z","dependencies_parsed_at":"2022-09-06T17:40:24.984Z","dependency_job_id":null,"html_url":"https://github.com/scriptype/USCSS","commit_stats":null,"previous_names":[],"tags_count":0,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/scriptype%2FUSCSS","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/scriptype%2FUSCSS/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/scriptype%2FUSCSS/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/scriptype%2FUSCSS/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/scriptype","download_url":"https://codeload.github.com/scriptype/USCSS/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":229786945,"owners_count":18123998,"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":[],"created_at":"2024-12-15T05:27:39.909Z","updated_at":"2024-12-15T05:27:40.566Z","avatar_url":"https://github.com/scriptype.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"USCSS\n=====\n\nUnited States of CSS Selectors.\n\nAllows to declare rules for all states of an element in one line.\n\n```css\nelement {\n  $states: :hover, :active, .small;\n  display: block;\n  font-style: italic;\n  color: [blue, red];\n  margin: [0, 0 50px, 0 25px, 10px];\n  font-size: [1em, 1em, .8em]\n}\n```\n\nwill compile into:\n\n```css\nelement {\n    display: block;\n    font-style: italic;\n\tcolor: blue;\n\tmargin: 0;\n\tfont-size: 1em;\n}\nelement:hover {\n\tcolor: red;\n\tmargin: 0 50px;\n\tfont-size: 1em;\n}\nelement:active {\n\tmargin: 0 25px;\n\tfont-size: .8em;\n}\nelement.small {\n\tmargin: 10px;\n}\n```\n\n1.1.0\n=====\n\nAs of 1.1.0 USCSS now allows for nested rules, but not in the fashion as LESS/SASS allows. You should use a \"$\" character at the beginning of children selector. Children selectors must be written relative to the main element. i.e. `\"$ a\" -\u003e el a {...}`\n\n```css\np {\n    $states: :not(.hede), $ a, $ i em:hover b;\n    color: [blue, red, yellow, green];\n    background: [url(lel.png),\n                (url(lol.png) left center, url(ley.png) right bottom),\n                blue,\n                #f08];\n    \n}\n```\n\nwill compile into:\n\n```css\np {\n\tcolor: blue;\n\tbackground: url(lel.png);\n}\np:not(.hede) {\n\tcolor: red;\n\tbackground: url(lol.png) left center, url(ley.png) right bottom;\n}\np a {\n\tcolor: yellow;\n\tbackground: blue;\n}\np i em:hover b {\n\tcolor: green;\n\tbackground: #f08;\n}\n```\n\nHow to start\n============\n\nIn the main directory of project run `node demo/uscss.js`.\n\n`style.css` will appear next to it. You can configure input and output paths/files in uscss.json.\n\nYou only need \"lib\" folder and files in the demo folder.\n\nTest\n====\n\nFirst run `npm install` to install `jasmine-node`. This is the only dependency.\n\nIn the main directory, run `jasmine-node test`","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fscriptype%2Fuscss","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fscriptype%2Fuscss","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fscriptype%2Fuscss/lists"}