diff --git a/client/homebrew/pages/printPage/printPage.jsx b/client/homebrew/pages/printPage/printPage.jsx index 4390570b3..64ced6072 100644 --- a/client/homebrew/pages/printPage/printPage.jsx +++ b/client/homebrew/pages/printPage/printPage.jsx @@ -91,6 +91,7 @@ const PrintPage = createClass({ return
+ {baseThemePath && } diff --git a/themes/V3/Blank/snippets/imageMask.gen.js b/themes/V3/Blank/snippets/imageMask.gen.js index 3fed11ce4..9c9b9049b 100644 --- a/themes/V3/Blank/snippets/imageMask.gen.js +++ b/themes/V3/Blank/snippets/imageMask.gen.js @@ -1,7 +1,7 @@ const _ = require('lodash'); module.exports = ()=>{ - return `{{imageMask${_.random(1, 6)},top -![](https://assets1.ignimgs.com/2019/05/29/dndmobile-br-1559158957902_160w.jpg?width=1280) + 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 b8563e39f..10c949e25 100644 --- a/themes/V3/Blank/style.less +++ b/themes/V3/Blank/style.less @@ -172,34 +172,34 @@ body { /* Image Masks */ [class*="imageMask"] { - position:absolute; - height: 100%; - width: 279.4mm; // Page height - left:0px; - bottom:0px; - --rotation : 0; - --revealer : none; - --checkerboard : none; - -webkit-mask-image : var(--wc), var(--revealer); - -webkit-mask-repeat : no-repeat; - -webkit-mask-size : 100% 100%; - mask-image : var(--wc); - mask-repeat : no-repeat; - mask-size : 100% 100%; - background-image: var(--checkerboard); - background-size: 20px; - z-index : -1; - //background-image : url(/assets/watercolorMasks/testBackground.jpg); - //background-size : 0px; // Hide the background so it can be inherited into :before - transform : rotate(calc(1deg * var(--rotation))); - transition : transform 2s; - & > :not(img) { + position : absolute; + height : 200%; + width : 200%; + left : 50%; + bottom : 50%; + --rotation : 0; + --revealer : none; + --checkerboard : none; + -webkit-mask-image : var(--wc), var(--revealer); + -webkit-mask-repeat : repeat-x; + -webkit-mask-size : 50%; + -webkit-mask-position : 50% calc(50% - var(--offset)); + mask-image : var(--wc); + mask-repeat : repeat-x; + mask-size : 50%; + mask-position : 50% calc(50% - var(--offset)); + background-image : var(--checkerboard); + background-size : 20px; + z-index : -1; + transform : translateY(50%) translateX(-50%) rotate(calc(1deg * var(--rotation))); + transition : transform 2s; + & > p:has(img) { position : absolute; - bottom : 0; - left : 0; - width : 100%; - height : 100%; - transform : rotate(calc(-1deg * var(--rotation))); + width : 50%; + height : 50%; + bottom : 50%; + left : 50%; + transform : translateX(-50%) translateY(50%) rotate(calc(-1deg * var(--rotation))); transition : transform 2s; } & img { @@ -221,8 +221,6 @@ body { } &.right { --rotation : -90; - left : unset; - right : 0px; & img {right: 0;} } &.revealImage { @@ -231,12 +229,14 @@ body { } } - .imageMask1 { --wc : url(/assets/waterColorMasks/edge/0001.png); } - .imageMask2 { --wc : url(/assets/waterColorMasks/edge/0002.png); } - .imageMask3 { --wc : url(/assets/waterColorMasks/edge/0003.png); } - .imageMask4 { --wc : url(/assets/waterColorMasks/edge/0004.png); } - .imageMask5 { --wc : url(/assets/waterColorMasks/edge/0005.png); } - .imageMask6 { --wc : url(/assets/waterColorMasks/edge/0006.png); } + .imageMask1 { --wc : url(/assets/waterColorMasks/edge/0001.webp); } + .imageMask2 { --wc : url(/assets/waterColorMasks/edge/0002.webp); } + .imageMask3 { --wc : url(/assets/waterColorMasks/edge/0003.webp); } + .imageMask4 { --wc : url(/assets/waterColorMasks/edge/0004.webp); } + .imageMask5 { --wc : url(/assets/waterColorMasks/edge/0005.webp); } + .imageMask6 { --wc : url(/assets/waterColorMasks/edge/0006.webp); } + .imageMask7 { --wc : url(/assets/waterColorMasks/edge/0007.webp); } + .imageMask8 { --wc : url(/assets/waterColorMasks/edge/0008.webp); } //************************************ // * CODE BLOCKS diff --git a/themes/assets/waterColorMasks/edge/0001.png b/themes/assets/waterColorMasks/edge/0001.png deleted file mode 100644 index 57293bac0..000000000 Binary files a/themes/assets/waterColorMasks/edge/0001.png and /dev/null differ diff --git a/themes/assets/waterColorMasks/edge/0001.webp b/themes/assets/waterColorMasks/edge/0001.webp new file mode 100644 index 000000000..6138a1a1b Binary files /dev/null and b/themes/assets/waterColorMasks/edge/0001.webp differ diff --git a/themes/assets/waterColorMasks/edge/0002.png b/themes/assets/waterColorMasks/edge/0002.png deleted file mode 100644 index 411c7718f..000000000 Binary files a/themes/assets/waterColorMasks/edge/0002.png and /dev/null differ diff --git a/themes/assets/waterColorMasks/edge/0002.webp b/themes/assets/waterColorMasks/edge/0002.webp new file mode 100644 index 000000000..15766829b Binary files /dev/null and b/themes/assets/waterColorMasks/edge/0002.webp differ diff --git a/themes/assets/waterColorMasks/edge/0003.png b/themes/assets/waterColorMasks/edge/0003.png deleted file mode 100644 index 2162e7745..000000000 Binary files a/themes/assets/waterColorMasks/edge/0003.png and /dev/null differ diff --git a/themes/assets/waterColorMasks/edge/0003.webp b/themes/assets/waterColorMasks/edge/0003.webp new file mode 100644 index 000000000..ef77e7577 Binary files /dev/null and b/themes/assets/waterColorMasks/edge/0003.webp differ diff --git a/themes/assets/waterColorMasks/edge/0004.png b/themes/assets/waterColorMasks/edge/0004.png deleted file mode 100644 index b08ddb9f8..000000000 Binary files a/themes/assets/waterColorMasks/edge/0004.png and /dev/null differ diff --git a/themes/assets/waterColorMasks/edge/0004.webp b/themes/assets/waterColorMasks/edge/0004.webp new file mode 100644 index 000000000..d18da828b Binary files /dev/null and b/themes/assets/waterColorMasks/edge/0004.webp differ diff --git a/themes/assets/waterColorMasks/edge/0005.png b/themes/assets/waterColorMasks/edge/0005.png deleted file mode 100644 index c77d7d0b2..000000000 Binary files a/themes/assets/waterColorMasks/edge/0005.png and /dev/null differ diff --git a/themes/assets/waterColorMasks/edge/0005.webp b/themes/assets/waterColorMasks/edge/0005.webp new file mode 100644 index 000000000..f9c9c12e7 Binary files /dev/null and b/themes/assets/waterColorMasks/edge/0005.webp differ diff --git a/themes/assets/waterColorMasks/edge/0006.png b/themes/assets/waterColorMasks/edge/0006.png deleted file mode 100644 index 842c803c5..000000000 Binary files a/themes/assets/waterColorMasks/edge/0006.png and /dev/null differ diff --git a/themes/assets/waterColorMasks/edge/0006.webp b/themes/assets/waterColorMasks/edge/0006.webp new file mode 100644 index 000000000..f09e74316 Binary files /dev/null and b/themes/assets/waterColorMasks/edge/0006.webp differ diff --git a/themes/assets/waterColorMasks/edge/0007.png b/themes/assets/waterColorMasks/edge/0007.png deleted file mode 100644 index ca91beb13..000000000 Binary files a/themes/assets/waterColorMasks/edge/0007.png and /dev/null differ diff --git a/themes/assets/waterColorMasks/edge/0007.webp b/themes/assets/waterColorMasks/edge/0007.webp new file mode 100644 index 000000000..197915e90 Binary files /dev/null and b/themes/assets/waterColorMasks/edge/0007.webp differ diff --git a/themes/assets/waterColorMasks/edge/0008.png b/themes/assets/waterColorMasks/edge/0008.png deleted file mode 100644 index ef72394ea..000000000 Binary files a/themes/assets/waterColorMasks/edge/0008.png and /dev/null differ diff --git a/themes/assets/waterColorMasks/edge/0008.webp b/themes/assets/waterColorMasks/edge/0008.webp new file mode 100644 index 000000000..bf6c90229 Binary files /dev/null and b/themes/assets/waterColorMasks/edge/0008.webp differ diff --git a/themes/assets/waterColorMasks/edge/0009.png b/themes/assets/waterColorMasks/edge/0009.png deleted file mode 100644 index 2c62dadea..000000000 Binary files a/themes/assets/waterColorMasks/edge/0009.png and /dev/null differ diff --git a/themes/assets/waterColorMasks/edge/0010.png b/themes/assets/waterColorMasks/edge/0010.png deleted file mode 100644 index 2bc1e4913..000000000 Binary files a/themes/assets/waterColorMasks/edge/0010.png and /dev/null differ diff --git a/themes/assets/waterColorMasks/edge/0011.png b/themes/assets/waterColorMasks/edge/0011.png deleted file mode 100644 index f44e68d4f..000000000 Binary files a/themes/assets/waterColorMasks/edge/0011.png and /dev/null differ diff --git a/themes/assets/waterColorMasks/edge/0012.png b/themes/assets/waterColorMasks/edge/0012.png deleted file mode 100644 index 9716ef690..000000000 Binary files a/themes/assets/waterColorMasks/edge/0012.png and /dev/null differ diff --git a/themes/assets/waterColorMasks/edge/0013.png b/themes/assets/waterColorMasks/edge/0013.png deleted file mode 100644 index 7533e9a8f..000000000 Binary files a/themes/assets/waterColorMasks/edge/0013.png and /dev/null differ diff --git a/themes/assets/waterColorMasks/edge/0014.png b/themes/assets/waterColorMasks/edge/0014.png deleted file mode 100644 index fc8ee7be1..000000000 Binary files a/themes/assets/waterColorMasks/edge/0014.png and /dev/null differ diff --git a/themes/assets/waterColorMasks/edge/0015.png b/themes/assets/waterColorMasks/edge/0015.png deleted file mode 100644 index 35f2c2dd1..000000000 Binary files a/themes/assets/waterColorMasks/edge/0015.png and /dev/null differ diff --git a/themes/assets/waterColorMasks/edge/0016.png b/themes/assets/waterColorMasks/edge/0016.png deleted file mode 100644 index 9e9f6288b..000000000 Binary files a/themes/assets/waterColorMasks/edge/0016.png and /dev/null differ diff --git a/themes/assets/waterColorMasks/edge/0017.png b/themes/assets/waterColorMasks/edge/0017.png deleted file mode 100644 index 4b37b0eff..000000000 Binary files a/themes/assets/waterColorMasks/edge/0017.png and /dev/null differ diff --git a/themes/assets/waterColorMasks/edge/0018.png b/themes/assets/waterColorMasks/edge/0018.png deleted file mode 100644 index 15ab95c60..000000000 Binary files a/themes/assets/waterColorMasks/edge/0018.png and /dev/null differ diff --git a/themes/assets/waterColorMasks/edge/0019.png b/themes/assets/waterColorMasks/edge/0019.png deleted file mode 100644 index 2b663e360..000000000 Binary files a/themes/assets/waterColorMasks/edge/0019.png and /dev/null differ diff --git a/themes/assets/waterColorMasks/edge/0020.png b/themes/assets/waterColorMasks/edge/0020.png deleted file mode 100644 index 10ca34a79..000000000 Binary files a/themes/assets/waterColorMasks/edge/0020.png and /dev/null differ diff --git a/themes/assets/waterColorMasks/edge/0021.png b/themes/assets/waterColorMasks/edge/0021.png deleted file mode 100644 index aff0803aa..000000000 Binary files a/themes/assets/waterColorMasks/edge/0021.png and /dev/null differ diff --git a/themes/assets/waterColorMasks/edge/0022.png b/themes/assets/waterColorMasks/edge/0022.png deleted file mode 100644 index b9f5f4c73..000000000 Binary files a/themes/assets/waterColorMasks/edge/0022.png and /dev/null differ diff --git a/themes/assets/waterColorMasks/edge/0023.png b/themes/assets/waterColorMasks/edge/0023.png deleted file mode 100644 index 3f3ddc35b..000000000 Binary files a/themes/assets/waterColorMasks/edge/0023.png and /dev/null differ diff --git a/themes/assets/waterColorMasks/edge/0024.png b/themes/assets/waterColorMasks/edge/0024.png deleted file mode 100644 index edff0d542..000000000 Binary files a/themes/assets/waterColorMasks/edge/0024.png and /dev/null differ diff --git a/themes/assets/waterColorMasks/edge/0025.png b/themes/assets/waterColorMasks/edge/0025.png deleted file mode 100644 index aadcec7f8..000000000 Binary files a/themes/assets/waterColorMasks/edge/0025.png and /dev/null differ diff --git a/themes/assets/waterColorMasks/edge/0026.png b/themes/assets/waterColorMasks/edge/0026.png deleted file mode 100644 index caa2a4f35..000000000 Binary files a/themes/assets/waterColorMasks/edge/0026.png and /dev/null differ diff --git a/themes/assets/waterColorMasks/edge/0027.png b/themes/assets/waterColorMasks/edge/0027.png deleted file mode 100644 index aaf885111..000000000 Binary files a/themes/assets/waterColorMasks/edge/0027.png and /dev/null differ