51 lines
1.5 KiB
SCSS
51 lines
1.5 KiB
SCSS
|
///////////
|
|||
|
|
// ITCSS -- https://www.xfive.co/blog/itcss-scalable-maintainable-css-architecture/
|
|||
|
|
|
|||
|
|
// Settings
|
|||
|
|
// used with preprocessors and contain font, colors definitions, etc.
|
|||
|
|
@import 'settings/colors';
|
|||
|
|
@import 'settings/variables';
|
|||
|
|
|
|||
|
|
// Tools
|
|||
|
|
// globally used mixins and functions. It’s important not to output
|
|||
|
|
// any CSS in the first 2 layers.
|
|||
|
|
@import 'tools/mixins';
|
|||
|
|
@import 'tools/keyframes';
|
|||
|
|
|
|||
|
|
// Generic
|
|||
|
|
// reset and/or normalize styles, box-sizing definition, etc. This is
|
|||
|
|
// the first layer which generates actual CSS.
|
|||
|
|
@import 'generic/reset';
|
|||
|
|
@import 'generic/container';
|
|||
|
|
@import 'generic/grid';
|
|||
|
|
@import 'generic/typography';
|
|||
|
|
|
|||
|
|
// Elements
|
|||
|
|
// styling for bare HTML elements (like H1, A, etc.). These come with
|
|||
|
|
// default styling from the browser so we can redefine them here.
|
|||
|
|
@import 'elements/body';
|
|||
|
|
@import 'elements/header';
|
|||
|
|
@import 'elements/headings';
|
|||
|
|
@import 'elements/main';
|
|||
|
|
@import 'elements/section';
|
|||
|
|
@import 'elements/article';
|
|||
|
|
@import 'elements/p';
|
|||
|
|
@import 'elements/img';
|
|||
|
|
@import 'elements/video';
|
|||
|
|
@import 'elements/lists';
|
|||
|
|
@import 'elements/links';
|
|||
|
|
@import 'elements/form';
|
|||
|
|
@import 'elements/inputs';
|
|||
|
|
@import 'elements/footer';
|
|||
|
|
|
|||
|
|
// Components
|
|||
|
|
// specific UI components. This is where majority of our work takes place
|
|||
|
|
// and our UI components are often composed of Objects and Components
|
|||
|
|
@import 'components/main-nav';
|
|||
|
|
|
|||
|
|
// Utilities
|
|||
|
|
// utilities and helper classes with ability to override anything which
|
|||
|
|
// goes before in the triangle, eg. hide helper class
|
|||
|
|
@import 'utilities/helpers';
|
|||
|
|
|