Saltar para o conteúdo

MediaWiki Discussão:Mobile.css

O conteúdo da página não é suportado noutras línguas.
Adicionar tópico
Origem: Wikipédia, a enciclopédia livre.
Último comentário: 20 de agosto de 2020 de !Silent no tópico Letras notas alfabéticas

Classes para caixas[editar código-fonte]

Favor adicionar as classes de estilo que estão em meu Mobile.css. Já fiz alguns testes e parece estar funcionando bem, coloquei a classe 'caixa' na {{ambox}} e pretendo colocar nas demais *mbox, com esses estilos a borda é removida, a borda colorida da ambox fica mais fina e a imagem que geralmente tem 40px é diminuída para 30 px, o que dá uma aparência melhor em dispositivos móveis. Considerei usar as classes de mbox da mw:Extension:MobileFrontend usadas na enwiki, mas elas removem a borda colorida e substitui a imagem por uma das imagens predefinidas pela extensão, criando uma aparência muito distante da versão desktop.

Acho que os administradores de interface não vigiam esta página, então vou chamar os três: He7d3r, !Silent e Diego Queiroz. Para quem não souber, na versão mobile o MediaWiki:Common.css não é chamado, no lugar são chamados os estilos desta página. Danilo.mac(discussão) 03h57min de 27 de março de 2019 (UTC)Responder

@Danilo.mac: realmente eu não vigiava. Criei a página com seu código inicial. Bom trabalho! !Silent (discussão) 10h57min de 27 de março de 2019 (UTC)Responder

Algumas mudanças são necessárias. O que foi colocado no Mobile.css até funciona, mas em alguns dispositivos eles demoram um segundo para serem carregados, o que dá um aspecto desagradável, a solução é manter no Common.css o que deve aparecer só no desktop e manter nos estilos em linha o que deve aparecer sempre. Além disso, a extensão MobileFrontend tem uma função de reduzir a ambox e ampliá-las quando são clicadas na versão mobile, isso é desejável, mas ela adiciona também uma imagem que nem sempre combina com a mensagem do aviso, então a solução é remover a imagem e fazer uma correção no padding do link que a extensão adiciona. Então é necessário remover tudo o que está no Mediawiki:Mobile.css (.caixa e .mobile-img-peq) e adicionar o seguinte código:

.caixa .mbox-text .mw-ui-icon{
	display: none;
}
.caixa .mbox-text .ambox-learn-more{
	left: 0.9em;
}

E no Mediawiki:Common.css, remover o font-size:95%; da classe .caixa, as mboxes usam font-size 100% na versão desktop, como 100% é o padrão é só remover. Eu testei as duas alterações usando o console de estilos do navegador e o meu /minerva.css (esse é o .css pessoal para mobile e não o /Mobile.css como eu tinha pensado antes). Danilo.mac(discussão) 02h32min de 4 de abril de 2019 (UTC)Responder

@Danilo.mac Feito. [1][2] !Silent (discussão) 11h22min de 4 de abril de 2019 (UTC)Responder

Class para plainlists[editar código-fonte]

Poderiam adicionar a seguinte class para dispositivos móveis?

/* Unbulleted lists */
.plainlist ul {
	list-style: none;
	padding-left: 0; /* Reset Minerva defaults */
}

CaiusSPQR(discussão) 02h03min de 6 de abril de 2019 (UTC)Responder

@CaiusSPQR Feito.[3] !Silent (discussão) 02h10min de 6 de abril de 2019 (UTC)Responder

Classes para hlists[editar código-fonte]

Podem adicionar classes para as horizontal lists? Elas não funcionam em dispositivos móveis.

