The simple-css-reset from mirego

simple-css-reset's Introduction

A simple, no-nonsense CSS reset stylesheet to use as an NPM dependency.

Installation

$ npm install --save simple-css-reset

Usage

Ember.js

You need the ember-cli-node-assets package to be able to import the CSS file into your application. Then you need to add the reset file to the ember-cli build file.

$ npm install --save-dev ember-cli-node-assets

// ember-cli-build.js
module.exports = function(defaults) {
  const app = new EmberApp(defaults, {
    nodeAssets: {
      'simple-css-reset': {
        import: ['reset.css']
      }
    }
  });
};

Webpack

Assuming you have properly installed and configured CSS loader, you can simply require the reset.css file within the entry point of your app.

$ npm install --save-dev css-loader

// index.js
import 'simple-css-reset/reset.css';

Gatsby

Since simple-css-reset is meant to be used a global reset stylesheet, the best way to use it in Gatsby is including in gatsby-browser.js.

// gatsby-browser.js
import 'simple-css-reset';

License

The reset logo is based on this lovely icon by Hali Gali Harun, from The Noun Project. Used under a Creative Commons BY 3.0 license.

About Mirego

Mirego is a team of passionate people who believe that work is a place where you can innovate and have fun. We're a team of talented people who imagine and build beautiful Web and mobile applications. We come together to share ideas and change the world.

We also love open-source software and we try to give back to the community as much as we can.

simple-css-reset's People

Contributors

Stargazers

Watchers

simple-css-reset's Issues

placeholder text

I find forms on different devices and browsers display placeholder text differently. Would be nice to reset that.

Why not use font: inherit?

Love the minimalism of this reset, nice work.

IMO, he only thing it's missing that almost everyone adds later is font-family:inherit for inputs, buttons, etc. You could do this and actually save bytes by changing your existing font-size:inherit declarations to font:inherit.

button reset

Hi,

can I understand rationale behind the button reset?

Button reset completely strips off the button's background, border and makes indistinguishable. IMO, the reset should ensure that it looks same across the browser but at least it should look like a button.

Can you provide your thoughts?

Improve README.md documentation

As mentioned in #19, we probably write better content for README.md to document what this "CSS reset" actually does.

Also, since we distribute it as an NPM package (and not a plain CSS file), I think we could provide references to external documentation URLs that explain how to use an NPM-provided stylesheet in popular frameworks / build tools.

@charlesdemers What do you think?

Recommend Projects

mirego / simple-css-reset Goto Github PK