Formatted all existing printed character sheet fields nicely

rpg-docs/client/views/character/printedCharacterSheet/printedCharacterSheet.css

@@ -10,9 +10,10 @@
 
 .printed > .page {
 	width: 100%;
-	padding: 1cm;
+	padding: 6mm;
 	page-break-inside: avoid;
 	page-break-after: always;
+	font-size: 3mm;
 }
 
 .printed .shrink-to-fit {
@@ -20,37 +21,87 @@
     overflow: hidden;
 }
 
-.double-border {
-	position: relative;
-	margin: 16px;
+.printed p {
+	margin-bottom: 1mm;
 }
 
-.double-border::after {
+.printed .double-border {
+	position: relative;
+	padding: 11px 10px;
+}
+
+.printed .double-border:before {
 	content: "";
     position: absolute;
     top: 0;
     bottom: 0;
     left: 0;
     right: 0;
-    border: 28px solid transparent;
-    border-image-source: url(/png/doubleLineImageBorder110x126.png);
+    border: 16px solid transparent;
+    border-image-source: url(/png/doubleLineImageBorder.png);
     border-image-slice: 110 126;
     border-image-repeat: stretch;
-    border-image-outset: 11px 10px;
     box-sizing: content-box;
+	z-index: -1;
+}
+
+.printed .double-border.printedAbility {
+	padding: 11px 6px 0;
+	margin-bottom: 3mm;
+}
+
+.printed .double-border.printedAbility:last-of-type {
+	margin-bottom: 0;
+}
+
+.printed .printedAbility .modifier {
+	position: relative;
+	top: 4px;
+	z-index: 1;
+	padding: 2px 32px;
+	background-image: url(/png/upwardPointingBorder.png);
+	background-position: center;
+	background-size: contain;
+	background-repeat: no-repeat;
+	-webkit-print-color-adjust: exact;
+}
+
+.printed .octogon-border {
+	position: relative;
+	padding: 0 20px;
+}
+
+.printed .octogon-border:before {
+	content: "";
+    position: absolute;
+    top: 0;
+    bottom: 0;
+    left: 0;
+    right: 0;
+	border: 22px solid transparent;
+	border-image: url(/png/octogonBorder.png) 124 118 fill;
+	z-index: -1;
+}
+
+.printed iron-icon {
+	width: 16px;
+	height: 16px;
 }
 
 .shield-background {
 	background: url(/png/shieldBorder.png);
-	background-size: contain;
+	background-size: cover;
 	background-repeat: no-repeat;
-	width: 102px;
-    height: 118px;
 	-webkit-print-color-adjust: exact;
+	padding: 4px 8px 8px;
+	width: 80px;
+	height: 91px;
+	position: relative;
+	top: -6px;
 }
 
 .shield-background .paper-font-subhead {
-	width: 80px;
+	width: 64px;
     text-align: center;
 	line-height: 1.1;
 }
@@ -68,5 +119,18 @@
 	app-drawer {
 		display: none;
 	}
-
+	.paper-font-subhead {
+		font-size: 3mm !important;
+		line-height: 3.5mm !important;
+		font-weight: bold !important;
+		text-transform: uppercase !important;
+	}
+	.paper-font-subhead.modifier {
+		font-size: 4mm !important;
+		line-height: 6mm !important;
+	}
+	.paper-font-display1 {
+		font-size: 8mm !important;
+		line-height: 12mm !important;
+	}
 }