Template:Styles/mobile.css: Difference between revisions

Revision as of 13:05, 29 June 2021

/******************

THEMES

******************/

.theme-table {
	background-color: #eaecf0 !important;
}

.mobilenav > * > tr > th {
	background-color: #f8f9fa;
	font-size: 110%;
}

.mobilenav > * > tr > td {
	background-color: #d9eceb
}

/******************

MOBILE-ONLY

******************/

@media screen and (min-width: 600px) {
	.mobiletable {
		display: none;
	}
	.desktopgrid {
		display: grid;
	}
}

@media screen and (max-width: 600px) {
	.mobiletable {
		display: table;
	}
	.mobilecell {
		display: table-cell;
	}
	.desktopgrid {
		display: none;
	}
	.desktopcell {
		display: none;
	}
}

/******************

PADDING

******************/

/* Table padding */
table.padding-1em > tr > td,
table.padding-1em > * > tr > td {
	padding: 0.7em 1em;
}

table.padding-07em > tr > td,
table.padding-07em > * > tr > td {
	padding: 0.5em 0.7em;
}

table.padding-05em > tr > td,
table.padding-05em > * > tr > td {
	padding: 0.3em 0.5em;
}

table.padding-03em > tr > td,
table.padding-03em > * > tr > td {
	padding: 0.1em 0.3em;
}

/* Table Heading */
table.header-1em > tr > th,
table.header-1em > * > tr > th {
	padding: 0.7em 1em;
}

table.header-07em > tr > th,
table.header-07em > * > tr > th {
	padding: 0.5em 0.7em;
}

table.header-05em > tr > th,
table.header-05em > * > tr > th {
	padding: 0.3em 0.5em;
}

/******************

BREAKS

******************/

hr {
	margin: 0.5em;
	height: 0.5px;
	background-color: darkgrey;
}