Init of v3

Author: NigelOToole

.editorconfig

@@ -0,0 +1,25 @@
+# EditorConfig is awesome: http://EditorConfig.org
+
+# top-most EditorConfig file
+root = true
+
+# Unix-style newlines with a newline ending every file
+[*]
+end_of_line = lf
+insert_final_newline = true
+indent_style = space
+indent_size = 2
+
+# Matches multiple files with brace expansion notation
+# Set default charset
+[*.{js,html}]
+charset = utf-8
+
+# 2 space indentation
+[*.{html,css,scss,js}]
+indent_style = space
+indent_size = 2
+
+# Markdown files
+[*.md]
+trim_trailing_whitespace = false

.github/workflows/deploy.yml

@@ -0,0 +1,49 @@
+# Simple workflow for deploying static content to GitHub Pages
+name: Deploy static content to Pages
+
+on:
+  # Runs on pushes targeting the default branch
+  push:
+    branches: ["master"]
+
+  # Allows you to run this workflow manually from the Actions tab
+  workflow_dispatch:
+
+# Sets permissions of the GITHUB_TOKEN to allow deployment to GitHub Pages
+permissions:
+  contents: read
+  pages: write
+  id-token: write
+
+# Allow only one concurrent deployment, skipping runs queued between the run in-progress and latest queued.
+# However, do NOT cancel in-progress runs as we want to allow these production deployments to complete.
+concurrency:
+  group: "pages"
+  cancel-in-progress: false
+
+jobs:
+  # Single deploy job since we're just deploying
+  deploy:
+    environment:
+      name: github-pages
+      url: ${{ steps.deployment.outputs.page_url }}
+    runs-on: ubuntu-latest
+    steps:
+      - name: Checkout
+        uses: actions/checkout@v4
+             
+      - name: Install and Build 🔧 # This example project is built using npm and outputs the result to the 'build' folder. Replace with the commands required to build your project, or remove this step entirely if your site is pre-built.
+        run: |
+          npm ci
+          npm run build
+
+      - name: Setup Pages
+        uses: actions/configure-pages@v4
+      - name: Upload artifact
+        uses: actions/upload-pages-artifact@v3
+        with:
+          # Upload entire repository
+          path: 'src'
+      - name: Deploy to GitHub Pages
+        id: deployment
+        uses: actions/deploy-pages@v4

.gitignore

@@ -1,11 +1,6 @@
-# Dependencies
 node_modules
 
-# Compiled output
-/dist
-/.tmp
-/zip
-
-# System Files
 .DS_Store
 Thumbs.db
+
+*.map

LICENSE

@@ -1,6 +1,6 @@
 The MIT License (MIT)
 
-Copyright (c) 2016 Nigel O Toole
+Copyright (c) 2020 Nigel O Toole
 
 Permission is hereby granted, free of charge, to any person obtaining a copy
 of this software and associated documentation files (the "Software"), to deal

README.md

@@ -1,62 +1,16 @@
-# SASS Progress Tracker
-### A HTML component to illustrate the steps in a multi step process e.g. a multi step form, a timeline or a quiz.
+# Progress Tracker
+### Illustrate the steps in a multi step process like a form or a timeline.
 
-### [View demo](http://nigelotoole.github.io/progress-tracker/)
-
-
-
-## Installation
-
-```javascript
-$ npm install progress-tracker --save
-```
-
-### Import
-
-After installation you can import it into your Sass files with the statement below.
-
-```scss
-@import "node_modules/progress-tracker/src/styles/progress-tracker.scss";
-```
-
-The JS that is part of this site is just for demonstration purposes, add your own JS as needed to toggle the classes for the step states.
-
-### Markup
-
-Follow the HTML code example below for basic usage; each demo sets the first two steps as complete, the third step as active and the last two steps as inactive.
-
-For additional styles add modifier classes and additional markup as needed in the examples below. You can add multiple modifier classes to achieve additional styles that those shown below.
-
-```html
-<ul class="progress-tracker">
-  <li class="progress-step is-complete">
-    <div class="progress-marker"></div>
-  </li>
-  <li class="progress-step is-complete">
-    <div class="progress-marker"></div>
-  </li>
-  <li class="progress-step is-active">
-    <div class="progress-marker"></div>
-  </li>
-  <li class="progress-step">
-    <div class="progress-marker"></div>
-  </li>
-  <li class="progress-step">
-    <div class="progress-marker"></div>
-  </li>
-</ul>
-```
-
-
-### Demo site
-
-Clone or download from Github.
+### [Demo and documentation](http://nigelotoole.github.io/progress-tracker/)
 
+---
+## Quick start
 ```javascript
-    $ npm install
-    $ gulp serve
+$ npm install @nigelotoole/progress-tracker --save-dev
 ```
 
+Import the CSS into your project and add the elements to your HTML.
 
+---
 ### License
 MIT © Nigel O Toole