Zeva

A modern and minimalist framework for building responsive and modern frontend
Explore Zeva docs »

Report bug · Request feature

Getting Started
Contributing
Styling Guide
Versioning
Core Team
Thanks

Getting Started

You have the following options to get zeva:

Download a zip file, or clone it from here;
Use one of our two CDN links:
- Zeva's regular CSS file
- Zeva's minified CSS file.

What's included

Within the download you'll find the following directories and files, logically grouping common assets and providing both compiled and minified variations. You'll see something like this:

zeva/
└── dist/
    └── css/
        ├── zeva-inverse.css
        ├── zeva-inverse.css.map
        ├── zeva-inverse.min.css
        ├── zeva-inverse.min.css.map
        ├── zeva.css
        ├── zeva.css.map
        ├── zeva.min.css
        └── zeva.min.css.map

CDN Usage:

<link rel="stylesheet" href="https://cdn.jsdelivr.net/gh/zeva-ui/zeva/dist/css/zeva.css">

<!-- Or you could try to use the minified version -->

<link rel="stylesheet" href="https://cdn.jsdelivr.net/gh/zeva-ui/zeva/dist/css/zeva.min.css">

Zip Usage: CSS files

Unzip the file wherever you want;
Go to dist/css/;
Import/Copy either the regular or minified CSS file.

<link rel="stylesheet" href="./dist/css/zeva.css">

<!-- Or you could try to use the minified version -->

<link rel="stylesheet" href="./dist/css/zeva.min.css">

Zip Usage: Sass files

Before anything, you should import our variables. To do so, follow these steps:

Unzip the .zip wherever you want;
Go to src/scss/;
Import ./abstracts/variables/variables to the top of your main Sass file. Always remember to import variables, before anything!

Now, you're free to import any .scss file that you need.

// Zeva's required files
@import './abstracts/variables/variables';

// Chosen components
@import './components/button',
        './components/form',
        './components/table';

Bugs and feature requests

Have a bug or a feature request? Please first read the issue guidelines and search for existing and closed issues. If your problem or idea is not addressed yet, please open a new issue.

Contributing

Please read through our contributing guidelines. Included are directions for opening issues, coding standards, and notes on development.

All HTML and CSS should conform to the Code Guide, maintained by Mark Otto.

Editor preferences are available in the editor config for easy use in common text editors. Read more and download plugins at https://editorconfig.org/.

Styling Guide

Basic stuff

$main-color:#fff;
$danger: rgb(236, 47, 79);
$font: 'Poppins', sans-serif;
$background:#000;

Basic Styling

yourcomponent {
    font-family:$font;
    background:$background;
    color:$main-color;
    padding:0px;
    margin:0px;
    border-radius: 50% !important; /* for rounded corners*/
    font-weight: bold; /* for bold text */
}

Basic Styling for Input Tags

yourInputComponent {
    outline: none;
    padding: 14px 35px;
    margin:10px 15px;
}

Community

Get updates on Zeva's development and chat with the project maintainers and community members.

Versioning

We use SemVer for versioning. For the versions available, see the tags on this repository.

Core Team

imfunny	jlammer	Kvanrooyen

Thanks

A special thanks for Billie Thompson, for providing a README.md template;
Repository management inspired by the good ol' boy Bootstrap.

jgudo/zeva