initial commit

css/modules/_footnotes.scss

@@ -0,0 +1,39 @@
+@page {
+    @footnote {
+      float: bottom;
+      
+    }
+  }
+
+  .pagedjs_footnote_content{
+  padding-top: calc(var(--baseline)*1);
+  }
+  
+.inline-note { 
+  float: footnote; 
+  font-size: 9px;
+  line-height: calc(var(--baseline)*0.9);
+  padding-left: var(--indent);
+  position: relative;
+  font-weight: 100;
+
+  &::marker{
+    display: none;
+    content: "";
+  }
+  
+}
+
+
+[data-counter-note]{
+&::before{
+    content: attr(data-counter-note) ".";
+    position: absolute;
+    // left: calc(var(--indent)*-1);
+    left: 0px;
+  }
+}
+
+[data-footnote-call]{
+      font-size: 9px;
+}

css/modules/_init.scss

@@ -0,0 +1,20 @@
+* {
+    margin: 0;
+    padding: 0;
+    box-sizing: border-box;
+}
+a {
+    color: currentColor;
+}
+
+body {
+    -webkit-font-smoothing: antialiased; /* Chrome, Safari, iOS */
+    -moz-osx-font-smoothing: grayscale;  /* Firefox macOS */
+
+    text-rendering: optimizeLegibility;  /* meilleure lisibilité, ligatures, kerning */
+    font-feature-settings: "liga" 1;     /* active les ligatures si la police les supporte */
+
+    font-family: var(--font);
+    font-size: var(--font-size);
+    line-height: var(--baseline);
+}

css/modules/_layout.scss

@@ -0,0 +1,79 @@
+@media print {
+    @page {
+        size: 134mm 205mm;
+        // size: 150mm 220mm;
+        margin-top: 67px;
+        margin-bottom: 10mm;
+        margin-left: 10mm;
+        margin-right: 10mm;
+        bleed: 6mm;
+        marks: crop;
+    }
+    @page:left {
+        margin-left: 12mm;
+        margin-right: 32mm;
+        @top-left {
+            content: counter(page);
+        }
+        // @top-right {
+        //     content: "Höchstpersönlichkeit";
+        //     font-variant-caps: small-caps;
+        //     letter-spacing: 0.01em;
+        // }
+    }
+    @page:right {
+        margin-left: 32mm;
+        margin-right: 12mm;
+        @top-right {
+            content: counter(page);
+        }
+        @top-left {
+            content: "Höchstpersönlichkeit";
+            font-variant-caps: small-caps;
+            letter-spacing: 0.05em;
+        }
+            
+    }
+    @page:first {
+        @top-left-corner { content: none; }
+        @top-left { content: none; }
+        @top-center { content: none; }
+        @top-right { content: none; }
+        @top-right-corner { content: none; }
+        @left-top { content: none; }
+        @left-middle { content: none; }
+        @left-bottom { content: none; }
+        @right-top { content: none; }
+        @right-middle { content: none; }
+        @right-bottom { content: none; }
+        @bottom-left-corner { content: none; }
+        @bottom-left { content: none; }
+        @bottom-center { content: none; }
+        @bottom-right { content: none; }
+        @bottom-right-corner { content: none; }
+    }
+    @page:blank {
+        @top-left-corner { content: none; }
+        @top-left { content: none; }
+        @top-center { content: none; }
+        @top-right { content: none; }
+        @top-right-corner { content: none; }
+        @left-top { content: none; }
+        @left-middle { content: none; }
+        @left-bottom { content: none; }
+        @right-top { content: none; }
+        @right-middle { content: none; }
+        @right-bottom { content: none; }
+        @bottom-left-corner { content: none; }
+        @bottom-left { content: none; }
+        @bottom-center { content: none; }
+        @bottom-right { content: none; }
+        @bottom-right-corner { content: none; }
+    }
+}
+
+
+#section__content{
+    break-before: right;
+    
+}

css/modules/_list-of-abbr.scss

@@ -0,0 +1,4 @@
+#section__list-of-abbr{ 
+    display: none; 
+    color: red;
+}

css/modules/_text.scss

@@ -0,0 +1,108 @@
+sup{
+    line-height: 0;
+}
+
+hr{
+    border: none;
+    height: var(--baseline);
+}
+
+a{
+    color: currentColor;
+    text-decoration: none;
+}
+
+p{
+    text-align: justify;
+    orphans: 2;
+    widows: 2;
+}
+
+p, li{
+    hyphens: auto;
+    hyphenate-limit-chars: 7 3 4;
+    hyphenate-limit-lines: 2;
+    hyphenate-limit-zone: 8%;
+    word-spacing: -0.004em;
+}
+
+                                                                                                                                                      
+
+ol[type="1"]{
+    list-style-type: none; 
+    position: relative; 
+    break-after: avoid;
+
+    position: absolute;
+    left: calc(var(--indent)*-3);
+    &::before{
+        content: attr(start);
+        font-family: var(--font-sans);
+        // font-weight: 200;
+        font-size: 0.6rem; 
+        color: #999; 
+        display: block;
+        padding: 0px 2px;
+        border: 1px solid #efefef;
+
+        min-width: 1.5ch;
+        display: flex;
+        justify-content: center;
+    }
+
+                                                                                                                 
+   
+}
+
+.pagedjs_left_page{
+    ol[type="1"] {
+        left: inherit;
+        right: calc(var(--indent)*-3);
+    }
+}
+
+p + p,
+ol[type="1"] + p{
+    text-indent: calc(var(--indent)*0.5);
+}
+
+
+
+blockquote{
+    padding-left: var(--indent);
+    margin-top: calc(var(--baseline)*1);
+    margin-bottom: calc(var(--baseline)*1);
+    
+    p{
+        font-style: italic;
+        em{
+            font-style: normal;
+        }
+    }
+
+
+    u{
+          font-variant: small-caps;
+          text-decoration: none;
+    }
+    
+}
+
+blockquote + ol + p{ text-indent: 0px; }
+
+
+
+.these{
+    &::before{
+        content: "---"
+    }
+    &::after{
+        content: "---";
+    }
+    &::before, &::after{
+        display: flex;
+        // width: 3ch;
+        justify-content: center;
+    }
+
+}

