PdfCSS:APRJA Minor Tech: Difference between revisions

From creative crowd wiki
Jump to navigation Jump to search
No edit summary
No edit summary
 
(110 intermediate revisions by 2 users not shown)
Line 28: Line 28:
     --body-size: 15px;
     --body-size: 15px;
     --small-text: 12px;
     --small-text: 12px;
     --accent-color: #2A9277;
     --accent-color: #006ae4b5;  


}
}
Line 36: Line 36:
@page{
@page{
     size: 210mm 297mm portrait;
     size: 210mm 297mm portrait;
    /*margin: 100px 100px 90px 90px;*/
    margin: 80px;
}
}
@page:left{
@page:left{
    margin: 80px 120px 80px 80px;


     font-family: var(--heading-font);
     font-family: var(--heading-font);
Line 54: Line 53:
}
}
@page:right{
@page:right{
    margin: 80px 80px 80px 120px;
      
      
     font-family: var(--heading-font);
     font-family: var(--heading-font);


     @top-right {
     @top-right {
         content: string(title);
         /*content: string(title);*/
        content: string(titleRunning);
         color: var(--accent-color);
         color: var(--accent-color);
         text-overflow: ellipsis;
         text-overflow: ellipsis;
Line 71: Line 72:
}
}
@page:first{
@page:first{
    margin: 80px 80px 80px 100px;
     background-color: var(--accent-color);
     background-color: var(--accent-color);


Line 82: Line 84:
@page contribution:first{
@page contribution:first{
     /* exception for running-header on the first page of a contribution */
     /* exception for running-header on the first page of a contribution */
     @top-right{ content: none; }  
     @top-right{ content: none; }
 
    @top-left{ content: none; }
    @bottom-right{ content: none; }
     @bottom-left{  
     @bottom-left{  
         content: "APRJA Volume 12, Issue 1, 2023 ISSN 2245-7755. CC license: ‘Attribution-NonCommercial-ShareAlike’.";  
         content: "APRJA Volume 12, Issue 1, 2023 ISSN 2245-7755. CC license: ‘Attribution-NonCommercial-ShareAlike’.";  
Line 91: Line 94:
}
}


div.contribution h2:nth-of-type(2) {
@page backmatter:left{
     break-before: always;
    @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); }
}
 
 
@page frontmatter{
    @top-left{ content: none; }
    @bottom-left{ content: none; }
    @top-right{ content: none; }
    @bottom-right{ content: none; }
}
}


div.contribution,
div.item,
div#contributors,
div#editorial,
div#wiki-to-print {  
div#wiki-to-print {  
page: contribution;  
    page: contribution;  
}  
}
div#contributors {
    page: backmatter;
}
div#toc,
div#colophon {
    page: frontmatter;
}
 
/*-----------------general rules */
 
/*body{
orphans: 3;
}*/


/*-----------------cover */
/*-----------------cover */
Line 109: Line 141:
div#cover-title p{
div#cover-title p{
     font-size: var(--first-heading-size);
     font-size: var(--first-heading-size);
     font-weight: 400;
     font-weight: bold;
     line-height: var(--first-heading-line-height);
     line-height: var(--first-heading-line-height);
     font-family: var(--heading-font);
     font-family: var(--heading-font);
Line 120: Line 152:
     font-family: var(--body-font);
     font-family: var(--body-font);
     line-height: var(--second-heading-line-height);
     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;
}
/*----------------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 TOC*/
div#toc a::before {
    content: "" target-counter(attr(href url), page);
    text-decoration: none !important;
    color: black;
    display: inline-block;
    text-indent: -4.75em;
    /*float: right;*/
    /*margin-right: -5em;*/
}
}


/*-----------------articles */
/*-----------------items */
body,
body{
table.wikitable{
     hyphens: auto;
     hyphens: auto;
     line-height: var(--line-height);
     line-height: var(--line-height);
Line 130: Line 239:
}
}


div.article{
div.item{
     break-after: always;
     break-after: always;
}
}


div.article p,
div.item p,
div.article h2{
div.item h2{
    /*columns: 2;
    column-fill: auto;*/
     overflow-wrap: break-word;
     overflow-wrap: break-word;
     hyphens: auto;
     hyphens: auto;
Line 143: Line 250:
     font-family: var(--body-font);
     font-family: var(--body-font);
     line-height: var(--line-height);
     line-height: var(--line-height);
    hyphens: none;
}
div.item h2{
margin: 0 0 var(--line-height) 0;
}
}


