matcha
3.0.0
Matcha.css é uma biblioteca CSS pura projetada para estilizar elementos HTML de maneira semelhante a uma folha de estilo padrão do navegador, eliminando a necessidade de os usuários corrigirem manualmente seus documentos.
Ideal para prototipagem rápida, páginas HTML estáticas, documentos gerados por marcação e desenvolvedores que buscam otimizar seu fluxo de trabalho sem se aprofundar nos meandros do CSS e desejam usar toda a gama de elementos HTML disponíveis.
~7kB Gzipped (pode ser reduzido ainda mais)
Funciona perfeitamente com qualquer documento e abrange uma gama mais ampla de elementos HTML em comparação com bibliotecas semelhantes. Ele permanece discreto ao alavancar pseudo-elementos do CSS e oferece um amplo suporte ao navegador.
Basta incluir sua <link rel="stylesheet"> para começar e removê -lo sempre que necessário, sem a necessidade de refatorar ou limpar o documento.
Adapta o estilo com base na hierarquia de elementos, fornecendo comportamentos intuitivos como "submenus implícitos" ao nidificar elementos <menu> , indicador de campo necessário ( * ) quando um <label> é emparelhado com <input required> , etc.
Prepare sua própria construção usando nosso construtor personalizado para selecionar recursos específicos e reduzir o tamanho final da construção de acordo com as necessidades do seu projeto.
Lançado sob a licença do MIT, disponível gratuitamente em github.com/lowlighter/matcha.
Para utilizar o Matcha.css , basta incluir a linha a seguir na seção <head> do seu documento. É tão simples!
< link rel =" stylesheet " href =" https://matcha.mizu.sh/matcha.css " >Os ativos estão hospedados no Vercel, mas o Matcha.css também está disponível em serviços e CDN que distribuem pacotes NPM como JSDelivr.
Todas as versões publicadas estão disponíveis no diretório /v/ . Por padrão, o ramo main é servido.
Cada subdiretório listado no diretório /styles também é servido diretamente do matcha.mizu.sh. Por exemplo, se você deseja incluir apenas os estilos @syntax-highlighting em vez de usar a compilação padrão ou personalizada, você pode usar:
< link rel =" stylesheet " href =" https://matcha.mizu.sh/styles/@syntax-highlighting/mod.css " > No entanto, observe que, a menos que você forneça suas próprias variáveis CSS, você provavelmente precisará incluir o pacote @root , pois ele contém todas as variáveis matcha.css.
Todos os arquivos
mod.csstambém são alias aos seus respectivos diretórios de pais por conveniência, o que significa que você também pode usar:< link rel =" stylesheet " href =" https://matcha.mizu.sh/@syntax-highlighting.css " >
!important nunca serão usadas para garantir que os usuários possam substituir facilmente os estilosEste projeto é separado em três diretórios principais:
/api para funções sem servidor executadas no vercel/app para pontos de entrada, ativos estáticos e scripts de criação/styles para arquivos de origem CSS/stylesCada subdiretório nessa pasta deve ser principalmente independente e escopo. Ajuda a manter a base de código organizada enquanto também permite que os usuários escolham os recursos específicos e a criar construções personalizadas.
Recursos extras devem ser prefixados usando o caractere @ e provavelmente devem ser excluídos por padrão no construtor para evitar inchaço a compilação padrão.
Ao enviar uma solicitação de tração, a visualização estará disponível no vercel. Os mantenedores e outros colaboradores podem revisar as alterações e fornecer feedback antes da fusão.
O desenvolvimento local deve ser feito usando o tempo de execução dono. Se você não deseja instalá -lo, também poderá usar a configuração do DevContainer fornecida para executar o projeto em um ambiente de contêiner ou diretamente nos espaços de codificina do GitHub.
Para iniciar o servidor de desenvolvimento, execute o seguinte comando:
deno task serveAntes de enviar suas alterações, verifique se tudo está formatado corretamente executando o seguinte comando:
deno task fmt MIT License
Copyright (c) 2024-present Simon Lecoq (lowlighter)
