MediaWiki:Mobile.css: mudanças entre as edições

Página de Interface do MediaWiki
Sem resumo de edição
mSem resumo de edição
 
Linha 22: Linha 22:
content: url(https://shared.prolewiki.org/uploads/b/b3/Mainpageheader_mobile.png);  
content: url(https://shared.prolewiki.org/uploads/b/b3/Mainpageheader_mobile.png);  
}
}
/* Infobox template style */
/*****************************/
.infobox {
/*******Site notice CSS*******/
border: 1px solid #a2a9b1;
 
border-spacing: 3px;
.sitenotice-box {
background-color: #f8f9fa;
display: flex;
color: black;
flex-direction: column;
/* @noflip */
padding: 20px;
margin: 0.5em 0 0.5em 0em;
width: 80%;
padding: 0.2em;
background: #efefef;
width: 100%;
border-radius: 15px;
/* @noflip */
margin: auto;
clear: right;
}
font-size: 88%;
 
line-height: 1.5em;
.sitenotice-text,
.sitenotice-subtext,
.sitenotice-button,
.sitenotice-button-dismiss {
font-family:Helvetica;
font-weight:bold;
}
}
.infobox caption {
.sitenotice-text {
font-size: 125%;
font-size:150%;
font-weight: bold;
color: #646464;
padding: 0.2em;
margin: 0.25em 0;
text-align: center;
}
}
.infobox td,
 
.infobox th {
.sitenotice-subtext {
vertical-align: top;
font-size:115%;
/* @noflip */
color: #646464;
text-align: left;
margin-bottom: 1em;
}
}
.infobox.bordered {
 
border-collapse: collapse;
.sitenotice-button-container {
display: flex;
width: 100%;
justify-content: flex-end;
}
}
.infobox.bordered td,
.sitenotice-button-container > span {
.infobox.bordered th {
padding: 12px;
border: 1px solid #a2a9b1;
height: 12px;
border-radius: 8px;
font-size: 115%;
cursor:pointer;
line-height: 12px;
box-shadow: 0px 2px 6px #5f5f5f;
}
}
.infobox.bordered .borderless td,
.sitenotice-button {
.infobox.bordered .borderless th {
background: #ff2206;
border: 0;
color: white;
}
}


.infobox.sisterproject {
.sitenotice-button:hover {
width: 20em;
background-color: #dd2206;
font-size: 90%;
transition: background-color 100ms;
}
}


.infobox.standard-talk {
.sitenotice-button:not(:last-child) {
border: 1px solid #c0c090;
margin-right:0.5em;
background-color: #f8eaba;
}
}
.infobox.standard-talk.bordered td,
 
.infobox.standard-talk.bordered th {
.sitenotice-button-dismiss {
border: 1px solid #c0c090;
background: #a6a6a6;
color: white;
margin-right:auto;
}
}


/* styles for bordered infobox with merged rows */
.sitenotice-button-dismiss:hover {
.infobox.bordered .mergedtoprow td,
  background-color: #868686;
.infobox.bordered .mergedtoprow th {
  transition: background-color 100ms;
border: 0;
border-top: 1px solid #a2a9b1;
/* @noflip */
border-right: 1px solid #a2a9b1;
}
}
/*End of site notice configuration*/


.infobox.bordered .mergedrow td,
.content blockquote {
.infobox.bordered .mergedrow th {
border-left: 3px solid #eee;
border: 0;
padding: 8px 16px;
/* @noflip */
font-size: 95%;
border-right: 1px solid #a2a9b1;
font-family: inherit;
}
}


/* Styles for geography infoboxes, eg countries,
 
  country subdivisions, cities, etc.            */
