test

Utils CSS and JS librairy

What is CSS and JS librairy

It's a CSS and JS Library, inspired by Bootstrap, TailwindCSS and Bulma. We try to get the best of those libraries and framework.

How to use it ?

Add those line in your html page:

<link href="https://overconsulting.tech/utils.min.css" rel="stylesheet" />
<script
  type="javascript"
  href="https://overconsulting.tech/utils.min.js"></script>

To see how it works

Available on: overconsulting.tech to see it online.

The documentation

Available on overconsulting.tech

Developpement

Installation of the tools to generate the minified file. I used uglifycss and uglifyjs. You can installe it with npm.

$ npm install uglifycss -g
$ npm install uglify-js -g

To generate the min.css files from the multiple css files.

$ git clone https://github.com/ldandoy/Utils-CSS-JS.git
$ cd Utils-CSS
$ uglifycss ./src/css/*.css > ./dist/utils.min.css
$ uglifyjs ./src/js/*.js > ./dist/utils.min.js

After runngin this commande, you will found the min.css and min.js in the dist folder.

SASS Part

First install sass on you system. If you need more information go to: SASS Website

$ npm install -g sass

And know to generate css files

$ sass src/stylesheets/index.scss dist/index.css

The Road MAP

  • Add the disabled for the button
  • Add the different pointer
  • Render active link for the navbar
  • Add hover for the navbar
  • Responsive global
  • Add outlined to the button
  • Add size to the button
  • Add a grid with quarter, half and tiers
  • Add Hero section
  • Add class rounded sur les Ă©lements
  • Add some menu
  • Add disabled for all the form field
  • Responsive de la navbar
  • Faire un rounded global
  • Add Js part
  • Modify the doc to be React compatible
  • Finish the documentation
  • Add container to the navbar
  • Complete menu part
  • Add color in input
  • Integration of Dark mode
  • Integration of SASS