Usage Setup

Grab the CSS code and start styling text, color, buttons, or images. All you really need is a simple HTML page linked to the evo css style sheet.

Quick Setup

Place the following CSS <link> in the document <head>. Evo can be used by itself.

<link rel="stylesheet" href="css/evo-elements.css">

If using Evo alongside a framework such as Bootstrap, place Evo last in the stacking order. This insures the Evo styles override any other 'opinionated' CSS for HTML inputs and resets.

<!doctype html>
<html lang="en">
<head>
   <meta charset="utf-8">
   <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
   <meta name="description" content="">
   <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
   <title>Title Goes Here</title>

   <!-- Link to your browser icon -->
   <link rel="apple-touch-icon" href="apple-touch-icon.png">

   <!-- Place your other CSS above Evo -->
   <link rel="stylesheet" href="css/bootstrap-grid-only.css">

   <!-- Place Evo below other CSS in the stacking order -->
   <link rel="stylesheet" href="css/evo-elements.css">

</head>
<body>
  <h1>Content Goes Here</h1>
 </body>
</html>

Google fonts or Adobe fonts may require additional minor installation.

Source Code Setup

Download the Evolution Github repository and run Gulp, SASS, and Node on your localhost to get the project up and running. If you have trouble setting it up, try some of the troubleshooting tips in this doc and also reference any comments within the gulpfile.js and other source files