/**********************************/
.infobox.geography {
/*******CSS for Citizen skin*******/
border-collapse: collapse;
 
line-height: 1.2em;
@media screen {
font-size: 90%;
:root.skin-citizen-light {
--border-color-1:hsl(0, 0%, 69%);
--border-color-2:hsl(0, 0%, 88%);
--color-surface-2:hsl(0,0%,97%);
--color-surface-4:hsl(213,30%,85%);
--color-surface-5:hsl(220,17%,93%);
--color-surface-6:hsl(200,2%,60%);
--color-surface-7:hsl(180,2%,40%);
--color-surface-subtle-red:hsl(0, 100%, 97%);
--color-success2:hsl(167,70%,31%);
--color-red-3:#b50014;
--color-base:#262e35;
--color-base--subtle:#646464;
--color-base--emphasized:#202020;
--color-primary:#143fbf;
}
:root.skin-citizen-dark {
--border-color-1:hsl(220, 28%, 23%);
--border-color-2:hsl(220,25%,20%);
--color-surface-5:hsl(220,25%,15%);
--color-surface-6:hsl(220,12%,35%);
--color-surface-7:hsl(220,12%,40%);
--color-red-3:#b50014;
--color-surface-subtle-red:hsl(0, 45%, 28%);
--color-primary:#5c85d6;
}
}
}


.infobox.geography  td,
/*************************/
.infobox.geography  th {
/*******Infobox CSS*******/
border-top: 1px solid #a2a9b1;
 
padding: 0.4em 0.6em 0.4em 0.6em;
.skin-citizen .infobox {
border: 1px solid var(--border-color-1);
background-color: var(--color-surface-2);
  width: 100%;
  max-width: 100%;
display: flex;
flex-flow: column nowrap;
}
}
.infobox.geography .mergedtoprow td,
.skin-citizen .infobox > tbody, .skin-citizen .infobox > caption {
.infobox.geography .mergedtoprow th {
display: flex;
border-top: 1px solid #a2a9b1;
  flex-flow: column nowrap;
padding: 0.4em 0.6em 0.2em 0.6em;
}
}


.infobox.geography .mergedrow td,
.skin-citizen .infobox > tbody > tr {
.infobox.geography .mergedrow th {
min-width: 100%;
  display: flex;
  flex-flow: row nowrap;
}
.skin-citizen .infobox td:only-child, .skin-citizen .infobox th:only-child {
width: 100%;
}
.skin-citizen .infobox th, .skin-citizen .infobox td {
border-bottom: 1px solid var(--border-color-1);
}
.skin-citizen .infobox tr:last-child th, .skin-citizen .infobox tr:last-child td {
border: 0;
border: 0;
padding: 0 0.6em 0.2em 0.6em;
}
}
 
.skin-citizen .infobox tbody > tr > td, .skin-citizen .infobox tbody > tr > th {
.infobox.geography .mergedbottomrow td,
flex: 1 0;
.infobox.geography .mergedbottomrow th {
}
border-top: 0;
.skin-citizen .infobox.geography td, .infobox.geography th, .infobox.geography .mergedtoprow td, .infobox.geography .mergedtoprow th{
border-bottom: 1px solid #a2a9b1;
border-top: 1px solid var(--border-color-1);
padding: 0 0.6em 0.4em 0.6em;
}
.skin-citizen .infobox.geography .mergedbottomrow td, .infobox.geography .mergedbottomrow th {
border-bottom: 1px solid var(--border-color-1);
}
}
 
.skin-citizen .infobox.geography .mergedrow td, .infobox.geography .mergedrow th {
.infobox.geography .maptable td,
border:0;
.infobox.geography .maptable th {
border: 0;
padding: 0;
}
}

Edição atual tal como às 17h25min de 23 de julho de 2023

/* O CSS colocado aqui afetará os usuários do site móvel */

/*Main page bullshit*/
.page-ProleWiki_Página_principal .firstHeading
	{ display: none; }

.page-ProleWiki_Página_principal .mw-parser-output .wd-mp-subheader {
	display: none;
}

.page-ProleWiki_Página_principal .mw-parser-output .wd-mp-headerbox {
	padding: 1em;
}


