diff --git a/HeroSystem6eHeroic/HeroSystem6eHeroic.css b/HeroSystem6eHeroic/HeroSystem6eHeroic.css index 62531e5101..acf452def9 100644 --- a/HeroSystem6eHeroic/HeroSystem6eHeroic.css +++ b/HeroSystem6eHeroic/HeroSystem6eHeroic.css @@ -1222,6 +1222,14 @@ select:focus + .focus { background-color: olivedrab; } +/* The d6 of dicefontd6 doesn't look good. Let's hold off for a better idea or stick with the label 'Roll' on the buttons. + +.buttonRollNormalDamage::before { + font-family: 'dicefontd6'; + font-size: 16px; + content: 'F'; +} */ + .portrait-display-button-left, .portrait-display-button-right { background-color: orange; @@ -1957,12 +1965,13 @@ text-align: center; margin: 0px; } -.button-Power-END-right { - background-color: salmon; +.button-Power-END-right, +.button-Power-END-left, +.button-Power-Roll { padding-top: 1px; padding-bottom: 1px; - padding-right: 10px; - padding-left: 10px; + padding-right: 2px; + padding-left: 2px; margin: 0px 0px; width: 98px; max-height:19px; @@ -1972,15 +1981,14 @@ text-align: center; .button-Power-END-left { background-color: olive; - padding-top: 1px; - padding-bottom: 1px; - padding-right: 10px; - padding-left: 10px; - margin: 0px 0px; - width: 98px; - max-height:19px; - text-align: center; - margin-right: 6px; +} + +.button-Power-END-right { + background-color: salmon; +} + +.button-Power-Roll { + background-color: #9184E2; // mediumslateblue } .flex-container-powers-right, @@ -2027,8 +2035,8 @@ text-align: center; .subitem-flex-power-heading-left input[type=text], .subitem-flex-power-heading-right input[type=text]{ - max-width: 200px; - min-width: 200px; + max-width: 195px; + min-width: 195px; max-height: 20px; text-align: left; font-weight: bold; @@ -2046,8 +2054,8 @@ text-align: center; .subitem-flex-power-effect-left input[type=text], .subitem-flex-power-effect-right input[type=text]{ - max-width: 200px; - min-width: 200px; + max-width: 144px; + min-width: 144px; margin-right: 5px; max-height: 20px; text-align: left; @@ -2055,6 +2063,13 @@ text-align: center; padding-left: 3px; } +.subitem-flex-power-effect-left input[type=text]:nth-child(2), +.subitem-flex-power-effect-right input[type=text]:nth-child(2) { + max-width: 45px; + min-width: 45px; + text-align: center; +} + .subitem-flex-power-activeCost { display: flex; flex-direction: row; @@ -2083,7 +2098,17 @@ text-align: center; background: lightblue; } -.flex-container-powers-left input[type=number] { +.flex-container-powers-left input[type=number]{ + border: solid 1px gray; + max-width: 60px; +} + +.flex-container-powers-left input[type=number]:nth-child(4){ + border: solid 1px gray; + min-width: 55px; +} + +.flex-container-powers-left input[type=number]:nth-child(2){ border: solid 1px gray; min-width: 55px; } @@ -2094,7 +2119,9 @@ text-align: center; .flex-container-powers-left input[readonly]{ background: lightcyan; + border: solid 1px gray; line-height: 1.1; + max-width: 45px; } .flex-container-powers-left textarea{ @@ -2114,6 +2141,16 @@ text-align: center; } .flex-container-powers-right input[type=number] { + border: solid 1px goldenrod; + max-width: 60px; +} + +.flex-container-powers-right input[type=number]:nth-child(4){ + border: solid 1px goldenrod; + min-width: 55px; +} + +.flex-container-powers-right input[type=number]:nth-child(2){ border: solid 1px goldenrod; min-width: 55px; } @@ -3442,6 +3479,7 @@ text-align: center; /* Three different Templates for attacks, armor activation, and skills ability checks. */ .sheet-rolltemplate-custom, .sheet-rolltemplate-custom-normal-attack, +.sheet-rolltemplate-custom-power-attack, .sheet-rolltemplate-custom-attack, .sheet-rolltemplate-custom-activate { margin-left: -37px; @@ -3449,6 +3487,7 @@ text-align: center; .withoutavatars .sheet-rolltemplate-custom, .withoutavatars .sheet-rolltemplate-custom-normal-attack, +.withoutavatars .sheet-rolltemplate-custom-power-attack, .withoutavatars .sheet-rolltemplate-custom-attack, .withoutavatars .sheet-rolltemplate-custom-activate { margin-left: -7px; @@ -3456,6 +3495,7 @@ text-align: center; .sheet-rolltemplate-custom .sheet-container, .sheet-rolltemplate-custom-normal-attack .sheet-container, +.sheet-rolltemplate-custom-power-attack .sheet-container, .sheet-rolltemplate-custom-attack .sheet-container, .sheet-rolltemplate-custom-activate .sheet-container { border: 1px solid; @@ -3465,7 +3505,7 @@ text-align: center; /* Header formatting - title and subtitle */ .sheet-rolltemplate-custom .sheet-header { - background-color: darkgoldenrod; + background-color: orange; /* change text-align to center to center the header text */ text-align: left; color: var(--header-text-color); @@ -3487,6 +3527,14 @@ text-align: center; color: var(--header-text-color); padding: 5px; } + +.sheet-rolltemplate-custom-power-attack .sheet-header { + background-color: #9184E2; // mediumslateblue; + /* change text-align to center to center the header text */ + text-align: left; + color: var(--header-text-color); + padding: 5px; + } .sheet-rolltemplate-custom-activate .sheet-header { background-color: steelblue; @@ -3498,6 +3546,7 @@ text-align: center; .sheet-rolltemplate-custom .sheet-title, .sheet-rolltemplate-custom-normal-attack .sheet-title, +.sheet-rolltemplate-custom-power-attack .sheet-title, .sheet-rolltemplate-custom-attack .sheet-title, .sheet-rolltemplate-custom-activate .sheet-title { font-size:1.1em; @@ -3505,6 +3554,7 @@ text-align: center; .sheet-rolltemplate-custom .sheet-subtitle, .sheet-rolltemplate-custom-normal-attack .sheet-subtitle, +.sheet-rolltemplate-custom-power-attack .sheet-subtitle, .sheet-rolltemplate-custom-attack .sheet-subtitle, .sheet-rolltemplate-custom-activate .sheet-subtitle { font-size:.9em; @@ -3513,6 +3563,7 @@ text-align: center; /* example colors */ .sheet-rolltemplate-custom .sheet-container, .sheet-rolltemplate-custom-normal-attack .sheet-container, +.sheet-rolltemplate-custom-power-attack .sheet-container, .sheet-rolltemplate-custom-attack .sheet-container, .sheet-rolltemplate-custom-activate .sheet-container { /* this is the default color */ @@ -3523,6 +3574,7 @@ text-align: center; /* Allprops part */ .sheet-rolltemplate-custom .sheet-content, .sheet-rolltemplate-custom-normal-attack .sheet-content, +.sheet-rolltemplate-custom-power-attack .sheet-content, .sheet-rolltemplate-custom-attack .sheet-content, .sheet-rolltemplate-custom-activate .sheet-content { display: grid; @@ -3535,6 +3587,7 @@ text-align: center; .sheet-rolltemplate-custom .sheet-content > div, .sheet-rolltemplate-custom-normal-attack .sheet-content > div, +.sheet-rolltemplate-custom-power-attack .sheet-content > div, .sheet-rolltemplate-custom-attack .sheet-content > div, .sheet-rolltemplate-custom-activate .sheet-content > div { padding: 5px; @@ -3543,6 +3596,7 @@ text-align: center; /* Left column */ .sheet-rolltemplate-custom .sheet-content .sheet-key, .sheet-rolltemplate-custom-normal-attack .sheet-content .sheet-key, +.sheet-rolltemplate-custom-power-attack .sheet-content .sheet-key, .sheet-rolltemplate-custom-attack .sheet-content .sheet-key, .sheet-rolltemplate-custom-activate .sheet-content .sheet-key { font-weight: bold; @@ -3560,6 +3614,8 @@ text-align: center; .sheet-rolltemplate-custom .sheet-content :nth-child(4n), .sheet-rolltemplate-custom-normal-attack .sheet-content :nth-child(4n+3), .sheet-rolltemplate-custom-normal-attack .sheet-content :nth-child(4n), +.sheet-rolltemplate-custom-power-attack .sheet-content :nth-child(4n+3), +.sheet-rolltemplate-custom-power-attack .sheet-content :nth-child(4n), .sheet-rolltemplate-custom-attack .sheet-content :nth-child(4n+3), .sheet-rolltemplate-custom-attack .sheet-content :nth-child(4n), .sheet-rolltemplate-custom-activate .sheet-content :nth-child(4n+3), @@ -3570,9 +3626,10 @@ text-align: center; /* Description field */ .sheet-rolltemplate-custom .sheet-desc, .sheet-rolltemplate-custom-normal-attack .sheet-desc, +.sheet-rolltemplate-custom-power-attack .sheet-desc, .sheet-rolltemplate-custom-attack .sheet-desc, .sheet-rolltemplate-custom-activate .sheet-desc { - font-weight: bold; + grid-column: span 2; padding-right: 10px; - text-align: right; + text-align: left; }