0.7.1 • Published 9 years ago

cdg-core v0.7.1

Weekly downloads
3
License
ISC
Repository
github
Last release
9 years ago

CDS Design Guide Core & Base Modules

The foundation of the Coud Data Services Design Guide is the CDG Core and Base modules.

The Core module represents our foundational design elements. This includes our color and type system and will in the future contain any globally usable variables or concepts.

The Base module contains our default and standard interface elements.

Usage

The preferred model of consumption for CDG-Core is through our packaged NPM module. To install, run this command in your project directory:

npm install --save-dev cdg-core

In order to use the entire Module in your stylesheets, simply inport the _index.scss file from the module root directory in your Sass stylesheet:

@import '{{PATH_TO_NODE_MODULES}}/cdg-core/index';

To import only the Core or the Base modules, simply bypass the global index and use one the submodule indices like so:

// Just the core module
@import '{{PATH_TO_NODE_MODULES}}/cdg-core/core/index';

// Just the base module
@import '{{PATH_TO_NODE_MODULES}}/cdg-core/base/index';

Beta Modules

By default, the index of each directory will only access the dev-ready submodules. If you require access to the submodules in beta development in addition to the dev ready modules, simply add the -beta to the end of your imports.

@import '{{PATH_TO_NODE_MODULES}}/cdg-core/index-beta';

Modules and Status

Core

ModuleStatusDescription
ColorsDev ReadyOur color system and color() function.
TypeDev ReadyOur type system and font() mixin.
UnitsDo Not UseStandardized spacing and measuring units.

Base Elements

ModuleStatusDescription
RootDev ReadyRoot elements resets and defaults
ButtonsBetaButtons
FormsBetaForms
LinksDo Not UseLinks and Calls to Action
ListsDo Not UseLists
MediaDo Not UseMedia
TablesBetaTables
Block TextDo Not UseBlock-level text elements
Inline TextDo Not UseInline-level text elements
UtilityBetaUtility classes and functions