NES.css é um Framework CSS, no estilo NES(8bit).
NES.css está disponível seja através do npm (preferível) ou Yarn, ou pelo CDN.
npm install nes.css
# ou
yarn add nes.css
Nosso package.json
contém alguns metadata adicionais, sob as seguintes chaves:
sass
- caminho para nosso arquivo de código fonte principal Sassstyle
- caminho para nosso CSS não-minificado
// style.scss
@import "./node_modules/nes.css/css/nes.css"
// script.js
import "nes.css/css/nes.min.css";
Você precisa instalar o css-loader.
<!-- index.html -->
<html>
<head>
<link rel="stylesheet" href="./node_modules/nes.css/css/nes.min.css">
</head>
<body></body>
</html>
Importe o CSS através de um elemento <link />
:
<!-- minify -->
<link href="https://unpkg.com/[email protected]/css/nes.min.css" rel="stylesheet" />
<!-- latest -->
<link href="https://unpkg.com/nes.css@latest/css/nes.min.css" rel="stylesheet" />
<!-- core style only -->
<link href="https://unpkg.com/nes.css/css/nes-core.min.css" rel="stylesheet" />
NES.css não fornece nenhuma fonte, mas nós mantemos uma lista de fontes recomendadas por nós para a utilização em conjunto com a biblioteca.
Idioma | Fonte |
---|---|
(Padrão) | Press Start 2P |
Inglês | Kongtext |
Japonês | 美咲フォント |
Japonês | Nu もち |
Coreano | 둥근모꼴 |
Chinês | Zpix (最像素) |
NES.css apenas fornece os componentes. Você precisará definir seu próprio layout.
A fonte recomendada para NES.css é a Press Start 2P. No entanto, ela apenas fornece suporte para caracteres ingleses. Quando você estiver usando este framework em qualquer outro idioma com exceção do inglês, por favor use outra fonte. 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>
NES.css apenas usa CSS e não depende de qualquer JavaScript.
NES.css é compatível com as mais novas versões dos seguintes browsers.
- Chrome
- Firefox
- Safari
Não testado
- IE/Edge
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.
Se você quiser nos ajudar com o projeto, nós agradecemos contribuições de todos os tipos! Verifique nosso CONTRIBUTING-pt-BR.md
para mais detalhes em como você pode ajudar a tornar o NES.css incrível!