Last Modified: Sunday, Feb 24, 2019

Installing Tachyons

Git Bash (Projects/$PROJECT_NAME/dev) git clone git@github.com:tachyons-css/tachyons.git

File Explorer

  • Cut the “tachyons/src” folder && Paste it into the “src/css” folder
  • Delete “src/css/main.css”
  • Delete “src/css/imports/”
  • Rename “src/css/src” to “src/css/imports”
  • Cut “src/css/imports/tachyons.css” && Paste to “src/css/” && Rename to “src/css/main.css”
  • Delete “tachyons” folder
  • Edit main.css: Select all imports and add “/imports” to their filepath.
  • Edit main.css: remove @import './imports./_normalize';

Add Files

Create the following files, then import them:

Containers.css

@import './containers';

@import './content';

@import './navigation';

Styles.css

@import './styles';

Install postcss-modular-scale

npm install postcss-modular-scale

postcss.config.js

src/css/modularscale.css

/* External Library Includes */
@import './imports/_normalize';
@import './modularscale';

type-scale.css

@import './imports/type-scale';

Setup default colors

colors.css

Setup Fonts

font-family.css

Usage

Default tachyons files are preceded by an underscore (i.e. ./imports/_flexbox.css)

If those files get modified, remove the underscore. This is to denote that all files with an underscore are default files.