Ativa o menu
Alternar menu de preferências
Alternar menu pessoal
Não autenticado(a)
Your IP address will be publicly visible if you make any edits.

ManutencaoWiki4Devs: mudanças entre as edições

De Celta Sistemas Wiki
Criou página com '__NOTOC__ <div class="celta-full-width"> {{Cabecalho|4devs|Celta Wiki Framework (Documentação Interna)}} Esta página documenta a arquitetura frontend do Wiki. O objetivo deste framework é eliminar o débito técnico causado por CSS Inline e HTML hardcoded nas páginas de documentação. {{Nota|danger|REGRA DE OURO (DEV)| '''Proibido comitar CSS Inline.''' Não use <code><div style="..."></code>. Se precisar de um estilo novo, crie uma classe no <code>Common....'
 
Sem resumo de edição
Linha 11: Linha 11:
}}
}}


== 1. Arquitetura de Estilos (CSS) ==
== Arquitetura de Estilos (CSS) ==


O visual é controlado por dois arquivos globais. Se precisar alterar cores, fontes ou espaçamentos, edite aqui:
O visual é controlado por dois arquivos globais. Se precisar alterar cores, fontes ou espaçamentos, edite aqui:
Linha 20: Linha 20:
  | cor = dark
  | cor = dark
  | icone = bi-filetype-css
  | icone = bi-filetype-css
  | titulo = MediaWiki:Common.css (Componentes)
  | titulo = '''MediaWiki:Common.css''' (Componentes)
  | conteudo =
  | conteudo =
* Contém as classes do Framework (Cards, Tables, Badges, Alerts).
* Contém as classes do Framework (Cards, Tables, Badges, Alerts).
* '''Responsabilidade:''' Estilizar o conteúdo interno das páginas.
* '''Responsabilidade:''' Estilizar o conteúdo interno das páginas.
* [[https://wiki.celtasistemas.com.br/index.php?title=MediaWiki:Common.css&action=edit|'''"Editar fonte "MediaWiki:Common.css""''']]
* [[MediaWiki:Common.css|'''Editar fonte: "MediaWiki:Common.cs"''']]
}}
}}


Linha 30: Linha 30:
  | cor = dark
  | cor = dark
  | icone = bi-layout-text-window-reverse
  | icone = bi-layout-text-window-reverse
  | titulo = MediaWiki:Citizen.css (Tema Global)
  | titulo = '''MediaWiki:Citizen.css''' (Tema Global)
  | conteudo =
  | conteudo =
* Contém overrides do tema Citizen (Rodapé, Header, Remoção de títulos nativos).
* Contém overrides do tema Citizen (Rodapé, Header, Remoção de títulos nativos).
* '''Responsabilidade:''' Layout macro e estrutura do site.
* '''Responsabilidade:''' Layout macro e estrutura do site.
* [https://wiki.celtasistemas.com.br/index.php?title=MediaWiki:Citizen.css&action=edit|'''[EDITAR FONTE]''']
* [[MediaWiki:Citizen.css|'''Editar fonte: "MediaWiki:Citizen.cs"''']]
}}
}}


</div>
</div>


== 2. Biblioteca de Componentes (Templates) ==
== Biblioteca de Componentes (Templates) ==


Não escreva HTML. Use as '''Predefinições''' (Wrappers). Elas garantem que se mudarmos o design no futuro, todo o legado será atualizado automaticamente.
Não escreva HTML. Use as '''Predefinições''' (Wrappers). Elas garantem que se mudarmos o design no futuro, todo o legado será atualizado automaticamente.
Linha 45: Linha 45:
{{TabelaCampos|
{{TabelaCampos|
   {{Linha
   {{Linha
   | 1= {{Predefinição:Cabecalho}}
   | 1= [[Predefinição:Cabecalho|<nowiki>{{Predefinição:Cabecalho}}</nowiki>]]
   | 2= Gera o Breadcrumb e Título H1. Lida com a supressão do título nativo do MediaWiki.
   | 2= Gera o Breadcrumb e Título H1. Lida com a supressão do título nativo do MediaWiki.
   }}
   }}
   {{Linha
   {{Linha
   | 1= {{Predefinição:Nota}}
   | 1= [[Predefinição:Nota|<nowiki>{{Predefinição:Nota}}</nowiki>]]
   | 2= Gera os alertas coloridos (Info, Success, Warning, Danger). Substitui divs coloridas manuais.
   | 2= Gera os alertas coloridos (Info, Success, Warning, Danger). Substitui divs coloridas manuais.
   }}
   }}
   {{Linha
   {{Linha
   | 1= {{Predefinição:TabelaCampos}}
   | 1= [[Predefinição:TabelaCampos|<nowiki>{{Predefinição:TabelaCampos}}</nowiki>]]
   | 2= Wrapper para tabelas de dados. Padroniza larguras (30/70) e cores de header.
   | 2= Wrapper para tabelas de dados. Padroniza larguras (30/70) e cores de header.
   }}
   }}
   {{Linha
   {{Linha
   | 1= {{Predefinição:CardMenu}}
   | 1= [[Predefinição:CardMenu|<nowiki>{{Predefinição:CardMenu}}</nowiki>]]
   | 2= Gera os cards de navegação com ícone e borda colorida (Accent).
   | 2= Gera os cards de navegação com ícone e borda colorida (Accent).
   }}
   }}
   {{Linha
   {{Linha
   | 1= {{Predefinição:ContatoSuporte}}
   | 1= [[Predefinição:ContatoSuporte|<nowiki>{{Predefinição:ContatoSuporte}}</nowiki>]]
   | 2= Injeta a barra de rodapé padrão (Email/Whats/Site). Existe a variação <code>ContatoFinanceiro</code>.
   | 2= Injeta a barra de rodapé padrão (Email/Whats/Site). Existe a variação <code>ContatoFinanceiro</code>.
   }}
   }}
}}
}}
</div>

Edição das 14h41min de 1 de dezembro de 2025

Início / 4devs

Celta Wiki Framework (Documentação Interna)

Atualizado em: 01/12/2025

Esta página documenta a arquitetura frontend do Wiki. O objetivo deste framework é eliminar o débito técnico causado por CSS Inline e HTML hardcoded nas páginas de documentação.

REGRA DE OURO (DEV)

Arquitetura de Estilos (CSS)

O visual é controlado por dois arquivos globais. Se precisar alterar cores, fontes ou espaçamentos, edite aqui:

MediaWiki:Common.css (Componentes)
MediaWiki:Citizen.css (Tema Global)

Biblioteca de Componentes (Templates)

Não escreva HTML. Use as Predefinições (Wrappers). Elas garantem que se mudarmos o design no futuro, todo o legado será atualizado automaticamente.

Campo / Parâmetro Função e Instruções
{{Predefinição:Cabecalho}} Gera o Breadcrumb e Título H1. Lida com a supressão do título nativo do MediaWiki.
{{Predefinição:Nota}} Gera os alertas coloridos (Info, Success, Warning, Danger). Substitui divs coloridas manuais.
{{Predefinição:TabelaCampos}} Wrapper para tabelas de dados. Padroniza larguras (30/70) e cores de header.
{{Predefinição:CardMenu}} Gera os cards de navegação com ícone e borda colorida (Accent).
{{Predefinição:ContatoSuporte}} Injeta a barra de rodapé padrão (Email/Whats/Site). Existe a variação ContatoFinanceiro.