Difference between revisions of "Template:Mbox/styles.css"

From Appropedia
Jump to navigation Jump to search
 
(11 intermediate revisions by the same user not shown)
Line 6: Line 6:
 
border-right: 1px solid #CCC;
 
border-right: 1px solid #CCC;
 
font-size: 95%;
 
font-size: 95%;
margin: 1em 10%;
+
margin: 1em 0;
 +
}
 +
.mbox-image {
 +
padding: 0.25em 1em 0.25em 0.5em;
 +
text-align: center;
 +
}
 +
.mbox img {
 +
display: block;
 
}
 
}
 
.mbox-text {
 
.mbox-text {
Line 12: Line 19:
 
width: 100%;
 
width: 100%;
 
}
 
}
.mbox-image {
+
.mbox-head {
padding: 2px 0 2px 0.5em;
+
font-weight: bold;
text-align: center;
+
margin-right: 1em;
 +
}
 +
.mbox-foot {
 +
font-size: smaller;
 
}
 
}
.mbox-imageright {
+
.mbox-tap {
padding: 2px 0.5em 2px 0;
+
display: none;
text-align: center;
+
float: right;
 
}
 
}
@media screen and (max-width:600px) {
+
@media screen and (max-width:640px) {
 
.mbox {
 
.mbox {
 
margin: .5em 0;
 
margin: .5em 0;
 +
}
 +
.mbox .hide-when-compact {
 +
display: none;
 +
}
 +
.mbox-tap {
 +
display: inline;
 +
}
 +
.mbox:hover .mbox-tap {
 +
display: none;
 
}
 
}
 
.mbox:hover .hide-when-compact {
 
.mbox:hover .hide-when-compact {
display: block;
+
display: initial;
 
}
 
}
 
}
 
}

Latest revision as of 13:35, 17 January 2021

.mbox {
	border-collapse: collapse;
	background-color: #fbfbfb;
	border-bottom: 1px solid #aaa;
	border-left: 1px solid #CCC;
	border-right: 1px solid #CCC;
	font-size: 95%;
	margin: 1em 0;
}
.mbox-image {
	padding: 0.25em 1em 0.25em 0.5em;
	text-align: center;
}
.mbox img {
	display: block;
}
.mbox-text {
	padding: 0.25em 0.5em;
	width: 100%;
}
.mbox-head {
	font-weight: bold;
	margin-right: 1em;
}
.mbox-foot {
	font-size: smaller;
}
.mbox-tap {
	display: none;
	float: right;
}
@media screen and (max-width:640px) {
	.mbox {
		margin: .5em 0;
	}
	.mbox .hide-when-compact {
		display: none;
	}
	.mbox-tap {
		display: inline;
	}
	.mbox:hover .mbox-tap {
		display: none;
	}
	.mbox:hover .hide-when-compact {
		display: initial;
	}
}

.mbox-notice {
	border-top: 5px solid #608ec2;
}
.mbox-protection {
	border-top: 5px solid #bba;
}
.mbox-serious {
	border-top: 5px solid #b22222;
}
.mbox-content {
	border-top: 5px solid #f28500;
}
.mbox-style {
	border-top: 5px solid #f4c430
}
.mbox-merge {
	border-top: 5px solid #8c08a4
}
.mbox-growth {
	border-top: 5px solid #47a30d
}