Spaces:
Sleeping
Sleeping
| @import (less) './themes/fonts/5e/fonts.less'; | |
| @import (less) './themes/assets/assets.less'; | |
| @import (less) './themes/fonts/icon fonts/font-icons.less'; | |
| :root { | |
| //Colors | |
| --HB_Color_Background : #EEE5CE; // Light parchment | |
| --HB_Color_Accent : #E0E5C1; // Pastel green | |
| --HB_Color_HeaderUnderline : #C0AD6A; // Gold | |
| --HB_Color_HorizontalRule : #9C2B1B; // Maroon | |
| --HB_Color_HeaderText : #58180D; // Dark Maroon | |
| --HB_Color_MonsterStatBackground : #F2E5B5; // Light orange parchment | |
| --HB_Color_CaptionText : #766649; // Brown | |
| --HB_Color_WatercolorStain : #BBAD82; // Light brown | |
| --HB_Color_Footnotes : #C9AD6A; // Gold | |
| } | |
| .useSansSerif() { | |
| font-family : 'ScalySansRemake'; | |
| font-size : 0.318cm; | |
| line-height : 1.2em; | |
| p,dl,ul,ol { line-height : 1.2em; } | |
| ul, ol { padding-left : 1em; } | |
| em { font-style : italic; } | |
| strong { | |
| font-weight : 800; | |
| letter-spacing : -0.02em; | |
| } | |
| h5 + * { margin-top : 0.1cm; } | |
| } | |
| .useColumns(@multiplier : 1, @fillMode: auto) { | |
| column-count : 2; | |
| column-fill : @fillMode; | |
| column-gap : 0.9cm; | |
| column-width : 8cm * @multiplier; | |
| -webkit-column-count : 2; | |
| -moz-column-count : 2; | |
| -webkit-column-width : 8cm * @multiplier; | |
| -moz-column-width : 8cm * @multiplier; | |
| -webkit-column-gap : 0.9cm; | |
| -moz-column-gap : 0.9cm; | |
| } | |
| .page { | |
| .useColumns(); | |
| font-family : 'BookInsanityRemake'; | |
| font-size : 0.34cm; | |
| background-image : @backgroundImage; | |
| } | |
| // ***************************** | |
| // * BASE | |
| // *****************************/ | |
| .page { | |
| p { | |
| line-height : 1.25em; | |
| & + * { margin-top : 0.325cm; } //TODO: MAKE ALL MARGINS TOP-ONLY. USE * + * STYLE SELECTORS | |
| & + p { margin-top : 0; } | |
| } | |
| ul { | |
| padding-left : 1.4em; | |
| margin-bottom : 0.8em; | |
| line-height : 1.25em; | |
| } | |
| ol { | |
| padding-left : 1.4em; | |
| margin-bottom : 0.8em; | |
| line-height : 1.25em; | |
| } | |
| //Indents after p or lists | |
| p + p, ul + p, ol + p { text-indent : 1em; } | |
| img { z-index : -1; } | |
| strong { | |
| font-weight : bold; | |
| letter-spacing : -0.02em; | |
| } | |
| // ***************************** | |
| // * HEADERS | |
| // *****************************/ | |
| h1,h2,h3,h4 { | |
| font-family : 'MrEavesRemake'; | |
| color : var(--HB_Color_HeaderText); | |
| } | |
| h1 { | |
| margin-bottom : 0.18cm; //Margin-bottom only because this is WIDE | |
| column-span : all; | |
| font-size : 0.89cm; | |
| line-height : 1em; | |
| -webkit-column-span : all; | |
| -moz-column-span : all; | |
| & + p::first-letter { | |
| float : left; | |
| padding-bottom : 2px; | |
| padding-left : 40px; //Allow background color to extend into margins | |
| margin-top : -0.3cm; | |
| margin-bottom : -20px; | |
| margin-left : -40px; | |
| font-family : 'SolberaImitationRemake'; | |
| font-size : 3.5cm; | |
| line-height : 1em; | |
| color : rgba(0, 0, 0, 0); | |
| background-image : linear-gradient(-45deg, #322814, #998250, #322814); | |
| -webkit-background-clip : text; | |
| background-clip : text; | |
| } | |
| & + p::first-line { font-variant : small-caps; } | |
| } | |
| h2 { | |
| //margin-top : 0px; //Font is misaligned. Shift up slightly | |
| //margin-bottom : 0.05cm; | |
| font-size : 0.75cm; | |
| line-height : 0.988em; //Font is misaligned. Shift up slightly | |
| } | |
| h3 { | |
| //margin-top : -0.1cm; //Font is misaligned. Shift up slightly | |
| //margin-bottom : 0.1cm; | |
| font-size : 0.575cm;; | |
| line-height : 0.995em; //Font is misaligned. Shift up slightly | |
| border-bottom : 2px solid var(--HB_Color_HeaderUnderline); | |
| & + * { margin-top : 0.17cm; } | |
| } | |
| * + h3 { | |
| margin-top : 0.155cm; //(0.325 - 0.17) | |
| } | |
| h4 { | |
| //margin-top : -0.02cm; //Font is misaligned. Shift up slightly | |
| //margin-bottom : 0.02cm; | |
| font-size : 0.458cm; | |
| line-height : 0.971em; //Font is misaligned. Shift up slightly | |
| & + * { margin-top : 0.09cm; } | |
| } | |
| * + h4 { | |
| margin-top : 0.235cm; //(0.325 - 0.09) | |
| } | |
| h5 { | |
| //margin-top : -0.02cm; //Font is misaligned. Shift up slightly | |
| //margin-bottom : 0.02cm; | |
| font-family : 'ScalySansSmallCapsRemake'; | |
| font-size : 0.423cm; | |
| line-height : 0.951em; //Font is misaligned. Shift up slightly | |
| & + * { margin-top : 0.2cm; } | |
| } | |
| // ***************************** | |
| // * TABLE | |
| // *****************************/ | |
| table { | |
| .useSansSerif(); | |
| line-height : 16px; | |
| & + * { margin-top : 0.325cm; } | |
| thead { | |
| display : table-row-group; | |
| font-weight : 800; | |
| th { | |
| //padding : 0.14em 0.4em; | |
| padding : 0px 1.5px; // Both of these are temporary, just to force | |
| vertical-align : bottom; | |
| //line-height : 16px; // PDF to render at same height until Chrome 108 | |
| } | |
| } | |
| tbody { | |
| tr { | |
| td { | |
| //padding : 0.14em 0.4em; | |
| padding : 0px 1.5px; // Both of these are temporary, just to force | |
| //line-height : 16px; // PDF to render at same height until Chrome 108 | |
| } | |
| &:nth-child(odd) { background-color : var(--HB_Color_Accent); } | |
| } | |
| } | |
| } | |
| // ***************************** | |
| // * QUOTE | |
| // *****************************/ | |
| .quote { | |
| & > p { | |
| font-style : italic; | |
| line-height : 0.54cm; | |
| &:first-child::first-line { | |
| font-size : 0.38cm; | |
| font-style : normal; | |
| font-variant : small-caps; | |
| } | |
| } | |
| p + .attribution { margin-top : 0; } | |
| .attribution { | |
| display : block; | |
| font-style : normal; | |
| line-height : 0.54cm; | |
| text-align : right; | |
| &::before { | |
| margin-right : 0.2em; | |
| content : '---'; | |
| } | |
| } | |
| & + * { margin-top : 0.54cm; } | |
| } | |
| // ***************************** | |
| // * NOTE | |
| // *****************************/ | |
| .note { | |
| .useSansSerif(); | |
| padding : 0.13cm 0.16cm; | |
| background-color : var(--HB_Color_Accent); | |
| border-style : solid; | |
| border-width : 1px; | |
| border-image : @noteBorderImage 12 stretch; | |
| border-image-width : 11px; | |
| border-image-outset : 9px 0px; | |
| box-shadow : 1px 4px 14px #888888; | |
| .page :where(&) { | |
| margin-top : 9px; //Prevent top border getting cut off on colbreak | |
| } | |
| & + * { margin-top : 0.45cm; } | |
| h5 { font-size : 0.375cm; } | |
| p { | |
| display : block; | |
| padding-bottom : 0px; | |
| } | |
| :last-child { margin-bottom : 0; } | |
| } | |
| // ************************************ | |
| // * DESCRIPTIVE TEXT BOX | |
| // ************************************/ | |
| .descriptive { | |
| .useSansSerif(); | |
| padding : 0.1em; | |
| background-color : #FAF7EA; | |
| border-style : solid; | |
| border-width : 7px; | |
| border-image : @descriptiveBoxImage 12 stretch; | |
| border-image-outset : 4px; | |
| box-shadow : 0 0 6px #FAF7EA; | |
| .page :where(&) { | |
| margin-top : 4px; //Prevent top border getting cut off on colbreak | |
| } | |
| & + * { margin-top : 0.45cm; } | |
| h5 { font-size : 0.375cm; } | |
| p { | |
| display : block; | |
| padding-bottom : 0px; | |
| line-height : 1.5em; | |
| } | |
| :last-child { margin-bottom : 0; } | |
| } | |
| // ***************************** | |
| // * Images Snippets | |
| // *****************************/ | |
| /* Arist Credit */ | |
| .artist { | |
| position : absolute; | |
| width : auto; | |
| font-family : 'WalterTurncoat'; | |
| font-size : 0.27cm; | |
| color : var(--HB_Color_CaptionText); | |
| text-align : center; | |
| p, p + p { | |
| margin : unset; | |
| line-height : 1em; | |
| text-indent : unset; | |
| } | |
| h5 { | |
| font-family : 'WalterTurncoat'; | |
| font-size : 1.3em; | |
| } | |
| a { | |
| color : inherit; | |
| text-decoration : unset; | |
| &:hover { text-decoration : underline; } | |
| } | |
| } | |
| /* Watermark */ | |
| .watermark { color : black; } | |
| /* Watercolor */ | |
| .watercolor1 { --wc : @watercolor1; } | |
| .watercolor2 { --wc : @watercolor2; } | |
| .watercolor3 { --wc : @watercolor3; } | |
| .watercolor4 { --wc : @watercolor4; } | |
| .watercolor5 { --wc : @watercolor5; } | |
| .watercolor6 { --wc : @watercolor6; } | |
| .watercolor7 { --wc : @watercolor7; } | |
| .watercolor8 { --wc : @watercolor8; } | |
| .watercolor9 { --wc : @watercolor9; } | |
| .watercolor10 { --wc : @watercolor10; } | |
| .watercolor11 { --wc : @watercolor11; } | |
| .watercolor12 { --wc : @watercolor12; } | |
| // ***************************** | |
| // * MONSTER STAT BLOCK | |
| // *****************************/ | |
| .monster { | |
| .useSansSerif(); | |
| &.frame { | |
| width : calc(100% + 0.32cm); | |
| padding : 4px 2px; | |
| margin-right : -0.16cm; | |
| margin-left : -0.16cm; | |
| background-color : var(--HB_Color_MonsterStatBackground); | |
| background-image : @monsterBlockBackground; | |
| background-attachment : unset; | |
| background-blend-mode : overlay; | |
| border-style : solid; | |
| border-width : 7px 6px; | |
| border-image : @monsterBorderImage 14 round; | |
| border-image-outset : 0px 2px; | |
| box-shadow : 1px 4px 14px #888888; | |
| } | |
| position : relative; | |
| padding : 0px; | |
| margin-bottom : 0.325cm; | |
| //Headers | |
| h2 { | |
| margin : 0; | |
| font-size : 0.62cm; | |
| line-height : 1em; | |
| & + p { | |
| margin-bottom : 0; | |
| font-size : 0.304cm; //Monster size and type subtext | |
| } | |
| } | |
| h3 { | |
| font-family : 'ScalySansSmallCapsRemake'; | |
| font-size : 0.45cm; | |
| border-bottom : 1.5px solid var(--HB_Color_HeaderText); | |
| } | |
| //Triangle dividers | |
| hr { | |
| height : 6px; | |
| margin : 0.12cm 0cm; | |
| visibility : visible; | |
| background-image : @redTriangleImage; | |
| background-size : 100% 100%; | |
| border : none; | |
| } | |
| //Attribute Lists - All text between HRs is red | |
| hr ~ :is(dl,p) { color : var(--HB_Color_HeaderText); } | |
| hr:last-of-type { | |
| & ~ :is(dl,p) { | |
| color : inherit; // After the HRs, reset text to black | |
| } | |
| & + * { | |
| margin-top : 0.325cm; // Space after last HR | |
| } | |
| } | |
| // Monster Ability table | |
| hr + table:first-of-type { | |
| margin : 0; | |
| column-span : none; | |
| color : var(--HB_Color_HeaderText); | |
| background-color : transparent; | |
| border-style : none; | |
| border-image : none; | |
| -webkit-column-span : none; | |
| tr { background-color : transparent; } | |
| td,th { padding : 0px; } | |
| } | |
| //indent fix after bulleted lists | |
| :is(ul,ol) + p { text-indent : 0; } | |
| :last-child { margin-bottom : 0; } | |
| } | |
| //Full Width | |
| .monster.wide { | |
| .useColumns(0.96, @fillMode: balance); | |
| } | |
| // ***************************** | |
| // * FOOTER | |
| // *****************************/ | |
| &::after { | |
| position : absolute; | |
| bottom : 0px; | |
| left : 0px; | |
| z-index : 100; | |
| width : 100%; | |
| height : 50px; | |
| content : ''; | |
| background-image : @footerAccentImage; | |
| background-size : cover; | |
| } | |
| &:nth-child(even) { | |
| &::after { transform : scaleX(-1); } | |
| .pageNumber { left : 2px; } | |
| .footnote { | |
| left : 80px; | |
| text-align : left; | |
| } | |
| } | |
| .pageNumber { | |
| position : absolute; | |
| right : 2px; | |
| bottom : 22px; | |
| width : 50px; | |
| font-size : 0.9em; | |
| color : var(--HB_Color_Footnotes); | |
| text-align : center; | |
| text-indent : 0; | |
| &.auto::after { content : counter(phb-page-numbers); } | |
| } | |
| .footnote { | |
| position : absolute; | |
| right : 80px; | |
| bottom : 32px; | |
| z-index : 150; | |
| width : 200px; | |
| font-size : 0.8em; | |
| color : var(--HB_Color_Footnotes); | |
| text-align : right; | |
| } | |
| // ************************************ | |
| // * CODE BLOCKS | |
| // ************************************/ | |
| code { | |
| padding : 0px 4px; | |
| font-size : 0.325cm; | |
| color : #58180D; | |
| background-color : #FAF7EA; | |
| border-radius : 4px; | |
| } | |
| pre code { | |
| padding : 0.15cm; | |
| margin-bottom : 2px; | |
| border-style : solid; | |
| border-width : 1px; | |
| border-radius : 12px; | |
| border-image : @codeBorderImage 26 stretch; | |
| border-image-width : 10px; | |
| border-image-outset : 2px; | |
| .page :where(&) { | |
| margin-top : 2px; //Prevent top border getting cut off on colbreak | |
| } | |
| & + * { margin-top : 0.325cm; } | |
| } | |
| // ***************************** | |
| // * EXTRAS | |
| // *****************************/ | |
| hr { | |
| margin : 0px; | |
| visibility : hidden; | |
| } | |
| //Text indent right after table | |
| table + p { text-indent : 1em; } | |
| // Nested lists | |
| ul ul,ol ol,ul ol,ol ul { | |
| margin-bottom : 0px; | |
| margin-left : 1.5em; | |
| } | |
| } | |
| // ***************************** | |
| // * SPELL LIST | |
| // *****************************/ | |
| .page .spellList { | |
| .useSansSerif(); | |
| column-count : 2; | |
| ul + h5 { margin-top : 15px; } | |
| p, ul { | |
| font-size : 0.352cm; | |
| line-height : 1.265em; | |
| } | |
| ul { | |
| padding-left : 1em; | |
| margin-bottom : 0.5em; | |
| text-indent : -1em; | |
| list-style-type : none; | |
| -webkit-column-break-inside : auto; | |
| page-break-inside : auto; | |
| break-inside : auto; | |
| } | |
| &.wide { column-count : 4; } | |
| } | |
| // ***************************** | |
| // * CLASS TABLE | |
| // *****************************/ | |
| .page .classTable { | |
| th[colspan]:not([rowspan]) { white-space : nowrap; } | |
| &.frame { | |
| width : calc(100% + 0.2cm); | |
| margin-top : 0.7cm; | |
| margin-right : -0.1cm; | |
| margin-bottom : 0.9cm; | |
| margin-left : -0.1cm; | |
| border-collapse : separate; | |
| background-color : white; | |
| border : initial; | |
| border-style : solid; | |
| border-image-source : @frameBorderImage; | |
| border-image-slice : 200; | |
| border-image-width : 47px; | |
| border-image-outset : 0.4cm 0.3cm; | |
| border-image-repeat : stretch; | |
| &.wide:first-child { margin-top : 0.12cm; } | |
| & + * { margin-top : 0; } | |
| } | |
| &.decoration { position : relative; } | |
| &.decoration::before { | |
| position : absolute; | |
| top : 50%; | |
| left : 50%; | |
| z-index : -1; | |
| width : 7.75cm; | |
| height : calc(100% + 3.3cm); | |
| content : ''; | |
| background-image : @classTableDecoration, | |
| @classTableDecoration; | |
| filter : drop-shadow(0px 0px 1px #C8C5C080); | |
| background-repeat : no-repeat, no-repeat; | |
| background-position : top, bottom; | |
| background-size : contain, contain; | |
| transform : translateY(-50%) translateX(-50%); | |
| } | |
| &.decoration.wide::before { | |
| width : calc(100% + 3.3cm); | |
| height : 7.75cm; | |
| background-position : left, right; | |
| } | |
| h5 + table { margin-top : 0.2cm; } | |
| } | |
| // ***************************** | |
| // * FRONT COVER PAGE | |
| // *****************************/ | |
| .page:has(.frontCover) { | |
| columns : 1; | |
| text-align : center; | |
| &::after { all : unset; } | |
| h1 { | |
| margin-top : 1.2cm; | |
| margin-bottom : 0; | |
| font-family : 'NodestoCapsCondensed'; | |
| font-size : 2.245cm; | |
| font-weight : normal; | |
| line-height : 0.85em; | |
| color : white; | |
| text-shadow : unset; | |
| text-transform : uppercase; | |
| filter : drop-shadow(0 0 1.5px black) drop-shadow(0 0 0 black) | |
| drop-shadow(0 0 0 black) drop-shadow(0 0 0 black) | |
| drop-shadow(0 0 0 black) drop-shadow(0 0 0 black) | |
| drop-shadow(0 0 0 black) drop-shadow(0 0 0 black); | |
| } | |
| h2 { | |
| font-family : 'NodestoCapsCondensed'; | |
| font-size : 0.85cm; | |
| font-weight : normal; | |
| color : white; | |
| letter-spacing : 0.1cm; | |
| filter : drop-shadow(0 0 1px black) drop-shadow(0 0 0 black) | |
| drop-shadow(0 0 0 black) drop-shadow(0 0 0 black) | |
| drop-shadow(0 0 0 black) drop-shadow(0 0 0 black) | |
| drop-shadow(0 0 0 black) drop-shadow(0 0 0 black); | |
| } | |
| hr { | |
| position : relative; | |
| display : block; | |
| width : 12cm; | |
| height : 0.5cm; | |
| margin : auto; | |
| visibility : visible; | |
| background-image : @horizontalRule; | |
| filter : drop-shadow(0 0 3px black); | |
| background-size : 100% 100%; | |
| border : none; | |
| } | |
| .banner { | |
| position : absolute; | |
| bottom : 4.2cm; | |
| left : 0; | |
| display : flex; | |
| flex-direction : column; | |
| justify-content : center; | |
| width : 10.5cm; | |
| height : 1.7cm; | |
| padding-top : 0.1cm; | |
| padding-left : 1cm; | |
| font-family : 'NodestoCapsCondensed'; | |
| font-size : 1cm; | |
| font-weight : normal; | |
| color : white; | |
| text-align : left; | |
| letter-spacing : 0.014cm; | |
| background-image : url('/assets/coverPageBanner.svg'); | |
| filter : drop-shadow(2px 2px 2px black); | |
| } | |
| .footnote { | |
| position : absolute; | |
| right : 0; | |
| bottom : 1.3cm; | |
| left : 0; | |
| width : 70%; | |
| margin-right : auto; | |
| margin-left : auto; | |
| font-family : 'Overpass'; | |
| font-size : 0.496cm; | |
| color : white; | |
| text-align : center; | |
| filter : drop-shadow(0 0 0.7px black) drop-shadow(0 0 0 black) | |
| drop-shadow(0 0 0 black) drop-shadow(0 0 0 black) | |
| drop-shadow(0 0 0 black) drop-shadow(0 0 0 black) | |
| drop-shadow(0 0 0 black) drop-shadow(0 0 0 black); | |
| } | |
| .logo { | |
| position : absolute; | |
| top : 0.5cm; | |
| right : 0; | |
| left : 0; | |
| filter : drop-shadow(0 0 0.075cm black); | |
| img { | |
| width : 100%; | |
| height : 2cm; | |
| } | |
| } | |
| } | |
| // ***************************** | |
| // * INSIDE COVER PAGE | |
| // *****************************/ | |
| .page:has(.insideCover) { | |
| columns : 1; | |
| text-align : center; | |
| &::after { all : unset; } | |
| h1 { | |
| margin-top : 1.2cm; | |
| margin-bottom : 0; | |
| font-family : 'NodestoCapsCondensed'; | |
| font-size : 2.1cm; | |
| font-weight : normal; | |
| line-height : 0.85em; | |
| text-transform : uppercase; | |
| } | |
| h2 { | |
| font-family : 'NodestoCapsCondensed'; | |
| font-size : 0.85cm; | |
| font-weight : normal; | |
| letter-spacing : 0.5cm; | |
| } | |
| hr { | |
| position : relative; | |
| display : block; | |
| width : 12cm; | |
| height : 0.5cm; | |
| margin : auto; | |
| visibility : visible; | |
| background-image : @horizontalRule; | |
| background-size : 100% 100%; | |
| border : none; | |
| } | |
| .logo { | |
| position : absolute; | |
| right : 0; | |
| bottom : 1cm; | |
| left : 0; | |
| height : 2cm; | |
| img { | |
| width : 100%; | |
| height : 2cm; | |
| } | |
| } | |
| } | |
| // ***************************** | |
| // * BACK COVER | |
| // *****************************/ | |
| .page:has(.backCover) { | |
| padding : 2.25cm 1.3cm 2cm 1.3cm; | |
| color : #FFFFFF; | |
| columns : 1; | |
| &::after { all : unset; } | |
| .columnWrapper { width : 7.6cm; } | |
| .backCover { | |
| position : absolute; | |
| inset : 0; | |
| z-index : -1; | |
| width : 11cm; | |
| background-image : @backCover; | |
| background-repeat : no-repeat; | |
| background-size : contain; | |
| } | |
| .blank { height : 1.4em; } | |
| h1 { | |
| margin-bottom : 0.3cm; | |
| font-family : 'NodestoCapsCondensed'; | |
| font-size : 1.35cm; | |
| line-height : 0.95em; | |
| color : #ED1C24; | |
| text-align : center; | |
| } | |
| h1 + p::first-line, | |
| h1 + p::first-letter { all : unset; } | |
| img { | |
| position : absolute; | |
| top : 0px; | |
| z-index : -2; | |
| height : 100%; | |
| } | |
| hr { | |
| width : 4.5cm; | |
| height : 0.53cm; | |
| margin-top : 1.1cm; | |
| margin-right : auto; | |
| margin-left : auto; | |
| visibility : visible; | |
| background-image : @horizontalRule; | |
| background-size : 100% 100%; | |
| border : none; | |
| } | |
| p { | |
| font-family : 'Overpass'; | |
| font-size : 0.332cm; | |
| line-height : 1.5em; | |
| } | |
| hr + p { | |
| margin-top : 0.6cm; | |
| text-align : center; | |
| } | |
| .logo { | |
| position : absolute; | |
| bottom : 2cm; | |
| left : 1.2cm; | |
| z-index : 0; | |
| width : 7.6cm; | |
| height : 1.5cm; | |
| img { | |
| position : relative; | |
| z-index : 0; | |
| width : 100%; | |
| height : 1.5cm; | |
| } | |
| p { | |
| position : relative; | |
| width : 100%; | |
| font-family : 'NodestoCapsWide'; | |
| font-size : 0.4cm; | |
| line-height : 1em; | |
| color : #FFFFFF; | |
| text-align : center; | |
| text-indent : 0; | |
| letter-spacing : 0.08em; | |
| } | |
| } | |
| } | |
| // ***************************** | |
| // * PART COVER | |
| // *****************************/ | |
| .page:has(.partCover) { | |
| padding-top : 0; | |
| text-align : center; | |
| columns : 1; | |
| .partCover { | |
| position : absolute; | |
| top : 0; | |
| left : 0; | |
| width : 100%; | |
| height : 6cm; | |
| background-image : @partCoverHeaderPHB; | |
| background-repeat : no-repeat; | |
| background-size : 100%; | |
| } | |
| h1 { | |
| position : relative; | |
| margin-top : 0.4cm; | |
| font-family : 'NodestoCapsCondensed'; | |
| font-size : 2.3cm; | |
| text-align : center; | |
| text-transform : uppercase; | |
| } | |
| h2 { | |
| position : relative; | |
| margin-top : -0.7em; | |
| margin-right : auto; | |
| margin-left : auto; | |
| font-family : 'Overpass'; | |
| font-size : 0.45cm; | |
| line-height : 1.1em; | |
| } | |
| } | |
| // ***************************** | |
| // * TABLE OF CONTENTS | |
| // *****************************/ | |
| .page { | |
| &:has(.toc)::after { display : none; } | |
| .toc { | |
| -webkit-column-break-inside : avoid; | |
| page-break-inside : avoid; | |
| break-inside : avoid; | |
| h1 { | |
| margin-bottom : 0.3cm; | |
| text-align : center; | |
| } | |
| a { | |
| display : inline; | |
| color : inherit; | |
| text-decoration : none; | |
| &:hover { text-decoration : underline; } | |
| } | |
| h4 { | |
| margin-top : 0.2cm; | |
| line-height : 0.4cm; | |
| & + ul li { line-height : 1.2em; } | |
| } | |
| ul { | |
| padding-left : 0; | |
| margin-top : 0; | |
| list-style-type : none; | |
| a { | |
| display : flex; | |
| flex-flow : row nowrap; | |
| justify-content : space-between; | |
| width : 100%; | |
| } | |
| li + li h3 { | |
| margin-top : 0.26cm; | |
| line-height : 1em; | |
| } | |
| h3 span:first-child::after { border : none; } | |
| span { | |
| display : contents; | |
| &:first-child::after { | |
| bottom : 0.08cm; | |
| flex : 1; | |
| margin-right : 0.16cm; | |
| margin-bottom : 0.08cm; | |
| margin-left : 0.08cm; /* Spacing before dot leaders */ | |
| content : ''; | |
| border-bottom : 0.05cm dotted #000000; | |
| } | |
| &:last-child { | |
| display : inline-block; | |
| align-self : flex-end; | |
| font-family : 'BookInsanityRemake'; | |
| font-size : 0.34cm; | |
| font-weight : normal; | |
| color : #000000; | |
| } | |
| } | |
| ul { /* List indent */ | |
| margin-left : 1em; | |
| } | |
| } | |
| &.wide { | |
| .useColumns(0.96, @fillMode: balance); | |
| } | |
| } | |
| } | |
| // ***************************** | |
| // * DEFINITION LISTS | |
| // *****************************/ | |
| .page { | |
| dl { | |
| line-height : 1.25em; | |
| & + * { margin-top : 0.17cm; } | |
| } | |
| p + dl { margin-top : 0.17cm; } | |
| dt { | |
| margin-right : 5px; | |
| margin-left : -1em; | |
| } | |
| } | |
| // ***************************** | |
| // * WIDE | |
| // *****************************/ | |
| .page .wide { margin-bottom : 0.325cm; } | |
| .page h1 + * { margin-top : 0; } | |
| //***************************** | |
| // * RUNE TABLE | |
| // *****************************/ | |
| .page { | |
| .runeTable { | |
| margin-block : 0.7cm; | |
| table { | |
| font-family : inherit; | |
| tbody tr { background : unset; } | |
| th, td { | |
| width : 1.3cm; | |
| height : 1.3cm; | |
| font-weight : normal; | |
| text-transform : uppercase; | |
| vertical-align : middle; | |
| outline : 1px solid #000000; | |
| } | |
| th { | |
| font-family : 'BookInsanityRemake'; | |
| font-size : 0.45cm; | |
| } | |
| td { font-size : 0.7cm; } | |
| } | |
| &.frame { | |
| border : initial; | |
| border-style : solid; | |
| border-image-source : @scriptBorder; | |
| border-image-slice : 170; | |
| border-image-width : 1.4cm; | |
| border-image-outset : 0.45cm 0.35cm 0.4cm 0.4cm; | |
| border-image-repeat : stretch; | |
| } | |
| } | |
| } | |
| // ***************************** | |
| // * INDEX | |
| // *****************************/ | |
| .page { | |
| .index { | |
| font-size : 0.218cm; | |
| ul ul { margin : 0; } | |
| ul { | |
| padding-left : 0; | |
| text-indent : 0; | |
| list-style-type : none; | |
| } | |
| & > ul > li { | |
| padding-left : 1.5em; | |
| text-indent : -1.5em; | |
| } | |
| } | |
| } | |