Skip to content

Latest commit

 

History

History
131 lines (90 loc) · 3.83 KB

README-pt-BR.md

File metadata and controls

131 lines (90 loc) · 3.83 KB

NES.css é um Framework CSS, no estilo NES(8bit).

Gitter Commitizen friendly

Instalação

CDN

<!-- minify -->
<link href="https://unpkg.com/nes.css@0.0.2/css/nes.min.css" rel="stylesheet" />
<!-- latest -->
<link href="https://unpkg.com/nes.css/css/nes.min.css" rel="stylesheet" />

OU

<!-- non-minified -->
<link href="https://unpkg.com/nes.css@0.0.2/css/nes.css" rel="stylesheet" />
<!-- latest -->
<link href="https://unpkg.com/nes.css/css/nes.css" rel="stylesheet" />

npm

TODO: Como utilizar com npm

Utilização

NES.css apenas fornece os componentes. Você precisará definir seu próprio layout.

A fonte padrão é a Press Start 2P o qual oferece suporte apenas para caracteres ingleses. Quando você estiver usando este framework em qualquer outro idioma com exceção do inglês, por favor use outra fonte. Por favor, siga as instruções fornecidas pelo Google Fonts sobre como incluí-la, ou simplismente faça a inclusão como consta abaixo:

<head>
    <link href="https://fonts.googleapis.com/css?family=Press+Start+2P" rel="stylesheet">
    <link href="https://unpkg.com/nes.css/css/nes.css" rel="stylesheet" />
    <style>
      html, body, pre, code, kbd, samp {
          font-family: "font-family you want to use";
      }
    </style>
</head>

Fontes Recomendadas

Idioma Fonte
(Padrão) Press Start 2P
Inglês Kongtext
Japonês 美咲フォント
Japonês Nu もち

Exclusivamente CSS

NES.css apenas usa CSS e não depende de qualquer JavaScript.

Suporte para Browsers

NES.css é compatível com as mais novas versões dos seguintes browsers.

  • Chrome
  • Firefox
  • Safari

Não testado

  • IE/Edge

Desenvolvimento

Comandos

git clone git@github.com:BcRikko/NES.css.git
cd NES.css

npm i

npm run watch
npm run build

Execute Storybook

npm run storybook

Lint, formatação e build são executados automaticamente em um hook de pré-commit.

TODO: Mudar a compilação para fazer com CI

Diretórios

.
├── index.html: Página de demonstração
├── style.css: Estilização da página de demonstração
├── css: Arquivos de distribuição
├── docs: "Histórias" Storybook
└── scss: Código fonte
    ├── base
    │   ├── reboot.scss: Não modifique-o! (Bootstrap Reboot)
    │   ├── generic.scss: Estilização genérica e reboot.css
    │   └── variables.scss: Variáveis em comum
    ├── elements
    ├── form
    ├── icons: ícones 16x16
    ├── pixel-arts: Para ícones que não são 16x16.
    └── utilities

Copyright e licença

Código e documentação copyright 2018 B.C.Rikko. Código lançado sobre a Licença MIT. Documentação e novos lançamentos com Creative Commons.