diff --git a/client/homebrew/pages/basePages/listPage/brewItem/brewItem.jsx b/client/homebrew/pages/basePages/listPage/brewItem/brewItem.jsx index 79a4f7d0f..171fc5bb4 100644 --- a/client/homebrew/pages/basePages/listPage/brewItem/brewItem.jsx +++ b/client/homebrew/pages/basePages/listPage/brewItem/brewItem.jsx @@ -96,7 +96,7 @@ const BrewItem = createClass({ render : function(){ const brew = this.props.brew; if(Array.isArray(brew.tags)) { // temporary fix until dud tags are cleaned - brew.tags = brew.tags?.filter(tag => tag); //remove tags that are empty strings + brew.tags = brew.tags?.filter((tag)=>tag); //remove tags that are empty strings } const dateFormatString = 'YYYY-MM-DD HH:mm:ss'; @@ -112,7 +112,7 @@ const BrewItem = createClass({
{brew.tags.map((tag, idx)=>{ - let matches = tag.match(/^(?:([^:]+):)?([^:]+)$/); + const matches = tag.match(/^(?:([^:]+):)?([^:]+)$/); return {matches[2]}; })}
diff --git a/themes/V3/Blank/snippets.js b/themes/V3/Blank/snippets.js index d3da91765..285bad049 100644 --- a/themes/V3/Blank/snippets.js +++ b/themes/V3/Blank/snippets.js @@ -104,9 +104,14 @@ module.exports = [ gen : WatercolorGen, }, { - name : 'Watercolor Image Mask', + name : 'Watercolor Image Mask Edge', icon : 'fas fa-fill-drip', - gen : ImageMaskGen, + gen : ImageMaskGen.edge, + }, + { + name : 'Watercolor Image Mask Corner', + icon : 'fas fa-fill-drip', + gen : ImageMaskGen.corner, }, { name : 'Watermark', diff --git a/themes/V3/Blank/snippets/imageMask.gen.js b/themes/V3/Blank/snippets/imageMask.gen.js index 9c9b9049b..d14bda3ce 100644 --- a/themes/V3/Blank/snippets/imageMask.gen.js +++ b/themes/V3/Blank/snippets/imageMask.gen.js @@ -1,7 +1,27 @@ const _ = require('lodash'); +const dedent = require('dedent-tabs').default; + +module.exports = { + edge : ()=>{ + return dedent` + {{imageMask${_.random(1, 8)},--offset:0cm,--rotation:0 + ![](https://assets1.ignimgs.com/2019/05/29/dndmobile-br-1559158957902_160w.jpg?width=1280){height:100%} + + + }}\n\n`; + }, + + corner : ()=>{ + return dedent` + {{imageMask_Corner${_.random(1, 8)},--offset:0cm,bottom,left + ![](https://assets1.ignimgs.com/2019/05/29/dndmobile-br-1559158957902_160w.jpg?width=1280){height:100%} + + + }}\n\n`; + } + +}; + +()=>{ -module.exports = ()=>{ - return `{{imageMask${_.random(1, 6)},--offset:0cm,--rotation:0 -![](https://assets1.ignimgs.com/2019/05/29/dndmobile-br-1559158957902_160w.jpg?width=1280){height:100%} -}}\n\n`; }; diff --git a/themes/V3/Blank/style.less b/themes/V3/Blank/style.less index 10c949e25..0bab5fbfe 100644 --- a/themes/V3/Blank/style.less +++ b/themes/V3/Blank/style.less @@ -180,9 +180,11 @@ body { --rotation : 0; --revealer : none; --checkerboard : none; + --scaleX : 1; + --scaleY : 1; -webkit-mask-image : var(--wc), var(--revealer); -webkit-mask-repeat : repeat-x; - -webkit-mask-size : 50%; + -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); mask-repeat : repeat-x; @@ -191,7 +193,7 @@ body { background-image : var(--checkerboard); background-size : 20px; z-index : -1; - transform : translateY(50%) translateX(-50%) rotate(calc(1deg * var(--rotation))); + transform : translateY(50%) translateX(-50%) rotate(calc(1deg * var(--rotation))) scaleX(var(--scaleX)) scaleY(var(--scaleY)); transition : transform 2s; & > p:has(img) { position : absolute; @@ -199,7 +201,7 @@ body { height : 50%; bottom : 50%; left : 50%; - transform : translateX(-50%) translateY(50%) rotate(calc(-1deg * var(--rotation))); + transform : translateX(-50%) translateY(50%) rotate(calc(-1deg * var(--rotation))) scaleX(var(--scaleX)) scaleY(var(--scaleY)); transition : transform 2s; } & img { @@ -238,6 +240,33 @@ body { .imageMask7 { --wc : url(/assets/waterColorMasks/edge/0007.webp); } .imageMask8 { --wc : url(/assets/waterColorMasks/edge/0008.webp); } + [class*="imageMask_Corner"] { + -webkit-mask-size : 50% 50%; //Scale both dimensions to fit page size + &.bottom { + --rotation : 0; + } + &.top { + --rotation : 0; + --scaleY : -1; + } + &.left { + --rotation : 0; + } + &.right { + --rotation : 0; + --scaleX : -1; + } + } + + .imageMask_Corner1 { --wc : url(/assets/waterColorMasks/corner/0005.webp); } + .imageMask_Corner2 { --wc : url(/assets/waterColorMasks/corner/0006.webp); } + .imageMask_Corner3 { --wc : url(/assets/waterColorMasks/corner/0007.webp); } + .imageMask_Corner4 { --wc : url(/assets/waterColorMasks/corner/0008.webp); } + .imageMask_Corner5 { --wc : url(/assets/waterColorMasks/corner/0009.webp); } + .imageMask_Corner6 { --wc : url(/assets/waterColorMasks/corner/0010.webp); } + .imageMask_Corner7 { --wc : url(/assets/waterColorMasks/corner/0016.webp); } + .imageMask_Corner8 { --wc : url(/assets/waterColorMasks/corner/0017.webp); } + //************************************ // * CODE BLOCKS // ************************************/ diff --git a/themes/assets/dragonBackground.png b/themes/assets/dragonBackground.png new file mode 100644 index 000000000..987e36e4d Binary files /dev/null and b/themes/assets/dragonBackground.png differ diff --git a/themes/assets/waterColorMasks/corner/0005.png b/themes/assets/waterColorMasks/corner/0005.png new file mode 100644 index 000000000..5fc7bae0f Binary files /dev/null and b/themes/assets/waterColorMasks/corner/0005.png differ diff --git a/themes/assets/waterColorMasks/corner/0005.webp b/themes/assets/waterColorMasks/corner/0005.webp new file mode 100644 index 000000000..ebaeb7c7b Binary files /dev/null and b/themes/assets/waterColorMasks/corner/0005.webp differ diff --git a/themes/assets/waterColorMasks/corner/0006.png b/themes/assets/waterColorMasks/corner/0006.png new file mode 100644 index 000000000..74fbfddb5 Binary files /dev/null and b/themes/assets/waterColorMasks/corner/0006.png differ diff --git a/themes/assets/waterColorMasks/corner/0006.webp b/themes/assets/waterColorMasks/corner/0006.webp new file mode 100644 index 000000000..dc25ee34f Binary files /dev/null and b/themes/assets/waterColorMasks/corner/0006.webp differ diff --git a/themes/assets/waterColorMasks/corner/0007.png b/themes/assets/waterColorMasks/corner/0007.png new file mode 100644 index 000000000..456c25a1a Binary files /dev/null and b/themes/assets/waterColorMasks/corner/0007.png differ diff --git a/themes/assets/waterColorMasks/corner/0007.webp b/themes/assets/waterColorMasks/corner/0007.webp new file mode 100644 index 000000000..7eba1daa9 Binary files /dev/null and b/themes/assets/waterColorMasks/corner/0007.webp differ diff --git a/themes/assets/waterColorMasks/corner/0008.png b/themes/assets/waterColorMasks/corner/0008.png new file mode 100644 index 000000000..b738c4a4b Binary files /dev/null and b/themes/assets/waterColorMasks/corner/0008.png differ diff --git a/themes/assets/waterColorMasks/corner/0008.webp b/themes/assets/waterColorMasks/corner/0008.webp new file mode 100644 index 000000000..8100eaff2 Binary files /dev/null and b/themes/assets/waterColorMasks/corner/0008.webp differ diff --git a/themes/assets/waterColorMasks/corner/0009.png b/themes/assets/waterColorMasks/corner/0009.png new file mode 100644 index 000000000..794c7f6fb Binary files /dev/null and b/themes/assets/waterColorMasks/corner/0009.png differ diff --git a/themes/assets/waterColorMasks/corner/0009.webp b/themes/assets/waterColorMasks/corner/0009.webp new file mode 100644 index 000000000..46e20ad6d Binary files /dev/null and b/themes/assets/waterColorMasks/corner/0009.webp differ diff --git a/themes/assets/waterColorMasks/corner/0010.png b/themes/assets/waterColorMasks/corner/0010.png new file mode 100644 index 000000000..b08072552 Binary files /dev/null and b/themes/assets/waterColorMasks/corner/0010.png differ diff --git a/themes/assets/waterColorMasks/corner/0010.webp b/themes/assets/waterColorMasks/corner/0010.webp new file mode 100644 index 000000000..3da96e189 Binary files /dev/null and b/themes/assets/waterColorMasks/corner/0010.webp differ diff --git a/themes/assets/waterColorMasks/corner/0016.png b/themes/assets/waterColorMasks/corner/0016.png new file mode 100644 index 000000000..1c439111d Binary files /dev/null and b/themes/assets/waterColorMasks/corner/0016.png differ diff --git a/themes/assets/waterColorMasks/corner/0016.webp b/themes/assets/waterColorMasks/corner/0016.webp new file mode 100644 index 000000000..bd679804d Binary files /dev/null and b/themes/assets/waterColorMasks/corner/0016.webp differ diff --git a/themes/assets/waterColorMasks/corner/0017.png b/themes/assets/waterColorMasks/corner/0017.png new file mode 100644 index 000000000..becaa6370 Binary files /dev/null and b/themes/assets/waterColorMasks/corner/0017.png differ diff --git a/themes/assets/waterColorMasks/corner/0017.webp b/themes/assets/waterColorMasks/corner/0017.webp new file mode 100644 index 000000000..cd99244d0 Binary files /dev/null and b/themes/assets/waterColorMasks/corner/0017.webp differ