Update color, snippet positioning, added into v3 Image and BackgroundImage

client/homebrew/editor/snippetbar/snippets/snippets.js

@@ -51,13 +51,23 @@ module.exports = [
 				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}
+					![cat warrior](https://s-media-cache-ak0.pinimg.com/736x/4a/81/79/4a8179462cfdf39054a418efd4cb743e.jpg) {width:325px,mix-blend-mode:multiply}
-					Credit: Kyounghwan Kim`
+
+					{{artist,position:relative,top:-230px,left:-100px,margin-bottom:-30px
+					##### Cat Warrior
+					[Kyoung Hwan Kim](https://www.artstation.com/tahra)
+					}}`
 			},
 			{
 				name : 'Background Image',
 				icon : 'fas fa-tree',
-				gen  : `![homebrew mug](http://i.imgur.com/hMna6G0.png) {position:absolute,top:50px,right:30px,width:280px}`
+				gen  : dedent`
+					![homebrew mug](http://i.imgur.com/hMna6G0.png) {position:absolute,top:50px,right:30px,width:280px}
+
+					{{artist,top:90px,right:30px
+					##### Homebrew Mug
+					[naturalcrit](https://homebrew.naturalcrit.com)
+					}}`
 			},
 			{
 				name : 'QR Code',
@@ -203,7 +213,7 @@ module.exports = [
 				icon : 'fas fa-signature',
 				gen  : function(){
 					return dedent`
-						{{artist,top:10px,left:10px
+						{{artist,top:90px,right:30px
 						##### Starry Night
 						[Van Gogh](https://www.vangoghmuseum.nl/en)
 						}}

client/homebrew/editor/snippetbar/snippetsLegacy/snippets.js

@@ -174,7 +174,7 @@ module.exports = [
 			{
 				name : 'Artist Credit',
 				icon : 'fas fa-signature',
-				gen  : '<div class=\'artist\' style=\'top:20px;left:20px;\'>\n' +
+				gen  : '<div class=\'artist\' style=\'top:90px;right:30px;\'>\n' +
 						'##### Starry Night\n' +
 						'[Van Gogh](https://www.vangoghmuseum.nl/en)\n' +
 						'</div>\n'

themes/5ePhb.style.less

@@ -2,12 +2,13 @@
 @import (less) './themes/assets/assets.less';
 
 //Colors
-@background            : #EEE5CE;
+@background            : #EEE5CE; // Light parchment
-@noteGreen             : #e0e5c1;
+@noteGreen             : #e0e5c1; // Pastel green
-@headerUnderline       : #c9ad6a;
+@headerUnderline       : #c9ad6a; // Gold
-@horizontalRule        : #9c2b1b;
+@horizontalRule        : #9c2b1b; // Maroon
-@headerText            : #58180D;
+@headerText            : #58180D; // Dark maroon
-@monsterStatBackground : #EEDBAB;
+@monsterStatBackground : #EEDBAB; // Light orange parchment
+@captionText           : #766649; // Brown
 @page { margin: 0; }
 body {
 	counter-reset : phb-page-numbers;
@@ -271,6 +272,7 @@ body {
 		text-align  : center;
 		font-family : WalterTurncoat;
 		font-size   : 0.27cm;
+		color       : @captionText;
 		p, p + p {
 			margin      : unset;
 			text-indent : unset;
@@ -281,7 +283,7 @@ body {
 			font-family : WalterTurncoat;
 		}
 		a{
-			color           : black;
+			color           : @captionText;
 			text-decoration : unset;
 			&:hover {
 				text-decoration :underline;

themes/5ePhbLegacy.style.less

@@ -2,12 +2,13 @@
 @import (less) './themes/assets/assets.less';
 @import (less) './themes/phb.depricated.less';
 //Colors
-@background            : #EEE5CE;
+@background            : #EEE5CE; // Light parchment
-@noteGreen             : #e0e5c1;
+@noteGreen             : #e0e5c1; // Pastel green
-@headerUnderline       : #c9ad6a;
+@headerUnderline       : #c9ad6a; // Gold
-@horizontalRule        : #9c2b1b;
+@horizontalRule        : #9c2b1b; // Maroon
-@headerText            : #58180D;
+@headerText            : #58180D; // Dark maroon
-@monsterStatBackground : #FDF1DC;
+@monsterStatBackground : #FDF1DC; // Lighter parchment
+@captionText           : #766649; // Brown
 @page { margin: 0; }
 body {
 	counter-reset : phb-page-numbers;
@@ -455,6 +456,7 @@ body {
 		text-align  : center;
 		font-family : WalterTurncoat;
 		font-size   : 0.27cm;
+		color       : @captionText;
 		p, p + p {
 			margin      : unset;
 			text-indent : unset;
@@ -465,7 +467,7 @@ body {
 			font-family : WalterTurncoat;
 		}
 		a{
-			color           : black;
+			color           : @captionText;
 			text-decoration : unset;
 			&:hover {
 				text-decoration : underline;