You can either clone this repo by copying & pasting into your terminal:
git clone git@github.com:healthlocker/app.git
Or you can download a zip of the repo by clicking on the Clone or download
button:
You can then view the content by right clicking on the index.html
file and
opening it in the browser.
The content UI was built using plain HTML and Tachyons for styling.
In this case, the regular version of tachyons was used, which has shortened class names. All of these can be found in the tachyons documentation if you want to find out what each class does. However, there is also a verbose version of tachyons which is clearer for some to get started with.
The reason for using tachyons instead of plain CSS, or another framework such as bootstrap are outlined (in style!) in the DWYL learn-tachyons repo.
A summary of the main points is:
- Easy to understand & use
- It is quick to set up (only requires a single link) and easy to understand the class names (after you get used to them)
- Mobile first, responsive design
- Tachyons gives you suffixes to add to classes for different size screens.
- There is
-ns
(for not small),-m
(medium), and-l
(large) - This makes it easy to design the app for different devices!
- By default, the non-suffixed version is for mobile devices
- A natural workflow, summed up perfectly by Jason Li: