Research Realm:Main Page/styles.css: Difference between revisions

From Research Realm
REVERT TO BEFORE THIS EDIT IF THE NEW TABLE LOOKS BAD
No edit summary
 
(7 intermediate revisions by the same user not shown)
Line 15: Line 15:
padding: 0.1em;
padding: 0.1em;
margin-top: 0.5em;
margin-top: 0.5em;
margin-bottom: 3px;
}
}


Line 27: Line 28:
text-shadow: 1px 2px 3px #999;
text-shadow: 1px 2px 3px #999;
box-shadow: 0 4px 6px -6px #000;
box-shadow: 0 4px 6px -6px #000;
}
#mp-info {
font-size: 95%;
}
}


#articlecount {
#articlecount {
font-size: 85%;
font-size: 85%;
}
#articlecount > ul {
margin: 0;
padding: 0;
}
#articlecount > ul > li {
margin: 0;
display: inline;
}
#articlecount > ul > li::after {
content: " · ";
font-weight: bold;
}
#articlecount > ul > li:last-child::after {
content: "";
}
}


Line 50: Line 74:


.topics-list {
.topics-list {
margin: 1.5em 0.5em 3em 0.5em;
margin: 1.5em 0.5em 0.5em 0.5em;
line-height: 1.2;
line-height: 1.2;
text-align: left;
text-align: left;
Line 57: Line 81:
#mp-subtopics {
#mp-subtopics {
margin-top: 1.5em
margin-top: 1.5em
}
.topics-pic1 {
padding: 1px 0;
}
.topics-pic3 {
padding: 3px 0;
}
.topics-pic4 {
padding: 4px 0;
}
}



Latest revision as of 23:10, 31 October 2025

.mp-box {
	border: 1px solid #aaa; /* all colors overriden on specific elements in @media screen */
	padding: 0 0.5em 0.5em;
	margin-top: 4px;
}

/* Welcome text */

#mp-welcomecount {
	text-align: center;
	margin: 0.4em;
}

#mp-welcome {
	padding: 0.1em;
	margin-top: 0.5em;
	margin-bottom: 3px;
}

#mp-welcome h1,
#mp-welcome .mw-heading1 {
	margin: 0;
	border-bottom: 0
}

#mp-welcome h1 {
	border-bottom: solid 1px #000;
	text-shadow: 1px 2px 3px #999;
	box-shadow: 0 4px 6px -6px #000;
}

#mp-info {
	font-size: 95%;
}

#articlecount {
	font-size: 85%;
}

#articlecount > ul {
	margin: 0;
	padding: 0;
}

#articlecount > ul > li {
	margin: 0; 
	display: inline;
}

#articlecount > ul > li::after {
	content: " · ";
	font-weight: bold;
}

#articlecount > ul > li:last-child::after {
	content: "";
}

/* Middle section (flex) */

.topics-container {
	display: flex;
	flex-direction: row;
	margin: 2em auto;
	padding: 0 1em;
}

.topics-item {
	width: 100%;
	vertical-align: top;
	text-align: center;
	padding: 1em 0;
}

.topics-list {
	margin: 1.5em 0.5em 0.5em 0.5em;
	line-height: 1.2;
	text-align: left;
}

#mp-subtopics {
	margin-top: 1.5em
}

.topics-pic1 {
	padding: 1px 0;
}

.topics-pic3 {
	padding: 3px 0;
}

.topics-pic4 {
	padding: 4px 0;
}

/* Bottom text */

#mp-contributetable {
	margin: 0 auto 1em auto;
	line-height: 1.2;
}

#mp-contribute {
	font-size: 105%;
	font-weight: bold;
	padding-bottom: 1em;
}

#mp-exciting {
	text-align: center;
	font-size: 1.2em;
	font-style: italic;
	font-weight: bold;
	padding-bottom: 1em;
}

@media screen {
	#mp-topbanner {
		background-color: #eee;
		border-color: #b8b8b8;
	}
}

/* Different sizes */

@media (max-width: 850px) {
	.topics-container {
		flex-direction: column;
	}

	.topics-item {
		border-top-width: 1px;
		border-top-style: solid;
		border-top-color: #b8b8b8;
		border-bottom-width: 1px;
		border-bottom-style: solid;
		border-bottom-color: #b8b8b8;
		margin-top: -0.5px;
		margin-bottom: -0.5px;
	}
	
	.topics-list {
		text-align: center;
		margin: 1em 0.5em;
	}
	
	/* hlist replication */
	.topics-list ul {
		margin: 0;
		padding: 0;
	}

	.topics-list li {
		margin: 0;
		display: inline;
	}
		/* Display nested lists inline */
	
	.topics-list ul ul {
		display: inline;
	}
	
		/* Generate interpuncts */
	.topics-list li::after {
		content: " · ";
		font-weight: bold;
	}
	
	.topics-list li:last-child::after {
		content: none;
	}
	
		/* Add parentheses around nested lists */
	.topics-list li li:first-child::before {
		content: " (";
		font-weight: normal;
	}

	.topics-list li li:last-child::after {
		content: ")";
		font-weight: normal;
	}

}

@media (min-width: 851px) {
	.topics-item {
		border-right-width: 1px;
		border-right-style: solid;
		border-right-color: #b8b8b8;
		border-left-width: 1px;
		border-left-style: solid;
		border-left-color: #b8b8b8;
		margin-left: -0.5px;
		margin-right: -0.5px;
	}
	
	#mp-subtopics {
		margin-left: 2em;
	}
}

@media screen and (max-width: 1099px) {
	
	.topicstable {
		box-sizing: border-box;
		display: flex;
		flex-flow: row wrap;
		transition: 0.5s;
	}

}