0
0
mirror of https://github.com/naturalcrit/homebrewery.git synced 2025-12-24 18:32:41 +00:00
Files
homebrewery/themes/Legacy/5ePHB/style.less
2025-03-24 13:09:56 +01:00

452 lines
11 KiB
Plaintext

@import (less) './themes/fonts/5e legacy/fonts.less';
@import (less) './themes/assets/assets.less';
@import (less) './themes/phb.depricated.less';
//Colors
@background : #EEE5CE; // Light parchment
@noteGreen : #e0e5c1; // Pastel green
@headerUnderline : #c9ad6a; // Gold
@horizontalRule : #9c2b1b; // Maroon
@headerText : #58180D; // Dark maroon
@monsterStatBackground : #FDF1DC; // Lighter parchment
@captionText : #766649; // Brown
@page { margin : 0; }
body { counter-reset : phb-page-numbers; }
* { -webkit-print-color-adjust : exact; }
.useSansSerif() {
font-family : 'ScalySans';
em {
font-family : 'ScalySans';
font-style : italic;
}
strong {
font-family : 'ScalySans';
font-weight : 800;
letter-spacing : -0.02em;
}
}
.useColumns(@multiplier : 1) {
column-count : 2;
column-fill : auto;
column-gap : 1cm;
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 : 1cm;
-moz-column-gap : 1cm;
}
.phb, .page {
.useColumns();
position : relative;
z-index : 15;
box-sizing : border-box;
width : 215.9mm;
height : 279.4mm;
padding : 1.0cm 1.7cm;
padding-bottom : 1.5cm;
overflow : hidden;
font-family : 'BookSanity';
font-size : 0.317cm;
counter-increment : phb-page-numbers;
background-color : @background;
background-image : @backgroundImage;
text-rendering : optimizeLegibility;
page-break-before : always;
page-break-after : always;
contain : strict;
content-visibility : auto;
contain-intrinsic-size : auto none;
}
.phb {
//*****************************
// * BASE
// *****************************/
p {
padding-bottom : 0.8em;
line-height : 1.269em;
& + p { margin-top : -0.8em; }
}
ul {
padding-left : 1.4em;
margin-bottom : 0.8em;
line-height : 1.269em;
list-style-position : outside;
list-style-type : disc;
}
ol {
padding-left : 1.4em;
margin-bottom : 0.8em;
line-height : 1.269em;
list-style-position : outside;
list-style-type : decimal;
}
//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.03em;
}
em { font-style : italic; }
sup {
font-size : smaller;
line-height : 0;
vertical-align : super;
}
sub {
font-size : smaller;
line-height : 0;
vertical-align : sub;
}
//*****************************
// * HEADERS
// *****************************/
h1,h2,h3,h4 {
margin-top : 0.2em;
margin-bottom : 0.2em;
font-family : 'MrJeeves';
font-weight : 800;
color : @headerText;
}
h1 {
column-span : all;
font-size : 0.987cm;
-webkit-column-span : all;
-moz-column-span : all;
& + p::first-letter {
float : left;
font-family : 'Solberry';
font-size : 10em;
line-height : 0.795em;
color : #222222;
}
}
h2 { font-size : 0.705cm; }
h3 {
font-size : 0.529cm;
border-bottom : 2px solid @headerUnderline;
}
h4 {
margin-bottom : 0.00em;
font-size : 0.458cm;
}
h5 {
margin-bottom : 0.2em;
font-family : 'ScalySansSmallCaps';
font-size : 0.423cm;
font-weight : 900;
}
//*****************************
// * TABLE
// *****************************/
table {
.useSansSerif();
width : 100%;
margin-bottom : 1em;
font-size : 10pt;
thead {
display : table-row-group;
font-weight : 800;
th {
padding-right : 0.1em;
padding-bottom : 0.3em;
padding-left : 0.1em;
vertical-align : bottom;
}
}
tbody {
tr {
td { padding : 0.3em 0.1em; }
&:nth-child(odd) { background-color : @noteGreen; }
}
}
}
//*****************************
// * NOTE
// *****************************/
blockquote {
.useSansSerif();
box-sizing : border-box;
padding : 5px 10px;
margin-bottom : 1em;
background-color : @noteGreen;
border-style : solid;
border-width : 11px;
border-image : @noteBorderImage 11;
border-image-outset : 9px 0px;
box-shadow : 1px 4px 14px #888888;
p, ul {
font-size : 0.352cm;
line-height : 1.083em;
}
}
//If a note starts a column, give it space at the top to render border
pre + blockquote, h2 + blockquote, h3 + blockquote, h4 + blockquote, h5 + blockquote { margin-top : 13px; }
//*****************************
// * MONSTER STAT BLOCK
// *****************************/
hr+blockquote {
position : relative;
padding-top : 15px;
background-color : @monsterStatBackground;
border-style : solid;
border-width : 10px;
border-image : @monsterBorderImageLegacy 10;
h2 {
margin-top : -8px;
margin-bottom : 0px;
& + p { padding-bottom : 0px; }
}
h3 {
font-family : 'ScalySans';
font-weight : normal;
border-bottom : 1px solid @headerText;
}
hr + ul { color : @headerText; }
ul {
.useSansSerif();
padding-left : 1em;
font-size : 0.352cm;
}
// Monster Ability table
hr + table {
margin : 0;
background-color : transparent;
border-style : none;
border-image : none;
tbody {
tr:nth-child(odd), tr:nth-child(even) { background-color : transparent; }
}
}
table { color : @headerText; }
p + p {
padding-bottom : 0.5em;
margin-top : 0em;
text-indent : 0em;
}
//Triangle dividers
hr {
visibility : visible;
height : 6px;
margin : 4px 0px;
background-image : @redTriangleImage;
background-size : 100% 100%;
border : none;
}
}
//Full Width
hr + hr + blockquote {
.useColumns(0.96);
column-fill : 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 : #C9AD6A;
text-align : center;
&.auto::after { content : counter(phb-page-numbers); }
}
.footnote {
position : absolute;
right : 80px;
bottom : 32px;
z-index : 150;
width : 200px;
font-size : 0.8em;
color : #C9AD6A;
text-align : right;
}
//*****************************
// * EXTRAS
// *****************************/
hr {
visibility : hidden;
margin : 0px;
}
//Modified unorder list, used in spells
hr + ul {
padding-left : 1em;
margin-bottom : 0.5em;
text-indent : -1em;
list-style-type : none;
}
//Column Break
pre, code {
visibility : hidden;
-webkit-column-break-after : always;
break-after : always;
-moz-column-break-after : always;
}
//Avoid breaking up
p,blockquote,table {
z-index : 15;
-webkit-column-break-inside : avoid;
page-break-inside : avoid;
break-inside : avoid;
}
//Better spacing for spell blocks
h4 + p + hr + ul { margin-top : -0.5em; }
//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;
}
li {
-webkit-column-break-inside : avoid;
page-break-inside : avoid;
break-inside : avoid;
}
}
//*****************************
// * SPELL LIST
// *****************************/
.phb .spellList {
.useSansSerif();
column-count : 4;
-webkit-column-span : all;
-moz-column-span : all;
column-span : all;
ul + h5 { margin-top : 15px; }
p, ul {
font-size : 0.352cm;
line-height : 1.263em;
}
ul {
padding-left : 1em;
margin-bottom : 0.5em;
text-indent : -1em;
list-style-type : none;
break-inside : auto;
-webkit-column-break-inside : auto;
page-break-inside : auto;
}
}
//*****************************
// * WIDE
// *****************************/
.phb .wide {
-webkit-column-span : all;
-moz-column-span : all;
column-span : all;
}
//*****************************
// * CLASS TABLE
// *****************************/
.phb .classTable {
margin-top : 25px;
margin-bottom : 40px;
border-collapse : separate;
background-color : white;
border : initial;
border-style : solid;
border-image-source : @frameBorderImage;
border-image-slice : 150 200 150 200;
border-image-width : 47px;
border-image-outset : 25px 17px;
border-image-repeat : stretch;
h5 { margin-bottom : 10px; }
}
//************************************
// * DESCRIPTIVE TEXT BOX
// ************************************/
.phb .descriptive {
margin-bottom : 1em;
font-family : 'ScalySans';
background-color : #FAF7EA;
border-style : solid;
border-width : 7px;
border-image : @descriptiveBoxImage 12 stretch;
border-image-outset : 4px;
box-shadow : 0px 0px 6px #FAF7EA;
p {
display : block;
padding-bottom : 0px;
line-height : 1.47em;
}
p + p { padding-top : 0.8em; }
em {
font-family : 'ScalySans';
font-style : italic;
}
strong {
font-family : 'ScalySans';
font-weight : 800;
letter-spacing : -0.02em;
}
}
.phb pre + .descriptive { margin-top : 8px; }
//*****************************
// * ARTIST CREDIT BLOCK
// *****************************/
.phb {
.artist {
position : absolute;
font-family : 'WalterTurncoat';
font-size : 0.27cm;
color : @captionText;
text-align : center;
p, p + p {
margin : unset;
line-height : 0.941em;
text-indent : unset;
}
h5 {
font-family : 'WalterTurncoat';
font-size : 1.3em;
}
a {
color : inherit;
text-decoration : unset;
&:hover { text-decoration : underline; }
}
}
}
//*****************************
// * TABLE OF CONTENTS
// *****************************/
.phb .toc {
-webkit-column-break-inside : avoid;
page-break-inside : avoid;
break-inside : avoid;
a {
color : black;
text-decoration : none;
&:hover { text-decoration : underline; }
}
ul {
padding-left : 0;
list-style-type : none;
}
& > ul > li { margin-bottom : 10px; }
}