https://github.com/tivix/strapless
Strapless is a color-changing CSS boilerplate for HTML elements, and a powerful LessCSS library for colors and patterns.
https://github.com/tivix/strapless
color css css-framework design html less
Last synced: 12 days ago
JSON representation
Strapless is a color-changing CSS boilerplate for HTML elements, and a powerful LessCSS library for colors and patterns.
- Host: GitHub
- URL: https://github.com/tivix/strapless
- Owner: Tivix
- License: mit
- Created: 2016-07-27T22:16:34.000Z (over 8 years ago)
- Default Branch: master
- Last Pushed: 2018-02-19T20:32:09.000Z (about 7 years ago)
- Last Synced: 2025-04-12T04:13:16.111Z (12 days ago)
- Topics: color, css, css-framework, design, html, less
- Language: CSS
- Homepage: http://www.strapless.io
- Size: 2.99 MB
- Stars: 27
- Watchers: 62
- Forks: 2
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
Strapless
=========
Basic setup
---------
Make sure you've got Less (http://lesscss.org/) up and running before starting with Strapless. Basic understanding of Less scope, Less importing and, well, just Less in general is recommended.
Use Strapless as the base of your project by renaming **strapless.less** into **[your project name here].less**. Or **index.less**. Or whatever you want. It's up to you. Strapless is intended as a starting point for your project's CSS/Less.
To add your own CSS rules, simply insert your own Less after the core Strapless library files. You can also edit the Strapless library directly, just remember anything included as a *(reference)* in **strapless.less** doesn't output CSS directly, and editing library files might make it harder to update Strapless in the future. If you find yourself overwriting too many rules for a particular element, you can start from scratch by commenting it out in **strapless.less**.
Strapless is really opinionated in its approach. It's okay if you comment a few things out. We won't be offended.
Everything that's included
---------
Here's what's included:
`settings.less`
Project settings are defined here. Edit them here or redefine them later and let lazy loading do its thing.
`mixins.less`
Strapless has a few mixins for determining text contrast. They're all determined to do the same thing: Make text and background colors work together to achieve target contrast ratios.
`colors.less`
Generates all of Strapless's color variables. These are documented in `settings.less` in variable name lists. (Strapless uses variable name lists because variable names sometimes end up as CSS classes.)
`patterns.less`
Contains mixins for generating patterns.
`targets.less`
Ruleset mixins for different targets, including responsiveness targets.
`elements/`
The elements folder contains Less for HTML elements. Each file is named for its element, while `etc.less` is a catch-all for rules too small for their own file.
`utilities.less`
CSS class utilities.