PdfCSS:APRJA Content Form: Difference between revisions
Jump to navigation
Jump to search
No edit summary |
No edit summary |
||
| (7 intermediate revisions by 2 users not shown) | |||
| Line 1: | Line 1: | ||
@charset "utf-8"; | @charset "utf-8"; | ||
/* --------------------------------------- loading all fonts */ | |||
@font-face { | @font-face { | ||
| Line 44: | Line 46: | ||
font-style: normal; | font-style: normal; | ||
} | } | ||
/* --------------------------------------- styling the root element */ | |||
:root{ | :root{ | ||
| Line 56: | Line 60: | ||
--body-size: 15px; | --body-size: 15px; | ||
--small-text: 12px; | --small-text: 12px; | ||
--accent-color: #006ae4b5; | --accent-color: #006ae4b5; | ||
--accent-color: hsl(162, 70%, 54%); | |||
} | } | ||
/*------------------page rules */ | /* --------------------------------------- setting page rules */ | ||
@page{ | @page{ | ||
size: 210mm 297mm portrait; | size: 210mm 297mm portrait; | ||
} | } | ||
/* verso */ | |||
@page:left{ | @page:left{ | ||
margin: 80px 120px 80px 80px; | margin: 80px 120px 80px 80px; | ||
| Line 80: | Line 88: | ||
} | } | ||
} | } | ||
/* recto */ | |||
@page:right{ | @page:right{ | ||
margin: 80px 80px 80px 120px; | margin: 80px 80px 80px 120px; | ||
| Line 98: | Line 109: | ||
} | } | ||
} | } | ||
/* cover page */ | |||
@page:first{ | @page:first{ | ||
margin: 80px 80px 80px 100px; | margin: 80px 80px 80px 100px; | ||
| Line 108: | Line 122: | ||
} | } | ||
} | } | ||
/* --------------------------------------- custom page types */ | |||
/* exception for running-header on the first page of a contribution */ | |||
@page contribution:first{ | @page contribution:first{ | ||
@top-right{ content: none; } | @top-right{ content: none; } | ||
@top-left{ content: none; } | @top-left{ content: none; } | ||
@bottom-right{ content: none; } | @bottom-right{ content: none; } | ||
@bottom-left{ | @bottom-left{ | ||
content: "APRJA Volume 13, Issue 1, 2024 ISSN | content: "APRJA Volume 13, Issue 1, 2024 ISSN 2245-7755. CC license: CC BY-NC-SA."; | ||
white-space: pre-wrap; | white-space: pre-wrap; | ||
font-size:var(--small-text); | font-size:var(--small-text); | ||
} | } | ||
} | } | ||
/* back pages */ | |||
@page backmatter:left{ | @page backmatter:left{ | ||
| Line 133: | Line 152: | ||
} | } | ||
/* front pages */ | |||
@page frontmatter{ | @page frontmatter{ | ||
| Line 154: | Line 174: | ||
} | } | ||
/* | /* cover page */ | ||
div#cover { | div#cover { | ||
| Line 197: | Line 217: | ||
} | } | ||
/* --------------------------------------- links */ | |||
/*----------------table of contents */ | a, | ||
a:hover, | |||
a:visited{ | |||
color: var(--accent-color); | |||
word-break: break-all; | |||
} | |||
/* --------------------------------------- table of contents */ | |||
div#toc { | div#toc { | ||
| Line 232: | Line 261: | ||
} | } | ||
/* | /* "Contents" */ | ||
div#toc p:nth-child(1) { | div#toc p:nth-child(1) { | ||
font-family: var(--heading-font); | font-family: var(--heading-font); | ||
| Line 242: | Line 272: | ||
} | } | ||
/* | /* adding page numbers to the table of contents programmatically */ | ||
div#toc a::before { | div#toc a::before { | ||
content: "" target-counter(attr(href url), page); | content: "" target-counter(attr(href url), page); | ||
| Line 251: | Line 282: | ||
} | } | ||
/*-----------------items */ | /* --------------------------------------- items */ | ||
body{ | body{ | ||
hyphens: auto; | hyphens: auto; | ||
| Line 271: | Line 303: | ||
hyphens: none; | hyphens: none; | ||
} | } | ||
div.item h2{ | div.item h2{ | ||
margin: 0 0 var(--line-height) 0; | margin: 0 0 var(--line-height) 0; | ||
| Line 280: | Line 313: | ||
} | } | ||
/* | /* works cited + notes */ | ||
div.workscited, | div.workscited, | ||
ol.references { | ol.references { | ||
| Line 289: | Line 323: | ||
padding-left: var(--body-size); | padding-left: var(--body-size); | ||
} | } | ||
div.item div.workscited p{ | div.item div.workscited p{ | ||
font-size: var(--small-text) !important; | font-size: var(--small-text) !important; | ||
margin: 0 !important; | margin: 0 !important; | ||
} | } | ||
div.item div.workscited p:before{ | div.item div.workscited p:before{ | ||
content: "– "; | content: "– "; | ||
| Line 299: | Line 335: | ||
} | } | ||
/* | /* titles */ | ||
div.item h1, | div.item h1, | ||
div#wiki-to-print h1 { | div#wiki-to-print h1 { | ||
| Line 313: | Line 350: | ||
} | } | ||
/* | /* custom titles for running headers */ | ||
span.running-header { | span.running-header { | ||
display: none; | display: none; | ||
| Line 319: | Line 357: | ||
} | } | ||
/* | /* authors */ | ||
div.item > p b:nth-of-type(1), | div.item > p b:nth-of-type(1), | ||
div.item > p b:nth-of-type(2), | div.item > p b:nth-of-type(2), | ||
| Line 341: | Line 380: | ||
} | } | ||
/* | /* "Abstracts" */ | ||
div.item > h2:nth-of-type(1) { | div.item > h2:nth-of-type(1) { | ||
padding-top: calc(var(--second-heading-size)*1.2); | padding-top: calc(var(--second-heading-size)*1.2); | ||
} | } | ||
/*- | /* overriding h2 padding-top on editorial and wiki-to-print pages */ | ||
div.item#editorial > h2:nth-of-type(1), | div.item#editorial > h2:nth-of-type(1), | ||
div.item#wiki-to-print > h2:nth-of-type(1) { | div.item#wiki-to-print > h2:nth-of-type(1) { | ||
| Line 352: | Line 393: | ||
} | } | ||
/* | /* preventing superscript & subscript characters from interfering with baseline */ | ||
sub, | sub, | ||
| Line 370: | Line 411: | ||
} | } | ||
/*----------------manual page breaks*/ | /* --------------------------------------- manual page breaks */ | ||
div.page-break { | div.page-break { | ||
| Line 376: | Line 417: | ||
} | } | ||
/*---------------colophon, contributors, editorial, wiki-to-print pages*/ | /* --------------------------------------- colophon, contributors, editorial, wiki-to-print pages*/ | ||
div#colophon { | div#colophon { | ||
| Line 393: | Line 434: | ||
margin: 0; | margin: 0; | ||
} | } | ||
div#contributors p { | div#contributors p { | ||
font-family:var(--body-font); | font-family:var(--body-font); | ||
| Line 398: | Line 440: | ||
line-height:var(--line-height); | line-height:var(--line-height); | ||
} | } | ||
div#wiki-to-print { | div#wiki-to-print { | ||
font-family:var(--body-font); | font-family:var(--body-font); | ||
font-size:var(--body-size); | font-size:var(--body-size); | ||
} | } | ||
div#wiki-to-print h1:nth-of-type(1) { | div#wiki-to-print h1:nth-of-type(1) { | ||
margin: 0 0 1.25em 0 !important; | margin: 0 0 1.25em 0 !important; | ||
} | } | ||
/*-----making the reference list in wiki-to-print 1 column*/ | /* --------------------------------------- making the reference list in wiki-to-print 1 column*/ | ||
div#wiki-to-print > ol.references { | div#wiki-to-print > ol.references { | ||
columns: 1 !important; | columns: 1 !important; | ||
| Line 413: | Line 458: | ||
/*-----------------images */ | /*-----------------images */ | ||
/* | /* adding space between image caption and following image */ | ||
div.thumb + div.thumb { | div.thumb + div.thumb { | ||
padding-top:var(--line-height); | padding-top:var(--line-height); | ||
} | } | ||
div.thumbinner { | div.thumbinner { | ||
width: auto; | width: auto; | ||
| Line 422: | Line 469: | ||
} | } | ||
/* | /* image captions */ | ||
div.thumbcaption, table.wikitable { | div.thumbcaption, table.wikitable { | ||
| Line 431: | Line 478: | ||
} | } | ||
/* | /* space between image caption / wikitable and following h2 */ | ||
div.thumb + h2, | div.thumb + h2, | ||
table.wikitable + h2 { | table.wikitable + h2 { | ||
padding-top:var(--line-height); | padding-top:var(--line-height); | ||
} | } | ||
Latest revision as of 09:28, 12 June 2024
@charset "utf-8";
/* --------------------------------------- loading all fonts */
@font-face {
font-family: 'happy-times';
src: url('/fonts/velvetyne/happy-times-at-the-IKOB/happy-times-NG_regular_master.otf') format('opentype'),
url('/fonts/velvetyne/happy-times-at-the-IKOB/happy-times-NG_regular_master_web.woff2') format('woff2'),
url('/fonts/velvetyne/happy-times-at-the-IKOB/happy-times-NG_regular_master_web.woff') format('woff'),
url('/fonts/velvetyne/happy-times-at-the-IKOB/happy-times-NG_regular_master_web.ttf') format('truetype');
font-weight: normal;
font-style: normal;
}
@font-face {
font-family: 'happy-times';
src: url('/fonts/velvetyne/happy-times-at-the-IKOB/happy-times-NG_italic_master.otf') format('opentype'),
url('/fonts/velvetyne/happy-times-at-the-IKOB/happy-times-NG_italic_master_web.woff2') format('woff2'),
url('/fonts/velvetyne/happy-times-at-the-IKOB/happy-times-NG_italic_master_web.woff') format('woff'),
url('/fonts/velvetyne/happy-times-at-the-IKOB/happy-times-NG_italic_master_web.ttf') format('truetype');
font-weight: normal;
font-style: italic;
}
@font-face {
font-family: 'happy-times';
src: url('/fonts/velvetyne/happy-times-at-the-IKOB/happy-times-NG_bold_master.otf') format('opentype'),
url('/fonts/velvetyne/happy-times-at-the-IKOB/happy-times-NG_bold_master_web.woff2') format('woff2'),
url('/fonts/velvetyne/happy-times-at-the-IKOB/happy-times-NG_bold_master_web.woff') format('woff'),
url('/fonts/velvetyne/happy-times-at-the-IKOB/happy-times-NG_bold_master_web.ttf') format('truetype');
font-weight: bold;
font-style: normal;
}
@font-face {
font-family: 'AllCon-Regular';
src: url('/fonts/simoon/AC/AllCon-Regular.ttf') format('truetype');
font-weight: normal;
font-style: normal;
}
@font-face {
font-family: 'AllCon-Regular';
src: url('/fonts/simoon/AC/AllCon-Bold.ttf') format('truetype');
font-weight: bold;
font-style: normal;
}
/* --------------------------------------- styling the root element */
:root{
--first-heading-size: 36px;
--first-heading-line-height: calc(var(--line-height)*2);
--second-heading-size: 21px;
--second-heading-line-height: calc(var(--line-height)*1.5);
--body-font: 'AllCon-Regular';
--heading-font: var(--author-font);
--author-font: "happy-times", serif;
--line-height: 21px;
--body-size: 15px;
--small-text: 12px;
--accent-color: #006ae4b5;
--accent-color: hsl(162, 70%, 54%);
}
/* --------------------------------------- setting page rules */
@page{
size: 210mm 297mm portrait;
}
/* verso */
@page:left{
margin: 80px 120px 80px 80px;
font-family: var(--heading-font);
@top-left{
content: "APRJA Volume 13, Issue 1, 2024";
color: var(--accent-color);
font-size: var(--small-text);
}
@bottom-left{
content: counter(page);
}
}
/* recto */
@page:right{
margin: 80px 80px 80px 120px;
font-family: var(--heading-font);
@top-right {
content: string(titleRunning);
color: var(--accent-color);
text-overflow: ellipsis;
overflow:hidden;
white-space:nowrap;
font-size: var(--small-text);
}
@bottom-right{
content: counter(page);
}
}
/* cover page */
@page:first{
margin: 80px 80px 80px 100px;
background-color: var(--accent-color);
@bottom-right,
@top-left,
@top-right {
content: none;
}
}
/* --------------------------------------- custom page types */
/* exception for running-header on the first page of a contribution */
@page contribution:first{
@top-right{ content: none; }
@top-left{ content: none; }
@bottom-right{ content: none; }
@bottom-left{
content: "APRJA Volume 13, Issue 1, 2024 ISSN 2245-7755. CC license: CC BY-NC-SA.";
white-space: pre-wrap;
font-size:var(--small-text);
}
}
/* back pages */
@page backmatter:left{
@top-right{ content: none; }
@top-left{ content: none; }
@bottom-left{ content: counter(page); }
}
@page backmatter:right{
@top-right{ content: none; }
@top-left{ content: none; }
@bottom-right{ content: counter(page); }
}
/* front pages */
@page frontmatter{
@top-left{ content: none; }
@bottom-left{ content: none; }
@top-right{ content: none; }
@bottom-right{ content: none; }
}
div.item,
div#editorial,
div#wiki-to-print {
page: contribution;
}
div#contributors {
page: backmatter;
}
div#toc,
div#colophon {
page: frontmatter;
}
/* cover page */
div#cover {
break-after: always;
}
div#cover-title p{
font-size: var(--first-heading-size);
font-weight: bold;
line-height: var(--first-heading-line-height);
font-family: var(--heading-font);
padding-bottom: var(--first-heading-size);
margin-top: 0;
}
div.authors{
font-size: var(--second-heading-size);
font-family: var(--body-font);
line-height: var(--second-heading-line-height);
font-weight: bold;
}
div#volume-issue-year {
font-family: var(--body-font);
font-size: var(--body-size);
font-weight: bold;
padding: 0 1em 0 0;
}
div#aprja-details {
position: absolute;
bottom: 0;
left: 0;
}
div#aprja-logo img{
width: 60px;
height: auto;
}
div#aprja-logo .thumbinner {
margin: 0;
}
/* --------------------------------------- links */
a,
a:hover,
a:visited{
color: var(--accent-color);
word-break: break-all;
}
/* --------------------------------------- table of contents */
div#toc {
width: 420px;
}
h2#mw-toc-heading {
color: var(--accent-color);
font-size: var(--first-heading-size);
line-height: var(--first-heading-line-height);
font-family: var(--heading-font);
margin-top: 0;
font-weight: bold;
}
div#toc li {
list-style: none !important;
font-family: var(--heading-font);
margin: 0 0 0 2em;
padding: var(--line-height) 0 0 calc(var(--line-height) * 0.5);
font-weight: bold;
break-inside: avoid;
}
div#toc li a {
color: black;
text-decoration: none !important;
word-break: unset !important;
}
div#toc li b {
font-family: var(--body-font);
font-weight: normal;
}
/* "Contents" */
div#toc p:nth-child(1) {
font-family: var(--heading-font);
font-size:var(--first-heading-size);
color:var(--accent-color);
font-weight: bold;
margin-top: var(--line-height);
margin-bottom: calc(var(--line-height) * 2);
}
/* adding page numbers to the table of contents programmatically */
div#toc a::before {
content: "" target-counter(attr(href url), page);
text-decoration: none !important;
color: black;
display: inline-block;
text-indent: -4.75em;
}
/* --------------------------------------- items */
body{
hyphens: auto;
line-height: var(--line-height);
font-family: var(--body-font);
}
div.item{
break-after: always;
}
div.item p,
div.item h2{
overflow-wrap: break-word;
hyphens: auto;
font-size: var(--body-size);
font-family: var(--body-font);
line-height: var(--line-height);
hyphens: none;
}
div.item h2{
margin: 0 0 var(--line-height) 0;
}
blockquote {
border-left: 2px solid lightgrey;
padding-left: var(--line-height);
}
/* works cited + notes */
div.workscited,
ol.references {
font-family: var(--body-font);
font-size: var(--small-text) !important;
columns: 2 auto;
column-gap: calc(var(--line-height)*2);
padding-left: var(--body-size);
}
div.item div.workscited p{
font-size: var(--small-text) !important;
margin: 0 !important;
}
div.item div.workscited p:before{
content: "– ";
text-indent: -1em;
display: inline-block;
}
/* titles */
div.item h1,
div#wiki-to-print h1 {
color: var(--accent-color);
font-weight: bold;
font-size: var(--first-heading-size);
line-height: var(--first-heading-line-height);
font-family: var(--heading-font);
margin-top: 0;
columns: 1;
text-transform: uppercase;
hyphens: none !important;
}
/* custom titles for running headers */
span.running-header {
display: none;
string-set: titleRunning content(text);
}
/* authors */
div.item > p b:nth-of-type(1),
div.item > p b:nth-of-type(2),
div#wiki-to-print p b:nth-of-type(1){
font-weight: bold;
color: var(--accent-color);
font-size: var(--first-heading-size);
line-height: var(--first-heading-line-height);
font-family: var(--heading-font);
padding-bottom: var(--first-heading-size);
margin-top: 0;
}
div.item > h2,
div#wiki-to-print > h2 {
font-family: var(--heading-font);
font-size: var(--second-heading-size);
line-height: var(--second-heading-line-height);
font-weight: 400;
break-after: avoid;
}
/* "Abstracts" */
div.item > h2:nth-of-type(1) {
padding-top: calc(var(--second-heading-size)*1.2);
}
/* overriding h2 padding-top on editorial and wiki-to-print pages */
div.item#editorial > h2:nth-of-type(1),
div.item#wiki-to-print > h2:nth-of-type(1) {
padding-top: 0;
}
/* preventing superscript & subscript characters from interfering with baseline */
sub,
sup {
font-size: 75%;
line-height: 0;
position: relative;
vertical-align: baseline;
}
sup {
top: -0.5em;
}
sub {
bottom: -0.25em;
}
/* --------------------------------------- manual page breaks */
div.page-break {
break-after: always;
}
/* --------------------------------------- colophon, contributors, editorial, wiki-to-print pages*/
div#colophon {
width: 100%;
break-before: always;
break-after: always;
}
div#contributors h1,
div#editorial h1,
div#wiki-to-print h1{
font-size:var(--first-heading-size);
font-weight: bold;
line-height:var(--first-heading-line-height);
color:var(--accent-color);
margin: 0;
}
div#contributors p {
font-family:var(--body-font);
font-size:var(--body-size);
line-height:var(--line-height);
}
div#wiki-to-print {
font-family:var(--body-font);
font-size:var(--body-size);
}
div#wiki-to-print h1:nth-of-type(1) {
margin: 0 0 1.25em 0 !important;
}
/* --------------------------------------- making the reference list in wiki-to-print 1 column*/
div#wiki-to-print > ol.references {
columns: 1 !important;
}
/*-----------------images */
/* adding space between image caption and following image */
div.thumb + div.thumb {
padding-top:var(--line-height);
}
div.thumbinner {
width: auto;
margin: 0 auto;
}
/* image captions */
div.thumbcaption, table.wikitable {
font-size: var(--small-text);
overflow-wrap: break-word;
word-wrap: break-word;
hyphens: auto;
}
/* space between image caption / wikitable and following h2 */
div.thumb + h2,
table.wikitable + h2 {
padding-top:var(--line-height);
}