{"id":13397462,"url":"https://github.com/varemenos/verepo","last_synced_at":"2025-07-20T09:33:01.195Z","repository":{"id":9046504,"uuid":"10810878","full_name":"varemenos/verepo","owner":"varemenos","description":"veRepo is a SASS library of modules and mixins for robust and maintainable front-end development using SASS.","archived":false,"fork":false,"pushed_at":"2015-02-15T19:00:21.000Z","size":1233,"stargazers_count":16,"open_issues_count":0,"forks_count":1,"subscribers_count":2,"default_branch":"master","last_synced_at":"2025-07-05T18:33:31.064Z","etag":null,"topics":["frontend","library","mixins","modules","sass","scss"],"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/varemenos.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE.md","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null}},"created_at":"2013-06-20T02:47:26.000Z","updated_at":"2021-04-27T14:14:48.000Z","dependencies_parsed_at":"2022-07-09T22:30:31.110Z","dependency_job_id":null,"html_url":"https://github.com/varemenos/verepo","commit_stats":null,"previous_names":[],"tags_count":4,"template":false,"template_full_name":null,"purl":"pkg:github/varemenos/verepo","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/varemenos%2Fverepo","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/varemenos%2Fverepo/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/varemenos%2Fverepo/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/varemenos%2Fverepo/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/varemenos","download_url":"https://codeload.github.com/varemenos/verepo/tar.gz/refs/heads/master","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/varemenos%2Fverepo/sbom","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":266100807,"owners_count":23876660,"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":["frontend","library","mixins","modules","sass","scss"],"created_at":"2024-07-30T18:01:25.321Z","updated_at":"2025-07-20T09:33:01.106Z","avatar_url":"https://github.com/varemenos.png","language":"CSS","funding_links":[],"categories":["CSS"],"sub_categories":[],"readme":"# veRepo - SASS Library\n\n## Table of Content\n\n* [About](#about)\n* [Documentation](#documentation)\n\t* [Live](#live)\n* [Guides](#guides)\n\t* [How to use veRepo](#how-to-use-verepo)\n\t* [Usage Examples](#usage-examples)\n\t* [Bower](#bower)\n\t* [Grunt.js](#gruntjs)\n\t* [SCSS to SASS](#scss-to-sass)\n* [Contribution Guidelines](#contribution-guidelines)\n* [License](#license)\n* [Credits](#credits)\n\n## About\n\nveRepo is a SASS library of modules and mixins for robust and maintainable front-end development using SASS. Most of the modular items/objects in this repo will work by just adding 1 class name to the html element you desire to style (although there are some exceptions).\n\n## Documentation\n\n### Live\n\nVisit [this link](http://varemenos.github.io/verepo/docs/) to read the online version, or follow the next steps to get a local version:\n\n1. To generate the docs you have to use the grunt command that generates the docs mentioned [here](https://github.com/varemenos/verepo#gruntjs).\n\n2. To view the docs you need to serve them in an http server. One of the fastest ways to do that is via python's httpserver: `cd docs` and then `python -m http.server`\n\n## Guides\n\n### How to use veRepo\n\n(It is highly recommended to use veRepo via [bower](https://github.com/varemenos/verepo#bower))\n\nAssuming that your current file structure looks like this:\n\n\tassets\n\t└──css\n\t\t├── _style.scss\n\t\t└── _verepo.scss\n\nWhere `style.scss` is the main stylesheet of your project and `verepo` is the distributable verepo library file found in the root directory of this repository. Now all you have to do is to import the `_verepo.scss` file inside of `style.scss` and then use it's components by using `@include`.\n\n### Usage Examples\n\n__example #1:__\n\n```scss\n@import \"_verepo\";\n@include normalize;\n```\n\nThis will include the latest normalize.css version\n\n__example #2:__\n\n```scss\n@import \"_verepo\";\n\n.blue-flat-button{\n\t@include button(#fff, #09f, 0);\n}\n```\n\nThe above will be processed into the following:\n\n```css\n.blue-flat-button {\n\tposition: relative;\n\tdisplay: inline-block;\n\tpadding: 0.5em 1em;\n\tcolor: white;\n\ttext-decoration: none;\n\tbackground-color: #0099ff;\n\tborder: 1px solid #007acc;\n\tborder-radius: 0;\n\tbackground-clip: padding-box;\n\ttransition: 150ms ease-in-out background-color, 150ms ease-in-out box-shadow;\n}\n\n.blue-flat-button:hover,\n.blue-flat-button:focus {\n\tcursor: pointer;\n\tbackground-color: #4db8ff;\n}\n\n.blue-flat-button:active {\n\tcursor: pointer;\n\tbox-shadow: 0 0 3px #0099ff, 0 0 0.5em rgba(0, 0, 0, 0.25) inset;\n}\n```\n\n### Bower\n\nveRepo is now in the bower package directory and you can install it by simply running this command:\n\n\tbower install verepo\n\n### Grunt.js\n\nWhile being in the root directory of the repository you need to run `npm install` which will allow you to use gruntjs by installing all the dependencies of the current project. After that, you can perform one of these tasks:\n\n1. `grunt update-docs` to compile the docs\n2. `grunt update-dist` to compile the distributable `_verepo.scss` file\n3. `grunt update-example` to compile the sass file for the example page\n4. `grunt update` or `grunt` to run the 3 tasks above.\n6. `grunt connect` to initiate a simple http server at http://localhost:8000 which will server a local viewer for the example website and docs\n\nto stop the tasks, you need to press `CTRL` + `C`\n\n### SCSS to SASS\n\nFor the SASS syntax lovers or the SCSS syntax haters, you can use `sass-convert` to convert the scss files to sass. Later on I might write a script to automate it but currently it doesn't seem wise to develop a tool which will most probably be rewriten again due to this repository's current state (alpha phase).\n\n## Contribution Guidelines\n\n1. Read [CONTRIBUTE.md](CONTRIBUTE.md)\n2. When creating a new verepo \"object\", you need to:\n\t1. include the `.scss` file inside the verepo library's directory\n\t2. name it after it's mixin but since it's a partial, prepend a `_` in the name (for example `_grid.scss`)\n3. Inside the file you just created:\n\t1. Include the documentation declaration (for syntax and information, [read here](http://sassdoc.com/annotations/))\n\t2. Include any import declarations\n\t3. Include any `TODO:` declarations\n\t4. Include the code (mixins, functions etc)\n\t5. If the mixin you've created takes no parameters, then create an `@extend` declaration with the same name which will include the mixin you've just created (for example: `%clearfix{ @include @clearfix; }`)\n\t6. If you create more than 1 mixin in the file, then repeat the previous steps for each mixin\n4. Finally you need to do the following to submit your changes:\n\t1. Re-generate the verepo documentation locally (there is a guide for this which is mentioned above)\n\t2. Run `grunt update` to update the documentation, example page and distributable `_verepo.scss` file\n\t3. Push the changes\n\t4. Update ghpages by running this command while in the root of the verepo repository directory: `git checkout gh-pages \u0026\u0026 git merge master \u0026\u0026 git push \u0026\u0026 git checkout master`\n\t5. Finally bump the project version by doing the following:\n\t\t1. Read [semver's spec](http://semver.org/) and deside whether the changes you've made are considered `patch`, `minor` or `major`\n\t\t2. Then use grunt bump to update the project verion with the following command: `grunt bump:patch` or `grunt bump:minor` or `grunt bump:major`\n\t6. Do a Pull-Request\n\n## About prefix mixins\n\nFrom v0.0.3 and onwards prefixes will be removed. Please Autoprefixer instead!\n\n## License\n\n\tThe MIT License (MIT)\n\n\tCopyright (c) 2013 Adonis K.\n\n\tPermission is hereby granted, free of charge, to any person obtaining a copy\n\tof this software and associated documentation files (the \"Software\"), to deal\n\tin the Software without restriction, including without limitation the rights\n\tto use, copy, modify, merge, publish, distribute, sublicense, and/or sell\n\tcopies of the Software, and to permit persons to whom the Software is\n\tfurnished to do so, subject to the following conditions:\n\n\tThe above copyright notice and this permission notice shall be included in\n\tall copies or substantial portions of the Software.\n\n\tTHE SOFTWARE IS PROVIDED \"AS IS\", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR\n\tIMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,\n\tFITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE\n\tAUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER\n\tLIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,\n\tOUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN\n\tTHE SOFTWARE.\n\n## Credits\n\n* The `CONTRIBUTE.md` file of this project is a slightly modified copy `CONTRIBUTE.md` file from the normalize.css project.\n* Some of the partials in this repo were inspired by [scut](https://github.com/davidtheclark/scut)\n* Stubbornella for the [media object](www.stubbornella.org/content/2010/06/25/the-media-object-saves-hundreds-of-lines-of-code/)\n* TODO add more\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fvaremenos%2Fverepo","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fvaremenos%2Fverepo","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fvaremenos%2Fverepo/lists"}