A dynamic utility-first css library written in python
Project description
EYE CSS
Eye css is a dynamic utility-first css library which aims to be usable across every design project. It is similar to tailwind css.
Eye css is a dynamic and powerful css library to create truly dynamic styles while still simple to use and learn.
Eye css is responsive, dynamic, detailed and familiar. Similar to tailwind css in both syntax and operation.
Eye css can be used in small and large web projects. Eye css can be used with your single static html file, to dynamic large web projects.
Just download Eye css or install Eye css and let Eye watch your defined files for defined styles.
It's as simple as that.
How to use eye css:
Installation
pip install eye-css
Create an eye_config.yml file and add the following:
eye:
input_directory: "./"
input_extensions: "*.html"
exclude_directory: ".git"
exclude_files: ".gitignore"
Remember to name the file: eye_config.yml
To use it with a single javascript file or your favorite javascript library:
eye:
input_directory: "./"
input_extensions: "*.html, *.js, *.jsx, *.ts, *.tsx"
exclude_directory: ".git"
exclude_files: ".gitignore"
output_name: "watched_eye.css"
Next, Add "watched_eye.css" to the head tag of your base html file.
<link rel="stylesheet" href="watched_eye.css"/>
Once installed, run the following command in your terminal
python -m eye_css "path to eye_config.yml"
Eye css will automatically watch and style your file once you make changes to the defined extensions from eye_config.yml.
Note: eye css will not automatically reload your browser or web page on file change, it leaves that functionality to existing implementation of such. Examples: htmx, angular, react, vue, svelte and other existing web frameworks.
Project details
Download files
Download the file for your platform. If you're not sure which to choose, learn more about installing packages.