Git Product home page Git Product logo

nes.css's Introduction

NES.css is a NES-style(8bit-like) CSS Framework.
NES.cssは ファミコン風(8bit ライク) なCSSフレームワークです。

Install

CDN

<!-- minify -->
<link href="https://unpkg.com/[email protected]/css/nes.min.css" rel="stylesheet" />
<!-- latest -->
<link href="https://unpkg.com/nes.css/css/nes.min.css" rel="stylesheet" />

OR

<!-- non-minified -->
<link href="https://unpkg.com/[email protected]/css/nes.css" rel="stylesheet" />
<!-- latest -->
<link href="https://unpkg.com/nes.css/css/nes.css" rel="stylesheet" />

npm

TODO: npm での使用方法を書く

Usage

NES.cssはコンポーネントのスタイルのみを提供しています。レイアウトはみなさんが好きなように定義してください。

デフォルトではPress Start 2Pフォントを使っています。英語以外(日本語など)で利用される場合は、別途フォントを読み込んで使ってください。

TODO: 詳細を書く

CSS Only

NES.cssはCSSのみで構成されています。JavaScriptは不要です。

Browser Support

次のブラウザの最新バージョンをサポートしています。

  • Chrome
  • Firefox
  • Safari

未確認

  • IE/Edge

Development

Commands

git clone [email protected]:BcRikko/NES.css.git
cd NES.css

npm i

npm run watch
npm run build

pre-commit hookにより、コミット時に自動でLint→format→buildが走り、cssディレクトリにファイルが出力されます。 TODO: ビルドはCIでするように変更したい

Directories

.
|- index.html: Demo page
|- style.css: Demo page style
|- css: Distribution files
|- scss: Source
    |- base
    |   |- reboot.scss: **Don't change!** (Bootstrap Reboot)
    |   |- generic.scss: Generic style and overwrite reboot.css
    |   |- variables.scss: Common variables
    |- elements
    |- form
    |- icons: For 16x16 icon
    |- pixel-arts: For icon other than 16x16 icon.
    |- utilities

Copyright and license

Code and documentation copyright 2018 B.C.Rikko. Code released under the MIT License. Docs released under Creative Commons.

nes.css's People

Contributors

bcrikko avatar rrj-dev avatar jsoref avatar

Watchers

Russ Callahan avatar James Cloos avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.