fortune-css - npm Package Compare versions

Comparing version 0.1.0 to 0.1.1

postcss.config.js

package.json

		{
		"name": "fortune-css",
		"version": "0.1.0",
		"version": "0.1.1",
		"author": "Vikram Babu",
		@@ -8,5 +8,5 @@ "description": "Fortune is your friendly CSS framework.",
		"scripts": {
		"build": "rm -rf dist \|\| true && mkdir -p dist && gulp build",
		"start": "gulp watch",
		"test": "gulp test"
		"postcss": "postcss ./src/fortune.css -d dist/",
		"build": "rimraf dist/* && yarn postcss && cross-env NODE_ENV=production yarn postcss --ext .min.css && gzip -c dist/fortune.min.css \| wc -c \| xargs echo 'Size:'",
		"pub": "npm run build && npm publish"
		},
		@@ -26,13 +26,11 @@ "keywords": [
		"devDependencies": {
		"gulp": "latest",
		"gulp-cssnano": "latest",
		"gulp-gzip": "latest",
		"gulp-postcss": "latest",
		"gulp-rename": "latest",
		"gulp-size": "latest",
		"gulp-stylelint": "latest",
		"postcss-preset-env": "latest",
		"postcss-import": "latest",
		"stylelint": "latest"
		"autoprefixer": "^9.6.1",
		"cross-env": "^5.2.0",
		"cssnano": "^4.1.7",
		"npm-run-all": "^4.1.5",
		"postcss-cli": "^6.1.3",
		"postcss-csso": "^3.0.0",
		"postcss-import": "^12.0.1",
		"rimraf": "^3.0.0"
		}
		}

README.md

		# 🔮 Fortune

		### Your friendly CSS framework.
		### Your friendly CSS framework.

		[![](https://data.jsdelivr.com/v1/package/npm/fortune-css/badge)](https://www.jsdelivr.com/package/npm/fortune-css)
		@@ -8,13 +9,15 @@

		- ⚡️ Light-weight at < 10kb gzipped
		- ⛔️ No preprocessor required
		- 📐 Easy CSS grids & flexbox
		- 🌈 Customizable CSS variables
		- ⚡️ Light-weight at < 10kb gzipped
		- ⛔️ No preprocessor required
		- 📐 Easy CSS grids & flexbox
		- 🌈 Customizable CSS variables

		To load Fortune via CDN, add this to your `<head>`:
		To load Fortune via CDN, add this to your `<head>`:

		```
		<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/fortune-css/dist/fortune.min.css">
		```
		<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/fortune.css/dist/fortune.min.css">
		```

		To theme your site, add `:root` or `:scope` to your CSS:
		To theme your site or components, modify `:root`, `:scope` or `.class` in your CSS:

		```
		@@ -25,36 +28,4 @@ :root {
		--container-width: 125em;
		--column-gutter: var(--gap-9);
		--column-gutter: 4rem;
		}
		```

		## Fortune Cheat Sheet

		### Tokens

		Gap `--gap-* \| rem \| 0-0.75rem`
		Space `--space-* \| rem \| 0-10rem`
		Color `--color \| #001f3f`
		State `--state-& \| primary \| secondary \| info \| success \| warning \| danger \| light \| dark \| disabled`
		Darken `--darken-* \| rgba`
		Lighten `--lighten-* \| rgba`
		Component `--component-* \| background-color \| border-color \| border-radius \| border-width \| focus \| padding \| transition \| font-size`

		### Components
		Alert `.alert \|\| --alert-*`
		Badge `.badge \| --chip-*`
		Button `.button \|\| --button-* \| font-family \| font-size \| font-weight \| color \| bg-color \| border-radius \| border-width \| bg-color \| focus`
		Form `fieldset \| label \| input \| select \| textarea \| .input-field \| .input-group \| .input-hint \| .input-addon \| .input-icon \| .input-invalid \| .input-valid \|\| --input-* \| --fieldset-* \| --label-*`
		List `.list-* \| .list-step \| .list-breadcrumb \| .list-dropdown`
		Nav `.nav \| .nav-left \| .nav-center \| .nav-right \|\| --nav-*`
		Tab `.tab \| .tab-full \| .tab-simple \|\| --tab-*`
		Table `table \| .table-bordered \| .table-hoverable \| .table-striped \|\| --table-*`
		Text `body \| a \| abbr \| blockquote \| code \| del \| figure \| h* \| hr \| img \| ins \| kbd \| mark \| p \| pre \| .pre \| .pre-line \| .pre-wrap \| .nowrap \| .small \| sub \| sup \| .ellipsis \| .italic \| .normal \| .oblique \| .thin \| .regular \| .medium \| .bold \| .muted \| .center \| .justify \| .left \| .right \| .line-through \| .overline \| .underline \| .capitalize \| .lowercase \| .uppercase \| .break-word`

		### Utilities
		Border `.radius-* \| .b-*`
		Blend `.gradient-* \| bg-blend-`
		Color `.* \| bg-* \| border-*`
		Column `.cols \| .cols-flush \| .col \| .col-* \| .offset-* \| .multi-col-* \|\| --column-gutter \| --columns-width`
		Dimension `.h-* \| .minvh-* \| .w-* \| .minvw-*`
		Display `.clearfix \| .grid \| .block \| .flex \| .inline \| .inline-block \| .inline-flex \| .inline-table \| .none \| .table \| .table-cell \| .table-colun \| .table-row \| .float-* \| .absolute \| .fixed \| .relative \| .sticky \| .bottom-* \| .left-* \| .right-* \| .top-* \| .z-* \| .overflow-hidden \| .overflow-scroll`
		Flex `.flex-wrap \| .flex-wrap-reverse \| .flex-reverse \| .flexcolumn \| .flex-center`

dist/fortune.css.gz

dist/fortune.min.css.gz

dist/fortune.prefixed.min.css

dist/fortune.prefixed.min.css.gz

dist/lab.min.css

dist/lab.min.css.gz

gulpfile.js

dist/fortune.css