Line 150: Line 261:
}
}


/*----notes */
/*---- works cited + notes */
.references,
div.workscited,
.reference-text {
ol.references {
     font-family:var(--body-font);
     font-family: var(--body-font);
     font-size:var(--small-text);
     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;
}
}


/*----article title*/
/*----titles*/
div.article h1 {
div.item h1,
div#wiki-to-print h1 {
     color: var(--accent-color);
     color: var(--accent-color);
     font-weight: 400;
     font-weight: bold;
     font-size: var(--first-heading-size);
     font-size: var(--first-heading-size);
     line-height: var(--first-heading-line-height);
     line-height: var(--first-heading-line-height);
     font-family: var(--heading-font);
     font-family: var(--heading-font);
    padding-bottom: var(--first-heading-size);
     margin-top: 0;
     margin-top: 0;
     columns: 1;
     columns: 1;
     text-transform: uppercase;
     text-transform: uppercase;
     string-set: title content(text);
     /*string-set: title content(text);*/
    hyphens: none !important;
}
 
/*-----custom titles for running headers*/
span.running-header {
    display: none;
    /*position: running(titleRunning);*/
    string-set: titleRunning content(text);
}
}


/*----article author*/
/*----authors*/
div.article > p b:nth-of-type(1){
div.item > p b:nth-of-type(1),
     font-weight: 400;
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);
     color: var(--accent-color);
     font-size: var(--first-heading-size);
     font-size: var(--first-heading-size);
Line 180: Line 313:
     padding-bottom: var(--first-heading-size);
     padding-bottom: var(--first-heading-size);
     margin-top: 0;
     margin-top: 0;
    /*break-after: always;*/
}
}


div.article > h2 {
div.item > h2,
div#wiki-to-print > h2 {
     font-family: var(--heading-font);
     font-family: var(--heading-font);
     font-size: var(--second-heading-size);
     font-size: var(--second-heading-size);
     line-height: var(--second-heading-line-height);
     line-height: var(--second-heading-line-height);
     font-weight: 400;
     font-weight: 400;
    break-after: avoid;
}
}


/*----abstract heading*/
/*----"Abstract" heading*/
div.item > h2:nth-of-type(1) {
    padding-top: calc(var(--second-heading-size)*1.2);
}


div.contribution > h2:nth-of-type(1) {
/*-----overriding editorial and wiki-to-print h2 padding-top*/
     padding-top: calc(var(--second-heading-size)*2);
div.item#editorial > h2:nth-of-type(1),
div.item#wiki-to-print > h2:nth-of-type(1) {
     padding-top: 0;
}
}


/*----prevent sup, sub from interfering with baseline*/
/*----prevent superscript & subscript characters from interfering with baseline*/


sub,
sub,
Line 214: Line 353:
}
}


/*----------------manual page and column breaks*/
/*----------------manual page breaks*/


div.page-break {
div.page-break {
Line 229: Line 368:


div#contributors h1,
div#contributors h1,
div#editorial h1{
div#editorial h1,
div#wiki-to-print h1{
     font-size:var(--first-heading-size);
     font-size:var(--first-heading-size);
     font-weight: 400;
     font-weight: bold;
     line-height:var(--first-heading-line-height);
     line-height:var(--first-heading-line-height);
     color:var(--accent-color);  
     color:var(--accent-color);
}
     margin: 0;
div#editorial b:nth-of-type(1){
     break-after:always;
}
}
div#contributors p {
div#contributors p {
     font-family:var(--body-font);
     font-family:var(--body-font);
Line 244: Line 381:
     line-height:var(--line-height);
     line-height:var(--line-height);
}
}
 
div#contributors b{
    /*color:var(--accent-color);*/
}
div#wiki-to-print {
div#wiki-to-print {
     page: contribution;
     font-family:var(--body-font);
    font-size:var(--body-size);
}
}
div#wiki-to-print h1:nth-of-type(1) {
div#wiki-to-print h1:nth-of-type(1) {
     break-before:always;
     margin: 0 0 1.25em 0 !important;
}
div#wiki-to-print b:nth-of-type(1) {
    break-after:always;
}
}


/*----------------table of contents */
/*-----making the reference list in wiki-to-print 1 column*/
 
div#wiki-to-print > ol.references {
h2#mw-toc-heading {
     columns: 1 !important;
     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: 400;
}
}


