{"id":18585184,"url":"https://github.com/programmierenm/utility-css-with-scss","last_synced_at":"2025-10-16T21:36:44.918Z","repository":{"id":153346402,"uuid":"480826342","full_name":"ProgrammierenM/utility-css-with-scss","owner":"ProgrammierenM","description":"Erstelle dein eigenes Utility CSS mit SASS/SCSS","archived":false,"fork":false,"pushed_at":"2022-04-22T10:45:36.000Z","size":5,"stargazers_count":0,"open_issues_count":0,"forks_count":0,"subscribers_count":1,"default_branch":"master","last_synced_at":"2025-02-17T16:52:27.262Z","etag":null,"topics":["sass","scss"],"latest_commit_sha":null,"homepage":"","language":"SCSS","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/ProgrammierenM.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE","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}},"created_at":"2022-04-12T13:39:17.000Z","updated_at":"2022-04-22T10:46:50.000Z","dependencies_parsed_at":null,"dependency_job_id":"30129ae9-f11e-4db2-a8b0-742ba8cd27b6","html_url":"https://github.com/ProgrammierenM/utility-css-with-scss","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/ProgrammierenM%2Futility-css-with-scss","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/ProgrammierenM%2Futility-css-with-scss/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/ProgrammierenM%2Futility-css-with-scss/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/ProgrammierenM%2Futility-css-with-scss/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/ProgrammierenM","download_url":"https://codeload.github.com/ProgrammierenM/utility-css-with-scss/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":254478193,"owners_count":22077676,"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":["sass","scss"],"created_at":"2024-11-07T00:31:40.754Z","updated_at":"2025-10-16T21:36:39.869Z","avatar_url":"https://github.com/ProgrammierenM.png","language":"SCSS","funding_links":[],"categories":[],"sub_categories":[],"readme":"# Utility CSS mit SCSS erstellen\n\nErstelle dein eigenes Utility CSS mit SASS/SCSS. In diesem Tutorial zeige ich dir wie du dir dein eigenes Klassen-System ähnlich der von Tailwind CSS oder Bootstrap aufbauen kannst. Wir generieren Klassen für das Spacing, eine Color Map und ein einfaches Grid System, welches an Bootstrap angelehnt ist. Happy Coding!\n\n[![Tutorial bei Youtube](http://img.youtube.com/vi/0_hNJPMgFAg/0.jpg)](https://youtu.be/0_hNJPMgFAg)\n\n## 📺 Playlists\n\n[Webentwicklung für Anfänger](https://www.youtube.com/playlist?list=PLnqycjkeRGqmrzCAVKOc4RPhFWFMVpZ6x)\n\n[CSS Tutorials Deutsch](https://www.youtube.com/playlist?list=PLnqycjkeRGqmNb4zay7i46-57KgnO_xcD)\n\n[Visual Studio Code Tutorials](https://www.youtube.com/playlist?list=PLnqycjkeRGqmlJvXkxqSvIynlxaiKecPN)\n\n[Frameworks, Libraries und Tools](https://www.youtube.com/playlist?list=PLnqycjkeRGqnqag9WBK1THbdwsf2E-6cV)\n\n[Programmieren: Tipps, Ideen, Gedanken und Meinungen](https://www.youtube.com/playlist?list=PLnqycjkeRGqmxW1HaS897rvCapowxbtYH)\n\n## Vernetze dich:\n\n[\u003cimg align=\"left\" alt=\"programmierenmitmario.de\" width=\"22px\" src=\"https://raw.githubusercontent.com/iconic/open-iconic/master/svg/globe.svg\" /\u003e][website]\n[\u003cimg align=\"left\" alt=\"programmierenmitmario | YouTube\" width=\"22px\" src=\"https://cdn.jsdelivr.net/npm/simple-icons@v3/icons/youtube.svg\" /\u003e][youtube]\n[\u003cimg align=\"left\" alt=\"programmierenmitmario | Twitter\" width=\"22px\" src=\"https://cdn.jsdelivr.net/npm/simple-icons@v3/icons/twitter.svg\" /\u003e][twitter]\n[\u003cimg align=\"left\" alt=\"programmierenmitmario | Instagram\" width=\"22px\" src=\"https://cdn.jsdelivr.net/npm/simple-icons@v3/icons/instagram.svg\" /\u003e][instagram]\n\u003cbr\u003e\n\u003cbr\u003e\n\n## Projekt Setup\n\nFühre diesen Befehl im Terminal einmalig aus um alle notwendigen Dependencies zu installieren.\n\n```\nnpm install\n```\n\n### Kompeliere SCSS zu CSS für Development\n\n```\nnpm run sass-dev\n```\n\n### Kompeliere SCSS zu CSS für Produktion\n\n```\nnpm run sass-prod\n```\n\n## License\n\n[MIT](LICENSE)\n\n[website]: http://programmierenmitmario.de\n[twitter]: https://twitter.com/programmierenm\n[youtube]: https://youtube.com/programmierenmitmario\n[instagram]: https://instagram.com/programmierenm\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fprogrammierenm%2Futility-css-with-scss","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fprogrammierenm%2Futility-css-with-scss","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fprogrammierenm%2Futility-css-with-scss/lists"}