css/modules/_titles-counters.scss

@@ -0,0 +1,50 @@
+#section__content{
+
+    counter-reset: h1;
+
+    h1{
+        counter-increment: h1 1;
+        counter-reset: h2;
+    }
+
+    h1::before{
+        content: counter(h1, upper-alpha);
+
+    }
+
+    h2{
+        counter-increment: h2 1;
+        counter-reset: h3;
+    }
+
+    h2::before{
+        content: counter(h2, upper-roman);
+    }
+
+     h3{
+        counter-increment: h3 1;
+        counter-reset: h4;
+    }
+
+    h3::before{
+        content: counter(h3);
+    }
+
+    h4{
+        counter-increment: h4 1;
+        counter-reset: h5;
+    }
+
+    h4::before{
+        content: counter(h4, lower-alpha) ". ";
+    }
+
+    h5{
+        counter-increment: h5 1;
+        counter-reset: h6;
+    }
+
+    h5::before{
+        content: counter(h5, lower-alpha) counter(h5, lower-alpha) ". ";
+    }
+  }

css/modules/_titles.scss

@@ -0,0 +1,124 @@
+
+#section__content{
+
+
+    h1, h2, h3 {
+        break-inside: avoid;
+        break-after: avoid;
+
+        /* hack for avoiding break-after */
+        margin-bottom: calc(var(--baseline)*-3);
+        &::after{
+            content: '';
+            display: block;
+            height: calc(var(--baseline)*3);
+            // background-color: rgba(255, 255, 0, 0.595);
+        }
+    }
+
+
+    h1 + ol + p,
+    h2 + ol + p,
+    h3 + ol + p,
+    h4 + ol + p,
+    h5 + ol + p,
+    h6 + ol + p{
+        text-indent: 0;
+    }
+
+    h1{
+        font-family: var(--font-title);
+        font-weight: normal;
+        font-size: 1.5rem;
+        line-height: calc(var(--baseline)*1.4);
+        text-align: center;
+        position: relative;
+        margin-top: calc(var(--baseline)*3 - 3px);
+        padding-bottom: calc(var(--baseline)*1);
+        padding-left: 1ch;
+        padding-right: 1ch;
+        &::before{
+            display: block;
+            font-size: 1rem;
+            
+        }
+    }
+
+    h1:first-of-type{
+        margin-top: 3px!important;
+    }
+
+
+    
+
+    h2{
+        font-family: var(--font-title);
+        font-weight: normal;
+        font-size: 1.3rem;
+        line-height: calc(var(--baseline)*1.2);
+
+        text-align: right;
+        padding-left: 3ch;
+        position: relative;
+        margin-top: calc(var(--baseline)*1 + 9px);
+        padding-bottom: calc(var(--baseline)*1);
+        &::before{
+            position: absolute;
+            left: 0;
+        }
+    }
+
+    h3{
+        font-family: var(--font-sans);
+        font-weight: normal;
+        font-size: 1rem;
+        line-height: calc(var(--baseline)*1);
+
+        text-align: right;
+        padding-left: 3ch;
+        position: relative;
+        margin-top: calc(var(--baseline)*1 + 9px);
+        padding-bottom: calc(var(--baseline)*1);
+        &::before{
+            // font-family: 'Helixotrope 4';
+            // font-size: var(--font-size);
+            // font-weight: bold;
+            position: absolute;
+            left: 0;
+        }
+    }
+
+    h4{
+        font-family:  var(--font-sans);
+        font-weight: normal;
+        font-size: 0.8rem;
+        line-height: calc(var(--baseline)*1);
+
+        text-align: right;
+        padding-left: 3ch;
+        position: relative;
+         margin-top: calc(var(--baseline)*0.5);
+        margin-bottom: calc(var(--baseline)*0.5);
+        font-weight: 500;
+      
+    }
+
+
+    h5{
+        font-family:  var(--font-sans);
+        font-weight: normal;
+        font-size: 0.7rem;
+        line-height: calc(var(--baseline)*1);
+        position: relative;
+        margin-top: calc(var(--baseline)*0.75);
+        margin-bottom: calc(var(--baseline)*0.25);
+       
+    }
+
+    
+
+}
+
+[data-id="section__content"][data-split-from] > :first-child {
+        margin-top: 0;
+}

css/modules/_var.scss

@@ -0,0 +1,11 @@
+:root{
+    --font: 'Edgar', sans-serif;
+    --font-title: "Heliotrope 3 Caps", sans-serif;
+    --font-sans: "Heliotrope 4", sans-serif;
+    --font-size: 12px;
+    --baseline: 16px;
+
+    --indent: 26px;
+}
+
+