Simple CSS framework with a markdowny touch

  • By Max Beier
  • Last update: Oct 27, 2022
  • Comments: 1

Tawian Frontend npm package

Simple CSS framework with a markdowny touch. Intended for developer facing applications.

Usage

"> 
<link rel="stylesheet" href="http://maxbeier.github.io/tawian-frontend/tawian-frontend.css">
<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Cousine:400,400i,700,700i">

or via npm

npm install --save tawian-frontend typeface-cousine

And then, for example (as used in curious-containers/cc-ui):

import 'tawian-frontend';
import 'typeface-cousine';

To use the icons, you have to place icons.svg at the root of your public path (or anywhere else and adjust the path in the icons svg code) or inline them in your HTML to make them work in Edge.

Preview

Screenshot

Build

npm run build

npm run watch  # builds continuously

Credits

The project was inspired by hack.

Github

https://github.com/maxbeier/tawian-frontend

Comments(1)

  • 1

    cell size -12of-12 not working

    Hi there! :) Great extension, it really adds a lot of useful stuff I found lacking in hackss. Kudos my good sir.

    However, I noticed last night that you've missed the last cell size: .cell-11 { flex: 0 0 calc(100% * 11 / 12); min-width: calc(100% * 11 / 12); } in /sass/_grid.scss - the 12th one. Just my 2 cents.

Popular Tag

Related