Combat page first pass

Essence motes, attack, damage moved to Combat page
Combos, armor added
Verbose charms, weapons added
Need to remove weapons from statistics page, replace charms on
statistics page with Merits & Flaws
Need to move Dodge DV and Mental DVs to Combat page

Exalted2e/exalted2e.css

@@ -1,7 +1,6 @@
-.charsheet
-{
-    background-color: White;
-}
+.charsheet { background-color: white; }
+
+.sheet-vspace { margin-top: 10px; }
 
 .sheet-center,
 h3.sheet-ability,
@@ -16,7 +15,8 @@ h4
     margin-left: 0px;
 }
 
-h1.sheet-separator
+h1.sheet-separator,
+hr
 {
     width: 100%;
     text-align: center;
@@ -26,6 +26,15 @@ h1.sheet-separator
     background-position: left 50%;
 }
 
+hr { height: 10px; }
+
+label { font-size: 16px; }
+
+button[type="roll"].sheet-blank-roll-button::before
+{
+    content: "";
+}
+
 h1.sheet-separator span
 {
     background: white;
@@ -58,7 +67,8 @@ div.sheet-ability div
 }
 
 div.sheet-attribute,
-div.sheet-ability
+div.sheet-ability,
+ul.sheet-craft-types li
 {
     clear: right;
 }
@@ -68,7 +78,6 @@ div.sheet-ability
     width: 841px;
 }
 
-div[data-groupname="repeating_charms"],
 h4.sheet-span2
 {
     width: 543px;
@@ -76,12 +85,7 @@ h4.sheet-span2
 
 div[data-groupname="repeating_charms"] .repitem
 {
-    display: inline-block;
-}
-
-div[data-groupname="repeating_charms"] .repitem:nth-child(even)
-{
-    margin-left: 8px;
+    width: 100%;
 }
 
 .sheet-charm
@@ -99,6 +103,11 @@ textarea.sheet-three-lines
     height: 8ex;
 }
 
+textarea.sheet-two-lines
+{
+    height: 5ex;
+}
+
 div.sheet-virtue
 {
     display: inline-block;
@@ -111,14 +120,17 @@ p.sheet-disclaimer
     text-align: center;
 }
 
-.sheet-narrow
-{
-    width: 80px;
-}
+.sheet-regular { width: 120px; }
+.sheet-narrow { width: 80px; }
+.sheet-very-narrow { width: 40px; }
 
-.sheet-very-narrow
+span.sheet-span-header
 {
-    width: 40px;
+    display: inline-block;
+    padding: 4px;
+    margin: 0px;
+    font-weight: bold;
+    font-size: 110%;
 }
 
 div[data-groupname="repeating_attack"] div:not(:first-child) div.sheet-attack
@@ -126,10 +138,43 @@ div[data-groupname="repeating_attack"] div:not(:first-child) div.sheet-attack
     border-top: 1px solid #ccc;
 }
 
+div.sheet-combat-equipment div.sheet-weapons { display: inline-block; vertical-align: top; }
+div.sheet-weapons div.sheet-rolls { padding: 5px; }
+div.sheet-weapons span { border-top: 3px solid black; border-right: 1px solid black; }
+div.sheet-weapons span:first-of-type,
+div.sheet-weapons div.sheet-rolls,
+div.sheet-weapons div.sheet-attack input:first-of-type { border-left: 3px solid black; }
+div.sheet-weapons span:last-of-type,
+div.sheet-weapons div.sheet-rolls,
+div.sheet-weapons div.sheet-attack input:last-of-type{ border-right: 3px solid black; }
+div.sheet-weapons div.sheet-attack select { height: 28px; vertical-align: top; }
+div.sheet-weapons div.sheet-attack input,
+div.sheet-weapons div.sheet-attack select
+{
+    border: 1px solid black;
+    border-left: none;
+    margin: 0px;
+    border-radius: 0px;
+}
+
+/*div.repcontainer[data-groupname="repeating_attacks"] div.repitem:last-child input*/
+div.repcontainer[data-groupname="repeating_attacks"] div.repitem:last-child div.sheet-rolls
+{
+    border-bottom: 3px solid black;
+}
+
+div.sheet-weapons .repcontrol { width: 400px; }
+
+div.sheet-combat-equipment div.sheet-armor
+{
+    display: inline-block;
+}
+
 /* Align labels and input boxes */
 label,
 div.sheet-background,
-div.sheet-charm
+div.sheet-charm,
+div.sheet-combo
 {
     display: -webkit-flex;
     display: flex;
@@ -138,6 +183,7 @@ div.sheet-charm
 
 div.sheet-background input[type="text"],
 div.sheet-charm input[type="text"]:not(.sheet-very-narrow),
+div.sheet-combo input[type="text"]:not(.sheet-narrow),
 label input[type="text"],
 label input[type="number"],
 label select
@@ -168,6 +214,27 @@ div.sheet-background div.sheet-dots
     text-align: right;
 }
 
