A generic set of stylesheet classes - In css, less & scss formats
bower install --save snippet-ss
or npm install --save snippet-ss
- All the styles are originally scripted in less, its then transpiled into css and scss by the build command
- All the transpiled scripts will be committed for ease at the user end
npm test
- The demo page (tests/index.html) must be built, and opened in your default browser.
npm run build
npm run build:css
npm run build:scss
Parameterised mixins would be available only in less & scss
- .no-mouse [alias - no-pointer]
- .no-select
- .no-display
- .no-visible
- .no-active
- .no-margin
- .no-padding
- .no-border
- .no-wrap
The glow is appended onto existing box-shadow value
- .outer-glow(@color)
- .inner-glow(@color)
- .text-outer-glow(@color)
- .shadow(@color)
- .left-shadow(@color)
- .right-shadow(@color)
- .white-outer-glow
- .white-inner-glow
- .white-text-outer-glow
- .dark-shadow
- .dark-left-shadow
- .dark-right-shadow
- .glass
- Default background color is grey, you can change that in less using background-color or other related property. Also the pattern is appended onto existing patterns
- Add
animate
class to make the background scroll horizontally- .noise-bg
- .dotted-bg
- .checker-bg
- .diagonal-stripes-bg
- .dotted-background(@light-color, @dark-color)
- .checker-background(@light-color, @dark-color)
- .diagonal-stripes-background(@light-color, @dark-color)
- .clear-fix
- .force-gpu - Just to force hardware acceleration for the element
- .force-scrollbar - To replace OSx Lion’s hidden scroll-bar behavior. So that a scroll-bar is displayed whenever scrolling is possible. Supported only by WebKit.
- .use-border-padding-in-width-height - Border & padding size would be considered as part of width or height
- .use-border-box - Alias for use-border-padding-in-width-height
- .use-ellipsis - Uses ellipsis to denote overflowing text
- .opacity(@opacity)
- @opacity must be a value from 0 to 1
- Previously it was under functions file
- .serif-georgia
- .serif-times
- .serif-palatino
- .san-helvetica
- .san-verdana
- .san-arial
- .san-comic
- .san-impact
- .san-lucida
- .san-tahoma
- .san-trebuchet
- .mono-courier
- .mono-lucida