Difference between revisions of "MediaWiki:Mobile.css"
(138 intermediate revisions by the same user not shown) | |||
Line 1: | Line 1: | ||
/* CSS placed here will affect users of the mobile site */ | /* 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%; } | ||
+ | } |
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%; } }