+ul.sheet-craft-types
+{
+    list-style-type: none;
+    display: none;
+    position: absolute;
+    background-color: #fefefe;
+    z-index: 5;
+    width: 190px;
+    padding: 5px;
+    border: 1px solid #3f8ff3;
+    
+    border-radius: 5px;
+    -webkit-border-radius: 5px;
+    -moz-border-radius: 5px;
+}
+
+div.sheet-craft-types:hover ul.sheet-craft-types
+{
+    display: block;
+}
+
 /* Style boxes */
 label input[type="text"],
 label input[type="number"],
@@ -176,6 +243,8 @@ div.sheet-ability input[type="text"],
 div.sheet-background input[type="text"],
 div.sheet-charm input[type="text"],
 div.sheet-charm input[type="number"],
+div.sheet-charm select,
+div.sheet-combo input[type="text"],
 .sheet-fancy
 {
     border: 0px;
@@ -189,12 +258,15 @@ div.sheet-charm input[type="number"],
     border-bottom: 1px solid #000;
 }
 
+div.sheet-charm select { margin-bottom: 0px; }
+
 label input[type="text"]:focus,
 label input[type="number"]:focus,
 div.sheet-ability input[type="text"]:focus,
 div.sheet-background input[type="text"]:focus,
 div.sheet-charm input[type="text"]:focus,
 div.sheet-charm input[type="number"]:focus,
+div.sheet-combo input[type="text"]:focus,
 .sheet-fancy:focus
 {
     box-shadow: rgba(83, 167, 235, 0.466667) 0px 0px 6px 0px;
@@ -370,3 +442,61 @@ select.sheet-health-value
 {
     float: right;
 }
+
+/* Tabs */
+input.sheet-tab
+{
+    position: inherit;
+    width: 100px;
+    height: 18px;
+}
+
+input.sheet-tab:first-of-type { margin-left: 5px; }
+input.sheet-tab:first-of-type + span::before { margin-left: -85px; }
+
+input.sheet-tab + span::before,
+input.sheet-tab:checked ~ input.sheet-tab + span::before
+{
+    content: attr(title);
+    margin-left: -90px;
+    margin-right: 10px;
+    padding-top: 2px;
+    border-radius: 3px;
+    -webkit-border-radius: 3px;
+    -moz-border-radius: 3px;
+    width: 100px;
+    height: 18px;
+    font-size: 14px;
+    
+    text-shadow: -1px -1px 0 rgba(0, 0, 0, 0.5);
+    font-weight: bold;
+    color: #f8f8f8;
+    
+    background-color: #cbd600;
+    background-image: -webkit-gradient(linear, left top, left bottom, from(#cbd600), to(#d9b84e));
+    background-image: -webkit-linear-gradient(top, #cbd600, #d9b84e);
+    background-image: -moz-linear-gradient(top, #cbd600, #d9b84e);
+    background-image: -ms-linear-gradient(top, #cbd600, #d9b84e);
+    background-image: -o-linear-gradient(top, #cbd600, #d9b84e);
+    background-image: linear-gradient(to bottom, #cbd600, #d9b84e);
+    filter:progid: DXImageTransform.Microsoft.gradient(GradientType=0, startColorstr=#cbd600, endColorstr=#d9b84e);
+}
+
+input.sheet-tab:checked + span::before
+{
+    border: 1px solid #6a7000;
+    background-color: #9ba300;
+    background-image: -webkit-gradient(linear, left top, left bottom, from(#9ba300), to(#c9a32b));
+    background-image: -webkit-linear-gradient(top, #9ba300, #c9a32b);
+    background-image: -moz-linear-gradient(top, #9ba300, #c9a32b);
+    background-image: -ms-linear-gradient(top, #9ba300, #c9a32b);
+    background-image: -o-linear-gradient(top, #9ba300, #c9a32b);
+    background-image: linear-gradient(to bottom, #9ba300, #c9a32b);
+    filter:progid:DXImageTransform.Microsoft.gradient(GradientType=0, startColorstr=#9ba300, endColorstr=#c9a32b);
+}
+
+div.sheet-tab-content { display: none; }
+input.sheet-tab[value="statistics"]:checked ~ div.sheet-statistics-tab { display: block; }
+input.sheet-tab[value="combat"]:checked ~ div.sheet-combat-tab { display: block; }
+input.sheet-tab[value="magic"]:checked ~ div.sheet-magic-tab { display: block; }
+input.sheet-tab[value="background"]:checked ~ div.sheet-background-tab { display: block; }