div.toc li {
/*-----------------images */
    text-indent: -20px;
    list-style: none !important;
    font-family: var(--body-font);
    margin: 0;
}
 
/*----- "Contents"*/
div.toc p:nth-child(1) {
    font-family: var(--heading-font);
    font-size:var(--first-heading-size);
    color:var(--accent-color);
}


/*----- adding page numbers to the TOC*/
/*----- space between image caption and following image */
div.toc a::before {
div.thumb + div.thumb {
     content: "" target-counter(attr(href url), page);
     padding-top:var(--line-height);
    text-decoration: none !important;
    color: black;
    width: 20px;
    display: inline-block;
}
}
/*-----------------images */
div.thumbinner {
div.thumbinner {
     width: auto;
     width: auto;
}
     margin: 0 auto;
 
 
div#aprja-logo img{
     width: 80px;
    height: auto;
}
 
/*-----two-column images*/
div.thumb.tright + div.thumb.tright {
    display: inline-block;
    columns: 2;
}
}


/*-----image captions */
/*-----image captions */


div.thumbcaption {
div.thumbcaption, table.wikitable {
     font-size: var(--small-text);
     font-size: var(--small-text);
     overflow-wrap: break-word;
     overflow-wrap: break-word;
     word-wrap: break-word;
     word-wrap: break-word;
     hyphens: auto;
     hyphens: auto;
}
/*----- space between image caption / wikitable and following h2 */
div.thumb + h2,
table.wikitable + h2 {
    padding-top:var(--line-height);
}
/*-----links */
a,
a:hover,
a:visited{
    color: var(--accent-color);
    word-break: break-all;
}
}

Latest revision as of 13:43, 22 August 2023

@charset "utf-8"; 

@import url("https://cc.vvvvvvaria.org/fonts/velvetyne/happy-times-at-the-IKOB/stylesheet.css");

@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;
}

: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;    

}

/*------------------page rules */

@page{
    size: 210mm 297mm portrait;
}
@page:left{
    margin: 80px 120px 80px 80px;

    font-family: var(--heading-font);

    @top-left{
        content: "APRJA Volume 12, Issue 1, 2023";
        color: var(--accent-color);
        font-size: var(--small-text);
    }

    @bottom-left{
        content: counter(page);
    }
}
@page:right{
    margin: 80px 80px 80px 120px;
    
    font-family: var(--heading-font);

    @top-right {
        /*content: string(title);*/
        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);
    }
}
@page:first{
    margin: 80px 80px 80px 100px;
    background-color: var(--accent-color);

    @bottom-right, 
    @top-left, 
    @top-right {
        content: none;
    }
}

@page contribution:first{
    /* exception for running-header on the first page of a contribution */
    @top-right{ content: none; }
    @top-left{ content: none; } 
    @bottom-right{ content: none; } 
    @bottom-left{ 
        content: "APRJA Volume 12, Issue 1, 2023 ISSN 2245-7755. CC license: ‘Attribution-NonCommercial-ShareAlike’."; 
        white-space: pre-wrap; 
        font-size:var(--small-text); 
    }
}

@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); }
}


@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;
}

/*-----------------general rules */

/*body{
orphans: 3;
}*/

/*-----------------cover */

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;
}


/*----------------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 TOC*/
div#toc a::before {
    content: "" target-counter(attr(href url), page);
    text-decoration: none !important;
    color: black;
    display: inline-block;
    text-indent: -4.75em;
    /*float: right;*/
    /*margin-right: -5em;*/
}

/*-----------------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;
    /*string-set: title content(text);*/
    hyphens: none !important; 
}

/*-----custom titles for running headers*/
span.running-header {
    display: none;
    /*position: running(titleRunning);*/
    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;
}

/*----"Abstract" heading*/
div.item > h2:nth-of-type(1) {
    padding-top: calc(var(--second-heading-size)*1.2);
}

/*-----overriding editorial and wiki-to-print h2 padding-top*/
div.item#editorial > h2:nth-of-type(1),
div.item#wiki-to-print > h2:nth-of-type(1) {
    padding-top: 0;
}

/*----prevent 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#contributors b{
    /*color:var(--accent-color);*/
}
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 */

/*----- 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);
}

/*-----links */
a, 
a:hover,
a:visited{
    color: var(--accent-color);
    word-break: break-all;
}