#pw-mp-banner span 
{
	display: inline-block;
	width: 100%;
	object-fit: contain;
	object-position: center;
	content: url(https://shared.prolewiki.org/uploads/b/b3/Mainpageheader_mobile.png); 
}
/*****************************/
/*******Site notice CSS*******/

.sitenotice-box {
	display: flex;
	flex-direction: column;
	padding: 20px;
	width: 80%;
	background: #efefef;
	border-radius: 15px;
	margin: auto;
}

.sitenotice-text,
.sitenotice-subtext,
.sitenotice-button,
.sitenotice-button-dismiss {
	font-family:Helvetica;
	font-weight:bold;
}
.sitenotice-text {
	font-size:150%;
	color: #646464;
	margin: 0.25em 0;
}

.sitenotice-subtext {
	font-size:115%;
	color: #646464;
	margin-bottom: 1em;
}

.sitenotice-button-container {
	display: flex;
	width: 100%;
	justify-content: flex-end;
}
.sitenotice-button-container > span {
	padding: 12px;
	height: 12px;
	border-radius: 8px;
	font-size: 115%;
	cursor:pointer;
	line-height: 12px;
	box-shadow: 0px 2px 6px #5f5f5f;
}
.sitenotice-button {
	background: #ff2206;
	color: white;
}

.sitenotice-button:hover {
	background-color: #dd2206;
	transition: background-color 100ms;
}

.sitenotice-button:not(:last-child) {
	margin-right:0.5em;
}

.sitenotice-button-dismiss {
	background: #a6a6a6;
	color: white;
	margin-right:auto;
}

.sitenotice-button-dismiss:hover {
  background-color: #868686;
  transition: background-color 100ms;
}
/*End of site notice configuration*/

.content blockquote {
	border-left: 3px solid #eee;
	padding: 8px 16px;
	font-size: 95%;
	font-family: inherit;
}


/**********************************/
/*******CSS for Citizen skin*******/

@media screen {
	:root.skin-citizen-light {
		--border-color-1:hsl(0, 0%, 69%);
		--border-color-2:hsl(0, 0%, 88%);
		--color-surface-2:hsl(0,0%,97%);
		--color-surface-4:hsl(213,30%,85%);
		--color-surface-5:hsl(220,17%,93%);
		--color-surface-6:hsl(200,2%,60%);
		--color-surface-7:hsl(180,2%,40%);
		--color-surface-subtle-red:hsl(0, 100%, 97%);
		--color-success2:hsl(167,70%,31%);
		--color-red-3:#b50014;
		--color-base:#262e35;
		--color-base--subtle:#646464;
		--color-base--emphasized:#202020;
		--color-primary:#143fbf;
	}
	:root.skin-citizen-dark {
		--border-color-1:hsl(220, 28%, 23%);
		--border-color-2:hsl(220,25%,20%);
		--color-surface-5:hsl(220,25%,15%);
		--color-surface-6:hsl(220,12%,35%);
		--color-surface-7:hsl(220,12%,40%);
		--color-red-3:#b50014;
		--color-surface-subtle-red:hsl(0, 45%, 28%);
		--color-primary:#5c85d6;
	}
}

/*************************/
/*******Infobox CSS*******/

.skin-citizen .infobox {
	border: 1px solid var(--border-color-1);
	background-color: var(--color-surface-2);
  width: 100%;
  max-width: 100%;
	display: flex;
	flex-flow: column nowrap;
}
.skin-citizen .infobox > tbody, .skin-citizen .infobox > caption {
	display: flex;
  flex-flow: column nowrap;
}

.skin-citizen .infobox > tbody > tr {
	min-width: 100%;
  display: flex;
  flex-flow: row nowrap;
}
.skin-citizen .infobox td:only-child, .skin-citizen .infobox th:only-child {
	width: 100%;
}
.skin-citizen .infobox th, .skin-citizen .infobox td {
	border-bottom: 1px solid var(--border-color-1);
}
.skin-citizen .infobox tr:last-child th, .skin-citizen .infobox tr:last-child td {
	border: 0;
}
.skin-citizen .infobox tbody > tr > td, .skin-citizen .infobox tbody > tr > th {
	flex: 1 0;
}
.skin-citizen .infobox.geography td, .infobox.geography th, .infobox.geography .mergedtoprow td, .infobox.geography .mergedtoprow th{
	border-top: 1px solid var(--border-color-1);
}
.skin-citizen .infobox.geography .mergedbottomrow td, .infobox.geography .mergedbottomrow th {
	border-bottom: 1px solid var(--border-color-1);
}
.skin-citizen .infobox.geography .mergedrow td, .infobox.geography .mergedrow th {
	border:0;
}