initial draft

client/homebrew/editor/snippetbar/snippetbar.less

@@ -96,6 +96,7 @@
 			padding          : 0px;
 			background-color : #ddd;
 			.snippet{
+				position: relative;
 				.animate(background-color);
 				display     : flex;
 				align-items : center;

themes/V3/5ePHB/snippets.js

@@ -3,6 +3,7 @@
 const MagicGen           = require('./snippets/magic.gen.js');
 const ClassTableGen      = require('./snippets/classtable.gen.js');
 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');
@@ -168,6 +169,29 @@ module.exports = [
 				icon : 'fas fa-dragon',
 				gen  : MonsterBlockGen.monster('monster,frame,wide', 4),
 			},
+			{
+				name         : 'Script Sample',
+				icon         : 'fac script',
+				gen          : scriptGen.dwarvish,
+				experimental : true,
+				subsnippets  : [
+					{
+						name : '5e Dwarvish',
+						icon : 'fac dwarvish',
+						gen  : scriptGen.dwarvish,
+					},
+					{
+						name : '5e Elvish',
+						icon : 'fac elvish',
+						gen  : scriptGen.elvish,
+					},
+					{
+						name : '5e Draconic',
+						icon : 'fac draconic',
+						gen  : scriptGen.draconic,
+					},
+				]
+			},
 			{
 				name         : 'Cover Page',
 				icon         : 'fac book-front-cover',

themes/V3/5ePHB/snippets/script.gen.js

@@ -0,0 +1,48 @@
+const _ = require('lodash');
+const dedent = require('dedent-tabs').default;
+
+module.exports = {
+    dwarvish: () => {
+        return dedent `##### Dwarvish Script: Sample Alphabet
+            {{script,wide,scriptFrame,dwarvish
+            | a | b | c | d | e | f | g | h | i | j | k | l | m |
+            |:-:|:-:|:-:|:-:|:-:|:-:|:-:|:-:|:-:|:-:|:-:|:-:|:-:|
+            | a | b | c | d | e | f | g | h | i | j | k | l | m |
+            :
+            | n | o | p | q | r | s | t | u | v | w | x | y | z |
+            |:-:|:-:|:-:|:-:|:-:|:-:|:-:|:-:|:-:|:-:|:-:|:-:|:-:|
+            | n | o | p | q | r | s | t | u | v | w | x | y | z |
+            }}`;
+    },
+    elvish: () => {
+        return dedent `##### Elvish Script: Sample Alphabet
+            {{script,wide,scriptFrame,elvish
+            | a | b | c | d | e | f | g | h | i | j | k | l | m |
+            |:-:|:-:|:-:|:-:|:-:|:-:|:-:|:-:|:-:|:-:|:-:|:-:|:-:|
+            | a | b | c | d | e | f | g | h | i | j | k | l | m |
+            :
+            | n | o | p | q | r | s | t | u | v | w | x | y | z |
+            |:-:|:-:|:-:|:-:|:-:|:-:|:-:|:-:|:-:|:-:|:-:|:-:|:-:|
+            | n | o | p | q | r | s | t | u | v | w | x | y | z |
+            }}`;
+    },
+    draconic: () => {
+        return dedent `##### Draconic Script: Sample Alphabet
+            {{script,wide,scriptFrame,draconic
+            | a | b | c | d | e | f | g | h | i | j | k | l | m |
+            |:-:|:-:|:-:|:-:|:-:|:-:|:-:|:-:|:-:|:-:|:-:|:-:|:-:|
+            | a | b | c | d | e | f | g | h | i | j | k | l | m |
+            :
+            | n | o | p | q | r | s | t | u | v | w | x | y | z |
+            |:-:|:-:|:-:|:-:|:-:|:-:|:-:|:-:|:-:|:-:|:-:|:-:|:-:|
+            | n | o | p | q | r | s | t | u | v | w | x | y | z |
+            }}`;
+    }
+
+
+};
+
+	
+()=>{
+
+};

themes/V3/5ePHB/style.less

@@ -902,3 +902,52 @@ break-inside                : avoid;
 .page h1 + *{
 	margin-top : 0;
 }
+
+//*****************************
+// *         SCRIPT
+// *****************************/
+.page {
+	.script {
+		margin-block: 0.7cm;
+		table {
+			tr {
+				background: unset !important;
+				th,
+				td {
+					width: 1.3cm;
+					height: 1.3cm;
+					vertical-align: middle !important;
+					font-family: BookInsanityRemake;
+					text-transform: uppercase;
+					outline: 1px solid #000;
+					font-size: 0.7cm;
+					font-weight: normal;
+				}
+			}
+		}
+	}
+
+	.scriptFrame {
+		border: initial;
+		border-style: solid;
+		border-image-outset: .45cm .35cm .4cm .4cm;
+		border-image-repeat: stretch;
+		border-image-slice: 170;
+		border-image-source: @scriptBorder;
+		border-image-width: 1.4cm;
+	}
+
+	.dwarvish td {
+		font-family: Davek !important;
+		font-size: .45cm !important;/*this should be fixed in the font*/
+	}
+
+	.elvish td {
+		font-family: Rellanic !important;
+	}
+
+	.draconic td {
+		font-family: Lokharic !important;
+	}
+}
+

themes/assets/assets.less

@@ -13,6 +13,7 @@
 @naturalCritLogo          : url('/assets/naturalCritLogo.svg');
 @coverPageBanner          : url('/assets/coverPageBanner.svg');
 @horizontalRule           : url('/assets/horizontalRule.svg');
+@scriptBorder             : url('/assets/scriptBorder.png');
 
 // Watercolor Images
 @watercolor1  : url('/assets/watercolor/watercolor1.png');

themes/fonts/5e/fonts.less

@@ -113,3 +113,23 @@
 	font-weight: 500;
 	font-style: normal;
 }
+
+@font-face {
+	font-family: Davek;
+	src: url('../../../fonts/5e/Davek.woff2');
+	font-weight: 500;
+	font-style: normal;
+}
+
+@font-face {
+	font-family: Lokharic;
+	src: url('../../../fonts/5e/Lokharic.woff2');
+	font-weight: 500;
+	font-style: normal;
+}
+@font-face {
+	font-family: Rellanic;
+	src: url('../../../fonts/5e/Rellanic.woff2');
+	font-weight: 500;
+	font-style: normal;
+}