eminem.css
eminem.css is a sleek, intuitive, responsive and scalable modern asynchrenous lightweight front-end framework for both large and tiny web applications.
It works by using well established best practices and modern web standards. eminem.css was created by Marko Klopets and is maintained by the core team with the massive support and involvement of our healthy and active community.
Quick start
Several quick start options are available:
- Download the latest release
- Clone the repo:
git clone https://github.com/mklopets/eminem-css.git
- Install with npm:
npm install eminem-css
You can have a look at the Getting Started page of the repo in docs/index.html
for examples on usage.
Usage basics
Use the white-wrapper
class on an element to turn it into an eminem element. This will automatically apply all of the necessary styles and scripts for the specified element.
Alternatively, you can use the data-white-wrapper
attribute on any element to turn it into an eminem
element. For this, assign its value to the string 'eminem'
like so: data-white-wrapper="eminem"
. Please note that data-red-wrapper
and others are not yet supported by eminem.css
. If you think they should be included, please open a new issue.
You can use the two methods interchangeably as shown here:
<div class="white-wrapper">
<h1>Eminem</h1>
<!-- more content here -->
</div>
<span data-white-wrapper="eminem">Eminem</span>
What's included
eminem-css/
├── css/
│ ├──eminem.css
├── scss/
│ ├──eminem.scss
├── fonts/
├──eminem.otf
├──eminem.svg
├──eminem.ttf
├──eminem.woff
├──eminem.woff2
Please note that some of the provided eminem fonts might not work entirely as expected at the time of release. We are passively working to resolve the issue.
Bugs and feature requests
Have a bug or a feature request? Please first search for existing and closed issues. If your problem or idea is not addressed yet, please open a new issue.
Building
eminem.css is built using SCSS. By default, the project uses Gulp
to compile code into vanilla CSS. For this, first run npm install
to make sure you have all the local modules installed (you also need to have the npm package gulp
installed globally).
npm install -g gulp # installs Gulp globally
npm install # installs packages required to compile the CSS into node_modules/
gulp styles # compiles the SCSS into CSS
gulp # the default task, watches the scss/ directory for changes