0.0.3 • Published 3 years ago

@reterial/color v0.0.3

Weekly downloads
-
License
MIT
Repository
github
Last release
3 years ago

Reterial Color Palette

@reterial/color

This is all colors in reterial.

What is the story of reterial ?

Reterial is jaypy.code design! When i was a junior frontend developer, i used Material Design to design my websites. I've used this design for a lots of websites and applications such as Meydoon or Kateb or Raybuy and other things. When i used them, i have to customize and change some styles of the design and my coworkers and friends said you shit on it (Take it good, they were my firends :D). And now i have my design to show them it's funny.

How to build ?

You can use npm or yarn to complie all scss file to css in dist folder with:

npm run build

How to start developing ?

I've design some scripts to start developing by runing serve to run a http server on port 5000 and a script to watch 'src' folder to refresh all built css on port 3000 with 'socket.io'.

Run the http server by:

npm run serve

Watch on source file change by:

npm run build:watch

How to use ?

You can use in your sass or scss by importing and calling color variables or use them as css class name. If you want to use it, install it by npm or yarn.

npm i @reterial/color

or use yarn

yarn add @reterial/color

then you can use them.

In: scss/sass

@import "~@reterial/color/src/all.scss"; // to use all colors
@import "~@reterial/color/src/blue.scss"; // to use just blue palette

.my-css-class {
    color: $reterial-blue-500;
}
In: html

<link type="stylesheet" href="/reterial/color/dist/all.css" /> // to use all colors
<link type="stylesheet" href="/reterial/color/dist/blue.css" /> // to use just blue palette

...
<div class="reterial-blue-500">
    ...
</div>
...

CDNs

jsdelivr

https://cdn.jsdelivr.net/npm/@reterial/color@0.0.2/dist/all.min.css

unpkg

https://unpkg.com/@reterial/color@0.0.2/dist/all.min.css

github

https://raw.githubusercontent.com/reterial/color/main/dist/all.min.css