Toggle menu
Toggle personal menu
Not logged in
Your IP address will be publicly visible if you make any edits.

Template:Essays homepage/style.css: Difference between revisions

Template page
No edit summary
Tag: Reverted
No edit summary
 
(5 intermediate revisions by the same user not shown)
Line 1: Line 1:
/* remove unordered list bullet points that DPL creates for the main feed */
p{
text-align:left; /*remove the justified alignment that the infobox essay template adds*/
}
 
.essays-list li > a{
.essays-list li > a{
display:none;
display:none;
Line 8: Line 11:
}
}


/* set up appearance differences between main feed and individual essay pages */
.essay-disappear{
.essay-disappear{
display:block!important;
display:block!important;
Line 17: Line 19:
}  
}  


/* font styling with two deployable classes */
.essay-small{
font-size:0.8em;
}
.essay-big{
font-size:1.2em;
}
/* MAIN FEED AND SIDEBAR */
.essays-page{
.essays-page{
display:flex;
display:flex;
Line 49: Line 41:
width:100%;
width:100%;
margin-bottom:20px;
margin-bottom:20px;
}
}


.essays-sidebar-item > div{
.essays-sidebar-item > div{
background-color: #eee; /* color is set from MediaWiki:Citizen.css for light and dark modes, this is for other themes */
background-color: #eee; /* color is set from MediaWiki:Citizen.css for light and dark modes */
padding:2px 25px;
padding:2px 25px;
border-radius:3px;
border-radius:3px;
}
.essays-sidebar-item > p{
display:none;
}
.essay-small{
font-size:0.8em;
}
.essay-big{
font-size:1.2em;
}
}


Line 61: Line 64:
transform:scale(1);
transform:scale(1);
transition:transform 0.4s;
transition:transform 0.4s;
height:300px;
}
}


Line 70: Line 72:




/* MOBILE STYLING */
 
@media screen and (max-width: 768px) {
@media screen and (max-width: 768px) {
.essays-page{
.essays-page{
Line 85: Line 87:
}
}
.infobox-essay{
.infobox-essay{
margin-bottom:40px;
margin-bottom:30px;
}
.essay-picture{
height:240px;
}
}
}
}

Latest revision as of 15:35, 15 September 2024

p{
	text-align:left; /*remove the justified alignment that the infobox essay template adds*/
}

.essays-list li > a{
	display:none;
}

.essays-list li{
	list-style-type: none;
}

.essay-disappear{
	display:block!important;
}

.essay-disappear2{ /* opposite of essay-disappear; make something appear in individual view but disappear in the homepage */
	display:none;
} 

.essays-page{
	display:flex;
	flex-flow:row-reverse wrap;
}

.essays-list{
	width:67%;
	margin-right:3%;
}

.infobox-essay{
	margin-bottom:80px;
}

.essays-sidebar{
	width:30%;
	padding-top:25px;
}

.essays-sidebar-item{
	width:100%;
	margin-bottom:20px;
}

.essays-sidebar-item > div{
	background-color: #eee; /* color is set from MediaWiki:Citizen.css for light and dark modes */
	padding:2px 25px;
	border-radius:3px;
}

.essays-sidebar-item > p{
	display:none;
}

.essay-small{
	font-size:0.8em;
}

.essay-big{
	font-size:1.2em;
}

.essay-picture img{
	transform:scale(1);
	transition:transform 0.4s;
}

.essay-picture img:hover{
	transform:scale(1.03);
	transition:transform 0.4s;
}



@media screen and (max-width: 768px) {
	.essays-page{
		display:flex;
		flex-wrap:wrap;
		flex-direction:column;
	}
	.essays-list{
		width:100%;
	}
	.essays-sidebar{
		width:100%;
		padding-top:0;
	}
	.infobox-essay{
		margin-bottom:30px;
	}
}