PdfCSS:APRJA Content Form: Difference between revisions
Jump to navigation
Jump to search
(Replaced content with "@charset "utf-8"; @import url('https://cc.vvvvvvaria.org/pad/p/APRJA.css/export/txt');") Tag: Replaced |
Tag: Rollback |
||
Line 1: | Line 1: | ||
@charset "utf-8"; | @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); | |||
} |
Revision as of 10:08, 26 September 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);
}