From fd5ff2c61a38137ec956491a7e31a8bf2ab7287b Mon Sep 17 00:00:00 2001 From: David Bolack Date: Fri, 23 Aug 2024 14:04:04 -0500 Subject: [PATCH 01/29] Relocate more general purposes snippets from 5ePHB to Blank Should include all supporting style content. --- themes/V3/5ePHB/snippets.js | 128 ------------------ themes/V3/Blank/snippets.js | 73 +++++++++- .../V3/{5ePHB => Blank}/snippets/index.gen.js | 0 .../snippets/tableOfContents.gen.js | 0 themes/V3/Blank/style.less | 127 +++++++++++++++++ 5 files changed, 199 insertions(+), 129 deletions(-) rename themes/V3/{5ePHB => Blank}/snippets/index.gen.js (100%) rename themes/V3/{5ePHB => Blank}/snippets/tableOfContents.gen.js (100%) diff --git a/themes/V3/5ePHB/snippets.js b/themes/V3/5ePHB/snippets.js index 4daa05c51..f5c8120c1 100644 --- a/themes/V3/5ePHB/snippets.js +++ b/themes/V3/5ePHB/snippets.js @@ -6,138 +6,13 @@ const MonsterBlockGen = require('./snippets/monsterblock.gen.js'); const scriptGen = require('./snippets/script.gen.js'); const ClassFeatureGen = require('./snippets/classfeature.gen.js'); const CoverPageGen = require('./snippets/coverpage.gen.js'); -const TableOfContentsGen = require('./snippets/tableOfContents.gen.js'); -const indexGen = require('./snippets/index.gen.js'); const QuoteGen = require('./snippets/quote.gen.js'); const dedent = require('dedent-tabs').default; module.exports = [ - - { - groupName : 'Text Editor', - icon : 'fas fa-pencil-alt', - view : 'text', - snippets : [ - { - name : 'Table of Contents', - icon : 'fas fa-book', - gen : TableOfContentsGen, - experimental : true, - subsnippets : [ - { - name : 'Table of Contents', - icon : 'fas fa-book', - gen : TableOfContentsGen, - experimental : true - }, - { - name : 'Include in ToC up to H3', - icon : 'fas fa-dice-three', - gen : dedent `\n{{tocDepthH3 - }}\n`, - - }, - { - name : 'Include in ToC up to H4', - icon : 'fas fa-dice-four', - gen : dedent `\n{{tocDepthH4 - }}\n`, - }, - { - name : 'Include in ToC up to H5', - icon : 'fas fa-dice-five', - gen : dedent `\n{{tocDepthH5 - }}\n`, - }, - { - name : 'Include in ToC up to H6', - icon : 'fas fa-dice-six', - gen : dedent `\n{{tocDepthH6 - }}\n`, - } - ] - }, - { - name : 'Index', - icon : 'fas fa-bars', - gen : indexGen, - experimental : true - } - ] - }, - { - groupName : 'Style Editor', - icon : 'fas fa-pencil-alt', - view : 'style', - snippets : [ - { - name : 'Remove Drop Cap', - icon : 'fas fa-remove-format', - gen : dedent`/* Removes Drop Caps */ - .page h1+p:first-letter { - all: unset; - }\n\n - /* Removes Small-Caps in first line */ - .page h1+p:first-line { - all: unset; - }` - }, - { - name : 'Tweak Drop Cap', - icon : 'fas fa-sliders-h', - gen : dedent`/* Drop Cap settings */ - .page h1 + p::first-letter { - font-family: SolberaImitationRemake; - font-size: 3.5cm; - background-image: linear-gradient(-45deg, #322814, #998250, #322814); - line-height: 1em; - }\n\n` - } - ] - }, - - /*********************** IMAGES *******************/ - { - groupName : 'Images', - icon : 'fas fa-images', - view : 'text', - snippets : [ - { - name : 'Image', - icon : 'fas fa-image', - gen : dedent` - ![cat warrior](https://s-media-cache-ak0.pinimg.com/736x/4a/81/79/4a8179462cfdf39054a418efd4cb743e.jpg) {width:325px,mix-blend-mode:multiply} - - {{artist,position:relative,top:-230px,left:10px,margin-bottom:-30px - ##### Cat Warrior - [Kyoung Hwan Kim](https://www.artstation.com/tahra) - }}` - }, - { - name : 'Background Image', - icon : 'fas fa-tree', - gen : dedent` - ![homebrew mug](http://i.imgur.com/hMna6G0.png) {position:absolute,top:50px,right:30px,width:280px} - - {{artist,top:80px,right:30px - ##### Homebrew Mug - [naturalcrit](https://homebrew.naturalcrit.com) - }}` - }, - { - name : 'Watermark', - icon : 'fas fa-id-card', - gen : dedent` - {{watermark Homebrewery}}\n` - }, - ] - }, - - /************************* PHB ********************/ - { groupName : 'PHB', icon : 'fas fa-book', @@ -332,9 +207,6 @@ module.exports = [ ] }, - - - /**************** PAGE *************/ { diff --git a/themes/V3/Blank/snippets.js b/themes/V3/Blank/snippets.js index 8d45560c5..b30412bd0 100644 --- a/themes/V3/Blank/snippets.js +++ b/themes/V3/Blank/snippets.js @@ -4,6 +4,8 @@ const WatercolorGen = require('./snippets/watercolor.gen.js'); const ImageMaskGen = require('./snippets/imageMask.gen.js'); const FooterGen = require('./snippets/footer.gen.js'); const dedent = require('dedent-tabs').default; +const TableOfContentsGen = require('./snippets/tableOfContents.gen.js'); +const indexGen = require('./snippets/index.gen.js'); module.exports = [ @@ -125,7 +127,53 @@ module.exports = [ [Homebrewery.Naturalcrit.com](https://homebrewery.naturalcrit.com) }}\n\n`; }, - } + }, + { + name : 'Table of Contents', + icon : 'fas fa-book', + gen : TableOfContentsGen, + experimental : true, + subsnippets : [ + { + name : 'Table of Contents', + icon : 'fas fa-book', + gen : TableOfContentsGen, + experimental : true + }, + { + name : 'Include in ToC up to H3', + icon : 'fas fa-dice-three', + gen : dedent `\n{{tocDepthH3 + }}\n`, + + }, + { + name : 'Include in ToC up to H4', + icon : 'fas fa-dice-four', + gen : dedent `\n{{tocDepthH4 + }}\n`, + }, + { + name : 'Include in ToC up to H5', + icon : 'fas fa-dice-five', + gen : dedent `\n{{tocDepthH5 + }}\n`, + }, + { + name : 'Include in ToC up to H6', + icon : 'fas fa-dice-six', + gen : dedent `\n{{tocDepthH6 + }}\n`, + } + ] + }, + { + name : 'Index', + icon : 'fas fa-bars', + gen : indexGen, + experimental : true + }, + ] }, { @@ -138,6 +186,29 @@ module.exports = [ icon : 'fas fa-code', gen : '/* This is a comment that will not be rendered into your brew. */' }, + { + name : 'Remove Drop Cap', + icon : 'fas fa-remove-format', + gen : dedent`/* Removes Drop Caps */ + .page h1+p:first-letter { + all: unset; + }\n\n + /* Removes Small-Caps in first line */ + .page h1+p:first-line { + all: unset; + }` + }, + { + name : 'Tweak Drop Cap', + icon : 'fas fa-sliders-h', + gen : dedent`/* Drop Cap settings */ + .page h1 + p::first-letter { + font-family: SolberaImitationRemake; + font-size: 3.5cm; + background-image: linear-gradient(-45deg, #322814, #998250, #322814); + line-height: 1em; + }\n\n` + }, ] }, diff --git a/themes/V3/5ePHB/snippets/index.gen.js b/themes/V3/Blank/snippets/index.gen.js similarity index 100% rename from themes/V3/5ePHB/snippets/index.gen.js rename to themes/V3/Blank/snippets/index.gen.js diff --git a/themes/V3/5ePHB/snippets/tableOfContents.gen.js b/themes/V3/Blank/snippets/tableOfContents.gen.js similarity index 100% rename from themes/V3/5ePHB/snippets/tableOfContents.gen.js rename to themes/V3/Blank/snippets/tableOfContents.gen.js diff --git a/themes/V3/Blank/style.less b/themes/V3/Blank/style.less index 18a478cf9..4b0653f4b 100644 --- a/themes/V3/Blank/style.less +++ b/themes/V3/Blank/style.less @@ -482,3 +482,130 @@ body { counter-reset : page-numbers; } .pageNumber { left : 30px; } } } + +// ***************************** +// * 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; + } + } +} + +// ***************************** +// * TABLE OF CONTENTS +// *****************************/ + +// Default Exclusions +// Anything not exlcuded is included, default Headers are H1, H2, and H3. +h4, +h5, +h6, +.page:has(.frontCover), +.page:has(.backCover), +.page:has(.insideCover), +.monster, +.noToC, +.toc { --TOC: exclude; } + +.tocDepthH2 :is(h1, h2) {--TOC: include; } +.tocDepthH3 :is(h1, h2, h3) {--TOC: include; } +.tocDepthH4 :is(h1, h2, h3, h4) {--TOC: include; } +.tocDepthH5 :is(h1, h2, h3, h4, h5) {--TOC: include; } +.tocDepthH6 :is(h1, h2, h3, h4, h5, h6) {--TOC: include; } + +.tocIncludeH1 h1 {--TOC: include; } +.tocIncludeH2 h2 {--TOC: include; } +.tocIncludeH3 h3 {--TOC: include; } +.tocIncludeH4 h4 {--TOC: include; } +.tocIncludeH5 h5 {--TOC: include; } +.tocIncludeH6 h6 {--TOC: include; } + +.page:has(.partCover) { + --TOC: exclude; + & h1 { + --TOC: include; + } + } + +.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); + } + } + .toc.wide li { + break-inside: auto; + } +} From 2c573bfef5dee6829418318c99822c223af0cc8e Mon Sep 17 00:00:00 2001 From: David Bolack Date: Fri, 23 Aug 2024 14:18:58 -0500 Subject: [PATCH 02/29] Failed to save one file's changes. --- themes/V3/5ePHB/style.less | 126 ------------------------------------- 1 file changed, 126 deletions(-) diff --git a/themes/V3/5ePHB/style.less b/themes/V3/5ePHB/style.less index ddffbec2f..e4bbb3514 100644 --- a/themes/V3/5ePHB/style.less +++ b/themes/V3/5ePHB/style.less @@ -792,111 +792,6 @@ } } -// ***************************** -// * TABLE OF CONTENTS -// *****************************/ - -// Default Exclusions -// Anything not exlcuded is included, default Headers are H1, H2, and H3. -h4, -h5, -h6, -.page:has(.frontCover), -.page:has(.backCover), -.page:has(.insideCover), -.monster, -.noToC, -.toc { --TOC: exclude; } - -.tocDepthH2 :is(h1, h2) {--TOC: include; } -.tocDepthH3 :is(h1, h2, h3) {--TOC: include; } -.tocDepthH4 :is(h1, h2, h3, h4) {--TOC: include; } -.tocDepthH5 :is(h1, h2, h3, h4, h5) {--TOC: include; } -.tocDepthH6 :is(h1, h2, h3, h4, h5, h6) {--TOC: include; } - -.tocIncludeH1 h1 {--TOC: include; } -.tocIncludeH2 h2 {--TOC: include; } -.tocIncludeH3 h3 {--TOC: include; } -.tocIncludeH4 h4 {--TOC: include; } -.tocIncludeH5 h5 {--TOC: include; } -.tocIncludeH6 h6 {--TOC: include; } - -.page:has(.partCover) { - --TOC: exclude; - & h1 { - --TOC: include; - } - } - -.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); - } - } - .toc.wide li { - break-inside: auto; - } -} - // ***************************** // * DEFINITION LISTS // *****************************/ @@ -958,24 +853,3 @@ h6, } } } -// ***************************** -// * 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; - } - } -} From ad1dfc8e2bc10f82f581c3267882df2cc1545235 Mon Sep 17 00:00:00 2001 From: David Bolack Date: Fri, 23 Aug 2024 16:52:35 -0500 Subject: [PATCH 03/29] Move Page styles ( cover Page, etc ) to Blank from 5ePHB --- themes/V3/5ePHB/style.less | 264 ------------------------------------ themes/V3/Blank/style.less | 265 +++++++++++++++++++++++++++++++++++++ 2 files changed, 265 insertions(+), 264 deletions(-) diff --git a/themes/V3/5ePHB/style.less b/themes/V3/5ePHB/style.less index e4bbb3514..e33a0b2be 100644 --- a/themes/V3/5ePHB/style.less +++ b/themes/V3/5ePHB/style.less @@ -538,259 +538,6 @@ } h5 + table { margin-top : 0.2cm; } } -// ***************************** -// * FRONT COVER PAGE -// *****************************/ -.page:has(.frontCover) { - columns : 1; - text-align : center; - &::after { display : none; } - h1 { - margin-top : 1.2cm; - margin-bottom : 0; - font-family : 'NodestoCapsCondensed'; - font-size : 2.245cm; - font-weight : normal; - line-height : 1.9cm; - color : white; - text-shadow : unset; - text-transform : uppercase; - -webkit-text-stroke: 0.2cm black; - paint-order:stroke; - } - h2 { - font-family : 'NodestoCapsCondensed'; - font-size : 0.85cm; - font-weight : normal; - color : white; - letter-spacing : 0.1cm; - -webkit-text-stroke: 0.14cm black; - paint-order:stroke; - } - 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; - -webkit-text-stroke: 0.1cm black; - paint-order:stroke; - } - .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 { display : none; } - h1 { - margin-top : 1.2cm; - margin-bottom : 0; - font-family : 'NodestoCapsCondensed'; - font-size : 2.1cm; - font-weight : normal; - line-height : 1.785cm; - 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 { display : none; } - .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 : 1.28cm; - 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 : 0.35cm; - } - 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; - line-height : 1.28cm; - color : #FFFFFF; - text-align : center; - text-indent : 0; - } - } -} - -// ***************************** -// * 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 : 0.495cm; - } -} // ***************************** // * DEFINITION LISTS @@ -807,17 +554,6 @@ } } -// ***************************** -// * WIDE -// *****************************/ -.page .wide { margin-bottom : 0.325cm; } - -.page h1 + * { margin-top : 0; } - -.page .descriptive.wide + * { - margin-top: 0; -} - //***************************** // * RUNE TABLE // *****************************/ diff --git a/themes/V3/Blank/style.less b/themes/V3/Blank/style.less index 4b0653f4b..791ebce73 100644 --- a/themes/V3/Blank/style.less +++ b/themes/V3/Blank/style.less @@ -609,3 +609,268 @@ h6, break-inside: auto; } } + +// ***************************** +// * WIDE +// *****************************/ +.page .wide { margin-bottom : 0.325cm; } + +.page h1 + * { margin-top : 0; } + +.page .descriptive.wide + * { + margin-top: 0; +} + +// ***************************** +// * FRONT COVER PAGE +// *****************************/ +.page:has(.frontCover) { + columns : 1; + text-align : center; + &::after { display : none; } + h1 { + margin-top : 1.2cm; + margin-bottom : 0; + font-family : 'NodestoCapsCondensed'; + font-size : 2.245cm; + font-weight : normal; + line-height : 1.9cm; + color : white; + text-shadow : unset; + text-transform : uppercase; + -webkit-text-stroke: 0.2cm black; + paint-order:stroke; + } + h2 { + font-family : 'NodestoCapsCondensed'; + font-size : 0.85cm; + font-weight : normal; + color : white; + letter-spacing : 0.1cm; + -webkit-text-stroke: 0.14cm black; + paint-order:stroke; + } + 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; + -webkit-text-stroke: 0.1cm black; + paint-order:stroke; + } + .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 { display : none; } + h1 { + margin-top : 1.2cm; + margin-bottom : 0; + font-family : 'NodestoCapsCondensed'; + font-size : 2.1cm; + font-weight : normal; + line-height : 1.785cm; + 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 { display : none; } + .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 : 1.28cm; + 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 : 0.35cm; + } + 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; + line-height : 1.28cm; + color : #FFFFFF; + text-align : center; + text-indent : 0; + } + } +} + +// ***************************** +// * 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 : 0.495cm; + } +} From a3c01305df17b78d860de1d0c407941103516393 Mon Sep 17 00:00:00 2001 From: David Bolack Date: Sun, 25 Aug 2024 19:15:57 -0500 Subject: [PATCH 04/29] Revert "Move Page styles ( cover Page, etc ) to Blank from 5ePHB" This reverts commit ad1dfc8e2bc10f82f581c3267882df2cc1545235. --- themes/V3/5ePHB/style.less | 264 ++++++++++++++++++++++++++++++++++++ themes/V3/Blank/style.less | 265 ------------------------------------- 2 files changed, 264 insertions(+), 265 deletions(-) diff --git a/themes/V3/5ePHB/style.less b/themes/V3/5ePHB/style.less index e33a0b2be..e4bbb3514 100644 --- a/themes/V3/5ePHB/style.less +++ b/themes/V3/5ePHB/style.less @@ -538,6 +538,259 @@ } h5 + table { margin-top : 0.2cm; } } +// ***************************** +// * FRONT COVER PAGE +// *****************************/ +.page:has(.frontCover) { + columns : 1; + text-align : center; + &::after { display : none; } + h1 { + margin-top : 1.2cm; + margin-bottom : 0; + font-family : 'NodestoCapsCondensed'; + font-size : 2.245cm; + font-weight : normal; + line-height : 1.9cm; + color : white; + text-shadow : unset; + text-transform : uppercase; + -webkit-text-stroke: 0.2cm black; + paint-order:stroke; + } + h2 { + font-family : 'NodestoCapsCondensed'; + font-size : 0.85cm; + font-weight : normal; + color : white; + letter-spacing : 0.1cm; + -webkit-text-stroke: 0.14cm black; + paint-order:stroke; + } + 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; + -webkit-text-stroke: 0.1cm black; + paint-order:stroke; + } + .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 { display : none; } + h1 { + margin-top : 1.2cm; + margin-bottom : 0; + font-family : 'NodestoCapsCondensed'; + font-size : 2.1cm; + font-weight : normal; + line-height : 1.785cm; + 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 { display : none; } + .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 : 1.28cm; + 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 : 0.35cm; + } + 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; + line-height : 1.28cm; + color : #FFFFFF; + text-align : center; + text-indent : 0; + } + } +} + +// ***************************** +// * 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 : 0.495cm; + } +} // ***************************** // * DEFINITION LISTS @@ -554,6 +807,17 @@ } } +// ***************************** +// * WIDE +// *****************************/ +.page .wide { margin-bottom : 0.325cm; } + +.page h1 + * { margin-top : 0; } + +.page .descriptive.wide + * { + margin-top: 0; +} + //***************************** // * RUNE TABLE // *****************************/ diff --git a/themes/V3/Blank/style.less b/themes/V3/Blank/style.less index 791ebce73..4b0653f4b 100644 --- a/themes/V3/Blank/style.less +++ b/themes/V3/Blank/style.less @@ -609,268 +609,3 @@ h6, break-inside: auto; } } - -// ***************************** -// * WIDE -// *****************************/ -.page .wide { margin-bottom : 0.325cm; } - -.page h1 + * { margin-top : 0; } - -.page .descriptive.wide + * { - margin-top: 0; -} - -// ***************************** -// * FRONT COVER PAGE -// *****************************/ -.page:has(.frontCover) { - columns : 1; - text-align : center; - &::after { display : none; } - h1 { - margin-top : 1.2cm; - margin-bottom : 0; - font-family : 'NodestoCapsCondensed'; - font-size : 2.245cm; - font-weight : normal; - line-height : 1.9cm; - color : white; - text-shadow : unset; - text-transform : uppercase; - -webkit-text-stroke: 0.2cm black; - paint-order:stroke; - } - h2 { - font-family : 'NodestoCapsCondensed'; - font-size : 0.85cm; - font-weight : normal; - color : white; - letter-spacing : 0.1cm; - -webkit-text-stroke: 0.14cm black; - paint-order:stroke; - } - 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; - -webkit-text-stroke: 0.1cm black; - paint-order:stroke; - } - .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 { display : none; } - h1 { - margin-top : 1.2cm; - margin-bottom : 0; - font-family : 'NodestoCapsCondensed'; - font-size : 2.1cm; - font-weight : normal; - line-height : 1.785cm; - 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 { display : none; } - .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 : 1.28cm; - 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 : 0.35cm; - } - 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; - line-height : 1.28cm; - color : #FFFFFF; - text-align : center; - text-indent : 0; - } - } -} - -// ***************************** -// * 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 : 0.495cm; - } -} From f1eb6e1ce473bd1a6cacbbbce0bac9bb55875dda Mon Sep 17 00:00:00 2001 From: David Bolack Date: Tue, 28 Jan 2025 21:31:43 -0600 Subject: [PATCH 05/29] Alter varCallInline content to alig with preceeding varDefBlock in inline definitions. This was failing due to both labels having the extraneous spaces cleaned up but the variable label portion of the varCallInline did not, preventing them from being matched during variable resolution. --- shared/naturalcrit/markdown.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/shared/naturalcrit/markdown.js b/shared/naturalcrit/markdown.js index 99766b536..1914cd201 100644 --- a/shared/naturalcrit/markdown.js +++ b/shared/naturalcrit/markdown.js @@ -735,7 +735,7 @@ function MarkedVariables() { varsQueue.push( { type : 'varCallInline', varName : label, - content : match[9] + content : match[9].replace(/\s+/g, ' ').replace(/\[\s+/, '[').replace(/\s+\]/, ']') }); } if(match[12]) { // Inline Call From 564f5d71b2549dbc86bb8fa0d2f4b033340a4764 Mon Sep 17 00:00:00 2001 From: David Bolack Date: Fri, 31 Jan 2025 16:12:00 -0600 Subject: [PATCH 06/29] WIP --- shared/naturalcrit/markdown.js | 18 ++++++++++++------ 1 file changed, 12 insertions(+), 6 deletions(-) diff --git a/shared/naturalcrit/markdown.js b/shared/naturalcrit/markdown.js index 1914cd201..1cd11d7b5 100644 --- a/shared/naturalcrit/markdown.js +++ b/shared/naturalcrit/markdown.js @@ -59,6 +59,12 @@ mathParser.functions.signed = function (a) { return `${a}`; }; +// Make sure we normalize variable names consistantly. +const normalizeVarNames = (label)=>{ + return label.trim() + .replace(/\s+/g, ' '); +}; + //Processes the markdown within an HTML block if it's just a class-wrapper renderer.html = function (html) { if(_.startsWith(_.trim(html), '')){ @@ -533,7 +539,7 @@ const replaceVar = function(input, hoist=false, allowUnresolved=false) { const match = regex.exec(input); const prefix = match[1]; - const label = match[2]; + const label = normalizeVarNames(match[2]); // Ensure the label name is normalized as it should be in the var stack. //v=====--------------------< HANDLE MATH >-------------------=====v// const mathRegex = /[a-z]+\(|[+\-*/^(),]/g; @@ -688,7 +694,7 @@ function MarkedVariables() { }); } if(match[3]) { // Block Definition - const label = match[4] ? match[4].trim().replace(/\s+/g, ' ') : null; // Trim edge spaces and shorten blocks of whitespace to 1 space + const label = match[4] ? normalizeVarNames(match[4]) : null; // Trim edge spaces and shorten blocks of whitespace to 1 space const content = match[5] ? match[5].trim().replace(/[ \t]+/g, ' ') : null; // Trim edge spaces and shorten blocks of whitespace to 1 space varsQueue.push( @@ -698,7 +704,7 @@ function MarkedVariables() { }); } if(match[6]) { // Block Call - const label = match[7] ? match[7].trim().replace(/\s+/g, ' ') : null; // Trim edge spaces and shorten blocks of whitespace to 1 space + const label = match[7] ? normalizeVarNames(match[7]) : null; // Trim edge spaces and shorten blocks of whitespace to 1 space varsQueue.push( { type : 'varCallBlock', @@ -707,7 +713,7 @@ function MarkedVariables() { }); } if(match[8]) { // Inline Definition - const label = match[10] ? match[10].trim().replace(/\s+/g, ' ') : null; // Trim edge spaces and shorten blocks of whitespace to 1 space + const label = match[10] ? normalizeVarNames(match[10]) : null; // Trim edge spaces and shorten blocks of whitespace to 1 space let content = match[11] || null; // In case of nested (), find the correct matching end ) @@ -735,11 +741,11 @@ function MarkedVariables() { varsQueue.push( { type : 'varCallInline', varName : label, - content : match[9].replace(/\s+/g, ' ').replace(/\[\s+/, '[').replace(/\s+\]/, ']') + content : match[9] }); } if(match[12]) { // Inline Call - const label = match[13] ? match[13].trim().replace(/\s+/g, ' ') : null; // Trim edge spaces and shorten blocks of whitespace to 1 space + const label = match[13] ? normalizeVarNames(match[13]) : null; // Trim edge spaces and shorten blocks of whitespace to 1 space varsQueue.push( { type : 'varCallInline', From b1ff68c3b1df577a8e51654373ac62024f0baaf9 Mon Sep 17 00:00:00 2001 From: David Bolack Date: Fri, 31 Jan 2025 16:12:00 -0600 Subject: [PATCH 07/29] Update code to use helper function to ensure unifrom normalization of Variable labels. --- shared/naturalcrit/markdown.js | 18 ++++++++++++------ 1 file changed, 12 insertions(+), 6 deletions(-) diff --git a/shared/naturalcrit/markdown.js b/shared/naturalcrit/markdown.js index 1914cd201..1cd11d7b5 100644 --- a/shared/naturalcrit/markdown.js +++ b/shared/naturalcrit/markdown.js @@ -59,6 +59,12 @@ mathParser.functions.signed = function (a) { return `${a}`; }; +// Make sure we normalize variable names consistantly. +const normalizeVarNames = (label)=>{ + return label.trim() + .replace(/\s+/g, ' '); +}; + //Processes the markdown within an HTML block if it's just a class-wrapper renderer.html = function (html) { if(_.startsWith(_.trim(html), '')){ @@ -533,7 +539,7 @@ const replaceVar = function(input, hoist=false, allowUnresolved=false) { const match = regex.exec(input); const prefix = match[1]; - const label = match[2]; + const label = normalizeVarNames(match[2]); // Ensure the label name is normalized as it should be in the var stack. //v=====--------------------< HANDLE MATH >-------------------=====v// const mathRegex = /[a-z]+\(|[+\-*/^(),]/g; @@ -688,7 +694,7 @@ function MarkedVariables() { }); } if(match[3]) { // Block Definition - const label = match[4] ? match[4].trim().replace(/\s+/g, ' ') : null; // Trim edge spaces and shorten blocks of whitespace to 1 space + const label = match[4] ? normalizeVarNames(match[4]) : null; // Trim edge spaces and shorten blocks of whitespace to 1 space const content = match[5] ? match[5].trim().replace(/[ \t]+/g, ' ') : null; // Trim edge spaces and shorten blocks of whitespace to 1 space varsQueue.push( @@ -698,7 +704,7 @@ function MarkedVariables() { }); } if(match[6]) { // Block Call - const label = match[7] ? match[7].trim().replace(/\s+/g, ' ') : null; // Trim edge spaces and shorten blocks of whitespace to 1 space + const label = match[7] ? normalizeVarNames(match[7]) : null; // Trim edge spaces and shorten blocks of whitespace to 1 space varsQueue.push( { type : 'varCallBlock', @@ -707,7 +713,7 @@ function MarkedVariables() { }); } if(match[8]) { // Inline Definition - const label = match[10] ? match[10].trim().replace(/\s+/g, ' ') : null; // Trim edge spaces and shorten blocks of whitespace to 1 space + const label = match[10] ? normalizeVarNames(match[10]) : null; // Trim edge spaces and shorten blocks of whitespace to 1 space let content = match[11] || null; // In case of nested (), find the correct matching end ) @@ -735,11 +741,11 @@ function MarkedVariables() { varsQueue.push( { type : 'varCallInline', varName : label, - content : match[9].replace(/\s+/g, ' ').replace(/\[\s+/, '[').replace(/\s+\]/, ']') + content : match[9] }); } if(match[12]) { // Inline Call - const label = match[13] ? match[13].trim().replace(/\s+/g, ' ') : null; // Trim edge spaces and shorten blocks of whitespace to 1 space + const label = match[13] ? normalizeVarNames(match[13]) : null; // Trim edge spaces and shorten blocks of whitespace to 1 space varsQueue.push( { type : 'varCallInline', From d061b902d5c8ddf03bf7d8abfa2c7c8e62377dec Mon Sep 17 00:00:00 2001 From: David Bolack Date: Fri, 7 Feb 2025 19:26:56 -0600 Subject: [PATCH 08/29] Make all typefaces available via blank - for now. --- themes/V3/Blank/style.less | 1 + 1 file changed, 1 insertion(+) diff --git a/themes/V3/Blank/style.less b/themes/V3/Blank/style.less index 82a101d09..ded7370ba 100644 --- a/themes/V3/Blank/style.less +++ b/themes/V3/Blank/style.less @@ -5,6 +5,7 @@ @import (less) './themes/fonts/iconFonts/diceFont.less'; @import (less) './themes/fonts/iconFonts/gameIcons.less'; @import (less) './themes/fonts/iconFonts/fontAwesome.less'; +@import (less) './themes/fonts/Journal/fonts.less'; :root { //Colors From dc8d0e94839e943f26e6c17d7c2ecf756fdfd8d4 Mon Sep 17 00:00:00 2001 From: David Bolack Date: Tue, 11 Feb 2025 14:37:25 -0600 Subject: [PATCH 09/29] Restore .monster --- themes/V3/5ePHB/style.less | 8 ++++++++ 1 file changed, 8 insertions(+) diff --git a/themes/V3/5ePHB/style.less b/themes/V3/5ePHB/style.less index 46d7e3239..55f89c670 100644 --- a/themes/V3/5ePHB/style.less +++ b/themes/V3/5ePHB/style.less @@ -793,6 +793,14 @@ } } +// ***************************** +// * TABLE OF CONTENTS +// *****************************/ + +// Default Exclusions +// Anything not excluded is included, default Headers are H1, H2, and H3. +.monster { --TOC: exclude; } + // ***************************** // * DEFINITION LISTS // *****************************/ From 3ffdb3431275aca6c45932021435a89b9a5e9a0a Mon Sep 17 00:00:00 2001 From: David Bolack Date: Tue, 11 Feb 2025 14:45:39 -0600 Subject: [PATCH 10/29] Tweaks in response to CC comments --- themes/V3/5ePHB/style.less | 101 ++++++++++++++++++++++++++++++++++++- themes/V3/Blank/style.less | 11 ---- 2 files changed, 99 insertions(+), 13 deletions(-) diff --git a/themes/V3/5ePHB/style.less b/themes/V3/5ePHB/style.less index 55f89c670..9e2ce5064 100644 --- a/themes/V3/5ePHB/style.less +++ b/themes/V3/5ePHB/style.less @@ -797,10 +797,85 @@ // * TABLE OF CONTENTS // *****************************/ -// Default Exclusions -// Anything not excluded is included, default Headers are H1, H2, and H3. +// Additional Default Exclusions .monster { --TOC: exclude; } +.page:has(.partCover) { + --TOC: exclude; + & h1 { + --TOC: include; + } + } + +.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); + } + } + .toc.wide li { + break-inside: auto; + } +} + // ***************************** // * DEFINITION LISTS // *****************************/ @@ -862,3 +937,25 @@ } } } + +// ***************************** +// * 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; + } + } +} diff --git a/themes/V3/Blank/style.less b/themes/V3/Blank/style.less index ded7370ba..c3a792b16 100644 --- a/themes/V3/Blank/style.less +++ b/themes/V3/Blank/style.less @@ -513,7 +513,6 @@ body { counter-reset : page-numbers 0; } // *****************************/ .page { .index { - font-size : 0.218cm; ul ul { margin : 0; } @@ -542,7 +541,6 @@ h6, .page:has(.frontCover), .page:has(.backCover), .page:has(.insideCover), -.monster, .noToC, .toc { --TOC: exclude; } @@ -559,13 +557,6 @@ h6, .tocIncludeH5 h5 {--TOC: include; } .tocIncludeH6 h6 {--TOC: include; } -.page:has(.partCover) { - --TOC: exclude; - & h1 { - --TOC: include; - } - } - .page { &:has(.toc)::after { display : none; } .toc { @@ -616,10 +607,8 @@ h6, &:last-child { display : inline-block; align-self : flex-end; - font-family : 'BookInsanityRemake'; font-size : 0.34cm; font-weight : normal; - color : #000000; } } ul { /* List indent */ From 20baa9984f27deb29432210f85e12602cf4b29c7 Mon Sep 17 00:00:00 2001 From: Trevor Buckner Date: Thu, 6 Mar 2025 11:13:39 -0500 Subject: [PATCH 11/29] Cleanup --- shared/naturalcrit/markdown.js | 15 +++++++-------- 1 file changed, 7 insertions(+), 8 deletions(-) diff --git a/shared/naturalcrit/markdown.js b/shared/naturalcrit/markdown.js index c5d93d73d..40a7584cf 100644 --- a/shared/naturalcrit/markdown.js +++ b/shared/naturalcrit/markdown.js @@ -60,10 +60,9 @@ mathParser.functions.signed = function (a) { return `${a}`; }; -// Make sure we normalize variable names consistantly. +// Normalize variable names; trim edge spaces and shorten blocks of whitespace to 1 space const normalizeVarNames = (label)=>{ - return label.trim() - .replace(/\s+/g, ' '); + return label.trim().replace(/\s+/g, ' '); }; //Processes the markdown within an HTML block if it's just a class-wrapper @@ -666,8 +665,8 @@ function MarkedVariables() { }); } if(match[3]) { // Block Definition - const label = match[4] ? normalizeVarNames(match[4]) : null; // Trim edge spaces and shorten blocks of whitespace to 1 space - const content = match[5] ? match[5].trim().replace(/[ \t]+/g, ' ') : null; // Trim edge spaces and shorten blocks of whitespace to 1 space + const label = match[4] ? normalizeVarNames(match[4]) : null; + const content = match[5] ? match[5].trim().replace(/[ \t]+/g, ' ') : null; // Normalize text content (except newlines for block-level content) varsQueue.push( { type : 'varDefBlock', @@ -676,7 +675,7 @@ function MarkedVariables() { }); } if(match[6]) { // Block Call - const label = match[7] ? normalizeVarNames(match[7]) : null; // Trim edge spaces and shorten blocks of whitespace to 1 space + const label = match[7] ? normalizeVarNames(match[7]) : null; varsQueue.push( { type : 'varCallBlock', @@ -685,7 +684,7 @@ function MarkedVariables() { }); } if(match[8]) { // Inline Definition - const label = match[10] ? normalizeVarNames(match[10]) : null; // Trim edge spaces and shorten blocks of whitespace to 1 space + const label = match[10] ? normalizeVarNames(match[10]) : null; let content = match[11] || null; // In case of nested (), find the correct matching end ) @@ -717,7 +716,7 @@ function MarkedVariables() { }); } if(match[12]) { // Inline Call - const label = match[13] ? normalizeVarNames(match[13]) : null; // Trim edge spaces and shorten blocks of whitespace to 1 space + const label = match[13] ? normalizeVarNames(match[13]) : null; varsQueue.push( { type : 'varCallInline', From 72c2857237fe50fb5a30947504d7be8edc056d19 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?V=C3=ADctor=20Losada=20Hern=C3=A1ndez?= Date: Thu, 13 Mar 2025 22:32:12 +0100 Subject: [PATCH 12/29] initial fix --- server/app.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/server/app.js b/server/app.js index 76caf6fed..22c3a6908 100644 --- a/server/app.js +++ b/server/app.js @@ -71,7 +71,7 @@ const corsOptions = { ]; if(isLocalEnvironment) { - allowedOrigins.push('http://localhost:8000', 'http://localhost:8010'); + allowedOrigins.push('http://localhost:8000', 'http://localhost:8010', /^http:\/\/192\.168\.\d+\.\d+:\d+$/); } const herokuRegex = /^https:\/\/(?:homebrewery-pr-\d+\.herokuapp\.com|naturalcrit-pr-\d+\.herokuapp\.com)$/; // Matches any Heroku app From 94bcc8e9979733bfe051c184b68e0c8498d87b4a Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?V=C3=ADctor=20Losada=20Hern=C3=A1ndez?= Date: Thu, 13 Mar 2025 22:59:23 +0100 Subject: [PATCH 13/29] update to include all possible local adresses --- server/app.js | 5 +++-- 1 file changed, 3 insertions(+), 2 deletions(-) diff --git a/server/app.js b/server/app.js index 22c3a6908..12fe21a1d 100644 --- a/server/app.js +++ b/server/app.js @@ -71,7 +71,8 @@ const corsOptions = { ]; if(isLocalEnvironment) { - allowedOrigins.push('http://localhost:8000', 'http://localhost:8010', /^http:\/\/192\.168\.\d+\.\d+:\d+$/); + const localNetworkRegex = /^http:\/\/(localhost|127\.0\.0\.1|10\.\d+\.\d+\.\d+|192\.168\.\d+\.\d+|172\.(1[6-9]|2\d|3[0-1])\.\d+\.\d+):\d+$/; + allowedOrigins.push(localNetworkRegex); } const herokuRegex = /^https:\/\/(?:homebrewery-pr-\d+\.herokuapp\.com|naturalcrit-pr-\d+\.herokuapp\.com)$/; // Matches any Heroku app @@ -352,7 +353,7 @@ app.get('/user/:username', async (req, res, next)=>{ app.put('/api/user/rename', async (req, res)=>{ const { username, newUsername } = req.body; const ownAccount = req.account && (req.account.username == newUsername); - + if(!username || !newUsername) return res.status(400).json({ error: 'Username and newUsername are required.' }); if(!ownAccount) From 86ff2ab96be56339ecf540b25d68ad8b45a77d50 Mon Sep 17 00:00:00 2001 From: David Bolack Date: Fri, 14 Mar 2025 19:51:35 -0500 Subject: [PATCH 14/29] Add tests for regression --- tests/markdown/variables.test.js | 25 +++++++++++++++++++++++++ 1 file changed, 25 insertions(+) diff --git a/tests/markdown/variables.test.js b/tests/markdown/variables.test.js index 41259da7e..4c91d7d00 100644 --- a/tests/markdown/variables.test.js +++ b/tests/markdown/variables.test.js @@ -410,4 +410,29 @@ describe('Regression Tests', ()=>{ const rendered = Markdown.render(source).trimReturns(); expect(rendered).toBe('
title 1title 2title 3title 4
fooIpsum))
'); }); + + it('Handle Extra spaces in image alt-text 1', function(){ + const source='![ where is my image??](http://i.imgur.com/hMna6G0.png)'; + const rendered = Markdown.render(source).trimReturns(); + expect(rendered).toBe('

\"where

'); + }); + + it('Handle Extra spaces in image alt-text 2', function(){ + const source='![where is my image??](http://i.imgur.com/hMna6G0.png)'; + const rendered = Markdown.render(source).trimReturns(); + expect(rendered).toBe('

\"where

'); + }); + + it('Handle Extra spaces in image alt-text 3', function(){ + const source='![where is my image?? ](http://i.imgur.com/hMna6G0.png)'; + const rendered = Markdown.render(source).trimReturns(); + expect(rendered).toBe('

\"where

'); + }); + + it('Handle Extra spaces in image alt-text 4', function(){ + const source='![where is my image??](http://i.imgur.com/hMna6G0.png){height=20%,width=20%}'; + const rendered = Markdown.render(source).trimReturns(); + expect(rendered).toBe('

\"where

'); + }); + }); \ No newline at end of file From a705e3b9d88ca1ee01f0a7452a2fad4ee9876c5a Mon Sep 17 00:00:00 2001 From: "G.Ambatte" Date: Tue, 18 Mar 2025 09:54:27 +1300 Subject: [PATCH 15/29] Change : from br to div class='blank' --- shared/naturalcrit/markdown.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/shared/naturalcrit/markdown.js b/shared/naturalcrit/markdown.js index bed109772..3334b026c 100644 --- a/shared/naturalcrit/markdown.js +++ b/shared/naturalcrit/markdown.js @@ -391,7 +391,7 @@ const forcedParagraphBreaks = { } }, renderer(token) { - return `
\n`.repeat(token.length); + return `
\n`.repeat(token.length); } }; From a44056a64b0fef56e859c56d9eac45ebc9fcb01b Mon Sep 17 00:00:00 2001 From: "G.Ambatte" Date: Tue, 18 Mar 2025 10:02:29 +1300 Subject: [PATCH 16/29] Restore blank styling --- .../brewRenderer/notificationPopup/notificationPopup.less | 5 +++++ client/homebrew/pages/basePages/uiPage/uiPage.less | 7 +++++++ themes/V3/5ePHB/style.less | 1 + themes/V3/Blank/style.less | 7 +++++++ 4 files changed, 20 insertions(+) diff --git a/client/homebrew/brewRenderer/notificationPopup/notificationPopup.less b/client/homebrew/brewRenderer/notificationPopup/notificationPopup.less index 6180decc6..9e5a4a73b 100644 --- a/client/homebrew/brewRenderer/notificationPopup/notificationPopup.less +++ b/client/homebrew/brewRenderer/notificationPopup/notificationPopup.less @@ -85,4 +85,9 @@ display : inline-block; width : 100%; } + .blank { + height : 1em; + margin-top: 0; + & + * { margin-top: 0; } + } } \ No newline at end of file diff --git a/client/homebrew/pages/basePages/uiPage/uiPage.less b/client/homebrew/pages/basePages/uiPage/uiPage.less index 49cb8311d..e1013fa81 100644 --- a/client/homebrew/pages/basePages/uiPage/uiPage.less +++ b/client/homebrew/pages/basePages/uiPage/uiPage.less @@ -59,6 +59,13 @@ padding-left : 1.25em; list-style : square; } + .blank { + height: 1em; + margin-top: 0; + & + * { + margin-top: 0; + } + } } } } \ No newline at end of file diff --git a/themes/V3/5ePHB/style.less b/themes/V3/5ePHB/style.less index 00804c19c..1a751b18d 100644 --- a/themes/V3/5ePHB/style.less +++ b/themes/V3/5ePHB/style.less @@ -689,6 +689,7 @@ background-repeat : no-repeat; background-size : contain; } + .blank { height: 1.4em; } h1 { margin-bottom : 0.3cm; font-family : 'NodestoCapsCondensed'; diff --git a/themes/V3/Blank/style.less b/themes/V3/Blank/style.less index 1a22db6a7..e107c76b8 100644 --- a/themes/V3/Blank/style.less +++ b/themes/V3/Blank/style.less @@ -437,6 +437,13 @@ body { counter-reset : page-numbers 0; } margin-bottom : 1em; & + * { margin-top : 0; } } + .blank { + height: 1em; + margin-top: 0; + & + * { + margin-top: 0; + } + } } //***************************** From 83a095923e86266c647cf15f7044fbb9cc7f11f2 Mon Sep 17 00:00:00 2001 From: "G.Ambatte" Date: Tue, 18 Mar 2025 10:51:09 +1300 Subject: [PATCH 17/29] Add columnSplit to end of each page for older Chrome versions --- client/homebrew/brewRenderer/brewRenderer.jsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/client/homebrew/brewRenderer/brewRenderer.jsx b/client/homebrew/brewRenderer/brewRenderer.jsx index 8f0f2f2ff..10d94c5ac 100644 --- a/client/homebrew/brewRenderer/brewRenderer.jsx +++ b/client/homebrew/brewRenderer/brewRenderer.jsx @@ -39,7 +39,7 @@ const BrewPage = (props)=>{ ...props }; const pageRef = useRef(null); - const cleanText = safeHTML(props.contents); + const cleanText = safeHTML(`${props.contents}\n
\n`); useEffect(()=>{ if(!pageRef.current) return; From 7329c69cfde0b7a45289d522a0ae78def0fb2873 Mon Sep 17 00:00:00 2001 From: "G.Ambatte" Date: Tue, 18 Mar 2025 11:02:09 +1300 Subject: [PATCH 18/29] Update tests --- tests/markdown/definition-lists.test.js | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/tests/markdown/definition-lists.test.js b/tests/markdown/definition-lists.test.js index 4c754db48..144dad880 100644 --- a/tests/markdown/definition-lists.test.js +++ b/tests/markdown/definition-lists.test.js @@ -1,4 +1,4 @@ -/* eslint-disable max-lines */ + import Markdown from 'naturalcrit/markdown.js'; @@ -92,12 +92,12 @@ describe('Multiline Definition Lists', ()=>{ test('Multiline Definition Term must have at least one non-empty Definition', function() { const source = 'Term 1\n::'; const rendered = Markdown.render(source).trim(); - expect(rendered, `Input:\n${source}`, { showPrefix: false }).toBe(`

Term 1

\n
\n
`); + expect(rendered, `Input:\n${source}`, { showPrefix: false }).toBe(`

Term 1

\n
\n
`); }); test('Multiline Definition List must have at least one non-newline character after ::', function() { const source = 'Term 1\n::\nDefinition 1\n\n'; const rendered = Markdown.render(source).trim(); - expect(rendered, `Input:\n${source}`, { showPrefix: false }).toBe(`

Term 1

\n
\n
\n

Definition 1

`); + expect(rendered, `Input:\n${source}`, { showPrefix: false }).toBe(`

Term 1

\n
\n
\n

Definition 1

`); }); }); From b2903137eb4a527e7f3534ffa452a7ce057a10a5 Mon Sep 17 00:00:00 2001 From: "G.Ambatte" Date: Tue, 18 Mar 2025 11:08:15 +1300 Subject: [PATCH 19/29] Fix hard-breaks tests --- tests/markdown/hard-breaks.test.js | 14 +++++++------- 1 file changed, 7 insertions(+), 7 deletions(-) diff --git a/tests/markdown/hard-breaks.test.js b/tests/markdown/hard-breaks.test.js index fe646eac9..63bfaef9c 100644 --- a/tests/markdown/hard-breaks.test.js +++ b/tests/markdown/hard-breaks.test.js @@ -1,4 +1,4 @@ -/* eslint-disable max-lines */ + import Markdown from 'naturalcrit/markdown.js'; @@ -6,37 +6,37 @@ describe('Hard Breaks', ()=>{ test('Single Break', function() { const source = ':\n\n'; const rendered = Markdown.render(source).trim(); - expect(rendered, `Input:\n${source}`, { showPrefix: false }).toBe(`
`); + expect(rendered, `Input:\n${source}`, { showPrefix: false }).toBe(`
`); }); test('Double Break', function() { const source = '::\n\n'; const rendered = Markdown.render(source).trim(); - expect(rendered, `Input:\n${source}`, { showPrefix: false }).toBe(`
\n
`); + expect(rendered, `Input:\n${source}`, { showPrefix: false }).toBe(`
\n
`); }); test('Triple Break', function() { const source = ':::\n\n'; const rendered = Markdown.render(source).trim(); - expect(rendered, `Input:\n${source}`, { showPrefix: false }).toBe(`
\n
\n
`); + expect(rendered, `Input:\n${source}`, { showPrefix: false }).toBe(`
\n
\n
`); }); test('Many Break', function() { const source = '::::::::::\n\n'; const rendered = Markdown.render(source).trim(); - expect(rendered, `Input:\n${source}`, { showPrefix: false }).toBe(`
\n
\n
\n
\n
\n
\n
\n
\n
\n
`); + expect(rendered, `Input:\n${source}`, { showPrefix: false }).toBe(`
\n
\n
\n
\n
\n
\n
\n
\n
\n
`); }); test('Multiple sets of Breaks', function() { const source = ':::\n:::\n:::'; const rendered = Markdown.render(source).trim(); - expect(rendered, `Input:\n${source}`, { showPrefix: false }).toBe(`
\n
\n
\n
\n
\n
\n
\n
\n
`); + expect(rendered, `Input:\n${source}`, { showPrefix: false }).toBe(`
\n
\n
\n
\n
\n
\n
\n
\n
`); }); test('Break directly between two paragraphs', function() { const source = 'Line 1\n::\nLine 2'; const rendered = Markdown.render(source).trim(); - expect(rendered, `Input:\n${source}`, { showPrefix: false }).toBe(`

Line 1

\n
\n
\n

Line 2

`); + expect(rendered, `Input:\n${source}`, { showPrefix: false }).toBe(`

Line 1

\n
\n
\n

Line 2

`); }); test('Ignored inside a code block', function() { From fef571b1d630ff88cabd70f6104559fd1deb5c4e Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?V=C3=ADctor=20Losada=20Hern=C3=A1ndez?= Date: Tue, 18 Mar 2025 12:13:17 +0100 Subject: [PATCH 20/29] version bump + npm audit fix --- package-lock.json | 104 +++++++++++++++++++++++++++++++++++++++------- package.json | 2 +- 2 files changed, 90 insertions(+), 16 deletions(-) diff --git a/package-lock.json b/package-lock.json index ac8ca11af..ce671e9b9 100644 --- a/package-lock.json +++ b/package-lock.json @@ -1,12 +1,12 @@ { "name": "homebrewery", - "version": "3.18.0", + "version": "3.18.1", "lockfileVersion": 3, "requires": true, "packages": { "": { "name": "homebrewery", - "version": "3.18.0", + "version": "3.18.1", "hasInstallScript": true, "license": "MIT", "dependencies": { @@ -376,13 +376,13 @@ } }, "node_modules/@babel/helpers": { - "version": "7.26.9", - "resolved": "https://registry.npmjs.org/@babel/helpers/-/helpers-7.26.9.tgz", - "integrity": "sha512-Mz/4+y8udxBKdmzt/UjPACs4G3j5SshJJEFFKxlCGPydG4JAHXxjWjAwjd09tf6oINvl1VfMJo+nB7H2YKQ0dA==", + "version": "7.26.10", + "resolved": "https://registry.npmjs.org/@babel/helpers/-/helpers-7.26.10.tgz", + "integrity": "sha512-UPYc3SauzZ3JGgj87GgZ89JVdC5dj0AoetR5Bw6wj4niittNyFh6+eOGonYvJ1ao6B8lEa3Q3klS7ADZ53bc5g==", "license": "MIT", "dependencies": { "@babel/template": "^7.26.9", - "@babel/types": "^7.26.9" + "@babel/types": "^7.26.10" }, "engines": { "node": ">=6.9.0" @@ -1688,9 +1688,10 @@ } }, "node_modules/@babel/runtime": { - "version": "7.25.9", - "resolved": "https://registry.npmjs.org/@babel/runtime/-/runtime-7.25.9.tgz", - "integrity": "sha512-4zpTHZ9Cm6L9L+uIqghQX8ZXg8HKFcjYO3qHoO8zTmRm6HQUJ8SSJ+KRvbMBZn0EGVlT4DRYeQ/6hjlyXBh+Kg==", + "version": "7.26.10", + "resolved": "https://registry.npmjs.org/@babel/runtime/-/runtime-7.26.10.tgz", + "integrity": "sha512-2WJMeRQPHKSPemqk/awGrAiuFfzBmOIPXKizAsVhWH9YJqLZ0H+HS4c8loHGgW6utJ3E/ejXQUsiGaQy2NZ9Fw==", + "license": "MIT", "dependencies": { "regenerator-runtime": "^0.14.0" }, @@ -1740,9 +1741,9 @@ } }, "node_modules/@babel/types": { - "version": "7.26.9", - "resolved": "https://registry.npmjs.org/@babel/types/-/types-7.26.9.tgz", - "integrity": "sha512-Y3IR1cRnOxOCDvMmNiym7XpXQ93iGDDPHx+Zj+NM+rg0fBaShfQLkg+hKPaZCEvg5N/LeCo4+Rj/i3FuJsIQaw==", + "version": "7.26.10", + "resolved": "https://registry.npmjs.org/@babel/types/-/types-7.26.10.tgz", + "integrity": "sha512-emqcG3vHrpxUKTrxcblR36dcrcoRDvKmnL/dCL6ZsHaShW80qxCAcNhzQZrpeM765VzEos+xOi4s+r4IXzTwdQ==", "license": "MIT", "dependencies": { "@babel/helper-string-parser": "^7.25.9", @@ -3877,6 +3878,16 @@ "url": "https://github.com/sponsors/sindresorhus" } }, + "node_modules/bindings": { + "version": "1.5.0", + "resolved": "https://registry.npmjs.org/bindings/-/bindings-1.5.0.tgz", + "integrity": "sha512-p2q/t/mhvuOj/UeLlV6566GD/guowlr0hHxClI0W9m7MWYkL1F0hLo+0Aexs9HSPCtR1SXQ0TD3MMKrXZajbiQ==", + "license": "MIT", + "optional": true, + "dependencies": { + "file-uri-to-path": "1.0.0" + } + }, "node_modules/bn.js": { "version": "5.2.1", "resolved": "https://registry.npmjs.org/bn.js/-/bn.js-5.2.1.tgz", @@ -4399,6 +4410,20 @@ "fsevents": "~2.3.2" } }, + "node_modules/chokidar/node_modules/fsevents": { + "version": "2.3.3", + "resolved": "https://registry.npmjs.org/fsevents/-/fsevents-2.3.3.tgz", + "integrity": "sha512-5xoDfX+fL7faATnagmWPpbFtwh/R77WmMMqqHGS65C3vvB0YHrgF+B1YmZ3441tMj5n63k0212XNoJwzlhffQw==", + "hasInstallScript": true, + "license": "MIT", + "optional": true, + "os": [ + "darwin" + ], + "engines": { + "node": "^8.16.0 || ^10.6.0 || >=11.0.0" + } + }, "node_modules/chokidar/node_modules/glob-parent": { "version": "5.1.2", "resolved": "https://registry.npmjs.org/glob-parent/-/glob-parent-5.1.2.tgz", @@ -5403,9 +5428,10 @@ "license": "ISC" }, "node_modules/elliptic": { - "version": "6.6.0", - "resolved": "https://registry.npmjs.org/elliptic/-/elliptic-6.6.0.tgz", - "integrity": "sha512-dpwoQcLc/2WLQvJvLRHKZ+f9FgOdjnq11rurqwekGQygGPsYSK29OMMD2WalatiqQ+XGFDglTNixpPfI+lpaAA==", + "version": "6.6.1", + "resolved": "https://registry.npmjs.org/elliptic/-/elliptic-6.6.1.tgz", + "integrity": "sha512-RaddvvMatK2LJHqFJ+YA4WysVN5Ita9E35botqIYspQ4TkRAlCicdzKOjlyv/1Za5RyTNn7di//eEV0uTAfe3g==", + "license": "MIT", "dependencies": { "bn.js": "^4.11.9", "brorand": "^1.1.0", @@ -6372,6 +6398,13 @@ "node": ">=16.0.0" } }, + "node_modules/file-uri-to-path": { + "version": "1.0.0", + "resolved": "https://registry.npmjs.org/file-uri-to-path/-/file-uri-to-path-1.0.0.tgz", + "integrity": "sha512-0Zt+s3L7Vf1biwWZ29aARiVYLx7iMGnEUl9x33fbB/j3jR81u/O2LbqK+Bm1CDSNDKVtJ/YjwY7TUd5SkeLQLw==", + "license": "MIT", + "optional": true + }, "node_modules/fill-range": { "version": "7.1.1", "resolved": "https://registry.npmjs.org/fill-range/-/fill-range-7.1.1.tgz", @@ -6546,6 +6579,25 @@ "integrity": "sha512-OO0pH2lK6a0hZnAdau5ItzHPI6pUlvI7jMVnxUQRtw4owF2wk8lOSabtGDCTP4Ggrg2MbGnWO9X8K1t4+fGMDw==", "license": "ISC" }, + "node_modules/fsevents": { + "version": "1.2.13", + "resolved": "https://registry.npmjs.org/fsevents/-/fsevents-1.2.13.tgz", + "integrity": "sha512-oWb1Z6mkHIskLzEJ/XWX0srkpkTQ7vaopMQkyaEIoq0fmtFVxOthb8cCxeT+p3ynTdkk/RZwbgG4brR5BeWECw==", + "deprecated": "Upgrade to fsevents v2 to mitigate potential security issues", + "hasInstallScript": true, + "license": "MIT", + "optional": true, + "os": [ + "darwin" + ], + "dependencies": { + "bindings": "^1.5.0", + "nan": "^2.12.1" + }, + "engines": { + "node": ">= 4.0" + } + }, "node_modules/function-bind": { "version": "1.1.2", "resolved": "https://registry.npmjs.org/function-bind/-/function-bind-1.1.2.tgz", @@ -8543,6 +8595,21 @@ "fsevents": "^2.3.2" } }, + "node_modules/jest-haste-map/node_modules/fsevents": { + "version": "2.3.3", + "resolved": "https://registry.npmjs.org/fsevents/-/fsevents-2.3.3.tgz", + "integrity": "sha512-5xoDfX+fL7faATnagmWPpbFtwh/R77WmMMqqHGS65C3vvB0YHrgF+B1YmZ3441tMj5n63k0212XNoJwzlhffQw==", + "dev": true, + "hasInstallScript": true, + "license": "MIT", + "optional": true, + "os": [ + "darwin" + ], + "engines": { + "node": "^8.16.0 || ^10.6.0 || >=11.0.0" + } + }, "node_modules/jest-leak-detector": { "version": "29.7.0", "resolved": "https://registry.npmjs.org/jest-leak-detector/-/jest-leak-detector-29.7.0.tgz", @@ -10405,6 +10472,13 @@ "resolved": "https://registry.npmjs.org/ms/-/ms-2.1.3.tgz", "integrity": "sha512-6FlzubTLZG3J2a/NVCAleEhjzq5oxgHyaCU9yYXvcLsvoVaHJq/s5xXI6/XXP6tz7R9xAOtHnSO/tXtF3WRTlA==" }, + "node_modules/nan": { + "version": "2.22.2", + "resolved": "https://registry.npmjs.org/nan/-/nan-2.22.2.tgz", + "integrity": "sha512-DANghxFkS1plDdRsX0X9pm0Z6SJNN6gBdtXfanwoZ8hooC5gosGFSBGRYHUVPz1asKA/kMRqDRdHrluZ61SpBQ==", + "license": "MIT", + "optional": true + }, "node_modules/nanoid": { "version": "5.1.3", "resolved": "https://registry.npmjs.org/nanoid/-/nanoid-5.1.3.tgz", diff --git a/package.json b/package.json index 50dda84ce..efcbd2d89 100644 --- a/package.json +++ b/package.json @@ -1,7 +1,7 @@ { "name": "homebrewery", "description": "Create authentic looking D&D homebrews using only markdown", - "version": "3.18.0", + "version": "3.18.1", "type": "module", "engines": { "npm": "^10.2.x", From f47a32067e6641eb9d95eb70c327b8b6a7ee2aff Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?V=C3=ADctor=20Losada=20Hern=C3=A1ndez?= Date: Tue, 18 Mar 2025 12:39:24 +0100 Subject: [PATCH 21/29] add changelog --- changelog.md | 14 ++++++++++++++ 1 file changed, 14 insertions(+) diff --git a/changelog.md b/changelog.md index 2a8ce15f4..f560ce1e5 100644 --- a/changelog.md +++ b/changelog.md @@ -88,6 +88,20 @@ pre { ## changelog For a full record of development, visit our [Github Page](https://github.com/naturalcrit/homebrewery). +### Tuesday 03/18/2025 - v3.18.1 + +{{taskList +##### G-Ambatte +* [x] Revert colon rendering from br elements to blank divs + +##### 5e-Cleric +* [x] Allow for local connections within a same network when running a local version +Fixes issue [#4094](https://github.com/naturalcrit/homebrewery/issues/4094) + +* [x] Add US Letter size page snippet +Fixes issue [#3893](https://github.com/naturalcrit/homebrewery/issues/3893) +}} + ### Monday 03/10/2025 - v3.18.0 {{taskList From ec36365697549f39d2fa3b6e6d54e3e3bf7fefee Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?V=C3=ADctor=20Losada=20Hern=C3=A1ndez?= Date: Tue, 18 Mar 2025 12:39:31 +0100 Subject: [PATCH 22/29] add letter size snippet --- themes/V3/Blank/snippets.js | 9 +++++++++ 1 file changed, 9 insertions(+) diff --git a/themes/V3/Blank/snippets.js b/themes/V3/Blank/snippets.js index e92e757cf..380daa37a 100644 --- a/themes/V3/Blank/snippets.js +++ b/themes/V3/Blank/snippets.js @@ -438,6 +438,15 @@ module.exports = [ icon : 'fas fa-print', view : 'style', snippets : [ + { + name : 'US Letter Page Size', + icon : 'far fa-file', + gen : dedent`/* US Letter Page Size */ + .page { + width : 215.9mm; /* 8.5in */ + height : 279.4mm; /* 11in */ + }\n\n`, + }, { name : 'A3 Page Size', icon : 'far fa-file', From 21be329e7751cfb82b01b061c13b9e3248cc38de Mon Sep 17 00:00:00 2001 From: "dependabot[bot]" <49699333+dependabot[bot]@users.noreply.github.com> Date: Tue, 18 Mar 2025 11:45:04 +0000 Subject: [PATCH 23/29] Bump stylelint from 16.15.0 to 16.16.0 Bumps [stylelint](https://github.com/stylelint/stylelint) from 16.15.0 to 16.16.0. - [Release notes](https://github.com/stylelint/stylelint/releases) - [Changelog](https://github.com/stylelint/stylelint/blob/main/CHANGELOG.md) - [Commits](https://github.com/stylelint/stylelint/compare/16.15.0...16.16.0) --- updated-dependencies: - dependency-name: stylelint dependency-type: direct:development update-type: version-update:semver-minor ... Signed-off-by: dependabot[bot] --- package-lock.json | 10 +++++----- package.json | 2 +- 2 files changed, 6 insertions(+), 6 deletions(-) diff --git a/package-lock.json b/package-lock.json index ce671e9b9..69cc1cade 100644 --- a/package-lock.json +++ b/package-lock.json @@ -63,7 +63,7 @@ "jest-expect-message": "^1.1.3", "jsdom-global": "^3.0.2", "postcss-less": "^6.0.0", - "stylelint": "^16.15.0", + "stylelint": "^16.16.0", "stylelint-config-recess-order": "^6.0.0", "stylelint-config-recommended": "^15.0.0", "supertest": "^7.0.0" @@ -13139,9 +13139,9 @@ "license": "ISC" }, "node_modules/stylelint": { - "version": "16.15.0", - "resolved": "https://registry.npmjs.org/stylelint/-/stylelint-16.15.0.tgz", - "integrity": "sha512-OK6Rs7EPdcdmjqiDycadZY4fw3f5/TC1X6/tGjnF3OosbwCeNs7nG+79MCAtjEg7ckwqTJTsku08e0Rmaz5nUw==", + "version": "16.16.0", + "resolved": "https://registry.npmjs.org/stylelint/-/stylelint-16.16.0.tgz", + "integrity": "sha512-40X5UOb/0CEFnZVEHyN260HlSSUxPES+arrUphOumGWgXERHfwCD0kNBVILgQSij8iliYVwlc0V7M5bcLP9vPg==", "dev": true, "funding": [ { @@ -13168,7 +13168,7 @@ "debug": "^4.3.7", "fast-glob": "^3.3.3", "fastest-levenshtein": "^1.0.16", - "file-entry-cache": "^10.0.6", + "file-entry-cache": "^10.0.7", "global-modules": "^2.0.0", "globby": "^11.1.0", "globjoin": "^0.1.4", diff --git a/package.json b/package.json index efcbd2d89..96528b786 100644 --- a/package.json +++ b/package.json @@ -137,7 +137,7 @@ "jest-expect-message": "^1.1.3", "jsdom-global": "^3.0.2", "postcss-less": "^6.0.0", - "stylelint": "^16.15.0", + "stylelint": "^16.16.0", "stylelint-config-recess-order": "^6.0.0", "stylelint-config-recommended": "^15.0.0", "supertest": "^7.0.0" From 163e3927b5a8fa087b9eb40a1650e85147a9c818 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?V=C3=ADctor=20Losada=20Hern=C3=A1ndez?= Date: Tue, 18 Mar 2025 19:38:58 +0100 Subject: [PATCH 24/29] style lint --- .../authorLookup/authorLookup.less | 2 +- .../notificationAdd/notificationAdd.less | 8 +- .../notificationLookup.less | 2 +- client/components/Anchored.less | 14 +- client/components/combobox.less | 2 +- .../homebrew/brewRenderer/brewRenderer.less | 52 +-- .../brewRenderer/headerNav/headerNav.less | 56 +-- .../notificationPopup/notificationPopup.less | 6 +- .../brewRenderer/toolBar/toolBar.less | 4 +- client/homebrew/editor/editor.less | 30 +- .../editor/metadataEditor/metadataEditor.jsx | 7 +- .../editor/metadataEditor/metadataEditor.less | 40 +- .../editor/snippetbar/snippetbar.less | 8 +- client/homebrew/homebrew.less | 30 +- client/homebrew/navbar/error-navitem.less | 138 +++--- client/homebrew/navbar/navbar.less | 18 +- .../basePages/listPage/brewItem/brewItem.less | 159 +++---- .../pages/basePages/listPage/listPage.less | 216 ++++----- .../pages/basePages/uiPage/uiPage.less | 28 +- client/homebrew/pages/editPage/editPage.less | 30 +- client/homebrew/pages/homePage/homePage.less | 38 +- client/homebrew/pages/newPage/newPage.less | 10 +- .../homebrew/pages/sharePage/sharePage.less | 10 +- client/icons/customIcons.less | 108 ++--- shared/naturalcrit/splitPane/splitPane.less | 2 +- shared/naturalcrit/styles/animations.less | 342 +++++++------- shared/naturalcrit/styles/colors.less | 80 ++-- shared/naturalcrit/styles/core.less | 28 +- shared/naturalcrit/styles/elements.less | 64 ++- shared/naturalcrit/styles/reset.less | 34 +- shared/naturalcrit/styles/tooltip.less | 75 ++- themes/Legacy/5ePHB/style.less | 312 ++++++------- themes/V3/5eDMG/style.less | 34 +- themes/V3/5ePHB/style.less | 152 +++---- themes/V3/Blank/style.less | 194 ++++---- themes/V3/Journal/style.less | 428 +++++++----------- themes/codeMirror/customEditorStyles.less | 167 ++++--- themes/fonts/5e legacy/fonts.less | 72 +-- themes/fonts/5e/fonts.less | 170 +++---- themes/fonts/Blank/fonts.less | 32 +- themes/fonts/Journal/fonts.less | 64 +-- themes/fonts/iconFonts/diceFont.less | 2 +- themes/phb.depricated.less | 20 +- 43 files changed, 1470 insertions(+), 1818 deletions(-) diff --git a/client/admin/authorUtils/authorLookup/authorLookup.less b/client/admin/authorUtils/authorLookup/authorLookup.less index 8fdd56d04..8c37e80d1 100644 --- a/client/admin/authorUtils/authorLookup/authorLookup.less +++ b/client/admin/authorUtils/authorLookup/authorLookup.less @@ -20,7 +20,7 @@ } button { - width: 50px; + width : 50px; i { margin-right : 10px; } } diff --git a/client/admin/notificationUtils/notificationAdd/notificationAdd.less b/client/admin/notificationUtils/notificationAdd/notificationAdd.less index 9256b43cb..14bdabd03 100644 --- a/client/admin/notificationUtils/notificationAdd/notificationAdd.less +++ b/client/admin/notificationUtils/notificationAdd/notificationAdd.less @@ -18,22 +18,20 @@ margin-bottom : unset; font-family : monospace; - &[type="date"] { - width:14ch; - } + &[type='date'] { width : 14ch; } } textarea { width : 50ch; min-height : 7em; max-height : 20em; - resize : vertical; padding : 10px; + resize : vertical; } } button { - width: 200px; + width : 200px; i { margin-right : 10px; } } diff --git a/client/admin/notificationUtils/notificationLookup/notificationLookup.less b/client/admin/notificationUtils/notificationLookup/notificationLookup.less index 830467368..65903213c 100644 --- a/client/admin/notificationUtils/notificationLookup/notificationLookup.less +++ b/client/admin/notificationUtils/notificationLookup/notificationLookup.less @@ -1,6 +1,6 @@ .notificationLookup { width : 450px; - height : fit-content; + height : fit-content; .noNotification { margin-block : 20px; } .notificationList { diff --git a/client/components/Anchored.less b/client/components/Anchored.less index 4f0e2fa8f..aeb9f1d5f 100644 --- a/client/components/Anchored.less +++ b/client/components/Anchored.less @@ -1,13 +1,11 @@ .anchored-box { - position:absolute; - @supports (inset-block-start: anchor(bottom)){ - inset-block-start: anchor(bottom); - } - justify-self: anchor-center; - visibility: hidden; - &.active { - visibility: visible; + position : absolute; + visibility : hidden; + justify-self : anchor-center; + @supports (inset-block-start: anchor(bottom)) { + inset-block-start : anchor(bottom); } + &.active { visibility : visible; } } \ No newline at end of file diff --git a/client/components/combobox.less b/client/components/combobox.less index d58019f6f..27f78356b 100644 --- a/client/components/combobox.less +++ b/client/components/combobox.less @@ -27,7 +27,7 @@ position : relative; padding : 5px; margin : 0 3px; - font-family : "Open Sans"; + font-family : 'Open Sans'; font-size : 11px; cursor : default; &:hover { diff --git a/client/homebrew/brewRenderer/brewRenderer.less b/client/homebrew/brewRenderer/brewRenderer.less index 68c688fb6..128c419be 100644 --- a/client/homebrew/brewRenderer/brewRenderer.less +++ b/client/homebrew/brewRenderer/brewRenderer.less @@ -1,43 +1,39 @@ @import (multiple, less) 'shared/naturalcrit/styles/reset.less'; .brewRenderer { + height : 100vh; + padding-top : 60px; overflow-y : scroll; will-change : transform; - padding-top : 60px; - height : 100vh; - &:has(.facing, .flow) { - padding : 60px 30px; - } - &.deployment { - background-color: darkred; - } + &:has(.facing, .flow) { padding : 60px 30px; } + &.deployment { background-color : darkred; } :where(.pages) { &.facing { - display: grid; - grid-template-columns: repeat(2, auto); - grid-template-rows: repeat(3, auto); - gap: 10px 10px; - justify-content: safe center; + display : grid; + grid-template-rows : repeat(3, auto); + grid-template-columns : repeat(2, auto); + gap : 10px 10px; + justify-content : safe center; &.recto .page:first-child { // sets first page on 'right' ('recto') of the preview, as if for a Cover page. // todo: add a checkbox to toggle this setting - grid-column-start: 2; + grid-column-start : 2; } & :where(.page) { - margin-left: unset !important; - margin-right: unset !important; + margin-right : unset !important; + margin-left : unset !important; } } &.flow { - display: flex; - flex-wrap: wrap; - gap: 10px; - justify-content: safe center; + display : flex; + flex-wrap : wrap; + gap : 10px; + justify-content : safe center; & :where(.page) { - flex: 0 0 auto; - margin-left: unset !important; - margin-right: unset !important; + flex : 0 0 auto; + margin-right : unset !important; + margin-left : unset !important; } } @@ -50,9 +46,7 @@ margin-left : auto; box-shadow : 1px 4px 14px #000000; } - *[id] { - scroll-margin-top:100px; - } + *[id] { scroll-margin-top : 100px; } } &::-webkit-scrollbar { width : 20px; @@ -79,11 +73,9 @@ overflow-y : unset; .pages { margin : 0px; - zoom: 100% !important; + zoom : 100% !important; & > .page { box-shadow : unset; } } } - .headerNav { - visibility: hidden; - } + .headerNav { visibility : hidden; } } \ No newline at end of file diff --git a/client/homebrew/brewRenderer/headerNav/headerNav.less b/client/homebrew/brewRenderer/headerNav/headerNav.less index a5769ef99..a5fd11f5e 100644 --- a/client/homebrew/brewRenderer/headerNav/headerNav.less +++ b/client/homebrew/brewRenderer/headerNav/headerNav.less @@ -1,39 +1,31 @@ .headerNav { - position: fixed; - top: 32px; - left: 0px; - padding: 5px 10px; - background-color: #ccc; - border-radius: 5px; - max-height: calc(100vh - 32px); - max-width: 40vw; - overflow-y: auto; - &.active { - padding-bottom: 10px; - .navIcon { - padding-bottom: 10px; - } - } - .navIcon { - cursor: pointer; + position : fixed; + top : 32px; + left : 0px; + max-width : 40vw; + max-height : calc(100vh - 32px); + padding : 5px 10px; + overflow-y : auto; + background-color : #CCCCCC; + border-radius : 5px; + &.active { + padding-bottom : 10px; + .navIcon { padding-bottom : 10px; } } + .navIcon { cursor : pointer; } li { - list-style-type: none; + list-style-type : none; a { - display: inline-block; - width: 100%; - font-family: 'Open Sans'; - font-size: 12px; - padding: 2px; - color: inherit; - text-decoration: none; - cursor: pointer; - &:hover { - text-decoration: underline; - } - &.pageLink { - font-weight: 900; - } + display : inline-block; + width : 100%; + padding : 2px; + font-family : 'Open Sans'; + font-size : 12px; + color : inherit; + text-decoration : none; + cursor : pointer; + &:hover { text-decoration : underline; } + &.pageLink { font-weight : 900; } @depths: 0,1,2,3,4,5,6,7; diff --git a/client/homebrew/brewRenderer/notificationPopup/notificationPopup.less b/client/homebrew/brewRenderer/notificationPopup/notificationPopup.less index 9e5a4a73b..85d4c8365 100644 --- a/client/homebrew/brewRenderer/notificationPopup/notificationPopup.less +++ b/client/homebrew/brewRenderer/notificationPopup/notificationPopup.less @@ -86,8 +86,8 @@ width : 100%; } .blank { - height : 1em; - margin-top: 0; - & + * { margin-top: 0; } + height : 1em; + margin-top : 0; + & + * { margin-top : 0; } } } \ No newline at end of file diff --git a/client/homebrew/brewRenderer/toolBar/toolBar.less b/client/homebrew/brewRenderer/toolBar/toolBar.less index a24731489..8f1464c8f 100644 --- a/client/homebrew/brewRenderer/toolBar/toolBar.less +++ b/client/homebrew/brewRenderer/toolBar/toolBar.less @@ -156,7 +156,7 @@ min-width : 46px; height : 100%; &:hover { background-color : #444444; } - &:focus { border : 1px solid #D3D3D3;outline : none;} + &:focus {outline : none; border : 1px solid #D3D3D3;} &:disabled { color : #777777; background-color : unset !important; @@ -182,8 +182,8 @@ position : absolute; left : 0; z-index : 5; + display : flex; width : 32px; min-width : unset; height : 100%; - display : flex; } \ No newline at end of file diff --git a/client/homebrew/editor/editor.less b/client/homebrew/editor/editor.less index b2e96683e..5511bee6e 100644 --- a/client/homebrew/editor/editor.less +++ b/client/homebrew/editor/editor.less @@ -1,8 +1,8 @@ @import 'themes/codeMirror/customEditorStyles.less'; .editor { - position : relative; - width : 100%; - container: editor / inline-size; + position : relative; + width : 100%; + container : editor / inline-size; .codeEditor { height : 100%; @@ -45,26 +45,26 @@ color : green; } .emoji:not(.cm-comment) { - margin-left : 2px; - color : #360034; - background : #ffc8ff; - border-radius : 6px; - font-weight : bold; padding-bottom : 1px; + margin-left : 2px; + font-weight : bold; + color : #360034; + outline : solid 2px #FF96FC; outline-offset : -2px; - outline : solid 2px #ff96fc; + background : #FFC8FF; + border-radius : 6px; } .superscript:not(.cm-comment) { - font-weight : bold; - color : goldenrod; - vertical-align : super; font-size : 0.9em; + font-weight : bold; + vertical-align : super; + color : goldenrod; } .subscript:not(.cm-comment) { - font-weight : bold; - color : rgb(123, 123, 15); - vertical-align : sub; font-size : 0.9em; + font-weight : bold; + vertical-align : sub; + color : rgb(123, 123, 15); } .dl-highlight { &.dl-colon-highlight { diff --git a/client/homebrew/editor/metadataEditor/metadataEditor.jsx b/client/homebrew/editor/metadataEditor/metadataEditor.jsx index 2a65d9384..0bafb3f9f 100644 --- a/client/homebrew/editor/metadataEditor/metadataEditor.jsx +++ b/client/homebrew/editor/metadataEditor/metadataEditor.jsx @@ -48,7 +48,7 @@ const MetadataEditor = createClass({ getInitialState : function(){ return { - showThumbnail : true + showThumbnail : true }; }, @@ -68,7 +68,7 @@ const MetadataEditor = createClass({ const inputRules = validations[name] ?? []; const validationErr = inputRules.map((rule)=>rule(e.target.value)).filter(Boolean); - const debouncedReportValidity = _.debounce((target, errMessage) => { + const debouncedReportValidity = _.debounce((target, errMessage)=>{ callIfExists(target, 'setCustomValidity', errMessage); callIfExists(target, 'reportValidity'); }, 300); // 300ms debounce delay, adjust as needed @@ -87,7 +87,7 @@ const MetadataEditor = createClass({ return `- ${err}`; }).join('\n'); - + debouncedReportValidity(e.target, errMessage); return false; } @@ -110,6 +110,7 @@ const MetadataEditor = createClass({ } this.props.onChange(this.props.metadata, 'renderer'); }, + handlePublish : function(val){ this.props.onChange({ ...this.props.metadata, diff --git a/client/homebrew/editor/metadataEditor/metadataEditor.less b/client/homebrew/editor/metadataEditor/metadataEditor.less index c5658a796..fd04f07d9 100644 --- a/client/homebrew/editor/metadataEditor/metadataEditor.less +++ b/client/homebrew/editor/metadataEditor/metadataEditor.less @@ -1,8 +1,8 @@ @import 'naturalcrit/styles/colors.less'; .userThemeName { - padding-left: 10px; - padding-right: 10px; + padding-right : 10px; + padding-left : 10px; } .metadataEditor { @@ -12,20 +12,20 @@ height : calc(100vh - 54px); // 54px is the height of the navbar + snippet bar. probably a better way to dynamic get this. padding : 25px; overflow-y : auto; + font-size : 13px; background-color : #999999; - font-size : 13px; h1 { - margin: 0 0 40px; - font-weight: bold; - text-transform: uppercase; + margin : 0 0 40px; + font-weight : bold; + text-transform : uppercase; } h2 { - margin : 20px 0; - font-weight : bold; - border-bottom: 2px solid gray; - color: #555; + margin : 20px 0; + font-weight : bold; + color : #555555; + border-bottom : 2px solid gray; } & > div { margin-bottom : 10px; } @@ -54,10 +54,10 @@ min-width : 200px; & > label { width : 80px; + font-size : 0.9em; font-weight : 800; line-height : 1.8em; text-transform : uppercase; - font-size: .9em; } & > .value { flex : 1 1 auto; @@ -74,7 +74,7 @@ border : 1px solid gray; &:focus { outline : 1px solid #444444; } } - &.thumbnail, &.themes{ + &.thumbnail, &.themes { label { line-height : 2.0em; } .value { overflow : hidden; @@ -90,14 +90,14 @@ } } - &.themes{ + &.themes { .value { overflow : visible; text-overflow : auto; } button { - padding-left: 5px; - padding-right: 5px; + padding-right : 5px; + padding-left : 5px; } } @@ -136,8 +136,8 @@ margin-right : 15px; font-size : 0.9em; font-weight : 800; - white-space : nowrap; vertical-align : middle; + white-space : nowrap; cursor : pointer; user-select : none; } @@ -164,9 +164,7 @@ .colorButton(@red); } } - .authors.field .value { - line-height : 1.5em; - } + .authors.field .value { line-height : 1.5em; } .themes.field { & .dropdown-container { @@ -174,9 +172,7 @@ z-index : 100; background-color : white; } - & .dropdown-options { - overflow-y : visible; - } + & .dropdown-options { overflow-y : visible; } .disabled { font-style : italic; color : dimgray; diff --git a/client/homebrew/editor/snippetbar/snippetbar.less b/client/homebrew/editor/snippetbar/snippetbar.less index 7d56dc718..0860a44bf 100644 --- a/client/homebrew/editor/snippetbar/snippetbar.less +++ b/client/homebrew/editor/snippetbar/snippetbar.less @@ -22,7 +22,7 @@ justify-content : flex-end; min-width : 225px; - &:only-child { margin-left : auto;min-width:unset;} + &:only-child {min-width : unset; margin-left : auto;} >div { display : flex; @@ -39,9 +39,7 @@ text-align : center; cursor : pointer; - &.editorTool:not(.active) { - cursor:not-allowed; - } + &.editorTool:not(.active) { cursor : not-allowed; } &:hover,&.selected { background-color : #999999; } &.text { @@ -151,9 +149,9 @@ position : absolute; top : 100%; z-index : 1000; + visibility : hidden; padding : 0px; margin-left : -5px; - visibility : hidden; background-color : #DDDDDD; .snippet { position : relative; diff --git a/client/homebrew/homebrew.less b/client/homebrew/homebrew.less index 828de796f..e265c2941 100644 --- a/client/homebrew/homebrew.less +++ b/client/homebrew/homebrew.less @@ -1,36 +1,32 @@ @import 'naturalcrit/styles/core.less'; -.homebrew{ +.homebrew { height : 100%; - .sitePage{ + .sitePage { display : flex; - height : 100%; - background-color : @steel; flex-direction : column; + height : 100%; overflow-y : hidden; - .content{ + background-color : @steel; + .content { position : relative; - height : calc(~"100% - 29px"); //Navbar height flex : auto; + height : calc(~'100% - 29px'); //Navbar height overflow-y : hidden; } &.listPage .content { overflow-y : scroll; &::-webkit-scrollbar { - width: 20px; - &:horizontal{ - height: 20px; - width:auto; + width : 20px; + &:horizontal { + width : auto; + height : 20px; } &-thumb { - background: linear-gradient(90deg, #d3c1af 15px, #00000000 15px); - &:horizontal{ - background: linear-gradient(0deg, #d3c1af 15px, #00000000 15px); - } - } - &-corner { - visibility: hidden; + background : linear-gradient(90deg, #D3C1AF 15px, #00000000 15px); + &:horizontal { background : linear-gradient(0deg, #D3C1AF 15px, #00000000 15px); } } + &-corner { visibility : hidden; } } } } diff --git a/client/homebrew/navbar/error-navitem.less b/client/homebrew/navbar/error-navitem.less index be138dca4..637ddac95 100644 --- a/client/homebrew/navbar/error-navitem.less +++ b/client/homebrew/navbar/error-navitem.less @@ -1,78 +1,70 @@ .navItem.error { - position : relative; - background-color : @red; + position : relative; + background-color : @red; } -.errorContainer{ - animation-name: glideDown; - animation-duration: 0.4s; - position : absolute; - top : 100%; - left : 50%; - z-index : 1000; - width : 140px; - padding : 3px; - color : white; - background-color : #333; - border : 3px solid #444; - border-radius : 5px; - transform : translate(-50% + 3px, 10px); - text-align : center; - font-size : 10px; - font-weight : 800; - text-transform : uppercase; - .lowercase { - text-transform : none; +.errorContainer { + position : absolute; + top : 100%; + left : 50%; + z-index : 1000; + width : 140px; + padding : 3px; + font-size : 10px; + font-weight : 800; + color : white; + text-align : center; + text-transform : uppercase; + background-color : #333333; + border : 3px solid #444444; + border-radius : 5px; + transform : translate(-50% + 3px, 10px); + animation-name : glideDown; + animation-duration : 0.4s; + .lowercase { text-transform : none; } + a { color : @teal; } + &::before { + position : absolute; + top : -23px; + left : 53px; + width : 0px; + height : 0px; + content : ''; + border-top : 10px solid transparent; + border-right : 10px solid transparent; + border-bottom : 10px solid #444444; + border-left : 10px solid transparent; + } + &::after { + position : absolute; + top : -19px; + left : 53px; + width : 0px; + height : 0px; + content : ''; + border-top : 10px solid transparent; + border-right : 10px solid transparent; + border-bottom : 10px solid #333333; + border-left : 10px solid transparent; + } + .deny { + display : inline-block; + width : 48%; + padding : 5px; + margin : 1px; + background-color : #333333; + border-left : 1px solid #666666; + .animate(background-color); + &:hover { background-color : red; } + } + .confirm { + display : inline-block; + width : 48%; + padding : 5px; + margin : 1px; + color : white; + background-color : #333333; + .animate(background-color); + &:hover { background-color : teal; } } - a{ - color : @teal; - } - &:before { - content: ""; - width: 0px; - height: 0px; - position: absolute; - border-left: 10px solid transparent; - border-right: 10px solid transparent; - border-top: 10px solid transparent; - border-bottom: 10px solid #444; - left: 53px; - top: -23px; - } - &:after { - content: ""; - width: 0px; - height: 0px; - position: absolute; - border-left: 10px solid transparent; - border-right: 10px solid transparent; - border-top: 10px solid transparent; - border-bottom: 10px solid #333; - left: 53px; - top: -19px; - } - .deny { - width : 48%; - margin : 1px; - padding : 5px; - background-color : #333; - display : inline-block; - border-left : 1px solid #666; - .animate(background-color); - &:hover{ - background-color : red; - } - } - .confirm { - width : 48%; - margin : 1px; - padding : 5px; - background-color : #333; - display : inline-block; - color : white; - .animate(background-color); - &:hover{ - background-color : teal; - } - } } diff --git a/client/homebrew/navbar/navbar.less b/client/homebrew/navbar/navbar.less index ae11c1e7e..aa233d631 100644 --- a/client/homebrew/navbar/navbar.less +++ b/client/homebrew/navbar/navbar.less @@ -24,11 +24,11 @@ } .homebrew nav { + position : relative; + z-index : 2; + display : flex; + justify-content : space-between; background-color : #333333; - position : relative; - z-index : 2; - display : flex; - justify-content : space-between; .navSection { display : flex; @@ -82,8 +82,8 @@ font-weight : 800; line-height : 13px; color : white; - text-decoration : none; text-transform : uppercase; + text-decoration : none; cursor : pointer; background-color : #333333; i { @@ -106,11 +106,11 @@ display : block; width : 100%; overflow : hidden; + text-overflow : ellipsis; font-size : 12px; font-weight : 800; color : white; text-align : center; - text-overflow : ellipsis; text-transform : initial; white-space : nowrap; background-color : transparent; @@ -170,16 +170,16 @@ h4 { box-sizing : border-box; display : block; - flex-basis : 20%; flex-grow : 1; + flex-basis : 20%; min-width : 76px; padding : 5px 0; color : #BBBBBB; text-align : center; } p { - flex-basis : 80%; flex-grow : 1; + flex-basis : 80%; padding : 5px 0; font-family : 'Open Sans', sans-serif; font-size : 10px; @@ -215,10 +215,10 @@ z-index : 10000; box-sizing : border-box; display : block; + visibility : hidden; width : 100%; padding : 13px 5px; text-align : center; - visibility : hidden; background-color : #333333; } } diff --git a/client/homebrew/pages/basePages/listPage/brewItem/brewItem.less b/client/homebrew/pages/basePages/listPage/brewItem/brewItem.less index a3c17215e..0d45e8537 100644 --- a/client/homebrew/pages/basePages/listPage/brewItem/brewItem.less +++ b/client/homebrew/pages/basePages/listPage/brewItem/brewItem.less @@ -1,148 +1,129 @@ -.brewItem{ +.brewItem { position : relative; + box-sizing : border-box; display : inline-block; - vertical-align : top; - box-sizing : border-box; - box-sizing : border-box; - overflow : hidden; width : 48%; min-height : 105px; - margin-right : 15px; - margin-bottom : 15px; padding : 5px 15px 2px 6px; padding-right : 15px; - border : 1px solid #c9ad6a; + margin-right : 15px; + margin-bottom : 15px; + overflow : hidden; + vertical-align : top; + background-color : #CAB2802E; + border : 1px solid #C9AD6A; border-radius : 5px; + box-shadow : 0px 4px 5px 0px #333333; + break-inside : avoid; -webkit-column-break-inside : avoid; page-break-inside : avoid; - break-inside : avoid; - box-shadow : 0px 4px 5px 0px #333; - background-color : #cab2802e; - .thumbnail { - position: absolute; - width: 150px; - height: 100%; - top: 0; - right: 0; - z-index: -1; - background-size: contain; - background-repeat: no-repeat; - background-position: right top; - mask-image: linear-gradient(80deg, #0000 20%, #050 40%); - -webkit-mask-image: linear-gradient(80deg, #0000 20%, #050 40%); - opacity: 50%; + .thumbnail { + position : absolute; + top : 0; + right : 0; + z-index : -1; + width : 150px; + height : 100%; + background-repeat : no-repeat; + background-position : right top; + background-size : contain; + opacity : 50%; + -webkit-mask-image : linear-gradient(80deg, #00000000 20%, #005500 40%); + mask-image : linear-gradient(80deg, #00000000 20%, #005500 40%); } .text { min-height : 54px; - h4{ + h4 { margin-bottom : 5px; font-size : 2.2em; } } - .info{ - position: initial; - bottom: 2px; - font-family : ScalySansRemake; + .info { + position : initial; + bottom : 2px; + font-family : "ScalySansRemake"; font-size : 1.2em; - &>span{ + & > span { margin-right : 12px; line-height : 1.5em; - a { - color:inherit; - } + a { color : inherit; } } } .brewTags span { - background-color: #c8ac6e3b; - margin: 2px; - padding: 2px; - border: 1px solid #c8ac6e; - border-radius: 4px; - white-space: nowrap; - display: inline-block; - font-weight: bold; - border-color: currentColor; - cursor : pointer; - &:before { - font-family: 'Font Awesome 5 Free'; - font-size: 12px; - margin-right: 3px; + display : inline-block; + padding : 2px; + margin : 2px; + font-weight : bold; + white-space : nowrap; + cursor : pointer; + background-color : #C8AC6E3B; + border : 1px solid #C8AC6E; + border-color : currentColor; + border-radius : 4px; + &::before { + margin-right : 3px; + font-family : 'Font Awesome 5 Free'; + font-size : 12px; } &.type { - background-color: #0080003b; - color: #008000; - &:before{ - content: '\f0ad'; - } + color : #008000; + background-color : #0080003B; + &::before { content : '\f0ad'; } } &.group { - background-color: #5050503b; - color: #000000; - &:before{ - content: '\f500'; - } + color : #000000; + background-color : #5050503B; + &::before { content : '\f500'; } } &.meta { - background-color: #0000803b; - color: #000080; - &:before{ - content: '\f05a'; - } + color : #000080; + background-color : #0000803B; + &::before { content : '\f05a'; } } &.system { - background-color: #8000003b; - color: #800000; - &:before{ - content: '\f518'; - } + color : #800000; + background-color : #8000003B; + &::before { content : '\f518'; } } } - &:hover{ - .links{ - opacity : 1; - } + &:hover { + .links { opacity : 1; } } - &:nth-child(2n + 1){ - margin-right : 0px; - } - .links{ + &:nth-child(2n + 1) { margin-right : 0px; } + .links { .animate(opacity); position : absolute; top : 0px; right : 0px; - height : 100%; width : 2em; - opacity : 0; - background-color : fade(black, 60%); + height : 100%; text-align : center; - a{ + background-color : fade(black, 60%); + opacity : 0; + a { .animate(opacity); display : block; margin : 8px 0px; - opacity : 0.6; font-size : 1.3em; color : white; text-decoration : unset; - &:hover{ - opacity : 1; - } - i{ - cursor : pointer; - } + opacity : 0.6; + &:hover { opacity : 1; } + i { cursor : pointer; } } } .googleDriveIcon { - height : 18px; + height : 18px; padding : 0px; margin : -5px; } .homebreweryIcon { - mix-blend-mode : darken; - height : 24px; position : relative; top : 5px; left : -5px; + height : 24px; + mix-blend-mode : darken; } } diff --git a/client/homebrew/pages/basePages/listPage/listPage.less b/client/homebrew/pages/basePages/listPage/listPage.less index 0aa4a278d..bf899bc71 100644 --- a/client/homebrew/pages/basePages/listPage/listPage.less +++ b/client/homebrew/pages/basePages/listPage/listPage.less @@ -1,5 +1,5 @@ -.noColumns(){ +.noColumns() { column-count : auto; column-fill : auto; column-gap : normal; @@ -13,177 +13,151 @@ height : auto; min-height : 279.4mm; margin : 20px auto; - contain : unset; + contain : unset; } -.listPage{ - .content{ +.listPage { + .content { z-index : 1; - .page{ + .page { .noColumns() !important; //Needed to override PHB Theme since this is on a lower @layer - &::after{ - display : none; - } - .noBrews{ + &::after { display : none; } + .noBrews { margin : 10px 0px; font-size : 1.3em; font-style : italic; } .brewCollection { - h1:hover{ - cursor: pointer; - } + h1:hover { cursor : pointer; } .active::before, .inactive::before { - font-family: 'Font Awesome 5 Free'; - font-weight: 900; - font-size: 0.6cm; - padding-right: 0.5em; - } - .active { - color: var(--HB_Color_HeaderText); - } - .active::before { - content: '\f107'; - } - .inactive { - color: #707070; - } - .inactive::before { - content: '\f105'; + padding-right : 0.5em; + font-family : 'Font Awesome 5 Free'; + font-size : 0.6cm; + font-weight : 900; } + .active { color : var(--HB_Color_HeaderText); } + .active::before { content : '\f107'; } + .inactive { color : #707070; } + .inactive::before { content : '\f105'; } } } } .sort-container { - font-family : 'Open Sans', sans-serif; - position : sticky; - top : 0; - left : 0; - width : 100%; - height : 30px; - background-color : #555; - border-top : 1px solid #666; - border-bottom : 1px solid #666; - color : white; - text-align : center; - z-index : 1; - display : flex; - justify-content : center; - align-items : baseline; - column-gap : 15px; - row-gap : 5px; - flex-wrap : wrap; - h6{ - text-transform : uppercase; + position : sticky; + top : 0; + left : 0; + z-index : 1; + display : flex; + flex-wrap : wrap; + row-gap : 5px; + column-gap : 15px; + align-items : baseline; + justify-content : center; + width : 100%; + height : 30px; + font-family : 'Open Sans', sans-serif; + color : white; + text-align : center; + background-color : #555555; + border-top : 1px solid #666666; + border-bottom : 1px solid #666666; + h6 { font-family : 'Open Sans', sans-serif; font-size : 11px; font-weight : bold; + text-transform : uppercase; } .sort-option { - display: flex; - align-items: center; - padding: 0 8px; - color: #ccc; - height: 100%; + display : flex; + align-items : center; + height : 100%; + padding : 0 8px; + color : #CCCCCC; - &:hover{ - background-color : #444; - } + &:hover { background-color : #444444; } &.active { - font-weight: bold; - color: #ddd; - background-color: #333; + font-weight : bold; + color : #DDDDDD; + background-color : #333333; - button { - color: white; - font-weight: 800; - height: 100%; - & + .sortDir { - padding-left: 5px; + button { + height : 100%; + font-weight : 800; + color : white; + & + .sortDir { padding-left : 5px; } } } - } } .filter-option { - margin-left: 20px; - background-color : transparent !important; + margin-left : 20px; font-size : 11px; - i{ - padding-right : 5px; - } + background-color : transparent !important; + i { padding-right : 5px; } + } + button { + padding : 0; + font-family : 'Open Sans', sans-serif; + font-size : 11px; + font-weight : normal; + color : #CCCCCC; + text-transform : uppercase; + background-color : transparent; } - button{ - background-color : transparent; - font-family : 'Open Sans', sans-serif; - text-transform : uppercase; - font-weight : normal; - font-size : 11px; - color : #ccc; - padding : 0; - } } .tags-container { - height : 30px; - background-color : #555; - border-top : 1px solid #666; - border-bottom : 1px solid #666; - color : white; display : flex; - justify-content : center; - align-items : center; - column-gap : 15px; - row-gap : 5px; flex-wrap : wrap; + row-gap : 5px; + column-gap : 15px; + align-items : center; + justify-content : center; + height : 30px; + color : white; + background-color : #555555; + border-top : 1px solid #666666; + border-bottom : 1px solid #666666; span { + padding : 3px; font-family : 'Open Sans', sans-serif; font-size : 11px; font-weight : bold; + color : #DFDFDF; + cursor : pointer; border : 1px solid; border-radius : 3px; - padding : 3px; - cursor : pointer; - color: #dfdfdf; - &:before { - font-family: 'Font Awesome 5 Free'; - font-size: 12px; - margin-right: 3px; + &::before { + margin-right : 3px; + font-family : 'Font Awesome 5 Free'; + font-size : 12px; } - &:after { - content: '\f00d'; - font-family: 'Font Awesome 5 Free'; - font-size: 12px; - margin-left: 3px; + &::after { + margin-left : 3px; + font-family : 'Font Awesome 5 Free'; + font-size : 12px; + content : '\f00d'; } &.type { - background-color: #008000; - border-color: #00a000; - &:before{ - content: '\f0ad'; - } + background-color : #008000; + border-color : #00A000; + &::before { content : '\f0ad'; } } &.group { - background-color: #505050; - border-color: #000000; - &:before{ - content: '\f500'; - } + background-color : #505050; + border-color : #000000; + &::before { content : '\f500'; } } &.meta { - background-color: #000080; - border-color: #0000a0; - &:before{ - content: '\f05a'; - } + background-color : #000080; + border-color : #0000A0; + &::before { content : '\f05a'; } } &.system { - background-color: #800000; - border-color: #a00000; - &:before{ - content: '\f518'; - } + background-color : #800000; + border-color : #A00000; + &::before { content : '\f518'; } } } } diff --git a/client/homebrew/pages/basePages/uiPage/uiPage.less b/client/homebrew/pages/basePages/uiPage/uiPage.less index e1013fa81..27f079e20 100644 --- a/client/homebrew/pages/basePages/uiPage/uiPage.less +++ b/client/homebrew/pages/basePages/uiPage/uiPage.less @@ -1,7 +1,7 @@ .homebrew { .uiPage.sitePage { .content { - width : ~"min(90vw, 1000px)"; + width : ~'min(90vw, 1000px)'; padding : 2% 4%; margin-top : 25px; margin-right : auto; @@ -17,19 +17,19 @@ border : 2px solid black; border-radius : 5px; button { + width : 125px; + margin-right : 5px; + color : black; background-color : transparent; border : 1px solid black; border-radius : 5px; - width : 125px; - color : black; - margin-right : 5px; &.active { - background-color: #0007; - color: white; - &:before { - content: '\f00c'; - font-family: 'FONT AWESOME 5 FREE'; - margin-right: 5px; + color : white; + background-color : #00000077; + &::before { + margin-right : 5px; + font-family : 'FONT AWESOME 5 FREE'; + content : '\f00c'; } } } @@ -60,11 +60,9 @@ list-style : square; } .blank { - height: 1em; - margin-top: 0; - & + * { - margin-top: 0; - } + height : 1em; + margin-top : 0; + & + * { margin-top : 0; } } } } diff --git a/client/homebrew/pages/editPage/editPage.less b/client/homebrew/pages/editPage/editPage.less index f94b60c1b..184aaa1f7 100644 --- a/client/homebrew/pages/editPage/editPage.less +++ b/client/homebrew/pages/editPage/editPage.less @@ -1,29 +1,25 @@ @keyframes glideDown { - 0% {transform : translate(-50% + 3px, 0px); - opacity : 0;} - 100% {transform : translate(-50% + 3px, 10px); - opacity : 1;} + 0% { + opacity : 0;transform : translate(-50% + 3px, 0px);} + 100% { + opacity : 1;transform : translate(-50% + 3px, 10px);} } -.editPage{ - .navItem.save{ +.editPage { + .navItem.save { + position : relative; width : 106px; text-align : center; - position : relative; - &.saved{ + &.saved { + color : #666666; cursor : initial; - color : #666; } } - .googleDriveStorage { - position : relative; - } - .googleDriveStorage img{ - height : 18px; + .googleDriveStorage { position : relative; } + .googleDriveStorage img { + height : 18px; padding : 0px; margin : -5px; - &.inactive { - filter: grayscale(1); - } + &.inactive { filter : grayscale(1); } } } diff --git a/client/homebrew/pages/homePage/homePage.less b/client/homebrew/pages/homePage/homePage.less index a7523bd3c..4cf9ff4fe 100644 --- a/client/homebrew/pages/homePage/homePage.less +++ b/client/homebrew/pages/homePage/homePage.less @@ -1,50 +1,40 @@ -.homePage{ +.homePage { position : relative; - a.floatingNewButton{ + a.floatingNewButton { .animate(background-color); position : absolute; - display : block; right : 70px; bottom : 50px; - z-index : 100; z-index : 5001; + display : block; padding : 1em; - background-color : @orange; font-size : 1.5em; color : white; text-decoration : none; + background-color : @orange; box-shadow : 3px 3px 15px black; - &:hover{ - background-color : darken(@orange, 20%); - } + &:hover { background-color : darken(@orange, 20%); } } - .floatingSaveButton{ + .floatingSaveButton { .animateAll(); position : absolute; - display : block; right : 200px; bottom : 70px; - z-index : 100; z-index : 5000; + display : block; padding : 0.8em; - cursor : pointer; - background-color : @blue; font-size : 0.8em; color : white; text-decoration : none; + cursor : pointer; + background-color : @blue; box-shadow : 3px 3px 15px black; - &:hover{ - background-color : darken(@blue, 20%); - } - &.show{ - right : 350px; - } + &:hover { background-color : darken(@blue, 20%); } + &.show { right : 350px; } } - .navItem.save{ - background-color: @orange; - &:hover{ - background-color: @green; - } + .navItem.save { + background-color : @orange; + &:hover { background-color : @green; } } } diff --git a/client/homebrew/pages/newPage/newPage.less b/client/homebrew/pages/newPage/newPage.less index f83827ffb..ebc44d543 100644 --- a/client/homebrew/pages/newPage/newPage.less +++ b/client/homebrew/pages/newPage/newPage.less @@ -1,8 +1,6 @@ -.newPage{ - .navItem.save{ - background-color: @orange; - &:hover{ - background-color: @green; - } +.newPage { + .navItem.save { + background-color : @orange; + &:hover { background-color : @green; } } } diff --git a/client/homebrew/pages/sharePage/sharePage.less b/client/homebrew/pages/sharePage/sharePage.less index 754108506..b76dc50f9 100644 --- a/client/homebrew/pages/sharePage/sharePage.less +++ b/client/homebrew/pages/sharePage/sharePage.less @@ -1,9 +1,7 @@ -.sharePage{ +.sharePage { nav .navSection.titleSection { - flex-grow: 1; - justify-content: center; - } - .content{ - overflow-y : hidden; + flex-grow : 1; + justify-content : center; } + .content { overflow-y : hidden; } } diff --git a/client/icons/customIcons.less b/client/icons/customIcons.less index 1c8d1bd47..a2caffc57 100644 --- a/client/icons/customIcons.less +++ b/client/icons/customIcons.less @@ -1,84 +1,34 @@ .fac { display : inline-block; - background-color : currentColor; - mask-size : contain; - mask-repeat : no-repeat; - mask-position : center; width : 1em; aspect-ratio : 1; + background-color : currentColor; + mask-repeat : no-repeat; + mask-position : center; + mask-size : contain; } -.position-top-left { - mask-image: url('../icons/position-top-left.svg'); -} -.position-top-right { - mask-image: url('../icons/position-top-right.svg'); -} -.position-bottom-left { - mask-image: url('../icons/position-bottom-left.svg'); -} -.position-bottom-right { - mask-image: url('../icons/position-bottom-right.svg'); -} -.position-top { - mask-image: url('../icons/position-top.svg'); -} -.position-right { - mask-image: url('../icons/position-right.svg'); -} -.position-bottom { - mask-image: url('../icons/position-bottom.svg'); -} -.position-left { - mask-image: url('../icons/position-left.svg'); -} -.mask-edge { - mask-image: url('../icons/mask-edge.svg'); -} -.mask-corner { - mask-image: url('../icons/mask-corner.svg'); -} -.mask-center { - mask-image: url('../icons/mask-center.svg'); -} -.book-front-cover { - mask-image: url('../icons/book-front-cover.svg'); -} -.book-back-cover { - mask-image: url('../icons/book-back-cover.svg'); -} -.book-inside-cover { - mask-image: url('../icons/book-inside-cover.svg'); -} -.book-part-cover { - mask-image: url('../icons/book-part-cover.svg'); -} -.image-wrap-left { - mask-image: url('../icons/image-wrap-left.svg'); -} -.image-wrap-right { - mask-image: url('../icons/image-wrap-right.svg'); -} -.davek { - mask-image: url('../icons/Davek.svg'); -} -.rellanic { - mask-image: url('../icons/Rellanic.svg'); -} -.iokharic { - mask-image: url('../icons/Iokharic.svg'); -} -.zoom-to-fit { - mask-image: url('../icons/zoom-to-fit.svg'); -} -.fit-width { - mask-image: url('../icons/fit-width.svg'); -} -.single-spread { - mask-image: url('../icons/single-spread.svg'); -} -.facing-spread { - mask-image: url('../icons/facing-spread.svg'); -} -.flow-spread { - mask-image: url('../icons/flow-spread.svg'); -} +.position-top-left { mask-image : url('../icons/position-top-left.svg'); } +.position-top-right { mask-image : url('../icons/position-top-right.svg'); } +.position-bottom-left { mask-image : url('../icons/position-bottom-left.svg'); } +.position-bottom-right { mask-image : url('../icons/position-bottom-right.svg'); } +.position-top { mask-image : url('../icons/position-top.svg'); } +.position-right { mask-image : url('../icons/position-right.svg'); } +.position-bottom { mask-image : url('../icons/position-bottom.svg'); } +.position-left { mask-image : url('../icons/position-left.svg'); } +.mask-edge { mask-image : url('../icons/mask-edge.svg'); } +.mask-corner { mask-image : url('../icons/mask-corner.svg'); } +.mask-center { mask-image : url('../icons/mask-center.svg'); } +.book-front-cover { mask-image : url('../icons/book-front-cover.svg'); } +.book-back-cover { mask-image : url('../icons/book-back-cover.svg'); } +.book-inside-cover { mask-image : url('../icons/book-inside-cover.svg'); } +.book-part-cover { mask-image : url('../icons/book-part-cover.svg'); } +.image-wrap-left { mask-image : url('../icons/image-wrap-left.svg'); } +.image-wrap-right { mask-image : url('../icons/image-wrap-right.svg'); } +.davek { mask-image : url('../icons/Davek.svg'); } +.rellanic { mask-image : url('../icons/Rellanic.svg'); } +.iokharic { mask-image : url('../icons/Iokharic.svg'); } +.zoom-to-fit { mask-image : url('../icons/zoom-to-fit.svg'); } +.fit-width { mask-image : url('../icons/fit-width.svg'); } +.single-spread { mask-image : url('../icons/single-spread.svg'); } +.facing-spread { mask-image : url('../icons/facing-spread.svg'); } +.flow-spread { mask-image : url('../icons/flow-spread.svg'); } diff --git a/shared/naturalcrit/splitPane/splitPane.less b/shared/naturalcrit/splitPane/splitPane.less index 8b61097be..80a8695af 100644 --- a/shared/naturalcrit/splitPane/splitPane.less +++ b/shared/naturalcrit/splitPane/splitPane.less @@ -21,8 +21,8 @@ background-color : #BBBBBB; .dots { display : table-cell; - text-align : center; vertical-align : middle; + text-align : center; i { display : block !important; margin : 10px 0px; diff --git a/shared/naturalcrit/styles/animations.less b/shared/naturalcrit/styles/animations.less index 69aac3e09..5757df151 100644 --- a/shared/naturalcrit/styles/animations.less +++ b/shared/naturalcrit/styles/animations.less @@ -3,127 +3,127 @@ @defaultEasing : ease; //Animates all properties on an element -.animateAll(@duration : @defaultDuration, @easing : @defaultEasing){ - -webkit-transition: all @duration @easing; - -moz-transition: all @duration @easing; - -o-transition: all @duration @easing; - transition: all @duration @easing; +.animateAll(@duration : @defaultDuration, @easing : @defaultEasing) { + -webkit-transition : all @duration @easing; + -moz-transition : all @duration @easing; + -o-transition : all @duration @easing; + transition : all @duration @easing; } //Animates Specific property -.animate(@prop, @duration : @defaultDuration, @easing : @defaultEasing){ - -webkit-transition: @prop @duration @easing; - -moz-transition: @prop @duration @easing; - -o-transition: @prop @duration @easing; - transition: @prop @duration @easing; +.animate(@prop, @duration : @defaultDuration, @easing : @defaultEasing) { + -webkit-transition : @prop @duration @easing; + -moz-transition : @prop @duration @easing; + -o-transition : @prop @duration @easing; + transition : @prop @duration @easing; } -.animateMany(...){ +.animateMany(...) { @value: ~`"@{arguments}".replace(/[\[\]]|\,\sX/g, '')`; - -webkit-transition-property: @value; - -moz-transition-property: @value; - -o-transition-property: @value; - transition-property: @value; + -webkit-transition-property : @value; + -moz-transition-property : @value; + -o-transition-property : @value; + transition-property : @value; .animateDuration(); .animateEasing(); } -.animateDuration(@duration : @defaultDuration){ - -webkit-transition-duration: @duration; - -moz-transition-duration: @duration; - -o-transition-duration: @duration; - transition-duration: @duration; +.animateDuration(@duration : @defaultDuration) { + -webkit-transition-duration : @duration; + -moz-transition-duration : @duration; + -o-transition-duration : @duration; + transition-duration : @duration; } -.animateEasing(@easing : @defaultEasing){ - -webkit-transition-timing-function: @easing; - -moz-transition-timing-function: @easing; - -o-transition-timing-function: @easing; - transition-timing-function: @easing; +.animateEasing(@easing : @defaultEasing) { + -webkit-transition-timing-function : @easing; + -moz-transition-timing-function : @easing; + -o-transition-timing-function : @easing; + transition-timing-function : @easing; } .transition (@prop, @duration: @defaultDuration) { - -webkit-transition: @prop @duration, -webkit-transform @duration; - -moz-transition: @prop @duration, -moz-transform @duration; - -o-transition: @prop @duration, -o-transform @duration; - -ms-transition: @prop @duration, -ms-transform @duration; - transition: @prop @duration, transform @duration; + -webkit-transition : @prop @duration, -webkit-transform @duration; + -moz-transition : @prop @duration, -moz-transform @duration; + -o-transition : @prop @duration, -o-transform @duration; + -ms-transition : @prop @duration, -ms-transform @duration; + transition : @prop @duration, transform @duration; } .transform (@transform) { - -webkit-transform: @transform; - -moz-transform: @transform; - -o-transform: @transform; - -ms-transform: @transform; - transform: @transform; + -webkit-transform : @transform; + -moz-transform : @transform; + -o-transform : @transform; + -ms-transform : @transform; + transform : @transform; } -.delay(@delay){ - animation-delay:@delay; - -webkit-animation-delay:@delay; - transition-delay:@delay; - -webkit-transition-delay:@delay; +.delay(@delay) { + -webkit-transition-delay : @delay; + transition-delay : @delay; + -webkit-animation-delay : @delay; + animation-delay : @delay; } -.keep(){ - -webkit-animation-fill-mode:forwards; - -moz-animation-fill-mode:forwards; - -ms-animation-fill-mode:forwards; - -o-animation-fill-mode:forwards; - animation-fill-mode:forwards; +.keep() { + -webkit-animation-fill-mode : forwards; + -moz-animation-fill-mode : forwards; + -ms-animation-fill-mode : forwards; + -o-animation-fill-mode : forwards; + animation-fill-mode : forwards; } -.sequentialDelay(@delayInc : 0.2s, @initialDelay : 0s){ - &:nth-child(1){.delay(0*@delayInc + @initialDelay)} - &:nth-child(2){.delay(1*@delayInc + @initialDelay)} - &:nth-child(3){.delay(2*@delayInc + @initialDelay)} - &:nth-child(4){.delay(3*@delayInc + @initialDelay)} - &:nth-child(5){.delay(4*@delayInc + @initialDelay)} - &:nth-child(6){.delay(5*@delayInc + @initialDelay)} - &:nth-child(7){.delay(6*@delayInc + @initialDelay)} - &:nth-child(8){.delay(7*@delayInc + @initialDelay)} - &:nth-child(9){.delay(8*@delayInc + @initialDelay)} - &:nth-child(10){.delay(9*@delayInc + @initialDelay)} - &:nth-child(11){.delay(10*@delayInc + @initialDelay)} - &:nth-child(12){.delay(11*@delayInc + @initialDelay)} - &:nth-child(13){.delay(12*@delayInc + @initialDelay)} - &:nth-child(14){.delay(13*@delayInc + @initialDelay)} - &:nth-child(15){.delay(14*@delayInc + @initialDelay)} - &:nth-child(16){.delay(15*@delayInc + @initialDelay)} - &:nth-child(17){.delay(16*@delayInc + @initialDelay)} - &:nth-child(18){.delay(17*@delayInc + @initialDelay)} - &:nth-child(19){.delay(18*@delayInc + @initialDelay)} - &:nth-child(20){.delay(19*@delayInc + @initialDelay)} +.sequentialDelay(@delayInc : 0.2s, @initialDelay : 0s) { + &:nth-child(1) {.delay(0*@delayInc + @initialDelay); } + &:nth-child(2) {.delay(1*@delayInc + @initialDelay); } + &:nth-child(3) {.delay(2*@delayInc + @initialDelay); } + &:nth-child(4) {.delay(3*@delayInc + @initialDelay); } + &:nth-child(5) {.delay(4*@delayInc + @initialDelay); } + &:nth-child(6) {.delay(5*@delayInc + @initialDelay); } + &:nth-child(7) {.delay(6*@delayInc + @initialDelay); } + &:nth-child(8) {.delay(7*@delayInc + @initialDelay); } + &:nth-child(9) {.delay(8*@delayInc + @initialDelay); } + &:nth-child(10) {.delay(9*@delayInc + @initialDelay); } + &:nth-child(11) {.delay(10*@delayInc + @initialDelay); } + &:nth-child(12) {.delay(11*@delayInc + @initialDelay); } + &:nth-child(13) {.delay(12*@delayInc + @initialDelay); } + &:nth-child(14) {.delay(13*@delayInc + @initialDelay); } + &:nth-child(15) {.delay(14*@delayInc + @initialDelay); } + &:nth-child(16) {.delay(15*@delayInc + @initialDelay); } + &:nth-child(17) {.delay(16*@delayInc + @initialDelay); } + &:nth-child(18) {.delay(17*@delayInc + @initialDelay); } + &:nth-child(19) {.delay(18*@delayInc + @initialDelay); } + &:nth-child(20) {.delay(19*@delayInc + @initialDelay); } } -.createFrames(@name, @from, @to){ +.createFrames(@name, @from, @to) { @frames: { from { @from(); } to { @to(); } }; - @-webkit-keyframes @name {@frames();} - @-moz-keyframes @name {@frames();} - @-ms-keyframes @name {@frames();} - @-o-keyframes @name {@frames();} - @keyframes @name {@frames();} + @-webkit-keyframes @name {@frames();} + @-moz-keyframes @name {@frames();} + @-ms-keyframes @name {@frames();} + @-o-keyframes @name {@frames();} + @keyframes @name {@frames();} } -.createAnimation(@name, @duration : @defaultDuration, @easing : @defaultEasing){ - -webkit-animation-name: @name; - -moz-animation-name: @name; - -ms-animation-name: @name; - animation-name: @name; - -webkit-animation-duration: @duration; - -moz-animation-duration: @duration; - -ms-animation-duration: @duration; - animation-duration: @duration; - -webkit-animation-timing-function: @easing; - -moz-animation-timing-function: @easing; - -ms-animation-timing-function: @easing; - animation-timing-function: @easing; +.createAnimation(@name, @duration : @defaultDuration, @easing : @defaultEasing) { + -webkit-animation-name : @name; + -moz-animation-name : @name; + -ms-animation-name : @name; + animation-name : @name; + -webkit-animation-duration : @duration; + -moz-animation-duration : @duration; + -ms-animation-duration : @duration; + animation-duration : @duration; + -webkit-animation-timing-function : @easing; + -moz-animation-timing-function : @easing; + -ms-animation-timing-function : @easing; + animation-timing-function : @easing; } @@ -132,82 +132,82 @@ Standard Animations ****************************/ -.fadeIn(@duration : @defaultDuration, @easing : @defaultEasing){ +.fadeIn(@duration : @defaultDuration, @easing : @defaultEasing) { .createAnimation(fadeIn; @duration; @easing); .createFrames(fadeIn, - { opacity : 0; }, + { opacity : 0; }, { opacity : 1; } ); } -.fadeInDown(@duration : @defaultDuration, @easing : @defaultEasing){ +.fadeInDown(@duration : @defaultDuration, @easing : @defaultEasing) { .createAnimation(fadeInDown; @duration; @easing); .createFrames(fadeInDown, - { opacity : 0; .transform(translateY(20px));}, + { opacity : 0; .transform(translateY(20px));}, { opacity : 1; .transform(translateY(0px));} ); } -.fadeInTop(@duration : @defaultDuration, @easing : @defaultEasing){ +.fadeInTop(@duration : @defaultDuration, @easing : @defaultEasing) { .createAnimation(fadeInTop; @duration; @easing); .createFrames(fadeInTop, - { opacity : 0; .transform(translateY(-20px)); }, + { opacity : 0; .transform(translateY(-20px)); }, { opacity : 1; .transform(translateY(0px));} ); } -.fadeInLeft(@duration : @defaultDuration, @easing : @defaultEasing){ +.fadeInLeft(@duration : @defaultDuration, @easing : @defaultEasing) { .createAnimation(fadeInLeft; @duration; @easing); .createFrames(fadeInLeft, - { opacity: 0; .transform(translateX(-20px));}, + { opacity: 0; .transform(translateX(-20px));}, { opacity: 1; .transform(translateX(0));} ); } -.fadeInRight(@duration : @defaultDuration, @easing : @defaultEasing){ +.fadeInRight(@duration : @defaultDuration, @easing : @defaultEasing) { .createAnimation(fadeInRight; @duration; @easing); .createFrames(fadeInRight, - { opacity: 0; .transform(translateX(20px));}, + { opacity: 0; .transform(translateX(20px));}, { opacity: 1; .transform(translateX(0));} ); } -.fadeOut(@duration : @defaultDuration, @easing : @defaultEasing){ +.fadeOut(@duration : @defaultDuration, @easing : @defaultEasing) { .createAnimation(fadeOut; @duration; @easing); .createFrames(fadeOut, - { opacity : 1; }, + { opacity : 1; }, { opacity : 0; } ); } -.fadeOutDown(@duration : @defaultDuration, @easing : @defaultEasing){ +.fadeOutDown(@duration : @defaultDuration, @easing : @defaultEasing) { .createAnimation(fadeOutDown; @duration; @easing); .createFrames(fadeOutDown, - { opacity : 1; .transform(translateY(0)); visibility: visible;}, + { opacity : 1; .transform(translateY(0)); visibility: visible;}, { opacity : 0; .transform(translateY(20px)); visibility: hidden;} ); } -.fadeOutTop(@duration : @defaultDuration, @easing : @defaultEasing){ +.fadeOutTop(@duration : @defaultDuration, @easing : @defaultEasing) { .createAnimation(fadeOutTop; @duration; @easing); .createFrames(fadeOutTop, - { opacity : 1; .transform(translateY(0)); }, + { opacity : 1; .transform(translateY(0)); }, { opacity : 0; .transform(translateY(-20px)); } ); } -.fadeOutLeft(@duration : @defaultDuration, @easing : @defaultEasing){ +.fadeOutLeft(@duration : @defaultDuration, @easing : @defaultEasing) { .createAnimation(fadeOutLeft; @duration; @easing); .createFrames(fadeOutLeft, - { opacity : 1; .transform(translateX(0));}, + { opacity : 1; .transform(translateX(0));}, { opacity : 0; .transform(translateX(-20px));} ); } -.fadeOutRight(@duration : @defaultDuration, @easing : @defaultEasing){ +.fadeOutRight(@duration : @defaultDuration, @easing : @defaultEasing) { .createAnimation(fadeOutRight; @duration; @easing); .createFrames(fadeOutRight, - { opacity : 1; .transform(translateX(0));}, + { opacity : 1; .transform(translateX(0));}, { opacity : 0; .transform(translateX(20px));} ); } @@ -219,50 +219,50 @@ Fun Animations ****************************/ -.spin(@duration : @defaultDuration, @easing : @defaultEasing){ +.spin(@duration : @defaultDuration, @easing : @defaultEasing) { .createAnimation(spin, @duration, @easing); - .spinKeyFrames(){ + .spinKeyFrames() { from { .transform(rotate(0deg)); } - to { .transform(rotate(360deg)); } + to { .transform(rotate(360deg)); } } @-webkit-keyframes spin {.spinKeyFrames();} - @-moz-keyframes spin {.spinKeyFrames();} - @-ms-keyframes spin {.spinKeyFrames();} - @-o-keyframes spin {.spinKeyFrames();} - @keyframes spin {.spinKeyFrames();} + @-moz-keyframes spin {.spinKeyFrames();} + @-ms-keyframes spin {.spinKeyFrames();} + @-o-keyframes spin {.spinKeyFrames();} + @keyframes spin {.spinKeyFrames();} } -.bounce(@duration : @defaultDuration, @easing : @defaultEasing){ +.bounce(@duration : @defaultDuration, @easing : @defaultEasing) { .createAnimation(bounce, @duration, @easing); - .bounceKeyFrames(){ + .bounceKeyFrames() { 0%, 20%, 50%, 80%, 100% { .transform(translateY(0));} 40% { .transform(translateY(-30px));} 60% { .transform(translateY(-15px));} } @-webkit-keyframes bounce {.bounceKeyFrames();} - @-moz-keyframes bounce {.bounceKeyFrames();} - @-ms-keyframes bounce {.bounceKeyFrames();} - @-o-keyframes bounce {.bounceKeyFrames();} - @keyframes bounce {.bounceKeyFrames();} + @-moz-keyframes bounce {.bounceKeyFrames();} + @-ms-keyframes bounce {.bounceKeyFrames();} + @-o-keyframes bounce {.bounceKeyFrames();} + @keyframes bounce {.bounceKeyFrames();} } -.pulse(@duration : @defaultDuration, @easing : @defaultEasing){ +.pulse(@duration : @defaultDuration, @easing : @defaultEasing) { .createAnimation(pulse, @duration, @easing); - .pulseKeyFrames(){ - 0% { .transform(scale(1));} - 50% { .transform(scale(1.4));} + .pulseKeyFrames() { + 0% { .transform(scale(1));} + 50% { .transform(scale(1.4));} 100% { .transform(scale(1));} } @-webkit-keyframes pulse {.pulseKeyFrames();} - @-moz-keyframes pulse {.pulseKeyFrames();} - @-ms-keyframes pulse {.pulseKeyFrames();} - @-o-keyframes pulse {.pulseKeyFrames();} - @keyframes pulse {.pulseKeyFrames();} + @-moz-keyframes pulse {.pulseKeyFrames();} + @-ms-keyframes pulse {.pulseKeyFrames();} + @-o-keyframes pulse {.pulseKeyFrames();} + @keyframes pulse {.pulseKeyFrames();} } -.rubberBand(@duration : @defaultDuration, @easing : @defaultEasing){ +.rubberBand(@duration : @defaultDuration, @easing : @defaultEasing) { .createAnimation(rubberBand, @duration, @easing); - .rubberBandKeyFrames(){ + .rubberBandKeyFrames() { 0% {.transform(scale(1));} 30% {.transform(scaleX(1.25) scaleY(0.75));} 40% {.transform(scaleX(0.75) scaleY(1.25));} @@ -270,32 +270,32 @@ 100% {.transform(scale(1));} } @-webkit-keyframes rubberBand {.rubberBandKeyFrames();} - @-moz-keyframes rubberBand {.rubberBandKeyFrames();} - @-ms-keyframes rubberBand {.rubberBandKeyFrames();} - @-o-keyframes rubberBand {.rubberBandKeyFrames();} - @keyframes rubberBand {.rubberBandKeyFrames();} + @-moz-keyframes rubberBand {.rubberBandKeyFrames();} + @-ms-keyframes rubberBand {.rubberBandKeyFrames();} + @-o-keyframes rubberBand {.rubberBandKeyFrames();} + @keyframes rubberBand {.rubberBandKeyFrames();} } -.shake(@duration : @defaultDuration, @easing : @defaultEasing){ +.shake(@duration : @defaultDuration, @easing : @defaultEasing) { .createAnimation(shake, @duration, @easing); - .shakeKeyFrames(){ + .shakeKeyFrames() { 0%, 100% {.transform( translateX(0));} 10%, 30%, 50%, 70%, 90% {.transform( translateX(-10px));} 20%, 40%, 60%, 80% {.transform( translateX(10px));} } @-webkit-keyframes shake {.shakeKeyFrames();} - @-moz-keyframes shake {.shakeKeyFrames();} - @-ms-keyframes shake {.shakeKeyFrames();} - @-o-keyframes shake {.shakeKeyFrames();} - @keyframes shake {.shakeKeyFrames();} + @-moz-keyframes shake {.shakeKeyFrames();} + @-ms-keyframes shake {.shakeKeyFrames();} + @-o-keyframes shake {.shakeKeyFrames();} + @keyframes shake {.shakeKeyFrames();} } -.swing(@duration : @defaultDuration, @easing : @defaultEasing){ - -webkit-transform-origin: top center; - -ms-transform-origin: top center; - transform-origin: top center; +.swing(@duration : @defaultDuration, @easing : @defaultEasing) { + -webkit-transform-origin : top center; + -ms-transform-origin : top center; + transform-origin : top center; .createAnimation(swing, @duration, @easing); - .swingKeyFrames(){ + .swingKeyFrames() { 20% {.transform(rotate(15deg));} 40% {.transform(rotate(-10deg));} 60% {.transform(rotate(5deg));} @@ -303,18 +303,18 @@ 100% {.transform(rotate(0deg));} } @-webkit-keyframes swing {.swingKeyFrames();} - @-moz-keyframes swing {.swingKeyFrames();} - @-ms-keyframes swing {.swingKeyFrames();} - @-o-keyframes swing {.swingKeyFrames();} - @keyframes swing {.swingKeyFrames();} + @-moz-keyframes swing {.swingKeyFrames();} + @-ms-keyframes swing {.swingKeyFrames();} + @-o-keyframes swing {.swingKeyFrames();} + @keyframes swing {.swingKeyFrames();} } -.twist(@duration : @defaultDuration, @easing : @defaultEasing){ - -webkit-transform-origin: center center; - -ms-transform-origin: center center; - transform-origin: center center; +.twist(@duration : @defaultDuration, @easing : @defaultEasing) { + -webkit-transform-origin : center center; + -ms-transform-origin : center center; + transform-origin : center center; .createAnimation(swing, @duration, @easing); - .swingKeyFrames(){ + .swingKeyFrames() { 20% {.transform(rotate(15deg));} 40% {.transform(rotate(-10deg));} 60% {.transform(rotate(5deg));} @@ -322,15 +322,15 @@ 100% {.transform(rotate(0deg));} } @-webkit-keyframes swing {.swingKeyFrames();} - @-moz-keyframes swing {.swingKeyFrames();} - @-ms-keyframes swing {.swingKeyFrames();} - @-o-keyframes swing {.swingKeyFrames();} - @keyframes swing {.swingKeyFrames();} + @-moz-keyframes swing {.swingKeyFrames();} + @-ms-keyframes swing {.swingKeyFrames();} + @-o-keyframes swing {.swingKeyFrames();} + @keyframes swing {.swingKeyFrames();} } -.wobble(@duration : @defaultDuration, @easing : @defaultEasing){ +.wobble(@duration : @defaultDuration, @easing : @defaultEasing) { .createAnimation(wobble, @duration, @easing); - .wobbleKeyFrames(){ + .wobbleKeyFrames() { 0% {.transform(translateX(0%));} 15% {.transform(translateX(-25%) rotate(-5deg));} 30% {.transform(translateX(20%) rotate(3deg));} @@ -340,22 +340,22 @@ 100% {.transform(translateX(0%));} } @-webkit-keyframes wobble {.wobbleKeyFrames();} - @-moz-keyframes wobble {.wobbleKeyFrames();} - @-ms-keyframes wobble {.wobbleKeyFrames();} - @-o-keyframes wobble {.wobbleKeyFrames();} - @keyframes wobble {.wobbleKeyFrames();} + @-moz-keyframes wobble {.wobbleKeyFrames();} + @-ms-keyframes wobble {.wobbleKeyFrames();} + @-o-keyframes wobble {.wobbleKeyFrames();} + @keyframes wobble {.wobbleKeyFrames();} } -.popIn(@duration : @defaultDuration, @easing : @defaultEasing){ +.popIn(@duration : @defaultDuration, @easing : @defaultEasing) { .createAnimation(popIn, @duration, @easing); - .popInKeyFrames(){ - 0% { .transform(scale(0));} - 70% { .transform(scale(1.4));} + .popInKeyFrames() { + 0% { .transform(scale(0));} + 70% { .transform(scale(1.4));} 100% { .transform(scale(1));} } @-webkit-keyframes popIn {.popInKeyFrames();} - @-moz-keyframes popIn {.popInKeyFrames();} - @-ms-keyframes popIn {.popInKeyFrames();} - @-o-keyframes popIn {.popInKeyFrames();} - @keyframes popIn {.popInKeyFrames();} + @-moz-keyframes popIn {.popInKeyFrames();} + @-ms-keyframes popIn {.popInKeyFrames();} + @-o-keyframes popIn {.popInKeyFrames();} + @keyframes popIn {.popInKeyFrames();} } diff --git a/shared/naturalcrit/styles/colors.less b/shared/naturalcrit/styles/colors.less index 30a7610a2..c096b9b4f 100644 --- a/shared/naturalcrit/styles/colors.less +++ b/shared/naturalcrit/styles/colors.less @@ -23,47 +23,47 @@ @grey : #7F8C8D; #backgroundColors { - &.tealLight{ background-color : @tealLight }; - &.teal{ background-color : @teal }; - &.greenLight{ background-color : @greenLight }; - &.green{ background-color : @green }; - &.blueLight{ background-color : @blueLight }; - &.blue{ background-color : @blue }; - &.purpleLight{ background-color : @purpleLight }; - &.purple{ background-color : @purple }; - &.steelLight{ background-color : @steelLight }; - &.steel{ background-color : @steel }; - &.yellowLight{ background-color : @yellowLight }; - &.yellow{ background-color : @yellow }; - &.orangeLight{ background-color : @orangeLight }; - &.orange{ background-color : @orange }; - &.redLight{ background-color : @redLight }; - &.red{ background-color : @red }; - &.silverLight{ background-color : @silverLight }; - &.silver{ background-color : @silver }; - &.greyLight{ background-color : @greyLight }; - &.grey{ background-color : @grey }; + &.tealLight { background-color : @tealLight; }; + &.teal { background-color : @teal; }; + &.greenLight { background-color : @greenLight; }; + &.green { background-color : @green; }; + &.blueLight { background-color : @blueLight; }; + &.blue { background-color : @blue; }; + &.purpleLight { background-color : @purpleLight; }; + &.purple { background-color : @purple; }; + &.steelLight { background-color : @steelLight; }; + &.steel { background-color : @steel; }; + &.yellowLight { background-color : @yellowLight; }; + &.yellow { background-color : @yellow; }; + &.orangeLight { background-color : @orangeLight; }; + &.orange { background-color : @orange; }; + &.redLight { background-color : @redLight; }; + &.red { background-color : @red; }; + &.silverLight { background-color : @silverLight; }; + &.silver { background-color : @silver; }; + &.greyLight { background-color : @greyLight; }; + &.grey { background-color : @grey; }; } #backgroundColorsHover { - &.tealLight:hover{ background-color : @tealLight }; - &.teal:hover{ background-color : @teal }; - &.greenLight:hover{ background-color : @greenLight }; - &.green:hover{ background-color : @green }; - &.blueLight:hover{ background-color : @blueLight }; - &.blue:hover{ background-color : @blue }; - &.purpleLight:hover{ background-color : @purpleLight }; - &.purple:hover{ background-color : @purple }; - &.steelLight:hover{ background-color : @steelLight }; - &.steel:hover{ background-color : @steel }; - &.yellowLight:hover{ background-color : @yellowLight }; - &.yellow:hover{ background-color : @yellow }; - &.orangeLight:hover{ background-color : @orangeLight }; - &.orange:hover{ background-color : @orange }; - &.redLight:hover{ background-color : @redLight }; - &.red:hover{ background-color : @red }; - &.silverLight:hover{ background-color : @silverLight }; - &.silver:hover{ background-color : @silver }; - &.greyLight:hover{ background-color : @greyLight }; - &.grey:hover{ background-color : @grey }; + &.tealLight:hover { background-color : @tealLight; }; + &.teal:hover { background-color : @teal; }; + &.greenLight:hover { background-color : @greenLight; }; + &.green:hover { background-color : @green; }; + &.blueLight:hover { background-color : @blueLight; }; + &.blue:hover { background-color : @blue; }; + &.purpleLight:hover { background-color : @purpleLight; }; + &.purple:hover { background-color : @purple; }; + &.steelLight:hover { background-color : @steelLight; }; + &.steel:hover { background-color : @steel; }; + &.yellowLight:hover { background-color : @yellowLight; }; + &.yellow:hover { background-color : @yellow; }; + &.orangeLight:hover { background-color : @orangeLight; }; + &.orange:hover { background-color : @orange; }; + &.redLight:hover { background-color : @redLight; }; + &.red:hover { background-color : @red; }; + &.silverLight:hover { background-color : @silverLight; }; + &.silver:hover { background-color : @silver; }; + &.greyLight:hover { background-color : @greyLight; }; + &.grey:hover { background-color : @grey; }; } \ No newline at end of file diff --git a/shared/naturalcrit/styles/core.less b/shared/naturalcrit/styles/core.less index 3248269c5..02db5db18 100644 --- a/shared/naturalcrit/styles/core.less +++ b/shared/naturalcrit/styles/core.less @@ -12,37 +12,31 @@ font-family : 'CodeBold'; src : data-uri('naturalcrit/styles/CODE Bold.otf') format('opentype'); } -html,body, #reactRoot{ +html,body, #reactRoot { height : 100vh; min-height : 100vh; margin : 0; font-family : 'Open Sans', sans-serif; } -*{ - box-sizing : border-box; -} -.colorButton(@backgroundColor : @green){ +* { box-sizing : border-box; } +.colorButton(@backgroundColor : @green) { .animate(background-color); display : inline-block; padding : 0.6em 1.2em; - cursor : pointer; - background-color : @backgroundColor; font-family : 'Open Sans', sans-serif; font-size : 0.8em; font-weight : 800; color : white; - text-decoration : none; text-transform : uppercase; - border : none; + text-decoration : none; + cursor : pointer; outline : none; - &:hover{ - background-color : darken(@backgroundColor, 5%); - } - &:active{ - background-color : darken(@backgroundColor, 10%); - } - &:disabled{ + background-color : @backgroundColor; + border : none; + &:hover { background-color : darken(@backgroundColor, 5%); } + &:active { background-color : darken(@backgroundColor, 10%); } + &:disabled { + cursor : not-allowed; background-color : @silver !important; - cursor:not-allowed; } } diff --git a/shared/naturalcrit/styles/elements.less b/shared/naturalcrit/styles/elements.less index e7f8b05f5..ca4574f26 100644 --- a/shared/naturalcrit/styles/elements.less +++ b/shared/naturalcrit/styles/elements.less @@ -1,86 +1,76 @@ @containerWidth : 1000px; -html, body{ +html, body { position : relative; height : 100%; min-height : 100%; - background-color : #eee; font-family : 'Lato', sans-serif; color : @copyGrey; + background-color : #EEEEEE; } -.container{ +.container { position : relative; max-width : @containerWidth; - margin : 0 auto; padding-right : 20px; padding-left : 20px; + margin : 0 auto; } -h1{ +h1 { margin-top : 10px; margin-bottom : 15px; font-size : 2em; } -h2{ +h2 { margin-top : 10px; margin-bottom : 15px; font-size : 1.5em; font-weight : 900; } -h3{ +h3 { margin-top : 5px; margin-bottom : 7px; font-size : 1em; font-weight : 900; } -p{ +p { margin-bottom : 1em; font-size : 16px; - color : @copyGrey; line-height : 1.5em; + color : @copyGrey; } -code{ - background-color : #F8F8F8; - font-family : 'Courier', mono; +code { + font-family : 'Courier', "mono"; color : black; white-space : pre; + background-color : #F8F8F8; } -a{ - color : inherit; -} -strong{ - font-weight : bold; -} -button{ +a { color : inherit; } +strong { font-weight : bold; } +button { .button(); } -.button(@backgroundColor : @green){ +.button(@backgroundColor : @green) { .animate(background-color); display : inline-block; padding : 0.6em 1.2em; - cursor : pointer; - background-color : @backgroundColor; - font-family : "Lato", Helvetica, Arial, sans-serif; + font-family : 'Lato', "Helvetica", "Arial", sans-serif; font-size : 15px; color : white; text-decoration : none; - border : none; - outline : none; - &:hover{ - background-color : darken(@backgroundColor, 5%); - } - &:active{ - background-color : darken(@backgroundColor, 10%); - } - &:disabled{ - background-color : @silver !important; - } -} -.iconButton(@backgroundColor : @green){ - padding : 0.6em; cursor : pointer; + outline : none; background-color : @backgroundColor; + border : none; + &:hover { background-color : darken(@backgroundColor, 5%); } + &:active { background-color : darken(@backgroundColor, 10%); } + &:disabled { background-color : @silver !important; } +} +.iconButton(@backgroundColor : @green) { + padding : 0.6em; font-size : 14px; color : white; text-align : center; + cursor : pointer; + background-color : @backgroundColor; } \ No newline at end of file diff --git a/shared/naturalcrit/styles/reset.less b/shared/naturalcrit/styles/reset.less index df5564a21..21e07a1c0 100644 --- a/shared/naturalcrit/styles/reset.less +++ b/shared/naturalcrit/styles/reset.less @@ -1,33 +1,23 @@ -:where(html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,button,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video){ - border:0;font-size:100%;font:inherit;vertical-align:baseline;margin:0;padding:0 +:where(html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,button,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video) {padding : 0;margin : 0;font : inherit;font-size : 100%;vertical-align : baseline; + border : 0; } -:where(article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section){ - display:block -} +:where(article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section) { display : block; } -:where(body){ - line-height:1 -} +:where(body) { line-height : 1; } -:where(ol,ul){ - list-style:none -} +:where(ol,ul) { list-style : none; } -:where(blockquote,q){ - quotes:none -} +:where(blockquote,q) { quotes : none; } -:where(blockquote:before,blockquote:after,q:before,q:after){ - content:none -} +:where(blockquote::before,blockquote::after,q::before,q::after) { content : none; } -:where(table){ - border-collapse:collapse;border-spacing:0 +:where(table) {border-spacing : 0; + border-collapse : collapse; } :where(button) { - background-color: unset; - text-transform: unset; - color: unset; + color : unset; + text-transform : unset; + background-color : unset; } diff --git a/shared/naturalcrit/styles/tooltip.less b/shared/naturalcrit/styles/tooltip.less index 078cfd0c1..b21439486 100644 --- a/shared/naturalcrit/styles/tooltip.less +++ b/shared/naturalcrit/styles/tooltip.less @@ -2,116 +2,115 @@ @tooltipColor : #383838; @arrowSize : 6px; @arrowPosition : 18px; -[data-tooltip]{ +[data-tooltip] { .tooltip(attr(data-tooltip)); } -[data-tooltip-top]{ +[data-tooltip-top] { .tooltipTop(attr(data-tooltip-top)); } -[data-tooltip-bottom]{ +[data-tooltip-bottom] { .tooltipBottom(attr(data-tooltip-bottom)); } -[data-tooltip-left]{ +[data-tooltip-left] { .tooltipLeft(attr(data-tooltip-left)); } -[data-tooltip-right]{ +[data-tooltip-right] { .tooltipRight(attr(data-tooltip-right)); } -.tooltip(@content){ +.tooltip(@content) { .tooltipBottom(@content); } -.tooltipTop(@content){ +.tooltipTop(@content) { .tooltipBase(@content); - &:before { + &::before { margin-bottom : -@arrowSize * 2; border-top-color : @tooltipColor; } - &:after{ margin-left: -18px; } - &:before, &:after{ + &::after { margin-left : -18px; } + &::before, &::after { bottom : 100%; left : 50%; } - &:hover:after, &:hover:before, &:focus:after, &:focus:before { + &:hover::after, &:hover::before, &:focus::after, &:focus::before { .transform(translateY(-(@arrowSize + 2))); } } -.tooltipBottom(@content){ +.tooltipBottom(@content) { .tooltipBase(@content); - &:before { + &::before { margin-top : -@arrowSize * 2; border-bottom-color : @tooltipColor; } - &:after{ margin-left: -18px; } - &:before, &:after{ + &::after { margin-left : -18px; } + &::before, &::after { top : 100%; left : 50%; } - &:hover:after, &:hover:before, &:focus:after, &:focus:before { + &:hover::after, &:hover::before, &:focus::after, &:focus::before { .transform(translateY(@arrowSize + 2)); } } -.tooltipLeft(@content){ +.tooltipLeft(@content) { .tooltipBase(@content); - &:before { + &::before { margin-right : -@arrowSize * 2; margin-bottom : -@arrowSize; border-left-color : @tooltipColor; } - &:after{ margin-bottom: -14px;} - &:before, &:after { + &::after { margin-bottom : -14px;} + &::before, &::after { right : 100%; bottom : 50%; } - &:hover:after, &:hover:before, &:focus:after, &:focus:before { + &:hover::after, &:hover::before, &:focus::after, &:focus::before { .transform(translateX(-(@arrowSize + 2))); } } -.tooltipRight(@content){ +.tooltipRight(@content) { .tooltipBase(@content); - &:before { + &::before { margin-bottom : -@arrowSize; margin-left : -@arrowSize * 2; border-right-color : @tooltipColor; } - &:after{ margin-bottom: -14px;} - &:before, &:after { + &::after { margin-bottom : -14px;} + &::before, &::after { bottom : 50%; left : 100%; } - &:hover:after, &:hover:before, &:focus:after, &:focus:before { + &:hover::after, &:hover::before, &:focus::after, &:focus::before { .transform(translateX(@arrowSize + 2)); } } -.tooltipShow(){ -} -.tooltipBase(@content){ +.tooltipShow(){ } +.tooltipBase(@content) { //position: relative; - &:before, &:after{ + &::before, &::after { .animateAll(); position : absolute; z-index : 1000000; - opacity : 0; pointer-events : none; + opacity : 0; } //Arrow - &:before{ - content : ''; + &::before { z-index : 1000001; + content : ''; background : transparent; border : @arrowSize solid transparent; } //Box - &:after{ - content : @content; + &::after { visibility : hidden; padding : 8px 10px; - background : @tooltipColor; font-size : 12px; - color : white; line-height : 12px; + color : white; white-space : nowrap; + content : @content; + background : @tooltipColor; } - &:hover:before, &:hover:after { + &:hover::before, &:hover::after { visibility : visible; opacity : 1; } diff --git a/themes/Legacy/5ePHB/style.less b/themes/Legacy/5ePHB/style.less index 4ebfbf840..56d1bed94 100644 --- a/themes/Legacy/5ePHB/style.less +++ b/themes/Legacy/5ePHB/style.less @@ -9,26 +9,22 @@ @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; +@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; + strong { + font-family : "ScalySans"; font-weight : 800; letter-spacing : -0.02em; } } -.useColumns(@multiplier : 1){ +.useColumns(@multiplier : 1) { column-count : 2; column-fill : auto; column-gap : 1cm; @@ -40,21 +36,21 @@ body { -webkit-column-gap : 1cm; -moz-column-gap : 1cm; } -.phb, .page{ +.phb, .page { .useColumns(); - counter-increment : phb-page-numbers; position : relative; z-index : 15; box-sizing : border-box; - overflow : hidden; - height : 279.4mm; 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; - font-family : BookSanity; - font-size : 0.317cm; text-rendering : optimizeLegibility; page-break-before : always; page-break-after : always; @@ -63,199 +59,175 @@ body { contain-intrinsic-size : auto none; } -.phb{ +.phb { //***************************** // * BASE // *****************************/ - p{ + p { padding-bottom : 0.8em; line-height : 1.269em; - &+p{ - margin-top : -0.8em; - } + & + p { margin-top : -0.8em; } } - ul{ - margin-bottom : 0.8em; + ul { padding-left : 1.4em; + margin-bottom : 0.8em; line-height : 1.269em; list-style-position : outside; list-style-type : disc; } - ol{ - margin-bottom : 0.8em; + 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{ + 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{ + em { font-style : italic; } + sup { + font-size : smaller; + line-height : 0; vertical-align : super; - font-size : smaller; - line-height : 0; } - sub{ - vertical-align : sub; + sub { font-size : smaller; line-height : 0; + vertical-align : sub; } //***************************** // * HEADERS // *****************************/ - h1,h2,h3,h4{ + h1,h2,h3,h4 { margin-top : 0.2em; margin-bottom : 0.2em; - font-family : MrJeeves; + font-family : "MrJeeves"; font-weight : 800; color : @headerText; } - h1{ + h1 { column-span : all; font-size : 0.987cm; -webkit-column-span : all; -moz-column-span : all; - &+p::first-letter{ + & + p::first-letter { float : left; - font-family : Solberry; + font-family : "Solberry"; font-size : 10em; - color : #222; line-height : 0.795em; + color : #222222; } } - h2{ - font-size : 0.705cm; - } - h3{ + h2 { font-size : 0.705cm; } + h3 { font-size : 0.529cm; border-bottom : 2px solid @headerUnderline; } - h4{ + h4 { margin-bottom : 0.00em; font-size : 0.458cm; } - h5{ + h5 { margin-bottom : 0.2em; - font-family : ScalySansSmallCaps; + font-family : "ScalySansSmallCaps"; font-size : 0.423cm; font-weight : 900; } //***************************** // * TABLE // *****************************/ - table{ + table { .useSansSerif(); width : 100%; margin-bottom : 1em; font-size : 10pt; - thead{ - display: table-row-group; + thead { + display : table-row-group; font-weight : 800; - th{ - vertical-align : bottom; - padding-bottom : 0.3em; + 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; - } + tbody { + tr { + td { padding : 0.3em 0.1em; } + &:nth-child(odd) { background-color : @noteGreen; } } } } //***************************** // * NOTE // *****************************/ - blockquote{ + blockquote { .useSansSerif(); box-sizing : border-box; - margin-bottom : 1em; 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 #888; - p, ul{ + 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; - } + pre + blockquote, h2 + blockquote, h3 + blockquote, h4 + blockquote, h5 + blockquote { margin-top : 13px; } //***************************** // * MONSTER STAT BLOCK // *****************************/ - hr+blockquote{ + hr+blockquote { position : relative; padding-top : 15px; background-color : @monsterStatBackground; border-style : solid; border-width : 10px; border-image : @monsterBorderImageLegacy 10; - h2{ + h2 { margin-top : -8px; margin-bottom : 0px; - &+p{ - padding-bottom : 0px; - } + & + p { padding-bottom : 0px; } } - h3{ - font-family : ScalySans; - font-weight : 400; + h3 { + font-family : "ScalySans"; + font-weight : normal; border-bottom : 1px solid @headerText; } - hr+ul{ - color : @headerText; - } - ul{ + hr + ul { color : @headerText; } + ul { .useSansSerif(); padding-left : 1em; font-size : 0.352cm; } // Monster Ability table - hr+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; - } + tbody { + tr:nth-child(odd), tr:nth-child(even) { background-color : transparent; } } } - table{ - color : @headerText; - } - p+p{ - margin-top : 0em; + table { color : @headerText; } + p + p { padding-bottom : 0.5em; + margin-top : 0em; text-indent : 0em; } //Triangle dividers - hr{ + hr { visibility : visible; height : 6px; margin : 4px 0px; @@ -265,100 +237,90 @@ body { } } //Full Width - hr+hr+blockquote{ + hr + hr + blockquote { .useColumns(0.96); column-fill : balance; } //***************************** // * FOOTER // *****************************/ - &:after{ - content : ""; + &:after { position : absolute; bottom : 0px; left : 0px; z-index : 100; - height : 50px; width : 100%; + height : 50px; + content : ''; background-image : @footerAccentImage; background-size : cover; } - &:nth-child(even){ - &:after{ - transform : scaleX(-1); - } - .pageNumber{ - left : 2px; - } - .footnote{ + &:nth-child(even) { + &::after { transform : scaleX(-1); } + .pageNumber { left : 2px; } + .footnote { left : 80px; text-align : left; } } - .pageNumber{ + .pageNumber { position : absolute; right : 2px; bottom : 22px; width : 50px; font-size : 0.9em; - color : #c9ad6a; + color : #C9AD6A; text-align : center; - &.auto::after { - content : counter(phb-page-numbers); - } + &.auto::after { content : counter(phb-page-numbers); } } - .footnote{ + .footnote { position : absolute; right : 80px; bottom : 32px; z-index : 150; width : 200px; font-size : 0.8em; - color : #c9ad6a; + color : #C9AD6A; text-align : right; } //***************************** // * EXTRAS // *****************************/ - hr{ + hr { visibility : hidden; margin : 0px; } //Modified unorder list, used in spells - hr+ul{ - margin-bottom : 0.5em; + hr + ul { padding-left : 1em; + margin-bottom : 0.5em; text-indent : -1em; list-style-type : none; } //Column Break - pre, code{ + pre, code { visibility : hidden; -webkit-column-break-after : always; break-after : always; -moz-column-break-after : always; } //Avoid breaking up - p,blockquote,table{ + 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 - } + h4 + p + hr + ul { margin-top : -0.5em; } //Text indent right after table - table+p{ - text-indent : 1em; - } + table + p { text-indent : 1em; } // Nested lists - ul ul,ol ol,ul ol,ol ul{ + ul ul,ol ol,ul ol,ol ul { margin-bottom : 0px; margin-left : 1.5em; } - li{ + li { -webkit-column-break-inside : avoid; page-break-inside : avoid; break-inside : avoid; @@ -367,89 +329,81 @@ body { //***************************** // * SPELL LIST // *****************************/ -.phb .spellList{ +.phb .spellList { .useSansSerif(); column-count : 4; - column-span : all; -webkit-column-span : all; -moz-column-span : all; - ul+h5{ - margin-top : 15px; - } - p, ul{ + column-span : all; + ul + h5 { margin-top : 15px; } + p, ul { font-size : 0.352cm; line-height : 1.263em; } - ul{ - margin-bottom : 0.5em; + 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; - break-inside : auto; } } //***************************** // * WIDE // *****************************/ -.phb .wide{ - column-span : all; +.phb .wide { -webkit-column-span : all; -moz-column-span : all; + column-span : all; } //***************************** // * CLASS TABLE // *****************************/ -.phb .classTable{ +.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; - border-image-slice : 150 200 150 200; - border-image-source : @frameBorderImage; - border-image-width : 47px; - h5{ - margin-bottom : 10px; - } + h5 { margin-bottom : 10px; } } //************************************ // * DESCRIPTIVE TEXT BOX // ************************************/ -.phb .descriptive{ +.phb .descriptive { margin-bottom : 1em; - background-color : #faf7ea; - font-family : ScalySans; + 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{ + box-shadow : 0px 0px 6px #FAF7EA; + p { display : block; padding-bottom : 0px; line-height : 1.47em; } - p + p { - padding-top : .8em; - } + p + p { padding-top : 0.8em; } em { - font-family : ScalySans; + font-family : "ScalySans"; font-style : italic; } strong { - font-family : ScalySans; + font-family : "ScalySans"; font-weight : 800; letter-spacing : -0.02em; } } -.phb pre+.descriptive{ - margin-top : 8px; -} +.phb pre + .descriptive { margin-top : 8px; } //***************************** // * ARTIST CREDIT BLOCK @@ -457,47 +411,41 @@ body { .phb { .artist { position : absolute; - text-align : center; - font-family : WalterTurncoat; + font-family : "WalterTurncoat"; font-size : 0.27cm; color : @captionText; + text-align : center; p, p + p { margin : unset; - text-indent : unset; line-height : 0.941em; + text-indent : unset; } - h5 { + h5 { + font-family : "WalterTurncoat"; font-size : 1.3em; - font-family : WalterTurncoat; } - a{ + a { color : inherit; text-decoration : unset; - &:hover { - text-decoration : underline; - } + &:hover { text-decoration : underline; } } } } //***************************** // * TABLE OF CONTENTS // *****************************/ -.phb .toc{ +.phb .toc { -webkit-column-break-inside : avoid; page-break-inside : avoid; break-inside : avoid; - a{ + a { color : black; text-decoration : none; - &:hover{ - text-decoration : underline; - } + &:hover { text-decoration : underline; } } - ul{ + ul { padding-left : 0; list-style-type : none; } - &>ul>li{ - margin-bottom : 10px; - } + & > ul > li { margin-bottom : 10px; } } diff --git a/themes/V3/5eDMG/style.less b/themes/V3/5eDMG/style.less index 2ced98312..cbc3fa890 100644 --- a/themes/V3/5eDMG/style.less +++ b/themes/V3/5eDMG/style.less @@ -7,37 +7,29 @@ } .page { - background-image : url(/assets/DMG_background.png); + background-image : url("/assets/DMG_background.png"); background-size : cover; - /*TABLES WITHIN NOTES*/ - .note table tbody tr:nth-child(odd) { - background:#fff; - } + /* TABLES WITHIN NOTES */ + .note table tbody tr:nth-child(odd) { background : #FFFFFF; } - /*DROP CAP*/ + /* DROP CAP */ h1 + p::first-letter { - background-image: unset; - color:black; + color : black; + background-image : unset; } - .quote p:first-child::first-line { - all: unset; + .quote p:first-child::first-line { all : unset; } + + &::after { + height : 58px; + background-image : url("/assets/DMG_footerAccent.png"); } - &:after { - background-image : url(/assets/DMG_footerAccent.png); - height: 58px; - } - - .footnote { - bottom : 40px; - } + .footnote { bottom : 40px; } } .page:has(.partCover) { - .partCover { - background-image: @partCoverHeaderDMG; - } + .partCover { background-image : @partCoverHeaderDMG; } } diff --git a/themes/V3/5ePHB/style.less b/themes/V3/5ePHB/style.less index 1a751b18d..93cfdf719 100644 --- a/themes/V3/5ePHB/style.less +++ b/themes/V3/5ePHB/style.less @@ -305,12 +305,12 @@ margin-left : -0.16cm; background-color : var(--HB_Color_MonsterStatBackground); background-image : @monsterBlockBackground; - 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; + background-blend-mode : overlay; } position : relative; @@ -335,9 +335,9 @@ //Triangle dividers hr { + visibility : visible; height : 6px; margin : 0.12cm 0cm; - visibility : visible; background-image : @redTriangleImage; background-size : 100% 100%; border : none; @@ -355,8 +355,8 @@ } .bonus { - float: right; - padding-right: 0.5em; + float : right; + padding-right : 0.5em; } // Monster Ability table @@ -456,8 +456,8 @@ // * EXTRAS // *****************************/ hr { - margin : 0px; visibility : hidden; + margin : 0px; } //Text indent right after table table + p { text-indent : 1em; } @@ -525,10 +525,10 @@ 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; + filter : drop-shadow(0px 0px 1px #C8C5C080); transform : translateY(-50%) translateX(-50%); } &.decoration.wide::before { @@ -547,38 +547,38 @@ &::after { display : none; } .frontCover { position : absolute; } h1 { - margin-top : 1.55cm; - margin-bottom : 0; - font-family : 'NodestoCapsCondensed'; - font-size : 2.245cm; - font-weight : normal; - line-height : 1.9cm; - color : white; - text-shadow : unset; - text-transform : uppercase; - -webkit-text-stroke: 0.2cm black; - paint-order:stroke; + margin-top : 1.55cm; + margin-bottom : 0; + font-family : 'NodestoCapsCondensed'; + font-size : 2.245cm; + font-weight : normal; + line-height : 1.9cm; + color : white; + text-transform : uppercase; + text-shadow : unset; + -webkit-text-stroke : 0.2cm black; + paint-order : stroke; } h2 { - font-family : 'NodestoCapsCondensed'; - font-size : 0.85cm; - font-weight : normal; - color : white; - letter-spacing : 0.1cm; - -webkit-text-stroke: 0.14cm black; - paint-order:stroke; + font-family : 'NodestoCapsCondensed'; + font-size : 0.85cm; + font-weight : normal; + color : white; + letter-spacing : 0.1cm; + -webkit-text-stroke : 0.14cm black; + paint-order : stroke; } hr { position : relative; display : block; + visibility : visible; 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; + filter : drop-shadow(0 0 3px black); } .banner { position : absolute; @@ -601,19 +601,19 @@ 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; - -webkit-text-stroke: 0.1cm black; - paint-order:stroke; + 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; + -webkit-text-stroke : 0.1cm black; + paint-order : stroke; } .logo { position : absolute; @@ -621,9 +621,7 @@ right : 0; left : 0; filter : drop-shadow(0 0 0.075cm black); - img { - height : 2cm; - } + img { height : 2cm; } } } // ***************************** @@ -652,10 +650,10 @@ hr { position : relative; display : block; + visibility : visible; width : 12cm; height : 0.5cm; margin : auto; - visibility : visible; background-image : @horizontalRule; background-size : 100% 100%; border : none; @@ -666,19 +664,17 @@ bottom : 1cm; left : 0; height : 2cm; - img { - height : 2cm; - } + img { height : 2cm; } } } // ***************************** // * BACK COVER // *****************************/ .page:has(.backCover) { - padding : 2.25cm 1.3cm 2cm 1.3cm; - color : #FFFFFF; - columns : 1; + padding : 2.25cm 1.3cm 2cm 1.3cm; line-height : 1.4em; + color : #FFFFFF; + columns : 1; &::after { display : none; } .columnWrapper { width : 7.6cm; } .backCover { @@ -689,7 +685,7 @@ background-repeat : no-repeat; background-size : contain; } - .blank { height: 1.4em; } + .blank { height : 1.4em; } h1 { margin-bottom : 0.3cm; font-family : 'NodestoCapsCondensed'; @@ -707,12 +703,12 @@ height : 100%; } hr { + visibility : visible; 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; @@ -805,7 +801,7 @@ h6, .page:has(.insideCover), .monster, .noToC, -.toc { --TOC: exclude; } +.toc { --TOC : exclude; } // Brew level default inclusion changes. @@ -815,34 +811,32 @@ h6, // Block level inclusion changes // These include either a single (include) or a range (depth) -.tocIncludeH1 h1 {--TOC: include; } -.tocIncludeH2 h2 {--TOC: include; } -.tocIncludeH3 h3 {--TOC: include; } -.tocIncludeH4 h4 {--TOC: include; } -.tocIncludeH5 h5 {--TOC: include; } -.tocIncludeH6 h6 {--TOC: include; } +.tocIncludeH1 h1 {--TOC : include; } +.tocIncludeH2 h2 {--TOC : include; } +.tocIncludeH3 h3 {--TOC : include; } +.tocIncludeH4 h4 {--TOC : include; } +.tocIncludeH5 h5 {--TOC : include; } +.tocIncludeH6 h6 {--TOC : include; } -.tocDepthH2 :is(h1, h2) {--TOC: include; } -.tocDepthH3 :is(h1, h2, h3) {--TOC: include; } -.tocDepthH4 :is(h1, h2, h3, h4) {--TOC: include; } -.tocDepthH5 :is(h1, h2, h3, h4, h5) {--TOC: include; } -.tocDepthH6 :is(h1, h2, h3, h4, h5, h6) {--TOC: include; } +.tocDepthH2 :is(h1, h2) {--TOC : include; } +.tocDepthH3 :is(h1, h2, h3) {--TOC : include; } +.tocDepthH4 :is(h1, h2, h3, h4) {--TOC : include; } +.tocDepthH5 :is(h1, h2, h3, h4, h5) {--TOC : include; } +.tocDepthH6 :is(h1, h2, h3, h4, h5, h6) {--TOC : include; } // Block level exclusion changes // These exclude a single block level -.tocExcludeH1 h1 {--TOC: exclude; } -.tocExcludeH2 h2 {--TOC: exclude; } -.tocExcludeH3 h3 {--TOC: exclude; } -.tocExcludeH4 h4 {--TOC: exclude; } -.tocExcludeH5 h5 {--TOC: exclude; } -.tocExcludeH6 h6 {--TOC: exclude; } +.tocExcludeH1 h1 {--TOC : exclude; } +.tocExcludeH2 h2 {--TOC : exclude; } +.tocExcludeH3 h3 {--TOC : exclude; } +.tocExcludeH4 h4 {--TOC : exclude; } +.tocExcludeH5 h5 {--TOC : exclude; } +.tocExcludeH6 h6 {--TOC : exclude; } .page:has(.partCover) { - --TOC: exclude; - & h1 { - --TOC: include; - } - } + --TOC : exclude; + & h1 { --TOC : include; } +} .page { &:has(.toc)::after { display : none; } @@ -908,9 +902,7 @@ h6, .useColumns(0.96, @fillMode: balance); } } - .toc.wide li { - break-inside: auto; - } + .toc.wide li { break-inside : auto; } } // ***************************** @@ -935,9 +927,7 @@ h6, .page h1 + * { margin-top : 0; } -.page .descriptive.wide + * { - margin-top: 0; -} +.page .descriptive.wide + * { margin-top : 0; } //***************************** // * RUNE TABLE @@ -952,8 +942,8 @@ h6, width : 1.3cm; height : 1.3cm; font-weight : normal; - text-transform : uppercase; vertical-align : middle; + text-transform : uppercase; outline : 1px solid #000000; } th { diff --git a/themes/V3/Blank/style.less b/themes/V3/Blank/style.less index e107c76b8..9f2bd498e 100644 --- a/themes/V3/Blank/style.less +++ b/themes/V3/Blank/style.less @@ -21,9 +21,9 @@ body { counter-reset : page-numbers 0; } // *****************************/ .page { .block { - break-inside : avoid; display : inline-block; width : 100%; + break-inside : avoid; img { z-index : 0; } } .inline-block { @@ -58,8 +58,8 @@ body { counter-reset : page-numbers 0; } content-visibility : auto; contain-intrinsic-size : auto none; } - //***************************** - // * BASE +//***************************** +// * BASE // *****************************/ .page { p { @@ -120,7 +120,7 @@ body { counter-reset : page-numbers 0; } // * CODE BLOCKS // ************************************/ code { - font-family : 'Courier New', "Courier", monospace; + font-family : 'Courier New', 'Courier', monospace; overflow-wrap : break-word; white-space : pre-wrap; } @@ -133,10 +133,10 @@ body { counter-reset : page-numbers 0; } // * EXTRAS // *****************************/ .columnSplit { - margin-top : 0; visibility : hidden; - -webkit-column-break-after : always; + margin-top : 0; break-after : always; + -webkit-column-break-after : always; -moz-column-break-after : always; & + * { margin-top : 0; } } @@ -199,11 +199,11 @@ body { counter-reset : page-numbers 0; } background-color : var(--HB_Color_WatercolorStain); /* default color */ background-size : cover; -webkit-mask-image : var(--wc); - -webkit-mask-size : contain; - -webkit-mask-repeat : no-repeat; mask-image : var(--wc); - mask-size : contain; + -webkit-mask-repeat : no-repeat; mask-repeat : no-repeat; + -webkit-mask-size : contain; + mask-size : contain; --wc : @watercolor1; /* default image */ } @@ -231,15 +231,15 @@ body { counter-reset : page-numbers 0; } height : 200%; background-image : var(--checkerboard); background-size : 20px; - transform : translateY(50%) translateX(-50%) rotate(calc(1deg * var(--rotation))) scaleX(var(--scaleX)) scaleY(var(--scaleY)); -webkit-mask-image : var(--wc), var(--revealer); - -webkit-mask-repeat : repeat-x; - -webkit-mask-size : 50%; //Scale only X to fit page width, leave height at aspect ratio, designed to hang off the edge - -webkit-mask-position : 50% calc(50% - var(--offset)); mask-image : var(--wc); + -webkit-mask-repeat : repeat-x; mask-repeat : repeat-x; - mask-size : 50%; + -webkit-mask-position : 50% calc(50% - var(--offset)); mask-position : 50% calc(50% - var(--offset)); + -webkit-mask-size : 50%; //Scale only X to fit page width, leave height at aspect ratio, designed to hang off the edge + mask-size : 50%; + transform : translateY(50%) translateX(-50%) rotate(calc(1deg * var(--rotation))) scaleX(var(--scaleX)) scaleY(var(--scaleY)); --rotation : 0; --revealer : none; --checkerboard : none; @@ -276,19 +276,19 @@ body { counter-reset : page-numbers 0; } } &.revealImage { --revealer : linear-gradient(0deg, rgba(0,0,0,0.2) 0%, rgba(0,0,0,0.2)); - --checkerboard : url("/assets/waterColorMasks/missingImage.png"); //shows any masked regions not filled by image + --checkerboard : url('/assets/waterColorMasks/missingImage.png'); //shows any masked regions not filled by image } } .imageMaskEdge { - &1 { --wc : url("/assets/waterColorMasks/edge/0001.webp"); } - &2 { --wc : url("/assets/waterColorMasks/edge/0002.webp"); } - &3 { --wc : url("/assets/waterColorMasks/edge/0003.webp"); } - &4 { --wc : url("/assets/waterColorMasks/edge/0004.webp"); } - &5 { --wc : url("/assets/waterColorMasks/edge/0005.webp"); } - &6 { --wc : url("/assets/waterColorMasks/edge/0006.webp"); } - &7 { --wc : url("/assets/waterColorMasks/edge/0007.webp"); } - &8 { --wc : url("/assets/waterColorMasks/edge/0008.webp"); } + &1 { --wc : url('/assets/waterColorMasks/edge/0001.webp'); } + &2 { --wc : url('/assets/waterColorMasks/edge/0002.webp'); } + &3 { --wc : url('/assets/waterColorMasks/edge/0003.webp'); } + &4 { --wc : url('/assets/waterColorMasks/edge/0004.webp'); } + &5 { --wc : url('/assets/waterColorMasks/edge/0005.webp'); } + &6 { --wc : url('/assets/waterColorMasks/edge/0006.webp'); } + &7 { --wc : url('/assets/waterColorMasks/edge/0007.webp'); } + &8 { --wc : url('/assets/waterColorMasks/edge/0008.webp'); } } [class*='imageMaskCenter'] { @@ -296,15 +296,15 @@ body { counter-reset : page-numbers 0; } left : calc(var(--offsetX)); width : 100%; height : 100%; - transform : rotate(calc(1deg * var(--rotation))) scaleX(var(--scaleX)) scaleY(var(--scaleY)); -webkit-mask-image : var(--wc), var(--revealer); - -webkit-mask-repeat : no-repeat; - -webkit-mask-size : 100% 100%; //Scale both dimensions to fit page size - -webkit-mask-position : 0% 0%; mask-image : var(--wc), var(--revealer); + -webkit-mask-repeat : no-repeat; mask-repeat : no-repeat; - mask-size : 100% 100%; //Scale both dimensions to fit page size + -webkit-mask-position : 0% 0%; mask-position : 50% 50%; + -webkit-mask-size : 100% 100%; //Scale both dimensions to fit page size + mask-size : 100% 100%; //Scale both dimensions to fit page size + transform : rotate(calc(1deg * var(--rotation))) scaleX(var(--scaleX)) scaleY(var(--scaleY)); & > p:has(img) { position : absolute; @@ -321,23 +321,23 @@ body { counter-reset : page-numbers 0; } } .imageMaskCenter { - &1 { --wc : url("/assets/waterColorMasks/center/0001.webp"); } - &2 { --wc : url("/assets/waterColorMasks/center/0002.webp"); } - &3 { --wc : url("/assets/waterColorMasks/center/0003.webp"); } - &4 { --wc : url("/assets/waterColorMasks/center/0004.webp"); } - &5 { --wc : url("/assets/waterColorMasks/center/0005.webp"); } - &6 { --wc : url("/assets/waterColorMasks/center/0006.webp"); } - &7 { --wc : url("/assets/waterColorMasks/center/0007.webp"); } - &8 { --wc : url("/assets/waterColorMasks/center/0008.webp"); } - &9 { --wc : url("/assets/waterColorMasks/center/0009.webp"); } - &10 { --wc : url("/assets/waterColorMasks/center/0010.webp"); } - &11 { --wc : url("/assets/waterColorMasks/center/0011.webp"); } - &12 { --wc : url("/assets/waterColorMasks/center/0012.webp"); } - &13 { --wc : url("/assets/waterColorMasks/center/0013.webp"); } - &14 { --wc : url("/assets/waterColorMasks/center/0014.webp"); } - &15 { --wc : url("/assets/waterColorMasks/center/0015.webp"); } - &16 { --wc : url("/assets/waterColorMasks/center/0016.webp"); } - &special { --wc : url("/assets/waterColorMasks/center/special.webp"); } + &1 { --wc : url('/assets/waterColorMasks/center/0001.webp'); } + &2 { --wc : url('/assets/waterColorMasks/center/0002.webp'); } + &3 { --wc : url('/assets/waterColorMasks/center/0003.webp'); } + &4 { --wc : url('/assets/waterColorMasks/center/0004.webp'); } + &5 { --wc : url('/assets/waterColorMasks/center/0005.webp'); } + &6 { --wc : url('/assets/waterColorMasks/center/0006.webp'); } + &7 { --wc : url('/assets/waterColorMasks/center/0007.webp'); } + &8 { --wc : url('/assets/waterColorMasks/center/0008.webp'); } + &9 { --wc : url('/assets/waterColorMasks/center/0009.webp'); } + &10 { --wc : url('/assets/waterColorMasks/center/0010.webp'); } + &11 { --wc : url('/assets/waterColorMasks/center/0011.webp'); } + &12 { --wc : url('/assets/waterColorMasks/center/0012.webp'); } + &13 { --wc : url('/assets/waterColorMasks/center/0013.webp'); } + &14 { --wc : url('/assets/waterColorMasks/center/0014.webp'); } + &15 { --wc : url('/assets/waterColorMasks/center/0015.webp'); } + &16 { --wc : url('/assets/waterColorMasks/center/0016.webp'); } + &special { --wc : url('/assets/waterColorMasks/center/special.webp'); } } @@ -346,15 +346,15 @@ body { counter-reset : page-numbers 0; } left : calc(-50% + var(--offsetX)); width : 200%; height : 200%; - transform : rotate(calc(1deg * var(--rotation))) scaleX(var(--scaleX)) scaleY(var(--scaleY)); -webkit-mask-image : var(--wc), var(--revealer); - -webkit-mask-repeat : no-repeat; - -webkit-mask-size : 100% 100%; //Scale both dimensions to fit page size - -webkit-mask-position : 50% 50%; mask-image : var(--wc), var(--revealer); + -webkit-mask-repeat : no-repeat; mask-repeat : no-repeat; - mask-size : 100% 100%; //Scale both dimensions to fit page size + -webkit-mask-position : 50% 50%; mask-position : 50% 50%; + -webkit-mask-size : 100% 100%; //Scale both dimensions to fit page size + mask-size : 100% 100%; //Scale both dimensions to fit page size + transform : rotate(calc(1deg * var(--rotation))) scaleX(var(--scaleX)) scaleY(var(--scaleY)); & > p:has(img) { bottom : 25%; left : 25%; @@ -367,43 +367,43 @@ body { counter-reset : page-numbers 0; } } } .imageMaskCorner { - &1 { --wc : url("/assets/waterColorMasks/corner/0001.webp"); } - &2 { --wc : url("/assets/waterColorMasks/corner/0002.webp"); } - &3 { --wc : url("/assets/waterColorMasks/corner/0003.webp"); } - &4 { --wc : url("/assets/waterColorMasks/corner/0004.webp"); } - &5 { --wc : url("/assets/waterColorMasks/corner/0005.webp"); } - &6 { --wc : url("/assets/waterColorMasks/corner/0006.webp"); } - &7 { --wc : url("/assets/waterColorMasks/corner/0007.webp"); } - &8 { --wc : url("/assets/waterColorMasks/corner/0008.webp"); } - &9 { --wc : url("/assets/waterColorMasks/corner/0009.webp"); } - &10 { --wc : url("/assets/waterColorMasks/corner/0010.webp"); } - &11 { --wc : url("/assets/waterColorMasks/corner/0011.webp"); } - &12 { --wc : url("/assets/waterColorMasks/corner/0012.webp"); } - &13 { --wc : url("/assets/waterColorMasks/corner/0013.webp"); } - &14 { --wc : url("/assets/waterColorMasks/corner/0014.webp"); } - &15 { --wc : url("/assets/waterColorMasks/corner/0015.webp"); } - &16 { --wc : url("/assets/waterColorMasks/corner/0016.webp"); } - &17 { --wc : url("/assets/waterColorMasks/corner/0017.webp"); } - &18 { --wc : url("/assets/waterColorMasks/corner/0018.webp"); } - &19 { --wc : url("/assets/waterColorMasks/corner/0019.webp"); } - &20 { --wc : url("/assets/waterColorMasks/corner/0020.webp"); } - &21 { --wc : url("/assets/waterColorMasks/corner/0021.webp"); } - &22 { --wc : url("/assets/waterColorMasks/corner/0022.webp"); } - &23 { --wc : url("/assets/waterColorMasks/corner/0023.webp"); } - &24 { --wc : url("/assets/waterColorMasks/corner/0024.webp"); } - &25 { --wc : url("/assets/waterColorMasks/corner/0025.webp"); } - &26 { --wc : url("/assets/waterColorMasks/corner/0026.webp"); } - &27 { --wc : url("/assets/waterColorMasks/corner/0027.webp"); } - &28 { --wc : url("/assets/waterColorMasks/corner/0028.webp"); } - &29 { --wc : url("/assets/waterColorMasks/corner/0029.webp"); } - &30 { --wc : url("/assets/waterColorMasks/corner/0030.webp"); } - &31 { --wc : url("/assets/waterColorMasks/corner/0031.webp"); } - &32 { --wc : url("/assets/waterColorMasks/corner/0032.webp"); } - &33 { --wc : url("/assets/waterColorMasks/corner/0033.webp"); } - &34 { --wc : url("/assets/waterColorMasks/corner/0034.webp"); } - &35 { --wc : url("/assets/waterColorMasks/corner/0035.webp"); } - &36 { --wc : url("/assets/waterColorMasks/corner/0036.webp"); } - &37 { --wc : url("/assets/waterColorMasks/corner/0037.webp"); } + &1 { --wc : url('/assets/waterColorMasks/corner/0001.webp'); } + &2 { --wc : url('/assets/waterColorMasks/corner/0002.webp'); } + &3 { --wc : url('/assets/waterColorMasks/corner/0003.webp'); } + &4 { --wc : url('/assets/waterColorMasks/corner/0004.webp'); } + &5 { --wc : url('/assets/waterColorMasks/corner/0005.webp'); } + &6 { --wc : url('/assets/waterColorMasks/corner/0006.webp'); } + &7 { --wc : url('/assets/waterColorMasks/corner/0007.webp'); } + &8 { --wc : url('/assets/waterColorMasks/corner/0008.webp'); } + &9 { --wc : url('/assets/waterColorMasks/corner/0009.webp'); } + &10 { --wc : url('/assets/waterColorMasks/corner/0010.webp'); } + &11 { --wc : url('/assets/waterColorMasks/corner/0011.webp'); } + &12 { --wc : url('/assets/waterColorMasks/corner/0012.webp'); } + &13 { --wc : url('/assets/waterColorMasks/corner/0013.webp'); } + &14 { --wc : url('/assets/waterColorMasks/corner/0014.webp'); } + &15 { --wc : url('/assets/waterColorMasks/corner/0015.webp'); } + &16 { --wc : url('/assets/waterColorMasks/corner/0016.webp'); } + &17 { --wc : url('/assets/waterColorMasks/corner/0017.webp'); } + &18 { --wc : url('/assets/waterColorMasks/corner/0018.webp'); } + &19 { --wc : url('/assets/waterColorMasks/corner/0019.webp'); } + &20 { --wc : url('/assets/waterColorMasks/corner/0020.webp'); } + &21 { --wc : url('/assets/waterColorMasks/corner/0021.webp'); } + &22 { --wc : url('/assets/waterColorMasks/corner/0022.webp'); } + &23 { --wc : url('/assets/waterColorMasks/corner/0023.webp'); } + &24 { --wc : url('/assets/waterColorMasks/corner/0024.webp'); } + &25 { --wc : url('/assets/waterColorMasks/corner/0025.webp'); } + &26 { --wc : url('/assets/waterColorMasks/corner/0026.webp'); } + &27 { --wc : url('/assets/waterColorMasks/corner/0027.webp'); } + &28 { --wc : url('/assets/waterColorMasks/corner/0028.webp'); } + &29 { --wc : url('/assets/waterColorMasks/corner/0029.webp'); } + &30 { --wc : url('/assets/waterColorMasks/corner/0030.webp'); } + &31 { --wc : url('/assets/waterColorMasks/corner/0031.webp'); } + &32 { --wc : url('/assets/waterColorMasks/corner/0032.webp'); } + &33 { --wc : url('/assets/waterColorMasks/corner/0033.webp'); } + &34 { --wc : url('/assets/waterColorMasks/corner/0034.webp'); } + &35 { --wc : url('/assets/waterColorMasks/corner/0035.webp'); } + &36 { --wc : url('/assets/waterColorMasks/corner/0036.webp'); } + &37 { --wc : url('/assets/waterColorMasks/corner/0037.webp'); } } } @@ -438,11 +438,9 @@ body { counter-reset : page-numbers 0; } & + * { margin-top : 0; } } .blank { - height: 1em; - margin-top: 0; - & + * { - margin-top: 0; - } + height : 1em; + margin-top : 0; + & + * { margin-top : 0; } } } @@ -468,8 +466,8 @@ body { counter-reset : page-numbers 0; } height : 1.5cm; margin : 0 auto; background-color : black; - -webkit-mask : url("/assets/naturalCritLogoWhite.svg") center / contain no-repeat; - mask : url("/assets/naturalCritLogoWhite.svg") center / contain no-repeat; + -webkit-mask : url('/assets/naturalCritLogoWhite.svg') center / contain no-repeat; + mask : url('/assets/naturalCritLogoWhite.svg') center / contain no-repeat; } .homebreweryIcon.red { background-color : red; } .homebreweryIcon.gold { background-image : linear-gradient(to top left, brown 22.5%, gold 40%, white 60%, gold 67.5%, brown 82.5%); } @@ -493,12 +491,8 @@ body { counter-reset : page-numbers 0; } .pageNumber { left : 30px; } } - .resetCounting { - counter-set : page-numbers 1; - } + .resetCounting { counter-set : page-numbers 1; } - &:not(:has(.skipCounting)) { - counter-increment : page-numbers; - } + &:not(:has(.skipCounting)) { counter-increment : page-numbers; } } diff --git a/themes/V3/Journal/style.less b/themes/V3/Journal/style.less index b8ed3ce8f..bddefb749 100644 --- a/themes/V3/Journal/style.less +++ b/themes/V3/Journal/style.less @@ -11,47 +11,35 @@ --HB_Color_WatercolorStain : #BBAD82; // Light brown } -.useSansSerif(){ - font-family : PermanentMarker; +.useSansSerif() { + font-family : "PermanentMarker"; font-size : 0.3cm; line-height : 1.2em; color : var(--HB_Color_Text2); - p,dl,ul,ol { - line-height : 1.2em; - } - ul, ol { - padding-left : 1em; - } - em{ - font-style : italic; - } - strong{ - font-weight : 800; + p,dl,ul,ol { line-height : 1.2em; } + ul, ol { padding-left : 1em; } + em { font-style : italic; } + strong { font-size : 1.1em; + font-weight : 800; } - h5 + * { - margin-top : 0.1cm; - } -} -.useColumns(@multiplier : 1, @fillMode: balance){ - column-gap : 0.5cm; + h5 + * { margin-top : 0.1cm; } } +.useColumns(@multiplier : 1, @fillMode: balance) { column-gap : 0.5cm; } -.page{ - background-size : 200% 100%; - background-repeat : no-repeat; - filter : drop-shadow(1px 4px 14px black); - background-image : url(/assets/Journal/Background1.webp); +.page { padding : 2.1cm 1.9cm 1.7cm 3.8cm; - &:nth-of-type(2n + 1) { - background-position : left; - } + background-image : url("/assets/Journal/Background1.webp"); + background-repeat : no-repeat; + background-size : 200% 100%; + filter : drop-shadow(1px 4px 14px black); + &:nth-of-type(2n + 1) { background-position : left; } &:nth-of-type(2n) { - background-position : right; padding : 2.1cm 3.9cm 1.7cm 1.8cm; + background-position : right; } &:nth-of-type(2) { - background-image : url(/assets/Journal/Background2.webp); //Only first page should show ribbon + background-image : url("/assets/Journal/Background2.webp"); //Only first page should show ribbon } & .columnWrapper { @@ -59,167 +47,137 @@ } } - //***************************** - // * BASE +//***************************** +// * BASE // *****************************/ -.page{ - color : var(--HB_Color_Text); - font-family : ReenieBeanie; +.page { + font-family : "ReenieBeanie"; font-size : 0.53cm; line-height : 0.8em; - p + * { - margin-top : 0.325cm; - } - p + p{ - margin-top : 0; - } - ul{ - margin-bottom : 0.8em; - } - ol{ - margin-bottom : 0.8em; - } - em{ + color : var(--HB_Color_Text); + p + * { margin-top : 0.325cm; } + p + p { margin-top : 0; } + ul { margin-bottom : 0.8em; } + ol { margin-bottom : 0.8em; } + em { + font-style : unset; text-decoration : underline; - font-style : unset; - } - del{ - text-decoration-style: double; } + del { text-decoration-style : double; } //Indents after p or lists - p+p, ul+p, ol+p{ - text-indent : 1em; - } + p + p, ul + p, ol + p { text-indent : 1em; } //***************************** // * HEADERS // *****************************/ - h1,h2,h3,h4,h5{ - font-family : FrederickaTheGreat; + h1,h2,h3,h4,h5 { + font-family : "FrederickaTheGreat"; font-weight : unset; color : var(--HB_Color_HeaderText); } - h1{ + h1 { margin-bottom : 0.18cm; //Margin-bottom only because this is WIDE font-size : 0.89cm; - line-height : 1em; font-variant : small-caps; - &+p::first-letter{ + line-height : 1em; + & + p::first-letter { float : left; - font-family : FrederickaTheGreat; - line-height : 1em; - font-size : 1.9em; - padding-left : 40px; //Allow background color to extend into margins - margin-top : -0.3cm; - margin-bottom : -20px; - margin-left : -40px; - margin-right : 0.1em; padding-top : 0.3em; padding-bottom : 2px; + padding-left : 40px; //Allow background color to extend into margins + margin-top : -0.3cm; + margin-right : 0.1em; + margin-bottom : -20px; + margin-left : -40px; + font-family : "FrederickaTheGreat"; + font-size : 1.9em; + line-height : 1em; } - &+p::first-line{ - font-variant : small-caps; - } + & + p::first-line { font-variant : small-caps; } } - h2{ + h2 { font-size : 0.62cm; line-height : 0.988em; //Font is misaligned. Shift up slightly } - h3{ + h3 { + margin-left : -0.9em; font-size : 0.575cm; line-height : 0.995em; //Font is misaligned. Shift up slightly - margin-left : -0.9em; } - h4{ + h4 { + padding-bottom : 5px; font-size : 0.55cm; line-height : 0.971em; //Font is misaligned. Shift up slightly color : var(--HB_Color_Text); - padding-bottom : 5px; - transform:rotate(0deg); - &:nth-of-type(2n) { - transform:rotate(1deg); - } - &:nth-of-type(3n) { - transform:rotate(-1.5deg); - } + transform : rotate(0deg); + &:nth-of-type(2n) { transform : rotate(1deg); } + &:nth-of-type(3n) { transform : rotate(-1.5deg); } } - h5{ - font-family : PermanentMarker; + h5 { + font-family : "PermanentMarker"; font-size : 0.4cm; - color : var(--HB_Color_Text2); font-weight : bold; line-height : 0.951em; //Font is misaligned. Shift up slightly - & + * { - margin-top : 0.2cm; - } + color : var(--HB_Color_Text2); + & + * { margin-top : 0.2cm; } } //***************************** // * TABLE // *****************************/ - table{ + table { .useSansSerif(); - & + * { - margin-top : 0.325cm; - } - thead{ - th{ - vertical-align : bottom; + & + * { margin-top : 0.325cm; } + thead { + th { padding : 0.14em 0; + vertical-align : bottom; } } - tbody{ - tr{ - td{ - padding : 0.14em 0; - } - &:nth-child(odd){ - background-image : linear-gradient(to left, #41212100, #41212122, #41212100); - } + tbody { + tr { + td { padding : 0.14em 0; } + &:nth-child(odd) { background-image : linear-gradient(to left, #41212100, #41212122, #41212100); } } } } //***************************** // * NOTE // *****************************/ - .note{ + .note { .useSansSerif(); + padding : 0.2cm; + background-image : url("/assets/Journal/HashMarks.png"), + linear-gradient(to bottom right, #FF000000, #A36A4E14, #41212100); + background-repeat : no-repeat; + background-position : center; + background-size : 120% 120%; border-style : solid; border-width : 1px; - border-image-source : url(/assets/Journal/Border1.png); + border-image-source : url("/assets/Journal/Border1.png"); border-image-slice : 18 18 18 18; border-image-width : 6px 6px 6px 6px; border-image-outset : 5px 5px 5px 5px; border-image-repeat : stretch stretch; - background-image : url(/assets/Journal/HashMarks.png), - linear-gradient(to bottom right, #ff000000, #a36a4e14, #41212100); - background-size : 120% 120%; - background-repeat : no-repeat; - background-position : center; - padding : 0.2cm; :where(&) { margin-top : 9px; //Prevent top border getting cut off on colbreak } - & + * { - margin-top : 0.45cm; - } - h5 { - font-size : 0.375cm; - } - p{ - padding-bottom : 0px; - } - :last-child { - margin-bottom : 0; - } + & + * { margin-top : 0.45cm; } + h5 { font-size : 0.375cm; } + p { padding-bottom : 0px; } + :last-child { margin-bottom : 0; } } //************************************ // * DESCRIPTIVE TEXT BOX // ************************************/ - * + .descriptive { - margin-top : 0.6cm; - } - .descriptive{ + * + .descriptive { margin-top : 0.6cm; } + .descriptive { .useSansSerif(); + padding : 0.2cm; + background-image : url("/assets/Journal/HashMarks.png"), + linear-gradient(to bottom right, #FF000000, #41212114, #41212100); + background-repeat : no-repeat; + background-position : center; + background-size : 120% 120%; border-style : solid; border-width : 1px; border-image-source : url('/assets/Journal/Border2.png'); @@ -227,27 +185,13 @@ border-image-width : 20px; border-image-outset : 16px 20px 16px 20px; border-image-repeat : stretch stretch; - background-image : url(/assets/Journal/HashMarks.png), - linear-gradient(to bottom right, #ff000000, #41212114, #41212100); - background-size : 120% 120%; - background-repeat : no-repeat; - background-position : center; - padding : 0.2cm; :where(&) { margin-top : 4px; //Prevent top border getting cut off on colbreak } - & + * { - margin-top : 0.45cm; - } - h5 { - font-size : 0.375cm; - } - p{ - padding-bottom : 0px; - } - :last-child { - margin-bottom : 0; - } + & + * { margin-top : 0.45cm; } + h5 { font-size : 0.375cm; } + p { padding-bottom : 0px; } + :last-child { margin-bottom : 0; } } //***************************** // * Images Snippets @@ -257,25 +201,23 @@ .artist { position : absolute; width : auto; - text-align : center; - font-family : WalterTurncoat; + font-family : "WalterTurncoat"; font-size : 0.27cm; color : var(--HB_Color_CaptionText); + text-align : center; p, p + p { margin : unset; - text-indent : unset; line-height : 1em; + text-indent : unset; } - h5 { + h5 { + font-family : "WalterTurncoat"; font-size : 1.3em; - font-family : WalterTurncoat; } - a{ + a { color : inherit; text-decoration : unset; - &:hover { - text-decoration : underline; - } + &:hover { text-decoration : underline; } } } @@ -285,6 +227,10 @@ .monster { .useSansSerif(); &.frame { + padding : 0.2cm; + background-image : url('/assets/Journal/HashMarks.png'), + linear-gradient(to bottom right, #FF000000, #A36A4E14, #41212100); + background-size : 100%; border-style : solid; border-width : 7px 6px; border-image-source : url('/assets/Journal/Border3.png'); @@ -292,33 +238,29 @@ border-image-width : 15px 20px 15px 20px; border-image-outset : 12px 12px 12px 12px; border-image-repeat : stretch round; - background-image : url('/assets/Journal/HashMarks.png'), - linear-gradient(to bottom right, #ff000000, #a36a4e14, #41212100); background-blend-mode : screen multiply; - background-size : 100%; - padding : 0.2cm; } - - color: var(--HB_Color_Text); position : relative; padding : 0px; margin-bottom : 0.325cm; + color : var(--HB_Color_Text); + //Headers - h2{ + h2 { + margin : 0; font-size : 0.62cm; line-height : 1em; - margin : 0; - &+p { + & + p { margin-bottom : 0; //Monster size and type subtext } } - h3{ + h3 { + padding-bottom : 0.05cm; margin-left : 0; font-variant : small-caps; - padding-bottom : 0.05cm; } - hr{ + hr { visibility : visible; height : 6px; margin : 0.12cm 0cm; @@ -330,24 +272,18 @@ } // Monster Ability table - hr + table:first-of-type{ + hr + table:first-of-type { margin : 0; - column-span : none; - background-image : none; + color : inherit; + background-image : none; border-style : none; border-image : none; - color : inherit; - tr { - background-image : none; - } - td,th { - padding: 0px; - } + column-span : none; + tr { background-image : none; } + td,th { padding : 0px; } } - :last-child { - margin-bottom : 0; - } + :last-child { margin-bottom : 0; } strong, em { font-style : normal; @@ -356,29 +292,27 @@ } //Full Width - .monster.wide{ + .monster.wide { .useColumns(0.96, @fillMode: balance); } //***************************** // * FOOTER // *****************************/ - &:nth-child(odd){ - .pageNumber{ - left : 3cm; - } - .footnote{ + &:nth-child(odd) { + .pageNumber { left : 3cm; } + .footnote { left : 4.5cm; text-align : left; } } - .pageNumber{ - font-family : FrederickaTheGreat; + .pageNumber { right : 3cm; bottom : 1.25cm; + font-family : "FrederickaTheGreat"; color : var(--HB_Color_HeaderText); } - .footnote{ + .footnote { position : absolute; right : 4.5cm; bottom : 1.25cm; @@ -391,154 +325,134 @@ //************************************ // * CODE BLOCKS // ************************************/ - code{ - font-size : 0.3cm; + code { padding : 0px 4px; - color : var(--HB_Color_Text); + font-size : 0.3cm; vertical-align : middle; - background-color : #faf7ea; + color : var(--HB_Color_Text); + background-color : #FAF7EA; border-radius : 4px; } - pre code{ + 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; - border-radius : 12px; - margin-bottom : 2px; - padding : 0.15cm; .page :where(&) { margin-top : 2px; //Prevent top border getting cut off on colbreak } - & + * { - margin-top : 0.325cm; - } + & + * { margin-top : 0.325cm; } } //***************************** // * EXTRAS // *****************************/ - hr{ + hr { visibility : hidden; - border : none; margin : 0px; + border : none; } //Text indent right after table - table+p{ - text-indent : 1em; - } + table + p { text-indent : 1em; } a, a:visited, a:hover { - color: var(--HB_Color_Text); - transition:all 1s ease; - } - a:hover { - color:red; + color : var(--HB_Color_Text); + transition : all 1s ease; } + a:hover { color : red; } } //***************************** // * SPELL LIST // *****************************/ -.page .spellList{ +.page .spellList { .useSansSerif(); - font-family : PermanentMarker; + font-family : "PermanentMarker"; column-count : 2; - ul+h5{ - margin-top : 15px; - } - ul{ - margin-bottom : 0.5em; + ul + h5 { margin-top : 15px; } + 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; - break-inside : auto; - } - &.wide{ - column-count : 4; } + &.wide { column-count : 4; } } //***************************** // * CLASS TABLE // *****************************/ -.page .classTable{ - th[colspan]:not([rowspan]) { - white-space : nowrap; - } - h5 + table{ - margin-top : 0.2cm; - } +.page .classTable { + th[colspan]:not([rowspan]) { white-space : nowrap; } + h5 + table { margin-top : 0.2cm; } } //***************************** // * TABLE OF CONTENTS // *****************************/ -.page .toc{ +.page .toc { -webkit-column-break-inside : avoid; page-break-inside : avoid; break-inside : avoid; h1 { - text-align : center; margin-bottom : 0.3cm; + text-align : center; } - a{ + a { display : inline; color : inherit; text-decoration : none; - &:hover{ - text-decoration : underline; - } + &:hover { text-decoration : underline; } } h4 { margin-top : 0.2cm; line-height : 0.4cm; - & + ul li { - line-height: 1.2em; - } + & + ul li { line-height : 1.2em; } } - ul{ + ul { padding-left : 0; list-style-type : none; li + li h3 { margin-top : 0.26cm; - line-height : 1em - } - h3 span:first-child::after { - border : none; + line-height : 1em; } + h3 span:first-child::after { border : none; } span { display : table-cell; &:first-child { - position : relative; - overflow : hidden; + position : relative; + overflow : hidden; &::after { - content : ""; position : absolute; bottom : 0.08cm; - margin-left : 0.06cm; /* Spacing before dot leaders */ width : 100%; - border-bottom : 0.05cm dotted #000; + margin-left : 0.06cm; /* Spacing before dot leaders */ + content : ''; + border-bottom : 0.05cm dotted #000000; } } &:last-child { - font-family : ReenieBeanie; - font-size : 0.34cm; - font-weight : normal; - color : black; - text-align : right; - vertical-align : bottom; /* Keep page number bottom-aligned */ width : 1%; padding-left : 0.06cm; /* Spacing after dot leaders */ - /*white-space : nowrap; /* Uncomment if needed */ + font-family : "ReenieBeanie"; + font-size : 0.34cm; + font-weight : normal; + vertical-align : bottom; /* Keep page number bottom-aligned */ + color : black; + text-align : right; + /* white-space : nowrap; /* Uncomment if needed */ } } - ul { /*List indent*/ + ul { /* List indent */ margin-left : 1em; } } - &.wide{ + &.wide { .useColumns(0.96, @fillMode: balance); } } @@ -546,6 +460,4 @@ //***************************** // * WIDE // *****************************/ -.page .wide { - margin-bottom : 0.45cm; -} +.page .wide { margin-bottom : 0.45cm; } diff --git a/themes/codeMirror/customEditorStyles.less b/themes/codeMirror/customEditorStyles.less index 367eaec33..8c48c1b43 100644 --- a/themes/codeMirror/customEditorStyles.less +++ b/themes/codeMirror/customEditorStyles.less @@ -1,88 +1,83 @@ .editor .codeEditor .CodeMirror { - // Themes with dark backgrounds - &.cm-s-3024-night, - &.cm-s-abbott, - &.cm-s-abcdef, - &.cm-s-ambiance, - &.cm-s-ayu-dark, - &.cm-s-ayu-mirage, - &.cm-s-base16-dark, - &.cm-s-bespin, - &.cm-s-blackboard, - &.cm-s-cobalt, - &.cm-s-colorforth, - &.cm-s-darcula, - &.cm-s-dracula, - &.cm-s-duotone-dark, - &.cm-s-erlang-dark, - &.cm-s-gruvbox-dark, - &.cm-s-hopscotch, - &.cm-s-icecoder, - &.cm-s-isotope, - &.cm-s-lesser-dark, - &.cm-s-liquibyte, - &.cm-s-lucario, - &.cm-s-material, - &.cm-s-material-darker, - &.cm-s-material-ocean, - &.cm-s-material-palenight, - &.cm-s-mbo, - &.cm-s-midnight, - &.cm-s-monokai, - &.cm-s-moxer, - &.cm-s-night, - &.cm-s-nord, - &.cm-s-oceanic-next, - &.cm-s-panda-syntax, - &.cm-s-paraiso-dark, - &.cm-s-pastel-on-dark, - &.cm-s-railscasts, - &.cm-s-rubyblue, - &.cm-s-seti, - &.cm-s-shadowfox, - &.cm-s-the-matrix, - &.cm-s-tomorrow-night-bright, - &.cm-s-tomorrow-night-eighties, - &.cm-s-twilight, - &.cm-s-vibrant-ink, - &.cm-s-xq-dark, - &.cm-s-yonce, - &.cm-s-zenburn - { - .CodeMirror-code { - .block:not(.cm-comment) { - color: magenta; - } - .columnSplit { - color: black; - background-color: rgba(35,153,153,0.5); - } - .pageLine { - background-color: rgba(255,255,255,0.5); - & ~ pre.CodeMirror-line { - color: black; - } - } - } - } - // Themes with light backgrounds - &.cm-s-default, - &.cm-s-3024-day, - &.cm-s-ambiance-mobile, - &.cm-s-base16-light, - &.cm-s-duotone-light, - &.cm-s-eclipse, - &.cm-s-elegant, - &.cm-s-juejin, - &.cm-s-neat, - &.cm-s-neo, - &.cm-s-paraiso-lightm - &.cm-s-solarized, - &.cm-s-ssms, - &.cm-s-ttcn, - &.cm-s-xq-light, - &.cm-s-yeti { - // Future styling for themes with light backgrounds - --dummyVar: 'currently unused'; - } + // Themes with dark backgrounds + &.cm-s-3024-night, + &.cm-s-abbott, + &.cm-s-abcdef, + &.cm-s-ambiance, + &.cm-s-ayu-dark, + &.cm-s-ayu-mirage, + &.cm-s-base16-dark, + &.cm-s-bespin, + &.cm-s-blackboard, + &.cm-s-cobalt, + &.cm-s-colorforth, + &.cm-s-darcula, + &.cm-s-dracula, + &.cm-s-duotone-dark, + &.cm-s-erlang-dark, + &.cm-s-gruvbox-dark, + &.cm-s-hopscotch, + &.cm-s-icecoder, + &.cm-s-isotope, + &.cm-s-lesser-dark, + &.cm-s-liquibyte, + &.cm-s-lucario, + &.cm-s-material, + &.cm-s-material-darker, + &.cm-s-material-ocean, + &.cm-s-material-palenight, + &.cm-s-mbo, + &.cm-s-midnight, + &.cm-s-monokai, + &.cm-s-moxer, + &.cm-s-night, + &.cm-s-nord, + &.cm-s-oceanic-next, + &.cm-s-panda-syntax, + &.cm-s-paraiso-dark, + &.cm-s-pastel-on-dark, + &.cm-s-railscasts, + &.cm-s-rubyblue, + &.cm-s-seti, + &.cm-s-shadowfox, + &.cm-s-the-matrix, + &.cm-s-tomorrow-night-bright, + &.cm-s-tomorrow-night-eighties, + &.cm-s-twilight, + &.cm-s-vibrant-ink, + &.cm-s-xq-dark, + &.cm-s-yonce, + &.cm-s-zenburn { + .CodeMirror-code { + .block:not(.cm-comment) { color : magenta; } + .columnSplit { + color : black; + background-color : rgba(35,153,153,0.5); + } + .pageLine { + background-color : rgba(255,255,255,0.5); + & ~ pre.CodeMirror-line { color : black; } + } + } + } + // Themes with light backgrounds + &.cm-s-default, + &.cm-s-3024-day, + &.cm-s-ambiance-mobile, + &.cm-s-base16-light, + &.cm-s-duotone-light, + &.cm-s-eclipse, + &.cm-s-elegant, + &.cm-s-juejin, + &.cm-s-neat, + &.cm-s-neo, + &.cm-s-paraiso-lightm + &.cm-s-solarized, + &.cm-s-ssms, + &.cm-s-ttcn, + &.cm-s-xq-light, + &.cm-s-yeti { + // Future styling for themes with light backgrounds + --dummyVar : 'currently unused'; + } } diff --git a/themes/fonts/5e legacy/fonts.less b/themes/fonts/5e legacy/fonts.less index d4c10c456..680e395ec 100644 --- a/themes/fonts/5e legacy/fonts.less +++ b/themes/fonts/5e legacy/fonts.less @@ -1,61 +1,61 @@ /* Main Font, serif */ @font-face { - font-family: BookSanity; - src: url('../../../fonts/5e legacy/Bookinsanity.woff2'); - font-weight: normal; - font-style: normal; + font-family : "BookSanity"; + font-style : normal; + font-weight : normal; + src : url('../../../fonts/5e legacy/Bookinsanity.woff2'); } @font-face { - font-family: BookSanity; - src: url('../../../fonts/5e legacy/Bookinsanity Bold.woff2'); - font-weight: bold; - font-style: normal; + font-family : "BookSanity"; + font-style : normal; + font-weight : bold; + src : url('../../../fonts/5e legacy/Bookinsanity Bold.woff2'); } @font-face { - font-family: BookSanity; - src: url('../../../fonts/5e legacy/Bookinsanity Italic.woff2'); - font-weight: normal; - font-style: italic; + font-family : "BookSanity"; + font-style : italic; + font-weight : normal; + src : url('../../../fonts/5e legacy/Bookinsanity Italic.woff2'); } @font-face { - font-family: BookSanity; - src: url('../../../fonts/5e legacy/Bookinsanity Bold Italic.woff2'); - font-weight: bold; - font-style: italic; + font-family : "BookSanity"; + font-style : italic; + font-weight : bold; + src : url('../../../fonts/5e legacy/Bookinsanity Bold Italic.woff2'); } /* Notes and Tables, sans-serif */ @font-face { - font-family: ScalySans; - src: url('../../../fonts/5e legacy/Scaly Sans.woff2'); - font-weight: normal; - font-style: normal; + font-family : "ScalySans"; + font-style : normal; + font-weight : normal; + src : url('../../../fonts/5e legacy/Scaly Sans.woff2'); } @font-face { - font-family: ScalySansSmallCaps; - src: url('../../../fonts/5e legacy/Scaly Sans Caps.woff2'); - font-weight: normal; - font-style: normal; + font-family : "ScalySansSmallCaps"; + font-style : normal; + font-weight : normal; + src : url('../../../fonts/5e legacy/Scaly Sans Caps.woff2'); } @font-face { - font-family: WalterTurncoat; - src: url('../../../fonts/5e legacy/WalterTurncoat-Regular.woff2'); - font-weight: normal; - font-style: normal; + font-family : "WalterTurncoat"; + font-style : normal; + font-weight : normal; + src : url('../../../fonts/5e legacy/WalterTurncoat-Regular.woff2'); } /* Headers */ @font-face { - font-family: MrJeeves; - src: url('../../../fonts/5e legacy/Mr Eaves Small Caps.woff2'); - font-weight: normal; - font-style: normal; + font-family : "MrJeeves"; + font-style : normal; + font-weight : normal; + src : url('../../../fonts/5e legacy/Mr Eaves Small Caps.woff2'); } /* Fancy Drop Cap */ @font-face { - font-family: Solberry; - src: url('../../../fonts/5e legacy/Solbera Imitation.woff2'); - font-weight: normal; - font-style: normal; + font-family : "Solberry"; + font-style : normal; + font-weight : normal; + src : url('../../../fonts/5e legacy/Solbera Imitation.woff2'); } diff --git a/themes/fonts/5e/fonts.less b/themes/fonts/5e/fonts.less index c028b06f9..eec5c418f 100644 --- a/themes/fonts/5e/fonts.less +++ b/themes/fonts/5e/fonts.less @@ -1,143 +1,143 @@ /* Main Font, serif */ @font-face { - font-family: BookInsanityRemake; - src: url('../../../fonts/5e/Bookinsanity.woff2'); - font-weight: normal; - font-style: normal; + font-family : "BookInsanityRemake"; + font-style : normal; + font-weight : normal; + src : url('../../../fonts/5e/Bookinsanity.woff2'); } @font-face { - font-family: BookInsanityRemake; - src: url('../../../fonts/5e/Bookinsanity Bold.woff2'); - font-weight: bold; - font-style: normal; + font-family : "BookInsanityRemake"; + font-style : normal; + font-weight : bold; + src : url('../../../fonts/5e/Bookinsanity Bold.woff2'); } @font-face { - font-family: BookInsanityRemake; - src: url('../../../fonts/5e/Bookinsanity Italic.woff2'); - font-weight: normal; - font-style: italic; + font-family : "BookInsanityRemake"; + font-style : italic; + font-weight : normal; + src : url('../../../fonts/5e/Bookinsanity Italic.woff2'); } @font-face { - font-family: BookInsanityRemake; - src: url('../../../fonts/5e/Bookinsanity Bold Italic.woff2'); - font-weight: bold; - font-style: italic; + font-family : "BookInsanityRemake"; + font-style : italic; + font-weight : bold; + src : url('../../../fonts/5e/Bookinsanity Bold Italic.woff2'); } /* Notes and Tables, sans-serif */ @font-face { - font-family: ScalySansRemake; - src: url('../../../fonts/5e/Scaly Sans.woff2'); - font-weight: normal; - font-style: normal; + font-family : "ScalySansRemake"; + font-style : normal; + font-weight : normal; + src : url('../../../fonts/5e/Scaly Sans.woff2'); } @font-face { - font-family: ScalySansRemake; - src: url('../../../fonts/5e/Scaly Sans Bold.woff2'); - font-weight: bold; - font-style: normal; + font-family : "ScalySansRemake"; + font-style : normal; + font-weight : bold; + src : url('../../../fonts/5e/Scaly Sans Bold.woff2'); } @font-face { - font-family: ScalySansRemake; - src: url('../../../fonts/5e/Scaly Sans Italic.woff2'); - font-weight: normal; - font-style: italic; + font-family : "ScalySansRemake"; + font-style : italic; + font-weight : normal; + src : url('../../../fonts/5e/Scaly Sans Italic.woff2'); } @font-face { - font-family: ScalySansRemake; - src: url('../../../fonts/5e/Scaly Sans Bold Italic.woff2'); - font-weight: bold; - font-style: italic; + font-family : "ScalySansRemake"; + font-style : italic; + font-weight : bold; + src : url('../../../fonts/5e/Scaly Sans Bold Italic.woff2'); } @font-face { - font-family: ScalySansSmallCapsRemake; - src: url('../../../fonts/5e/Scaly Sans Caps.woff2'); - font-weight: normal; - font-style: normal; + font-family : "ScalySansSmallCapsRemake"; + font-style : normal; + font-weight : normal; + src : url('../../../fonts/5e/Scaly Sans Caps.woff2'); } @font-face { - font-family: WalterTurncoat; - src: url('../../../fonts/5e/WalterTurncoat-Regular.woff2'); - font-weight: normal; - font-style: normal; + font-family : "WalterTurncoat"; + font-style : normal; + font-weight : normal; + src : url('../../../fonts/5e/WalterTurncoat-Regular.woff2'); } /* Headers */ @font-face { - font-family: MrEavesRemake; - src: url('../../../fonts/5e/Mr Eaves Small Caps.woff2'); - font-weight: normal; - font-style: normal; + font-family : "MrEavesRemake"; + font-style : normal; + font-weight : normal; + src : url('../../../fonts/5e/Mr Eaves Small Caps.woff2'); } /* Fancy Drop Cap */ @font-face { - font-family: SolberaImitationRemake; //Tweaked 5e version - src: url('../../../fonts/5e/Solbera Imitation Tweak.woff2'); - font-weight: 100 1000; - font-style: normal; - font-style: italic; + font-family : "SolberaImitationRemake"; //Tweaked 5e version + font-style : normal; + font-style : italic; + font-weight : 100 1000; + src : url('../../../fonts/5e/Solbera Imitation Tweak.woff2'); } /* Cover Page */ @font-face { - font-family: NodestoCapsCondensed; - src: url('../../../fonts/5e/Nodesto Caps Condensed.woff2'); - font-weight: normal; - font-style: normal; + font-family : "NodestoCapsCondensed"; + font-style : normal; + font-weight : normal; + src : url('../../../fonts/5e/Nodesto Caps Condensed.woff2'); } @font-face { - font-family: NodestoCapsCondensed; - src: url('../../../fonts/5e/Nodesto Caps Condensed Bold.woff2'); - font-weight: bold; - font-style: normal; + font-family : "NodestoCapsCondensed"; + font-style : normal; + font-weight : bold; + src : url('../../../fonts/5e/Nodesto Caps Condensed Bold.woff2'); } @font-face { - font-family: NodestoCapsCondensed; - src: url('../../../fonts/5e/Nodesto Caps Condensed Italic.woff2'); - font-weight: normal; - font-style: italic; + font-family : "NodestoCapsCondensed"; + font-style : italic; + font-weight : normal; + src : url('../../../fonts/5e/Nodesto Caps Condensed Italic.woff2'); } @font-face { - font-family: NodestoCapsCondensed; - src: url('../../../fonts/5e/Nodesto Caps Condensed Bold Italic.woff2'); - font-weight: bold; - font-style: italic; + font-family : "NodestoCapsCondensed"; + font-style : italic; + font-weight : bold; + src : url('../../../fonts/5e/Nodesto Caps Condensed Bold Italic.woff2'); } @font-face { - font-family: NodestoCapsWide; - src: url('../../../fonts/5e/Nodesto Caps Wide.woff2'); - font-weight: normal; - font-style: normal + font-family : "NodestoCapsWide"; + font-style : normal; + font-weight : normal; + src : url('../../../fonts/5e/Nodesto Caps Wide.woff2'); } @font-face { - font-family: Overpass; - src: url('../../../fonts/5e/Overpass Medium.woff2'); - font-weight: 500; - font-style: normal; + font-family : "Overpass"; + font-style : normal; + font-weight : 500; + src : url('../../../fonts/5e/Overpass Medium.woff2'); } @font-face { - font-family: Davek; - src: url('../../../fonts/5e/Davek.woff2'); - font-weight: 500; - font-style: normal; + font-family : "Davek"; + font-style : normal; + font-weight : 500; + src : url('../../../fonts/5e/Davek.woff2'); } @font-face { - font-family: Iokharic; - src: url('../../../fonts/5e/Iokharic.woff2'); - font-weight: 500; - font-style: normal; + font-family : "Iokharic"; + font-style : normal; + font-weight : 500; + src : url('../../../fonts/5e/Iokharic.woff2'); } @font-face { - font-family: Rellanic; - src: url('../../../fonts/5e/Rellanic.woff2'); - font-weight: 500; - font-style: normal; + font-family : "Rellanic"; + font-style : normal; + font-weight : 500; + src : url('../../../fonts/5e/Rellanic.woff2'); } diff --git a/themes/fonts/Blank/fonts.less b/themes/fonts/Blank/fonts.less index 4a3d2d1e8..6558c84b4 100644 --- a/themes/fonts/Blank/fonts.less +++ b/themes/fonts/Blank/fonts.less @@ -18,29 +18,29 @@ License: */ @font-face { - font-family: Pagella; - src: url('../../../fonts/Blank/texgyrepagella-regular.woff2'); - font-weight: normal; - font-style: normal; + font-family : "Pagella"; + font-style : normal; + font-weight : normal; + src : url('../../../fonts/Blank/texgyrepagella-regular.woff2'); } @font-face { - font-family: Pagella; - src: url('../../../fonts/Blank/texgyrepagella-bold.woff2'); - font-weight: bold; - font-style: normal; + font-family : "Pagella"; + font-style : normal; + font-weight : bold; + src : url('../../../fonts/Blank/texgyrepagella-bold.woff2'); } @font-face { - font-family: Pagella; - src: url('../../../fonts/Blank/texgyrepagella-italic.woff2'); - font-weight: normal; - font-style: italic; + font-family : "Pagella"; + font-style : italic; + font-weight : normal; + src : url('../../../fonts/Blank/texgyrepagella-italic.woff2'); } @font-face { - font-family: Pagella; - src: url('../../../fonts/Blank/texgyrepagella-bolditalic.woff2'); - font-weight: bold; - font-style: italic; + font-family : "Pagella"; + font-style : italic; + font-weight : bold; + src : url('../../../fonts/Blank/texgyrepagella-bolditalic.woff2'); } diff --git a/themes/fonts/Journal/fonts.less b/themes/fonts/Journal/fonts.less index 703b594ba..20190c651 100644 --- a/themes/fonts/Journal/fonts.less +++ b/themes/fonts/Journal/fonts.less @@ -1,58 +1,58 @@ /* Main Font, serif */ @font-face { - font-family: ReenieBeanie; - src: url('../../../fonts/Journal/ReenieBeanie-Regular.woff2'); - font-weight: normal; - font-style: normal; + font-family : "ReenieBeanie"; + font-style : normal; + font-weight : normal; + src : url('../../../fonts/Journal/ReenieBeanie-Regular.woff2'); } /* Notes and Tables, sans-serif */ @font-face { - font-family: PermanentMarker; - src: url('../../../fonts/Journal/PermanentMarker-Regular.woff2'); - font-weight: normal; - font-style: normal; + font-family : "PermanentMarker"; + font-style : normal; + font-weight : normal; + src : url('../../../fonts/Journal/PermanentMarker-Regular.woff2'); } @font-face { - font-family: WalterTurncoat; - src: url('../../../fonts/5e/WalterTurncoat-Regular.woff2'); - font-weight: normal; - font-style: normal; + font-family : "WalterTurncoat"; + font-style : normal; + font-weight : normal; + src : url('../../../fonts/5e/WalterTurncoat-Regular.woff2'); } /* Headers */ @font-face { - font-family: FrederickaTheGreat; - src: url('../../../fonts/Journal/FrederickaTheGreat-Regular.woff2'); - font-weight: normal; - font-style: normal; + font-family : "FrederickaTheGreat"; + font-style : normal; + font-weight : normal; + src : url('../../../fonts/Journal/FrederickaTheGreat-Regular.woff2'); } /* Cover Page */ @font-face { - font-family: NodestoCapsCondensed; - src: url('../fonts/5e/Nodesto Caps Condensed.woff2'); - font-weight: normal; - font-style: normal; + font-family : "NodestoCapsCondensed"; + font-style : normal; + font-weight : normal; + src : url('../fonts/5e/Nodesto Caps Condensed.woff2'); } @font-face { - font-family: NodestoCapsCondensed; - src: url('../fonts/5e/Nodesto Caps Condensed Bold.woff2'); - font-weight: bold; - font-style: normal; + font-family : "NodestoCapsCondensed"; + font-style : normal; + font-weight : bold; + src : url('../fonts/5e/Nodesto Caps Condensed Bold.woff2'); } @font-face { - font-family: NodestoCapsCondensed; - src: url('../fonts/5e/Nodesto Caps Condensed Italic.woff2'); - font-weight: normal; - font-style: italic; + font-family : "NodestoCapsCondensed"; + font-style : italic; + font-weight : normal; + src : url('../fonts/5e/Nodesto Caps Condensed Italic.woff2'); } @font-face { - font-family: NodestoCapsCondensed; - src: url('../fonts/5e/Nodesto Caps Condensed Bold Italic.woff2'); - font-weight: bold; - font-style: italic; + font-family : "NodestoCapsCondensed"; + font-style : italic; + font-weight : bold; + src : url('../fonts/5e/Nodesto Caps Condensed Bold Italic.woff2'); } diff --git a/themes/fonts/iconFonts/diceFont.less b/themes/fonts/iconFonts/diceFont.less index ec80f132b..3b60093d0 100644 --- a/themes/fonts/iconFonts/diceFont.less +++ b/themes/fonts/iconFonts/diceFont.less @@ -13,8 +13,8 @@ font-weight : normal; font-variant : normal; line-height : 1; - text-decoration : inherit; text-transform : none; + text-decoration : inherit; text-rendering : optimizeLegibility; /* Better Font Rendering =========== */ diff --git a/themes/phb.depricated.less b/themes/phb.depricated.less index 992dab35b..7cc574183 100644 --- a/themes/phb.depricated.less +++ b/themes/phb.depricated.less @@ -1,31 +1,31 @@ -.phb{ +.phb { //Double hr for full width elements - hr+hr+blockquote{ - column-span : all; + hr + hr + blockquote { -webkit-column-span : all; -moz-column-span : all; + column-span : all; } //***************************** // * CLASS TABLE // *****************************/ - hr+table{ + hr+table { + padding-top : 10px; margin-top : -5px; margin-bottom : 50px; - padding-top : 10px; 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 : 37px 17px; border-image-repeat : round; - border-image-slice : 150 200 150 200; - border-image-source : @frameBorderImage; - border-image-width : 47px; } - h5+hr+table{ - column-span : all; + h5 + hr + table { -webkit-column-span : all; -moz-column-span : all; + column-span : all; } } \ No newline at end of file From f076e05f49f6e9bd74f2ad78990726b0a036d37c Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?V=C3=ADctor=20Losada=20Hern=C3=A1ndez?= Date: Tue, 18 Mar 2025 19:46:11 +0100 Subject: [PATCH 25/29] js files --- .../editor/metadataEditor/validations.js | 12 ++++---- .../pages/errorPage/errors/errorIndex.js | 2 +- scripts/buildHomebrew.js | 8 +++--- server/admin.api.spec.js | 16 +++++------ server/app.js | 1 - server/googleActions.js | 16 +++++------ server/homebrew.api.js | 5 ++-- server/homebrew.model.js | 2 +- shared/naturalcrit/markdown.js | 28 +++++++++---------- tests/markdown/basic.test.js | 2 +- tests/markdown/non-breaking-spaces.test.js | 2 +- .../markdown/paragraph-justification.test.js | 2 +- themes/V3/5eDMG/snippets.js | 2 +- themes/V3/Journal/snippets.js | 2 +- themes/fonts/iconFonts/fontAwesome.js | 2 ++ 15 files changed, 52 insertions(+), 50 deletions(-) diff --git a/client/homebrew/editor/metadataEditor/validations.js b/client/homebrew/editor/metadataEditor/validations.js index b475783a4..858fca6c4 100644 --- a/client/homebrew/editor/metadataEditor/validations.js +++ b/client/homebrew/editor/metadataEditor/validations.js @@ -28,18 +28,18 @@ module.exports = { return new RegExp(/^([a-zA-Z]{2,3})(-[a-zA-Z]{4})?(-(?:[0-9]{3}|[a-zA-Z]{2}))?$/).test(value) === false && (value.length > 0) ? 'Invalid language code.' : null; } ], - theme: [ - (value) => { + theme : [ + (value)=>{ const URL = global.config.baseUrl.replace(/[-/\\^$*+?.()|[\]{}]/g, '\\$&'); //Escape any regex characters const shareIDPattern = '[a-zA-Z0-9-_]{12}'; const shareURLRegex = new RegExp(`^${URL}\\/share\\/${shareIDPattern}$`); const shareIDRegex = new RegExp(`^${shareIDPattern}$`); - if (value?.length === 0) return null; - if (shareURLRegex.test(value)) return null; - if (shareIDRegex.test(value)) return null; + if(value?.length === 0) return null; + if(shareURLRegex.test(value)) return null; + if(shareIDRegex.test(value)) return null; return 'Must be a valid Share URL or a 12-character ID.'; - } + } ] }; diff --git a/client/homebrew/pages/errorPage/errors/errorIndex.js b/client/homebrew/pages/errorPage/errors/errorIndex.js index c2c49f958..9584a14b9 100644 --- a/client/homebrew/pages/errorPage/errors/errorIndex.js +++ b/client/homebrew/pages/errorPage/errors/errorIndex.js @@ -167,7 +167,7 @@ const errorIndex = (props)=>{ **Requested access:** ${props.brew.accessType} **Brew ID:** ${props.brew.brewId}`, - + // Theme Not Valid '10' : dedent` ## The selected theme is not tagged as a theme. diff --git a/scripts/buildHomebrew.js b/scripts/buildHomebrew.js index 656714d87..4d55a4176 100644 --- a/scripts/buildHomebrew.js +++ b/scripts/buildHomebrew.js @@ -10,7 +10,7 @@ import babel from '@babel/core'; import babelConfig from '../babel.config.json' with { type : 'json' }; import less from 'less'; -const isDev = !!process.argv.find((arg) => arg === '--dev'); +const isDev = !!process.argv.find((arg)=>arg === '--dev'); const babelify = async (code)=>(await babel.transformAsync(code, babelConfig)).code; @@ -53,7 +53,7 @@ fs.emptyDirSync('./build'); const themes = { Legacy: {}, V3: {} }; let themeFiles = fs.readdirSync('./themes/Legacy'); - for (let dir of themeFiles) { + for (const dir of themeFiles) { const themeData = JSON.parse(fs.readFileSync(`./themes/Legacy/${dir}/settings.json`).toString()); themeData.path = dir; themes.Legacy[dir] = (themeData); @@ -70,7 +70,7 @@ fs.emptyDirSync('./build'); } themeFiles = fs.readdirSync('./themes/V3'); - for (let dir of themeFiles) { + for (const dir of themeFiles) { const themeData = JSON.parse(fs.readFileSync(`./themes/V3/${dir}/settings.json`).toString()); themeData.path = dir; themes.V3[dir] = (themeData); @@ -113,7 +113,7 @@ fs.emptyDirSync('./build'); const stream = fs.createWriteStream(editorThemeFile, { flags: 'a' }); stream.write('[\n"default"'); - for (let themeFile of editorThemeFiles) { + for (const themeFile of editorThemeFiles) { stream.write(`,\n"${themeFile.slice(0, -4)}"`); } stream.write('\n]\n'); diff --git a/server/admin.api.spec.js b/server/admin.api.spec.js index 6a23393b1..036c238c9 100644 --- a/server/admin.api.spec.js +++ b/server/admin.api.spec.js @@ -1,6 +1,6 @@ import supertest from 'supertest'; import HBApp from './app.js'; -import {model as NotificationModel } from './notifications.model.js'; +import { model as NotificationModel } from './notifications.model.js'; // Mimic https responses to avoid being redirected all the time @@ -16,7 +16,7 @@ describe('Tests for admin api', ()=>{ const testNotifications = ['a', 'b']; jest.spyOn(NotificationModel, 'find') - .mockImplementationOnce(() => { + .mockImplementationOnce(()=>{ return { exec: jest.fn().mockResolvedValue(testNotifications) }; }); @@ -59,7 +59,7 @@ describe('Tests for admin api', ()=>{ expect(response.body).toEqual(savedNotification); }); - it('should handle error adding a notification without dismissKey', async () => { + it('should handle error adding a notification without dismissKey', async ()=>{ const inputNotification = { title : 'Test Notification', text : 'This is a test notification', @@ -75,7 +75,7 @@ describe('Tests for admin api', ()=>{ const response = await app .post('/admin/notification/add') - .set('Authorization', 'Basic ' + Buffer.from('admin:password3').toString('base64')) + .set('Authorization', `Basic ${Buffer.from('admin:password3').toString('base64')}`) .send(inputNotification); expect(response.status).toBe(500); @@ -86,14 +86,14 @@ describe('Tests for admin api', ()=>{ const dismissKey = 'testKey'; jest.spyOn(NotificationModel, 'findOneAndDelete') - .mockImplementationOnce((key) => { + .mockImplementationOnce((key)=>{ return { exec: jest.fn().mockResolvedValue(key) }; }); const response = await app .delete(`/admin/notification/delete/${dismissKey}`) .set('Authorization', `Basic ${Buffer.from('admin:password3').toString('base64')}`); - expect(NotificationModel.findOneAndDelete).toHaveBeenCalledWith({'dismissKey': 'testKey'}); + expect(NotificationModel.findOneAndDelete).toHaveBeenCalledWith({ 'dismissKey': 'testKey' }); expect(response.status).toBe(200); expect(response.body).toEqual({ dismissKey: 'testKey' }); }); @@ -102,14 +102,14 @@ describe('Tests for admin api', ()=>{ const dismissKey = 'testKey'; jest.spyOn(NotificationModel, 'findOneAndDelete') - .mockImplementationOnce(() => { + .mockImplementationOnce(()=>{ return { exec: jest.fn().mockResolvedValue() }; }); const response = await app .delete(`/admin/notification/delete/${dismissKey}`) .set('Authorization', `Basic ${Buffer.from('admin:password3').toString('base64')}`); - expect(NotificationModel.findOneAndDelete).toHaveBeenCalledWith({'dismissKey': 'testKey'}); + expect(NotificationModel.findOneAndDelete).toHaveBeenCalledWith({ 'dismissKey': 'testKey' }); expect(response.status).toBe(500); expect(response.body).toEqual({ message: 'Notification not found' }); }); diff --git a/server/app.js b/server/app.js index 12fe21a1d..079f5e03c 100644 --- a/server/app.js +++ b/server/app.js @@ -11,7 +11,6 @@ const version = packageJSON.version; import _ from 'lodash'; import jwt from 'jwt-simple'; import express from 'express'; -import yaml from 'js-yaml'; import config from './config.js'; import fs from 'fs-extra'; diff --git a/server/googleActions.js b/server/googleActions.js index 2c2cbac73..0ca7556ba 100644 --- a/server/googleActions.js +++ b/server/googleActions.js @@ -27,12 +27,12 @@ if(!config.get('service_account')){ const defaultAuth = serviceAuth || config.get('google_api_key'); const retryConfig = { - retry: 3, // Number of retry attempts - retryDelay: 100, // Initial delay in milliseconds - retryDelayMultiplier: 2, // Multiplier for exponential backoff - maxRetryDelay: 32000, // Maximum delay in milliseconds - httpMethodsToRetry: ['PATCH'], // Only retry PATCH requests - statusCodesToRetry: [[429, 429]], // Only retry on 429 status code + retry : 3, // Number of retry attempts + retryDelay : 100, // Initial delay in milliseconds + retryDelayMultiplier : 2, // Multiplier for exponential backoff + maxRetryDelay : 32000, // Maximum delay in milliseconds + httpMethodsToRetry : ['PATCH'], // Only retry PATCH requests + statusCodesToRetry : [[429, 429]], // Only retry on 429 status code }; const GoogleActions = { @@ -177,8 +177,8 @@ const GoogleActions = { mimeType : 'text/plain', body : brew.text }, - headers: { - 'X-Forwarded-For': userIp, // Set the X-Forwarded-For header + headers : { + 'X-Forwarded-For' : userIp, // Set the X-Forwarded-For header }, retryConfig }) diff --git a/server/homebrew.api.js b/server/homebrew.api.js index 7bd88cbdb..af408e579 100644 --- a/server/homebrew.api.js +++ b/server/homebrew.api.js @@ -92,7 +92,7 @@ const api = { const accessMap = { edit : { editId: id }, share : { shareId: id }, - admin : { $or : [{ editId: id }, { shareId: id }] } + admin : { $or: [{ editId: id }, { shareId: id }] } }; // Try to find the document in the Homebrewery database -- if it doesn't exist, that's fine. @@ -181,6 +181,7 @@ const api = { `${text}`; return text; }, + getGoodBrewTitle : (text)=>{ const tokens = Markdown.marked.lexer(text); return (tokens.find((token)=>token.type === 'heading' || token.type === 'paragraph')?.text || 'No Title') @@ -294,7 +295,7 @@ const api = { currentTheme = req.brew; splitTextStyleAndMetadata(currentTheme); - if(!currentTheme.tags.some(tag => tag === "meta:theme" || tag === "meta:Theme")) + if(!currentTheme.tags.some((tag)=>tag === 'meta:theme' || tag === 'meta:Theme')) throw { brewId: req.params.id, name: 'Invalid Theme Selected', message: 'Selected theme does not have the meta:theme tag', status: 422, HBErrorCode: '10' }; themeName ??= currentTheme.title; themeAuthor ??= currentTheme.authors?.[0]; diff --git a/server/homebrew.model.js b/server/homebrew.model.js index adeac0d5d..15341f5d8 100644 --- a/server/homebrew.model.js +++ b/server/homebrew.model.js @@ -63,7 +63,7 @@ HomebrewSchema.statics.getByUser = async function(username, allowAccess=false, f const Homebrew = mongoose.model('Homebrew', HomebrewSchema); -export { +export { HomebrewSchema as schema, Homebrew as model }; diff --git a/shared/naturalcrit/markdown.js b/shared/naturalcrit/markdown.js index 3334b026c..a8b877f4b 100644 --- a/shared/naturalcrit/markdown.js +++ b/shared/naturalcrit/markdown.js @@ -86,8 +86,8 @@ renderer.paragraph = function(token){ //Fix local links in the Preview iFrame to link inside the frame renderer.link = function (token) { - let {href, title, tokens} = token; - const text = this.parser.parseInline(tokens) + let { href, title, tokens } = token; + const text = this.parser.parseInline(tokens); let self = false; if(href[0] == '#') { self = true; @@ -110,7 +110,7 @@ renderer.link = function (token) { // Expose `src` attribute as `--HB_src` to make the URL accessible via CSS renderer.image = function (token) { - let {href, title, text} = token; + const { href, title, text } = token; if(href === null) return text; @@ -776,7 +776,7 @@ Marked.use({ extensions : [justifiedParagraphs, definitionListsMultiLine, defini Marked.use(mustacheInjectBlock); Marked.use(MarkedSubSuperText()); Marked.use({ renderer: renderer, tokenizer: tokenizer, mangle: false }); -Marked.use(MarkedExtendedTables({interruptPatterns : tableTerminators}), MarkedGFMHeadingId({ globalSlugs: true }), +Marked.use(MarkedExtendedTables({ interruptPatterns: tableTerminators }), MarkedGFMHeadingId({ globalSlugs: true }), MarkedSmartypantsLite(), MarkedEmojis(MarkedEmojiOptions)); function cleanUrl(href) { @@ -841,12 +841,12 @@ const processStyleTags = (string)=>{ obj[key.trim()] = value.trim(); return obj; }, {}) || null; - const styles = tags?.length ? tags.reduce((styleObj, style) => { - const index = style.indexOf(':'); - const [key, value] = [style.substring(0, index), style.substring(index + 1)]; - styleObj[key.trim()] = value.replace(/"?([^"]*)"?/g, '$1').trim(); - return styleObj; - }, {}) : null; + const styles = tags?.length ? tags.reduce((styleObj, style)=>{ + const index = style.indexOf(':'); + const [key, value] = [style.substring(0, index), style.substring(index + 1)]; + styleObj[key.trim()] = value.replace(/"?([^"]*)"?/g, '$1').trim(); + return styleObj; + }, {}) : null; return { id : id, @@ -862,8 +862,8 @@ const extractHTMLStyleTags = (htmlString)=>{ const id = firstElementOnly.match(/id="([^"]*)"/)?.[1] || null; const classes = firstElementOnly.match(/class="([^"]*)"/)?.[1] || null; const styles = firstElementOnly.match(/style="([^"]*)"/)?.[1] - ?.split(';').reduce((styleObj, style) => { - if (style.trim() === '') return styleObj; + ?.split(';').reduce((styleObj, style)=>{ + if(style.trim() === '') return styleObj; const index = style.indexOf(':'); const [key, value] = [style.substring(0, index), style.substring(index + 1)]; styleObj[key.trim()] = value.trim(); @@ -873,7 +873,7 @@ const extractHTMLStyleTags = (htmlString)=>{ ?.filter((attr)=>!attr.startsWith('class="') && !attr.startsWith('style="') && !attr.startsWith('id="')) .reduce((obj, attr)=>{ const index = attr.indexOf('='); - let [key, value] = [attr.substring(0, index), attr.substring(index + 1)]; + const [key, value] = [attr.substring(0, index), attr.substring(index + 1)]; obj[key.trim()] = value.replace(/"/g, ''); return obj; }, {}) || null; @@ -886,7 +886,7 @@ const extractHTMLStyleTags = (htmlString)=>{ }; }; -const mergeHTMLTags = (originalTags, newTags) => { +const mergeHTMLTags = (originalTags, newTags)=>{ return { id : newTags.id || originalTags.id || null, classes : [originalTags.classes, newTags.classes].join(' ').trim() || null, diff --git a/tests/markdown/basic.test.js b/tests/markdown/basic.test.js index e5feec0b3..aaa2adf58 100644 --- a/tests/markdown/basic.test.js +++ b/tests/markdown/basic.test.js @@ -1,4 +1,4 @@ -/* eslint-disable max-lines */ + import Markdown from 'naturalcrit/markdown.js'; diff --git a/tests/markdown/non-breaking-spaces.test.js b/tests/markdown/non-breaking-spaces.test.js index 9dad4eb0f..c4f36554a 100644 --- a/tests/markdown/non-breaking-spaces.test.js +++ b/tests/markdown/non-breaking-spaces.test.js @@ -1,4 +1,4 @@ -/* eslint-disable max-lines */ + import Markdown from 'naturalcrit/markdown.js'; diff --git a/tests/markdown/paragraph-justification.test.js b/tests/markdown/paragraph-justification.test.js index 48b311e85..7876f5a26 100644 --- a/tests/markdown/paragraph-justification.test.js +++ b/tests/markdown/paragraph-justification.test.js @@ -1,4 +1,4 @@ -/* eslint-disable max-lines */ + import Markdown from 'naturalcrit/markdown.js'; diff --git a/themes/V3/5eDMG/snippets.js b/themes/V3/5eDMG/snippets.js index 636befb60..bad5e8e6a 100644 --- a/themes/V3/5eDMG/snippets.js +++ b/themes/V3/5eDMG/snippets.js @@ -1,4 +1,4 @@ -/* eslint-disable max-lines */ + module.exports = [ ]; diff --git a/themes/V3/Journal/snippets.js b/themes/V3/Journal/snippets.js index 636befb60..bad5e8e6a 100644 --- a/themes/V3/Journal/snippets.js +++ b/themes/V3/Journal/snippets.js @@ -1,4 +1,4 @@ -/* eslint-disable max-lines */ + module.exports = [ ]; diff --git a/themes/fonts/iconFonts/fontAwesome.js b/themes/fonts/iconFonts/fontAwesome.js index f5f89e3aa..bf11a7c92 100644 --- a/themes/fonts/iconFonts/fontAwesome.js +++ b/themes/fonts/iconFonts/fontAwesome.js @@ -1,3 +1,5 @@ +/* eslint-disable max-lines */ + const fontAwesome = { // FONT-AWESOME SOLID 'fas_0' : 'fas fa-0', From 8e37806791e4eaf8b5c4cdb12ad9fa32c39a0a41 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?V=C3=ADctor=20Losada=20Hern=C3=A1ndez?= Date: Tue, 18 Mar 2025 19:47:49 +0100 Subject: [PATCH 26/29] jsx files --- client/homebrew/brewRenderer/brewRenderer.jsx | 4 +- .../brewRenderer/headerNav/headerNav.jsx | 16 ++-- .../editor/metadataEditor/metadataEditor.jsx | 1 - .../homebrew/editor/snippetbar/snippetbar.jsx | 96 +++++++++---------- client/homebrew/editor/tagInput/tagInput.jsx | 54 +++++------ .../basePages/listPage/brewItem/brewItem.jsx | 6 +- client/homebrew/pages/homePage/homePage.jsx | 52 +++++----- client/homebrew/pages/newPage/newPage.jsx | 66 ++++++------- shared/naturalcrit/nav/nav.jsx | 4 +- shared/naturalcrit/splitPane/splitPane.jsx | 4 +- 10 files changed, 150 insertions(+), 153 deletions(-) diff --git a/client/homebrew/brewRenderer/brewRenderer.jsx b/client/homebrew/brewRenderer/brewRenderer.jsx index 10d94c5ac..21c0608bd 100644 --- a/client/homebrew/brewRenderer/brewRenderer.jsx +++ b/client/homebrew/brewRenderer/brewRenderer.jsx @@ -189,14 +189,14 @@ const BrewRenderer = (props)=>{ const injectedTags = firstLineTokens.find((obj)=>obj.injectedTags !== undefined)?.injectedTags; if(injectedTags) { styles = { ...styles, ...injectedTags.styles }; - styles = _.mapKeys(styles, (v, k) => k.startsWith('--') ? k : _.camelCase(k)); // Convert CSS to camelCase for React + styles = _.mapKeys(styles, (v, k)=>k.startsWith('--') ? k : _.camelCase(k)); // Convert CSS to camelCase for React classes = [classes, injectedTags.classes].join(' ').trim(); attributes = injectedTags.attributes; } pageText = pageText.includes('\n') ? pageText.substring(pageText.indexOf('\n') + 1) : ''; // Remove the \page line } - let html = Markdown.render(pageText, index); + const html = Markdown.render(pageText, index); return ; } diff --git a/client/homebrew/brewRenderer/headerNav/headerNav.jsx b/client/homebrew/brewRenderer/headerNav/headerNav.jsx index cfc10bbd6..04ced2585 100644 --- a/client/homebrew/brewRenderer/headerNav/headerNav.jsx +++ b/client/homebrew/brewRenderer/headerNav/headerNav.jsx @@ -25,7 +25,7 @@ const HeaderNav = React.forwardRef(({}, pagesRef)=>{ '.toc' : ()=>{ return 'Table of Contents'; }, }; - const getHeaderContent = el => el.querySelector('h1')?.textContent; + const getHeaderContent = (el)=>el.querySelector('h1')?.textContent; const topLevelPageSelector = Object.keys(topLevelPages).join(','); @@ -52,25 +52,23 @@ const HeaderNav = React.forwardRef(({}, pagesRef)=>{ depth : 7, // All unmatched elements with IDs are set to the maximum depth (7) text : el.textContent, // Use `textContent` because `innerText` is affected by rendering, e.g. 'content-visibility: auto' link : el.id - } + }; if(el.classList.contains('page')) { let text = `Page ${el.id.slice(1)}`; // Get the page # by trimming off the 'p' from the ID - const pageType = Object.keys(topLevelPages).find(pageType => el.querySelector(pageType)); - if (pageType) - text += ` - ${topLevelPages[pageType](el, pageType)}` // If a Top Level Page, add extra label + const pageType = Object.keys(topLevelPages).find((pageType)=>el.querySelector(pageType)); + if(pageType) + text += ` - ${topLevelPages[pageType](el, pageType)}`; // If a Top Level Page, add extra label navEntry.depth = 0; // Pages are always at the least indented level navEntry.text = text; navEntry.className = 'pageLink'; - } - else if(el.localName.match(/^h[1-6]/)){ // Header elements H1 through H6 + } else if(el.localName.match(/^h[1-6]/)){ // Header elements H1 through H6 navEntry.depth = el.localName[1]; // Depth is set by the header level } navList.push(navEntry); }); - return _.map(navList, (navItem, index)=> - + return _.map(navList, (navItem, index)=> ); }; diff --git a/client/homebrew/editor/metadataEditor/metadataEditor.jsx b/client/homebrew/editor/metadataEditor/metadataEditor.jsx index 0bafb3f9f..8f256922f 100644 --- a/client/homebrew/editor/metadataEditor/metadataEditor.jsx +++ b/client/homebrew/editor/metadataEditor/metadataEditor.jsx @@ -4,7 +4,6 @@ const React = require('react'); const createClass = require('create-react-class'); const _ = require('lodash'); import request from '../../utils/request-middleware.js'; -const Nav = require('naturalcrit/nav/nav.jsx'); const Combobox = require('client/components/combobox.jsx'); const TagInput = require('../tagInput/tagInput.jsx'); diff --git a/client/homebrew/editor/snippetbar/snippetbar.jsx b/client/homebrew/editor/snippetbar/snippetbar.jsx index f7d9508f8..4d702bfdf 100644 --- a/client/homebrew/editor/snippetbar/snippetbar.jsx +++ b/client/homebrew/editor/snippetbar/snippetbar.jsx @@ -207,59 +207,59 @@ const Snippetbar = createClass({ renderEditorButtons : function(){ if(!this.props.showEditButtons) return; - + return ( -
- {this.props.view !== 'meta' && <>
-
- - { this.state.showHistory && this.renderHistoryItems() } +
+ {this.props.view !== 'meta' && <>
+
+ + { this.state.showHistory && this.renderHistoryItems() } +
+
+ +
+
+ +
-
- -
-
- -
-
-
-
- -
-
- -
-
- - {this.state.themeSelector && this.renderThemeSelector()} -
-
} - +
+
+ +
+
+ +
+
+ + {this.state.themeSelector && this.renderThemeSelector()} +
+
} -
-
this.props.onViewChange('text')}> - -
-
this.props.onViewChange('style')}> - -
-
this.props.onViewChange('meta')}> - -
-
-
- ) +
+
this.props.onViewChange('text')}> + +
+
this.props.onViewChange('style')}> + +
+
this.props.onViewChange('meta')}> + +
+
+ +
+ ); }, render : function(){ diff --git a/client/homebrew/editor/tagInput/tagInput.jsx b/client/homebrew/editor/tagInput/tagInput.jsx index 816541167..d60e23b1b 100644 --- a/client/homebrew/editor/tagInput/tagInput.jsx +++ b/client/homebrew/editor/tagInput/tagInput.jsx @@ -3,43 +3,43 @@ const React = require('react'); const { useState, useEffect } = React; const _ = require('lodash'); -const TagInput = ({ unique = true, values = [], ...props }) => { +const TagInput = ({ unique = true, values = [], ...props })=>{ const [tempInputText, setTempInputText] = useState(''); - const [tagList, setTagList] = useState(values.map((value) => ({ value, editing: false }))); + const [tagList, setTagList] = useState(values.map((value)=>({ value, editing: false }))); useEffect(()=>{ - handleChange(tagList.map((context)=>context.value)) - }, [tagList]) + handleChange(tagList.map((context)=>context.value)); + }, [tagList]); const handleChange = (value)=>{ props.onChange({ target : { value } - }) + }); }; - const handleInputKeyDown = ({ evt, value, index, options = {} }) => { - if (_.includes(['Enter', ','], evt.key)) { + const handleInputKeyDown = ({ evt, value, index, options = {} })=>{ + if(_.includes(['Enter', ','], evt.key)) { evt.preventDefault(); submitTag(evt.target.value, value, index); - if (options.clear) { + if(options.clear) { setTempInputText(''); } } }; - const submitTag = (newValue, originalValue, index) => { - setTagList((prevContext) => { + const submitTag = (newValue, originalValue, index)=>{ + setTagList((prevContext)=>{ // remove existing tag if(newValue === null){ return [...prevContext].filter((context, i)=>i !== index); } // add new tag if(originalValue === null){ - return [...prevContext, { value: newValue, editing: false }] + return [...prevContext, { value: newValue, editing: false }]; } // update existing tag - return prevContext.map((context, i) => { - if (i === index) { + return prevContext.map((context, i)=>{ + if(i === index) { return { ...context, value: newValue, editing: false }; } return context; @@ -47,10 +47,10 @@ const TagInput = ({ unique = true, values = [], ...props }) => { }); }; - const editTag = (index) => { - setTagList((prevContext) => { - return prevContext.map((context, i) => { - if (i === index) { + const editTag = (index)=>{ + setTagList((prevContext)=>{ + return prevContext.map((context, i)=>{ + if(i === index) { return { ...context, editing: true }; } return { ...context, editing: false }; @@ -58,25 +58,25 @@ const TagInput = ({ unique = true, values = [], ...props }) => { }); }; - const renderReadTag = (context, index) => { + const renderReadTag = (context, index)=>{ return (
  • editTag(index)}> + onClick={()=>editTag(index)}> {context.value} - +
    • ); }; - const renderWriteTag = (context, index) => { + const renderWriteTag = (context, index)=>{ return ( handleInputKeyDown({evt, value: context.value, index: index})} - autoFocus + defaultValue={context.value} + onKeyDown={(evt)=>handleInputKeyDown({ evt, value: context.value, index: index })} + autoFocus /> ); }; @@ -86,7 +86,7 @@ const TagInput = ({ unique = true, values = [], ...props }) => {
      - {tagList.map((context, index) => { return context.editing ? renderWriteTag(context, index) : renderReadTag(context, index); })} + {tagList.map((context, index)=>{ return context.editing ? renderWriteTag(context, index) : renderReadTag(context, index); })}
    { className='value' placeholder={props.placeholder} value={tempInputText} - onChange={(e) => setTempInputText(e.target.value)} - onKeyDown={(evt) => handleInputKeyDown({ evt, value: null, options: { clear: true } })} + onChange={(e)=>setTempInputText(e.target.value)} + onKeyDown={(evt)=>handleInputKeyDown({ evt, value: null, options: { clear: true } })} />
    diff --git a/client/homebrew/pages/basePages/listPage/brewItem/brewItem.jsx b/client/homebrew/pages/basePages/listPage/brewItem/brewItem.jsx index ef98e8425..ef309a613 100644 --- a/client/homebrew/pages/basePages/listPage/brewItem/brewItem.jsx +++ b/client/homebrew/pages/basePages/listPage/brewItem/brewItem.jsx @@ -30,11 +30,11 @@ const BrewItem = ({ } request.delete(`/api/${brew.googleId ?? ''}${brew.editId}`).send().end((err, res)=>{ - if (err) reportError(err); else window.location.reload(); - }); + if(err) reportError(err); else window.location.reload(); + }); }, [brew, reportError]); - const updateFilter = useCallback((type, term)=> updateListFilter(type, term), [updateListFilter]); + const updateFilter = useCallback((type, term)=>updateListFilter(type, term), [updateListFilter]); const renderDeleteBrewLink = ()=>{ if(!brew.editId) return null; diff --git a/client/homebrew/pages/homePage/homePage.jsx b/client/homebrew/pages/homePage/homePage.jsx index 00d0c801d..b9c1b7371 100644 --- a/client/homebrew/pages/homePage/homePage.jsx +++ b/client/homebrew/pages/homePage/homePage.jsx @@ -100,32 +100,32 @@ const HomePage = createClass({ return
    {this.renderNavbar()} -
    - - - - +
    + + + +
    Save current diff --git a/client/homebrew/pages/newPage/newPage.jsx b/client/homebrew/pages/newPage/newPage.jsx index 1d5887b8a..7aaeb3fd3 100644 --- a/client/homebrew/pages/newPage/newPage.jsx +++ b/client/homebrew/pages/newPage/newPage.jsx @@ -223,39 +223,39 @@ const NewPage = createClass({ render : function(){ return
    {this.renderNavbar()} -
    - - - - +
    + + + +
    ; } diff --git a/shared/naturalcrit/nav/nav.jsx b/shared/naturalcrit/nav/nav.jsx index d9b403239..50dff4c33 100644 --- a/shared/naturalcrit/nav/nav.jsx +++ b/shared/naturalcrit/nav/nav.jsx @@ -12,8 +12,8 @@ const Nav = { displayName : 'Nav.base', render : function(){ return ; + {this.props.children} + ; } }), logo : function(){ diff --git a/shared/naturalcrit/splitPane/splitPane.jsx b/shared/naturalcrit/splitPane/splitPane.jsx index 1500c759f..4c77d81a5 100644 --- a/shared/naturalcrit/splitPane/splitPane.jsx +++ b/shared/naturalcrit/splitPane/splitPane.jsx @@ -29,8 +29,8 @@ const SplitPane = (props)=>{ const limitPosition = (x, min = 1, max = window.innerWidth - 13)=>Math.round(Math.min(max, Math.max(min, x))); //when resizing, the divider should grow smaller if less space is given, then grow back if the space is restored, to the original position - const handleResize = () =>setDividerPos(limitPosition(window.localStorage.getItem(storageKey), 0.1 * (window.innerWidth - 13), 0.9 * (window.innerWidth - 13))); - + const handleResize = ()=>setDividerPos(limitPosition(window.localStorage.getItem(storageKey), 0.1 * (window.innerWidth - 13), 0.9 * (window.innerWidth - 13))); + const handleUp =(e)=>{ e.preventDefault(); if(isDragging) { From cb618914506f55bcf4523657227bad294cdd1031 Mon Sep 17 00:00:00 2001 From: "G.Ambatte" Date: Sat, 22 Mar 2025 12:31:38 +1300 Subject: [PATCH 27/29] Change local regex testing --- server/app.js | 7 ++----- 1 file changed, 2 insertions(+), 5 deletions(-) diff --git a/server/app.js b/server/app.js index 079f5e03c..6bd0c7c9a 100644 --- a/server/app.js +++ b/server/app.js @@ -69,14 +69,11 @@ const corsOptions = { 'https://homebrewery-stage.herokuapp.com', ]; - if(isLocalEnvironment) { - const localNetworkRegex = /^http:\/\/(localhost|127\.0\.0\.1|10\.\d+\.\d+\.\d+|192\.168\.\d+\.\d+|172\.(1[6-9]|2\d|3[0-1])\.\d+\.\d+):\d+$/; - allowedOrigins.push(localNetworkRegex); - } + const localNetworkRegex = /^http:\/\/(localhost|127\.0\.0\.1|10\.\d+\.\d+\.\d+|192\.168\.\d+\.\d+|172\.(1[6-9]|2\d|3[0-1])\.\d+\.\d+):\d+$/; const herokuRegex = /^https:\/\/(?:homebrewery-pr-\d+\.herokuapp\.com|naturalcrit-pr-\d+\.herokuapp\.com)$/; // Matches any Heroku app - if(!origin || allowedOrigins.includes(origin) || herokuRegex.test(origin)) { + if(!origin || allowedOrigins.includes(origin) || herokuRegex.test(origin) || (isLocalEnvironment && localNetworkRegex.test(origin))) { callback(null, true); } else { console.log(origin, 'not allowed'); From 712ee111d4480121eff300b09b4ab8522135a9da Mon Sep 17 00:00:00 2001 From: David Bolack Date: Sun, 23 Mar 2025 20:48:30 -0500 Subject: [PATCH 28/29] Move Dropcap settings back to PHB --- themes/V3/5ePHB/snippets.js | 30 ++++++++++++++++++++++++++++++ themes/V3/Blank/snippets.js | 25 +------------------------ 2 files changed, 31 insertions(+), 24 deletions(-) diff --git a/themes/V3/5ePHB/snippets.js b/themes/V3/5ePHB/snippets.js index f5c8120c1..27ea62bea 100644 --- a/themes/V3/5ePHB/snippets.js +++ b/themes/V3/5ePHB/snippets.js @@ -12,6 +12,36 @@ const dedent = require('dedent-tabs').default; module.exports = [ + { + groupName : 'Style Editor', + icon : 'fas fa-pencil-alt', + view : 'style', + snippets : [ + { + name : 'Remove Drop Cap', + icon : 'fas fa-remove-format', + gen : dedent`/* Removes Drop Caps */ + .page h1+p:first-letter { + all: unset; + }\n\n + /* Removes Small-Caps in first line */ + .page h1+p:first-line { + all: unset; + }` + }, + { + name : 'Tweak Drop Cap', + icon : 'fas fa-sliders-h', + gen : dedent`/* Drop Cap settings */ + .page h1 + p::first-letter { + font-family: SolberaImitationRemake; + font-size: 3.5cm; + background-image: linear-gradient(-45deg, #322814, #998250, #322814); + line-height: 1em; + }\n\n` + }, + ] + }, /************************* PHB ********************/ { groupName : 'PHB', diff --git a/themes/V3/Blank/snippets.js b/themes/V3/Blank/snippets.js index 08e378490..809035a3a 100644 --- a/themes/V3/Blank/snippets.js +++ b/themes/V3/Blank/snippets.js @@ -201,30 +201,7 @@ module.exports = [ name : 'Add Comment', icon : 'fas fa-code', gen : '/* This is a comment that will not be rendered into your brew. */' - }, - { - name : 'Remove Drop Cap', - icon : 'fas fa-remove-format', - gen : dedent`/* Removes Drop Caps */ - .page h1+p:first-letter { - all: unset; - }\n\n - /* Removes Small-Caps in first line */ - .page h1+p:first-line { - all: unset; - }` - }, - { - name : 'Tweak Drop Cap', - icon : 'fas fa-sliders-h', - gen : dedent`/* Drop Cap settings */ - .page h1 + p::first-letter { - font-family: SolberaImitationRemake; - font-size: 3.5cm; - background-image: linear-gradient(-45deg, #322814, #998250, #322814); - line-height: 1em; - }\n\n` - }, + } ] }, From 3672285e923a2f5de9cef4a2ae7bffff02df47c2 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?V=C3=ADctor=20Losada=20Hern=C3=A1ndez?= Date: Mon, 24 Mar 2025 13:09:56 +0100 Subject: [PATCH 29/29] additional linting pass through themes --- themes/Legacy/5ePHB/style.less | 26 +++++++++++++------------- themes/V3/5eDMG/style.less | 4 ++-- themes/V3/5ePHB/style.less | 2 +- themes/V3/Blank/style.less | 28 +++++++++++++--------------- themes/V3/Journal/style.less | 30 +++++++++++++++--------------- 5 files changed, 44 insertions(+), 46 deletions(-) diff --git a/themes/Legacy/5ePHB/style.less b/themes/Legacy/5ePHB/style.less index 56d1bed94..41524c74c 100644 --- a/themes/Legacy/5ePHB/style.less +++ b/themes/Legacy/5ePHB/style.less @@ -13,13 +13,13 @@ body { counter-reset : phb-page-numbers; } * { -webkit-print-color-adjust : exact; } .useSansSerif() { - font-family : "ScalySans"; + font-family : 'ScalySans'; em { - font-family : "ScalySans"; + font-family : 'ScalySans'; font-style : italic; } strong { - font-family : "ScalySans"; + font-family : 'ScalySans'; font-weight : 800; letter-spacing : -0.02em; } @@ -46,7 +46,7 @@ body { counter-reset : phb-page-numbers; } padding : 1.0cm 1.7cm; padding-bottom : 1.5cm; overflow : hidden; - font-family : "BookSanity"; + font-family : 'BookSanity'; font-size : 0.317cm; counter-increment : phb-page-numbers; background-color : @background; @@ -106,7 +106,7 @@ body { counter-reset : phb-page-numbers; } h1,h2,h3,h4 { margin-top : 0.2em; margin-bottom : 0.2em; - font-family : "MrJeeves"; + font-family : 'MrJeeves'; font-weight : 800; color : @headerText; } @@ -117,7 +117,7 @@ body { counter-reset : phb-page-numbers; } -moz-column-span : all; & + p::first-letter { float : left; - font-family : "Solberry"; + font-family : 'Solberry'; font-size : 10em; line-height : 0.795em; color : #222222; @@ -134,7 +134,7 @@ body { counter-reset : phb-page-numbers; } } h5 { margin-bottom : 0.2em; - font-family : "ScalySansSmallCaps"; + font-family : 'ScalySansSmallCaps'; font-size : 0.423cm; font-weight : 900; } @@ -200,7 +200,7 @@ body { counter-reset : phb-page-numbers; } & + p { padding-bottom : 0px; } } h3 { - font-family : "ScalySans"; + font-family : 'ScalySans'; font-weight : normal; border-bottom : 1px solid @headerText; } @@ -380,7 +380,7 @@ body { counter-reset : phb-page-numbers; } // ************************************/ .phb .descriptive { margin-bottom : 1em; - font-family : "ScalySans"; + font-family : 'ScalySans'; background-color : #FAF7EA; border-style : solid; border-width : 7px; @@ -394,11 +394,11 @@ body { counter-reset : phb-page-numbers; } } p + p { padding-top : 0.8em; } em { - font-family : "ScalySans"; + font-family : 'ScalySans'; font-style : italic; } strong { - font-family : "ScalySans"; + font-family : 'ScalySans'; font-weight : 800; letter-spacing : -0.02em; } @@ -411,7 +411,7 @@ body { counter-reset : phb-page-numbers; } .phb { .artist { position : absolute; - font-family : "WalterTurncoat"; + font-family : 'WalterTurncoat'; font-size : 0.27cm; color : @captionText; text-align : center; @@ -421,7 +421,7 @@ body { counter-reset : phb-page-numbers; } text-indent : unset; } h5 { - font-family : "WalterTurncoat"; + font-family : 'WalterTurncoat'; font-size : 1.3em; } a { diff --git a/themes/V3/5eDMG/style.less b/themes/V3/5eDMG/style.less index cbc3fa890..d79533c2c 100644 --- a/themes/V3/5eDMG/style.less +++ b/themes/V3/5eDMG/style.less @@ -7,7 +7,7 @@ } .page { - background-image : url("/assets/DMG_background.png"); + background-image : url('/assets/DMG_background.png'); background-size : cover; /* TABLES WITHIN NOTES */ @@ -23,7 +23,7 @@ &::after { height : 58px; - background-image : url("/assets/DMG_footerAccent.png"); + background-image : url('/assets/DMG_footerAccent.png'); } .footnote { bottom : 40px; } diff --git a/themes/V3/5ePHB/style.less b/themes/V3/5ePHB/style.less index d51cfd313..555866ba4 100644 --- a/themes/V3/5ePHB/style.less +++ b/themes/V3/5ePHB/style.less @@ -792,7 +792,7 @@ // *****************************/ // Additional Default Exclusions -.monster { --TOC: exclude; } +.monster { --TOC : exclude; } .page:has(.partCover) { --TOC : exclude; diff --git a/themes/V3/Blank/style.less b/themes/V3/Blank/style.less index 519b60207..01b85326f 100644 --- a/themes/V3/Blank/style.less +++ b/themes/V3/Blank/style.less @@ -532,20 +532,20 @@ h6, .page:has(.backCover), .page:has(.insideCover), .noToC, -.toc { --TOC: exclude; } +.toc { --TOC : exclude; } -.tocDepthH2 :is(h1, h2) {--TOC: include; } -.tocDepthH3 :is(h1, h2, h3) {--TOC: include; } -.tocDepthH4 :is(h1, h2, h3, h4) {--TOC: include; } -.tocDepthH5 :is(h1, h2, h3, h4, h5) {--TOC: include; } -.tocDepthH6 :is(h1, h2, h3, h4, h5, h6) {--TOC: include; } +.tocDepthH2 :is(h1, h2) {--TOC : include; } +.tocDepthH3 :is(h1, h2, h3) {--TOC : include; } +.tocDepthH4 :is(h1, h2, h3, h4) {--TOC : include; } +.tocDepthH5 :is(h1, h2, h3, h4, h5) {--TOC : include; } +.tocDepthH6 :is(h1, h2, h3, h4, h5, h6) {--TOC : include; } -.tocIncludeH1 h1 {--TOC: include; } -.tocIncludeH2 h2 {--TOC: include; } -.tocIncludeH3 h3 {--TOC: include; } -.tocIncludeH4 h4 {--TOC: include; } -.tocIncludeH5 h5 {--TOC: include; } -.tocIncludeH6 h6 {--TOC: include; } +.tocIncludeH1 h1 {--TOC : include; } +.tocIncludeH2 h2 {--TOC : include; } +.tocIncludeH3 h3 {--TOC : include; } +.tocIncludeH4 h4 {--TOC : include; } +.tocIncludeH5 h5 {--TOC : include; } +.tocIncludeH6 h6 {--TOC : include; } .page { &:has(.toc)::after { display : none; } @@ -609,7 +609,5 @@ h6, .useColumns(0.96, @fillMode: balance); } } - .toc.wide li { - break-inside: auto; - } + .toc.wide li { break-inside : auto; } } diff --git a/themes/V3/Journal/style.less b/themes/V3/Journal/style.less index bddefb749..74c976f47 100644 --- a/themes/V3/Journal/style.less +++ b/themes/V3/Journal/style.less @@ -12,7 +12,7 @@ } .useSansSerif() { - font-family : "PermanentMarker"; + font-family : 'PermanentMarker'; font-size : 0.3cm; line-height : 1.2em; color : var(--HB_Color_Text2); @@ -29,7 +29,7 @@ .page { padding : 2.1cm 1.9cm 1.7cm 3.8cm; - background-image : url("/assets/Journal/Background1.webp"); + background-image : url('/assets/Journal/Background1.webp'); background-repeat : no-repeat; background-size : 200% 100%; filter : drop-shadow(1px 4px 14px black); @@ -39,7 +39,7 @@ background-position : right; } &:nth-of-type(2) { - background-image : url("/assets/Journal/Background2.webp"); //Only first page should show ribbon + background-image : url('/assets/Journal/Background2.webp'); //Only first page should show ribbon } & .columnWrapper { @@ -51,7 +51,7 @@ // * BASE // *****************************/ .page { - font-family : "ReenieBeanie"; + font-family : 'ReenieBeanie'; font-size : 0.53cm; line-height : 0.8em; color : var(--HB_Color_Text); @@ -71,7 +71,7 @@ // * HEADERS // *****************************/ h1,h2,h3,h4,h5 { - font-family : "FrederickaTheGreat"; + font-family : 'FrederickaTheGreat'; font-weight : unset; color : var(--HB_Color_HeaderText); } @@ -89,7 +89,7 @@ margin-right : 0.1em; margin-bottom : -20px; margin-left : -40px; - font-family : "FrederickaTheGreat"; + font-family : 'FrederickaTheGreat'; font-size : 1.9em; line-height : 1em; } @@ -114,7 +114,7 @@ &:nth-of-type(3n) { transform : rotate(-1.5deg); } } h5 { - font-family : "PermanentMarker"; + font-family : 'PermanentMarker'; font-size : 0.4cm; font-weight : bold; line-height : 0.951em; //Font is misaligned. Shift up slightly @@ -146,14 +146,14 @@ .note { .useSansSerif(); padding : 0.2cm; - background-image : url("/assets/Journal/HashMarks.png"), + background-image : url('/assets/Journal/HashMarks.png'), linear-gradient(to bottom right, #FF000000, #A36A4E14, #41212100); background-repeat : no-repeat; background-position : center; background-size : 120% 120%; border-style : solid; border-width : 1px; - border-image-source : url("/assets/Journal/Border1.png"); + border-image-source : url('/assets/Journal/Border1.png'); border-image-slice : 18 18 18 18; border-image-width : 6px 6px 6px 6px; border-image-outset : 5px 5px 5px 5px; @@ -173,7 +173,7 @@ .descriptive { .useSansSerif(); padding : 0.2cm; - background-image : url("/assets/Journal/HashMarks.png"), + background-image : url('/assets/Journal/HashMarks.png'), linear-gradient(to bottom right, #FF000000, #41212114, #41212100); background-repeat : no-repeat; background-position : center; @@ -201,7 +201,7 @@ .artist { position : absolute; width : auto; - font-family : "WalterTurncoat"; + font-family : 'WalterTurncoat'; font-size : 0.27cm; color : var(--HB_Color_CaptionText); text-align : center; @@ -211,7 +211,7 @@ text-indent : unset; } h5 { - font-family : "WalterTurncoat"; + font-family : 'WalterTurncoat'; font-size : 1.3em; } a { @@ -309,7 +309,7 @@ .pageNumber { right : 3cm; bottom : 1.25cm; - font-family : "FrederickaTheGreat"; + font-family : 'FrederickaTheGreat'; color : var(--HB_Color_HeaderText); } .footnote { @@ -370,7 +370,7 @@ .page .spellList { .useSansSerif(); - font-family : "PermanentMarker"; + font-family : 'PermanentMarker'; column-count : 2; ul + h5 { margin-top : 15px; } ul { @@ -439,7 +439,7 @@ &:last-child { width : 1%; padding-left : 0.06cm; /* Spacing after dot leaders */ - font-family : "ReenieBeanie"; + font-family : 'ReenieBeanie'; font-size : 0.34cm; font-weight : normal; vertical-align : bottom; /* Keep page number bottom-aligned */