Template:Essay quote/style.css: Difference between revisions

Template page
No edit summary
No edit summary
Line 45: Line 45:
     text-align: center;
     text-align: center;
     margin:0 auto;
     margin:0 auto;
    max-width:60%;
}
}


Line 53: Line 54:
text-align: center;
text-align: center;
     margin: 0 auto;
     margin: 0 auto;
     max-width:100%;
     max-width:90%;
}
}
.essay-quote-right{
.essay-quote-right{
text-align: center;
text-align: center;
     margin: 0 auto;
     margin: 0 auto;
     max-width:100%;
     max-width:90%;
}
.essay-quote-center{
max-width:90%;
}
}
}
}

Revision as of 22:38, 19 September 2023

.essay-quote{
	/* container for whole quote thing */

}

.essay-quote-mark{
	/* just the quotation mark that appears behind the quote */
	user-select:none;
	font-size:8rem;
	position:relative;
	z-index:1;
	color:#7f7f7f;
	opacity:0.5;
	font-family: Serif;
	font-weight:bold;
}

.essay-quote-text{
	position:relative;
	font-size:2rem;
	left:-15px;
	top:-50px;
	z-index:2;
}

h1,h2{
	overflow:hidden; /* if the quote overlaps a title, the border at the bottom will be cut off. More aesthetic */
}


/* selectable alignment with {{{align}}} parameter */
.essay-quote-left{
	float:left;
	clear:both;
	max-width:35%;
}

.essay-quote-right{
	float:right;
	clear:both;
	max-width:35%;
}

.essay-quote-center{
    text-align: center;
    margin:0 auto;
    max-width:60%;
}

/* Mobile positioning */

@media screen and (max-width:768px){
	.essay-quote-left{
	text-align: center;
    margin: 0 auto;
    max-width:90%;
	}
	.essay-quote-right{
	text-align: center;
    margin: 0 auto;
    max-width:90%;
	}
	.essay-quote-center{
		max-width:90%;
	}
}