Difference between revisions of "MediaWiki:Mobile.css"

From TaticView
Jump to: navigation, search
 
(108 intermediate revisions by the same user not shown)
Line 4: Line 4:
 
.header-container .branding-box > h1 { display: none; }
 
.header-container .branding-box > h1 { display: none; }
 
.header-container .branding-box {  
 
.header-container .branding-box {  
   background-image: url(https://wiki.taticview.com/skins/common/images/logo.png?16bb4);
+
   background-image: url(https://wiki.taticview.com/skins/common/images/logo.png);
   
 
 
   background-repeat: no-repeat;
 
   background-repeat: no-repeat;
   background-size: 100% 90%;
+
   background-size: 200px 50px;
 +
  background-position: 0px;
 
}
 
}
  
 +
/* Faz com que as imagens se adaptem ao tamanho da tela no mobile */
 +
img { max-width: 100% !important; height: auto !important; }
  
/* Remove link para últimas modificações da página */
+
/* Seta a font default da Wiki Tatic */
footer div.last-modified-bar { display:none !important; }
+
.section-heading,
 +
.mw-headline { font-family: inherit !important; }
  
/* Remove label TaticView do rodapé da página */
+
/* Adiciona espaçamento antes da barra de traduções */
footer > .post-content > h2 { display: none; }
+
#bodyContent { padding-top: 10px; }
 +
 
 +
/* Adiciona margem após a barra de traduções */
 +
#mf-section-0 { margin-bottom: 10px; }
 +
 
 +
/* Remove todo o footer da página */
 +
#mw-mf-page-center > footer > .last-modified-bar,
 +
#mw-mf-page-center > footer #footer-places-privacy,
 +
#mw-mf-page-center > footer > .footer-content > h2 { display:none !important; }
  
 
/* Remove seta indicadora de expansão do bloco "Bem vindo..." */
 
/* Remove seta indicadora de expansão do bloco "Bem vindo..." */
div.mw-parser-output h2.section-heading:first-of-type > div { display: none; }
+
/* div.mw-parser-output h2.section-heading:first-of-type > div { display: none; } */
  
/* Remove informações sobre tradução da página */
+
/* Remove informações sobre tradução da página e separador do conteúdo */
div#content div.pre-content, div#bodyContent div.mw-pt-translate-header { display: none; }
+
div#content div.pre-content, div#bodyContent div.mw-pt-translate-header, #mw-content-text > hr { display: none; }
  
 
/* Remove botão para discussão*/
 
/* Remove botão para discussão*/
 
div#content div.post-content { display: none; }
 
div#content div.post-content { display: none; }
 +
 +
/* Remove parágrafos não utilizados */
 +
#content p:empty, #content p > br:only-child  { display: none; }
 +
 +
/* Ajusta espaço entre conteúdo e footer */
 +
#mw-mf-page-center > footer > .footer-content { margin-top: 10px; }
 +
 +
/* Ajusta dimensões e posicionamento das tabelas de conteúdo */
 +
.content-table tr { display: flex; }
 +
.content-table td { display: flex; flex-direction: column; font-size: .9em; width: 33%; padding-left: 5px; }
 +
 +
/* Remove opções não utilizadas no menu */
 +
nav#mw-mf-page-left ul:first-child li:last-child,
 +
nav#mw-mf-page-left ul:nth-child(2),
 +
nav#mw-mf-page-left ul:nth-child(3),
 +
nav#mw-mf-page-left ul:last-child li:last-child { display: none; }
 +
 +
/* Ajusta formatação dos links para o termo de uso e politica de privacidade */
 +
div#terms { display: flex; justify-content: center; }
 +
div#terms > p { display: flex; justify-content: space-around; width: 100%; }
 +
 +
/* Remove opção de visualizar informações das imagens, quando clicadas */
 +
.media-viewer .details { display: none !important; }
 +
 +
@media(max-width: 376px) {
 +
  .content-table tr { flex-direction: column; }
 +
  .content-table td { flex-direction: row; align-items: center; flex-wrap: wrap; border-bottom: 1px solid lightgray; margin-bottom: 10px; width: 100%; }
 +
  .content-table td > p:last-child { width: 100%; }
 +
}

Latest revision as of 12:36, 24 January 2019

/* CSS placed here will affect users of the mobile site */

/* Adiciona logotipo no topo da página */
.header-container .branding-box > h1 { display: none; }
.header-container .branding-box { 
   background-image: url(https://wiki.taticview.com/skins/common/images/logo.png);
   background-repeat: no-repeat;
   background-size: 200px 50px;
   background-position: 0px;
}

/* Faz com que as imagens se adaptem ao tamanho da tela no mobile */
img { max-width: 100% !important; height: auto !important; }

/* Seta a font default da Wiki Tatic */
.section-heading,
.mw-headline { font-family: inherit !important; }

/* Adiciona espaçamento antes da barra de traduções */
#bodyContent { padding-top: 10px; }

/* Adiciona margem após a barra de traduções */
#mf-section-0 { margin-bottom: 10px; }

/* Remove todo o footer da página */
#mw-mf-page-center > footer > .last-modified-bar, 
#mw-mf-page-center > footer #footer-places-privacy,
#mw-mf-page-center > footer > .footer-content > h2  { display:none !important; }

/* Remove seta indicadora de expansão do bloco "Bem vindo..." */
/* div.mw-parser-output h2.section-heading:first-of-type > div { display: none; } */

/* Remove informações sobre tradução da página e separador do conteúdo */
div#content div.pre-content, div#bodyContent div.mw-pt-translate-header, #mw-content-text > hr { display: none; }

/* Remove botão para discussão*/
div#content div.post-content { display: none; }

/* Remove parágrafos não utilizados */
#content p:empty, #content p > br:only-child  { display: none; }

/* Ajusta espaço entre conteúdo e footer */
#mw-mf-page-center > footer > .footer-content { margin-top: 10px; }

/* Ajusta dimensões e posicionamento das tabelas de conteúdo */ 
.content-table tr { display: flex; }
.content-table td { display: flex; flex-direction: column; font-size: .9em; width: 33%; padding-left: 5px; }

/* Remove opções não utilizadas no menu */
nav#mw-mf-page-left ul:first-child li:last-child,
nav#mw-mf-page-left ul:nth-child(2), 
nav#mw-mf-page-left ul:nth-child(3),
nav#mw-mf-page-left ul:last-child li:last-child { display: none; }

/* Ajusta formatação dos links para o termo de uso e politica de privacidade */
div#terms { display: flex; justify-content: center; }
div#terms > p { display: flex; justify-content: space-around; width: 100%; }

/* Remove opção de visualizar informações das imagens, quando clicadas */
.media-viewer .details { display: none !important; }

@media(max-width: 376px) {
  .content-table tr { flex-direction: column; }
  .content-table td { flex-direction: row; align-items: center; flex-wrap: wrap; border-bottom: 1px solid lightgray; margin-bottom: 10px; width: 100%; }
  .content-table td > p:last-child { width: 100%; }
}