More languages
More actions
No edit summary |
No edit summary |
||
| Line 17: | Line 17: | ||
} | } | ||
.essay-quote-text{ | .essay-quote > .essay-quote-text{ | ||
position:relative; | position:relative; | ||
font-size:2rem; | font-size:2rem; | ||
| Line 24: | Line 24: | ||
z-index:2; | z-index:2; | ||
line-height:3rem; | line-height:3rem; | ||
text-align:left; | text-align:left!important; | ||
} | } | ||
| Line 30: | Line 30: | ||
overflow:hidden; /* if the quote overlaps a title, the border at the bottom will be cut off. More aesthetic */ | overflow:hidden; /* if the quote overlaps a title, the border at the bottom will be cut off. More aesthetic */ | ||
} | } | ||
/* selectable alignment with {{{align}}} parameter */ | /* selectable alignment with {{{align}}} parameter */ | ||
| Line 58: | Line 57: | ||
@media screen and (max-width:768px){ | @media screen and (max-width:768px){ | ||
.essay-quote-left{ | .essay-quote-text{ | ||
font-size:2rem; | |||
} | |||
.essay-quote-left, .essay-quote-right{ | |||
text-align: center; | text-align: center; | ||
margin: 0 auto; | margin: 0 auto; | ||
max-width:90%; | max-width:90%; | ||
padding-top:50px; /*undoes the relative positioning which moves only the content, not the frame with it*/ | padding-top:50px; /*undoes the relative positioning which moves only the content, not the frame with it*/ | ||
float:none; | |||
} | } | ||
.essay-quote-center{ | .essay-quote-center{ | ||
Revision as of 23:09, 19 September 2023
.essay-quote{
/* container for whole quote thing */
margin:35px;
}
.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;
line-height:0; /* cancel line-height because it affects the quote due to sheer size of quotation marks*/
}
.essay-quote > .essay-quote-text{
position:relative;
font-size:2rem;
left:-15px;
top:-50px;
z-index:2;
line-height:3rem;
text-align:left!important;
}
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%;
margin-left:0;
margin-right:50px;
}
.essay-quote-right{
float:right;
clear:both;
max-width:35%;
margin-right:0;
margin-left:50px;
}
.essay-quote-center{
text-align: center;
margin:0 auto;
max-width:60%;
}
/* MOBILE POSITIONING */
@media screen and (max-width:768px){
.essay-quote-text{
font-size:2rem;
}
.essay-quote-left, .essay-quote-right{
text-align: center;
margin: 0 auto;
max-width:90%;
padding-top:50px; /*undoes the relative positioning which moves only the content, not the frame with it*/
float:none;
}
.essay-quote-center{
max-width:90%;
padding-top:50px;
}
}