.mw-parser-output .hlist ul,
.mw-parser-output .hlist ol {
	padding-left: 0;
}
/* reset hlist margins of Minerva */
.mw-parser-output .hlist li,
.mw-parser-output .hlist dd,
.mw-parser-output .hlist dt {
	margin-right: 0;
}
.mw-parser-output .hlist li:after,
.mw-parser-output .hlist dd:after {
	content: " · ";
	font-weight: bold;
}
.mw-parser-output .hlist dt:after {
	content: ": ";
}
.mw-parser-output .hlist dd:last-child:after,
.mw-parser-output .hlist dt:last-child:after,
.mw-parser-output .hlist li:last-child:after {
	content: none;
}
/* Add parentheses around nested lists */
.mw-parser-output .hlist dd dd:first-child:before, .mw-parser-output .hlist dd dt:first-child:before, .mw-parser-output .hlist dd li:first-child:before,
.mw-parser-output .hlist dt dd:first-child:before, .mw-parser-output .hlist dt dt:first-child:before, .mw-parser-output .hlist dt li:first-child:before,
.mw-parser-output .hlist li dd:first-child:before, .mw-parser-output .hlist li dt:first-child:before, .mw-parser-output .hlist li li:first-child:before {
	content: " (";
	font-weight: normal;
}
.mw-parser-output .hlist dd dd:last-child:after, .mw-parser-output .hlist dd dt:last-child:after, .mw-parser-output .hlist dd li:last-child:after,
.mw-parser-output .hlist dt dd:last-child:after, .mw-parser-output .hlist dt dt:last-child:after, .mw-parser-output .hlist dt li:last-child:after,
.mw-parser-output .hlist li dd:last-child:after, .mw-parser-output .hlist li dt:last-child:after, .mw-parser-output .hlist li li:last-child:after {
	content: ") ";
	font-weight: normal;
}
/* Put ordinals in front of ordered list items */
.mw-parser-output .hlist ol {
	counter-reset: listitem;
}
.mw-parser-output .hlist ol > li {
	counter-increment: listitem;
}
.mw-parser-output .hlist ol > li:before {
	content: " " counter(listitem) " ";
	white-space: nowrap;
}
.mw-parser-output .hlist dd ol > li:first-child:before,
.mw-parser-output .hlist dt ol > li:first-child:before,
.mw-parser-output .hlist li ol > li:first-child:before {
	content: " (" counter(listitem) " ";
}

Obrigado. —CaiusSPQR(discussão) 19h25min de 3 de maio de 2019 (UTC)Responder

@!Silent: Poderia fazê-lo? —CaiusSPQR(discussão) 03h02min de 3 de julho de 2019 (UTC)Responder
@CaiusSPQR Feito.[4] !Silent (discussão) 00h36min de 5 de julho de 2019 (UTC)Responder

TeX e HTML[editar código-fonte]

Seria possível adicionar regras para TeX quando usada em elementos HTML? (Também para quando serifa baseada em Times for esperada.)

/* Classe genérica para serifa baseada em Times, classe texhtml para matemática em linha */
.times-serif,
span.texhtml {
	font-family: serif;
}
span.texhtml {
	white-space: nowrap;
}

Obrigado. —CaiusSPQR(discussão) 03h05min de 3 de julho de 2019 (UTC)Responder

@CaiusSPQR Feito.[5] !Silent (discussão) 00h37min de 5 de julho de 2019 (UTC)Responder

Letras notas alfabéticas[editar código-fonte]

@!Silent, podia por favor adicionar a seguinte regra para que letras de notas alfa ([a], [b], [c], etc.), que usam list-style-style: lower-alpha;, sejam exibidas em tags <references />? Isto já ocorre na visão desktop, mas não na visão móvel. BTW, notas decimais, que usam list-style-style: decimal;, ainda são suportadas (por isso inherit).

/* Habilitar tipos de estilo de lista personalizados para listas de referências */
.reflist ol.references {
	list-style-type: inherit;
}

--CaiusSPQR(discussão) 06h42min de 20 de agosto de 2020 (UTC)Responder

@CaiusSPQR Feito.[6] !Silent (discussão) 11h14min de 20 de agosto de 2020 (UTC)Responder