This is the backend for the Pretty Poetry Component.
[[module css]]
@import url('{$fonturl}');
@import url('https://fonts.googleapis.com/css2?family=EB+Garamond:ital,wght@0,400..800;1,400..800&display=block');
.poem span {white-space:pre !important}
.poem p {
margin-top: 0em;
margin-bottom: 0em;
}
.prosepoem p { margin-top: 0em; }
.poem h4, .poem h5, .prosepoem h4, .prosepoem h5 { font-family: "{$headerfont}", "EB Garamond", "Georgia", serif }
.poem {
white-space: {$wrap} !important;
font-family: "{$fontname}", "EB Garamond", "Georgia", serif;
font-size:120%;
text-indent: -1em;
padding-left: calc(10% + 1em);
padding-right: 10%;
padding-top:5%;
padding-bottom: {$pad};
overflow: auto;
}
.prosepoem {
white-space:wrap !important;
font-family: "{$fontname}", "EB Garamond", "Georgia", serif;
font-size:120%;
text-indent: 0em;
padding-left: 10%;
padding-top: 5%;
padding-right: 10%;
padding-bottom: {$pad};
overflow: auto;
}
@media only screen and (max-width: 600px) {
.poem { padding-left: 1em; padding-right: 0%; font-size:115%;}
}
@media only screen and (max-width: 600px) {
.prosepoem { padding-left: 0em; padding-right: 0%; font-size:115%;}
}
[[/module]]