From d079985e6c8ca58dabbda862681bbe2cc63ffa66 Mon Sep 17 00:00:00 2001
From: Trevor Buckner <calculuschild@gmail.com>
Date: Fri, 16 Sep 2022 00:30:39 -0400
Subject: [PATCH] Add checkerboard behind image to show position

---
 themes/V3/5ePHB/style.less                    |  18 -----------
 themes/V3/Blank/style.less                    |  30 ++++++++----------
 .../assets/waterColorMasks/missingImage.png   | Bin 0 -> 135 bytes
 3 files changed, 13 insertions(+), 35 deletions(-)
 create mode 100644 themes/assets/waterColorMasks/missingImage.png

diff --git a/themes/V3/5ePHB/style.less b/themes/V3/5ePHB/style.less
index 98b52788f..14404e8cf 100644
--- a/themes/V3/5ePHB/style.less
+++ b/themes/V3/5ePHB/style.less
@@ -725,24 +725,6 @@ body {
 	}
 }
 
-//*****************************
-// *    MUSTACHE DIVS/SPANS
-// *****************************/
-.page {
-	.block {
-		break-inside      : avoid;
-		display           : inline-block;
-		.page :where(&) {
-			width             : 100%;
-		}
-		//-webkit-transform : translateZ(0); //Prevents shadows from breaking across columns
-	}
-	.inline-block {
-		display : inline-block;
-		text-indent : initial;
-	}
-}
-
 //*****************************
 // *    DEFINITION LISTS
 // *****************************/
diff --git a/themes/V3/Blank/style.less b/themes/V3/Blank/style.less
index 3b5829622..b8563e39f 100644
--- a/themes/V3/Blank/style.less
+++ b/themes/V3/Blank/style.less
@@ -177,13 +177,17 @@ body {
 		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
@@ -201,37 +205,29 @@ body {
 		& img {
 			position : absolute;
 			display  : block;
-		}
-		&:before {
-			content:'';
-			position:absolute;
-			display:block;
-			height:100%;
-			width:100%;
-			bottom:0px;
-			background-image:inherit;
-			background-position: bottom 0px left 0px;
-			background-size:100% 100%;
-			background-repeat:no-repeat;
-			transform  : rotate(calc(-1deg * var(--rotation)));
-			transition : transform 2s;
+			bottom   : 0;
 		}
 		&.bottom {
 			--rotation : 0;
+			& img {bottom: 0;}
 		}
 		&.top {
 			--rotation : 180;
+			& img {top: 0;}
 		}
 		&.left {
 			--rotation : 90;
+			& img {left: 0;}
 		}
 		&.right {
 			--rotation : -90;
 			left  : unset;
 			right : 0px;
+			& img {right: 0;}
 		}
 		&.revealImage {
 			--revealer : linear-gradient(0deg, rgba(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
 		}
 	}
 
@@ -290,9 +286,9 @@ body {
 	.block {
 		break-inside      : avoid;
 		display           : inline-block;
-		.page :where(&) {
-			width             : 100%;
-		}
+	}
+	& :where(.block) {
+		width      : 100%;
 	}
 	.inline-block {
 		display     : inline-block;
diff --git a/themes/assets/waterColorMasks/missingImage.png b/themes/assets/waterColorMasks/missingImage.png
new file mode 100644
index 0000000000000000000000000000000000000000..08dcb816cb140f7c0ad2a77a6159b7bf3c0fe641
GIT binary patch
literal 135
zcmeAS@N?(olHy`uVBq!ia0vp^AT}2V6Od#Ih<F90I14-?iy0WWg+Z8+Vb&Z8pdfpR
zr>`sfJq|%$M&4leqHLg$nx~6nh{WY&o6=W2%t8icW-iZ+3?HzXOilaq`@6o;|2H>3
cHy_PpSU#I0%R^c4AW#Q`r>mdKI;Vst00T85w*UYD

literal 0
HcmV?d00001