Functional Sass framework for rapid and painless development
APACHE-2.0 License
Install framework with NPM:
npm install ekzo --save
Import parts you would like to use, like:
@import 'node_modules/ekzo/tools/index';
@import 'node_modules/ekzo/settings.defaults/assets';
@import 'node_modules/ekzo/settings.defaults/framework';
@import 'node_modules/ekzo/settings.defaults/misc';
@import 'node_modules/ekzo/settings.defaults/options';
@import 'node_modules/ekzo/settings.defaults/responsive';
@import 'node_modules/ekzo/settings.defaults/themes';
@import 'node_modules/ekzo/settings.defaults/typography';
@import 'node_modules/ekzo/base/normalize';
@import 'node_modules/ekzo/generic/shared';
@import 'node_modules/ekzo/generic/headings';
@import 'node_modules/ekzo/generic/text';
@import 'node_modules/ekzo/objects/grid';
@import 'node_modules/ekzo/helpers/flex';
@import 'node_modules/ekzo/helpers/spacing';
@import 'node_modules/ekzo/helpers/typography';
@import 'node_modules/ekzo/helpers/widths';
Imports should be layered in following order:
Refer to Kotsu style.scss
as an example.
Sass 3.4.2 or higher.
Autoprefixer is highly advised.
IE | Edge | Chrome | Firefox | Safari | Opera | Opera Mobile | iOS Safari | Android |
---|---|---|---|---|---|---|---|---|
10+ | 12+ | 21+ | 28+ | 6.1+ | 12.1+ | 12.1+ | 7.1+ | 4.4+ |
_ie.scss
provides graceful regression for IE9 and below:
flexbox
to inline-block
, table
or float
-based models.text-align
and vertical-align
to imitate intended alignment on inline-block
-based grid, media and nav objects.::placeholder
and ::selection
won't be styled nor displayed.All this will help to maintain intended flow and alignment of elements as closely as possible, but some features will be limited, especially vertical alignment.
To use, include _ie.scss
in stylesheet, which will be served only to IE9 and below with IE conditional comments.
Kotsu — Advanced Web Starter Kit & Static Website Generator with docker integration.