diff --git a/L5R/L5RsheetCSS.css b/L5R/L5RsheetCSS.css index 71a474d01e..ed0fb2d56a 100644 --- a/L5R/L5RsheetCSS.css +++ b/L5R/L5RsheetCSS.css @@ -1,840 +1,1287 @@ +/*** + * Container width + ***/ +.ui-dialog .tab-content .charsheet .container-full { + max-width: 1000px; +} +/*** + * Section widths + ***/ +/* Medium section meant for 3 col layouts. */ +.ui-dialog .tab-content .charsheet .section-m { + min-width: 160px; + max-width: 300px; +} + +/* Full width section */ +.ui-dialog .tab-content .charsheet .section-full { + min-width: 160px; + max-width: 900px; +} + +/* Have form elements adjust thier width to that of the section container */ +.ui-dialog .tab-content .charsheet .section-m input, +.ui-dialog .tab-content .charsheet .section-m select { + width: 100%; +} + +.ui-dialog .tab-content .charsheet .section-m textarea { + box-sizing: border-box; /* ensure textarea does not overflow */ + width: 100%; +} + +/*** + * Default grid: A 3 column layout + **/ + +.ui-dialog .tab-content .charsheet .grid { + display: grid; + gap: 5px; +} + +@media (max-width: 420px) { + .ui-dialog .tab-content .charsheet .grid { + grid-template-columns: 1fr; + } +} + +@media (min-width: 420px) and (max-width: 720px) { + .ui-dialog .tab-content .charsheet .grid { + grid-template-columns: 1fr 1fr; + } +} + +@media (min-width: 720px) { + .ui-dialog .tab-content .charsheet .grid { + grid-template-columns: 1fr 1fr 1fr; + } +} + +/*** + * A grid list for repeating items + **/ + +.ui-dialog .tab-content .charsheet .repgrid > .repcontainer { + display: grid; + gap: 0px 5px; + grid-template-areas: "content content"; + grid-template-columns: minmax(80px, 210px) 70px; +} + +.ui-dialog .tab-content .charsheet .repgrid > .repcontainer.editmode { + grid-template-areas: "content controls"; +} + +.ui-dialog .tab-content .charsheet .repgrid .repitem { + display: grid; + grid-template-columns: subgrid; + grid-template-rows: subgrid; + grid-column: span 2; +} + +.ui-dialog + .tab-content + .charsheet + .repgrid + > .repcontainer.editmode + > .repitem + > .itemcontrol { + grid-area: controls; +} + +/* .ui-dialog .tab-content .charsheet .repgrid a.repcontrol_move { + grid-area: move-control; +} */ + +/* .ui-dialog .tab-content .charsheet .repgrid a.repcontrol_del { + grid-area: del-control; +} */ + +.ui-dialog .tab-content .charsheet .repgrid-content { + grid-area: content; + border: 1px solid #eee; + padding: 3px; +} + +.ui-dialog + .tab-content + .charsheet + .repgrid + .repitem:nth-child(even) + .repgrid-content { + background-color: #f2f2f2; +} + +.ui-dialog .tab-content .charsheet .repgrid summary { + cursor: pointer; + list-style: none; + user-select: none; +} + +.ui-dialog .tab-content .charsheet .repgrid summary::after { + background-color: rgba(0, 0, 0, 0.4); + border-radius: 1em; + color: #000; + content: "W"; + font-family: Pictos; + font-weight: bold; + padding: 0 5px; + margin-inline-start: 5px; + &::hover { + color: #06d85f; + } +} + +.ui-dialog .tab-content .charsheet .repgrid details::open summary::after { + content: "*"; +} + +/** + * Style form inputs with this specific class, this is also used + * for label input, but I might migrate them to use an explicit class + * here for easier debugging later. + */ +.ui-dialog .tab-content .charsheet input.l5r-textfield { + -moz-box-shadow: none; + -webkit-box-shadow: none; + box-shadow: none; + + background: transparent; + + border: 0; + border-bottom: 1px solid #000; + border-radius: 0; + + vertical-align: baseline; +} +/*** + * Legacy fields, hide when empty, place in grid when content is present. + **/ + +.ui-dialog .tab-content .charsheet textarea[name="attr_description"], +.ui-dialog .tab-content .charsheet textarea[name="attr_advantages"], +.ui-dialog .tab-content .charsheet textarea[name="attr_disadvantages"] { + grid-column-start: 1; + grid-column-end: 2; +} + +.ui-dialog + .tab-content + .charsheet + textarea[name="attr_description"]:placeholder-shown, +.ui-dialog + .tab-content + .charsheet + textarea[name="attr_advantages"]:placeholder-shown, +.ui-dialog + .tab-content + .charsheet + textarea[name="attr_disadvantages"]:placeholder-shown { + display: none; +} + +/*** + * Old Stuff + */ .dialog label { - padding-right: 0px; - -} - -.charsheet -{ - background-color: #fff; - overflow: hidden; - font-family: Calibri; - + padding-right: 0px; } -.sheet-logo -{ - img { - max-width: 100%; - height: auto; - border: 0; - margin-right: -20px; - } +.ui-dialog .tab-content .charsheet { + background-color: #fff; + overflow: hidden; + font-family: Calibri; } -.sheet-traits span, -p { - margin: 9px 0 3px; - font-family: "Helvetica Neue",Helvetica,Arial,sans-serif; - font-size: 13px; - line-height: 13px; +.ui-dialog .tab-content .charsheet .logo img { + max-width: 100%; + height: auto; + border: 0; + margin-right: -20px; } -.sheet-short - -label { - display: block; - float: left; - width: 100px; - text-align: right; - padding-right: 0px; +.ui-dialog .tab-content .charsheet .traits span, +.ui-dialog .tab-content .charsheet p { + margin: 9px 0 3px; + font-family: "Helvetica Neue", Helvetica, Arial, sans-serif; + font-size: 13px; + line-height: 13px; } -.sheet-vspace { margin-top:10px; } - -h4 -{ - font-weight: 400; - margin-left: 0; - text-align: Center; +.ui-dialog .tab-content .charsheet .short label { + display: block; + float: left; + width: 100px; + text-align: right; + padding-right: 0px; } -h1, -hr -{ - background-image: url(http://i.imgur.com/T67Y0e5.jpg); - background-position: center top 100%; - //backgrund-repeat: repea-x; - background-size: auto 85px; - height: 55px; - text-align: Left; - width: 100%; - font-size: 20px; +.ui-dialog .tab-content .charsheet .vspace { + margin-top: 10px; } -hr { height: 10px; } - -label { font-size: 12px; - } - -h1 span -{ - color: #BE4136; - padding: 0 40px; - text-align: Center; +.ui-dialog .tab-content .charsheet h4 { + font-weight: 400; + margin-left: 0; + text-align: Center; } -img { max-height: 100px; } - -span.sheet-attribute, -span.sheet-ability -{ - display: inline-block; - - font-size: 12px; - font-weight: 700; +.ui-dialog .tab-content .charsheet h1, +.ui-dialog .tab-content .charsheet hr { + background-image: url(http://i.imgur.com/T67Y0e5.jpg); + background-position: center top 100%; + //backgrund-repeat: repea-x; + background-size: auto 85px; + height: 55px; + text-align: Left; + width: 100%; + font-size: 20px; } -div.sheet-attribute, -div.sheet-ability, -ul.sheet-craft-types li { clear: right; - text-align: center; - } - -.sheet-col .sheet-2colrow.sheet-sub2colrow { width: 841px; padding: 0 auto 0 auto; +.ui-dialog .tab-content .charsheet hr { + height: 10px; } -.sheet-borderedtable -{ border:1px #745035; -width:460px -} -.sheet-borderedtable td -{ border:1px solid black; -color: #6C4C34; - background-color: #DDC69A; +.ui-dialog .tab-content .charsheet label { + font-size: 12px; } -.sheet-borderedtable th -{ border:1px solid black; -color: #FFFFFF; - background-color: #6C4C34; +.ui-dialog .tab-content .charsheet h1 span { + color: #be4136; + padding: 0 40px; + text-align: Center; } - - -.sheet-span2 -{ - margin-left: 0; - width: 543px; +.ui-dialog .tab-content .charsheet img { + max-height: 100px; } -.sheet-air -{ - color=#7290AA +.ui-dialog .tab-content .charsheet span.attribute, +.ui-dialog .tab-content .charsheet span.ability { + display: inline-block; + + font-size: 12px; + font-weight: 700; } -.sheet-skill, -.sheet-charm, -.sheet-sorcery, -.sheet-artifacts, -.sheet-hearthstones, -.sheet-languages, -.sheet-background, -.sheet-specialty, -.sheet-intimacy, -.sheet-merit, -.sheet-flaw { margin-bottom: 5px; } - -.sheet-four-lines { height: 20ex; } - -.sheet-three-lines { height: 8ex; } - -.sheet-two-lines { height: 5ex; } - -.sheet-regular { width: 120px; } - -.sheet-narrow { width: 96px; } - -.sheet-very-narrow { width: 40px; } - -.sheet-span-header -{ - display: inline-block; - - font-size: 110%; - font-weight: 700; - - margin: 0; - padding: 4px; +.ui-dialog .tab-content .charsheet div.attribute, +.ui-dialog .tab-content .charsheet div.ability, +.ui-dialog .tab-content .charsheet ul.craft-types li { + clear: right; + text-align: center; } -.sheet-2colrow.sheet-span2 .sheet-col { width: 250px; } - -.sheet-2colrow.sheet-span2 .sheet-col .sheet-span-header:first-child { width: 200px; } - -[data-groupname=repeating_attack] div:not(:first-child) .sheet-attack { border-top: 1px solid #ccc; } - -[data-groupname=repeating_intimacies] .repitem:nth-child(even) { margin-left: 40px; } - -.sheet-combat-equipment .sheet-weapons -{ - display: inline-block; - vertical-align: top; +.sheet-col .sheet-2colrow.sub2colrow { + width: 841px; + padding: 0 auto 0 auto; } -.sheet-weapons .sheet-rolls { padding: 5px; } - -.sheet-weapons span -{ - border-right: 1px solid #000; - border-top: 3px solid #000; +.ui-dialog .tab-content .charsheet .borderedtable { + border: 1px #745035; + width: 460px; } -.sheet-weapons span:first-of-type, -.sheet-weapons .sheet-rolls, -.sheet-weapons .sheet-attack input:first-of-type { border-left: 3px solid #000; } - -.sheet-weapons span:last-of-type, -.sheet-weapons .sheet-rolls, -.sheet-weapons .sheet-attack input:last-of-type { border-right: 3px solid #000; } - -.sheet-weapons .sheet-attack select -{ - height: 28px; - vertical-align: top; +.ui-dialog .tab-content .charsheet .borderedtable td { + border: 1px solid black; + color: #6c4c34; + background-color: #ddc69a; } -.sheet-weapons .sheet-attack input, -.sheet-weapons .sheet-attack select -{ - border: 1px solid #000; - border-left: none; - border-radius: 0; - - margin: 0; +.ui-dialog .tab-content .charsheet .borderedtable th { + border: 1px solid black; + color: #ffffff; + background-color: #6c4c34; } -.repcontainer[data-groupname=repeating_attacks] .repitem:last-child .sheet-rolls { border-bottom: 3px solid #000; } - -.sheet-weapons .repcontrol { width: 400px; } - -.sheet-anima:first-of-type > tbody > tr > td:last-child, -.sheet-anima:last-of-type > thead > tr:last-child > th:last-child, -.sheet-anima:last-of-type > tbody > tr > td:first-child { padding-left: 10px; } - -.sheet-anima:last-of-type { margin-top: 30px; } - -.sheet-anima:last-of-type > thead > tr > td { width: 70px; } - -.sheet-anima th -{ - font-size: 18px; - text-align: left; +.ui-dialog .tab-content .charsheet .span2 { + margin-left: 0; + width: 543px; } -.sheet-anima td { font-weight: 700; } - -.sheet-anima > thead > tr:first-child > th { font-size: 20px; } - -.sheet-familiar-attacks > thead > tr > th:first-child { text-align: left; } - -label, -.sheet-background, -.sheet-charm, -.sheet-combo, -.sheet-sorcery, -.sheet-artifacts, -.sheet-hearthstones, -.sheet-languages, -.sheet-specialty, -.sheet-intimacy, -.sheet-familiar-row, -.sheet-merit, -.sheet-flaw -{ - display: flex; - width: 100%; +.ui-dialog .tab-content .charsheet .air { + color: #7290aa; } -.sheet-background input[type=text], -.sheet-charm input, -.sheet-skills input:not(.sheet-narrow), -.sheet-sorcery input:not(.sheet-regular):not(.sheet-narrow), -.sheet-artifacts input, -.sheet-hearthstones input[type=text], -.sheet-languages input[type=text], -.sheet-specialty input[type=text], -.sheet-intimacy > input, -.sheet-merit input[type=text], -.sheet-flaw input[type=text], -label input, -label select -{ - -webkit-flex: 1 1 auto; - flex: 1 1 auto; +.ui-dialog .tab-content .charsheet .skill, +.ui-dialog .tab-content .charsheet .charm, +.ui-dialog .tab-content .charsheet .sorcery, +.ui-dialog .tab-content .charsheet .artifacts, +.ui-dialog .tab-content .charsheet .hearthstones, +.ui-dialog .tab-content .charsheet .languages, +.ui-dialog .tab-content .charsheet .background, +.ui-dialog .tab-content .charsheet .specialty, +.ui-dialog .tab-content .charsheet .intimacy, +.ui-dialog .tab-content .charsheet .merit, +.ui-dialog .tab-content .charsheet .flaw { + margin-bottom: 5px; } -.sheet-intimacy > input { max-width: 220px; } - -.sheet-intimacy .sheet-dots { width: 185px; } - -.sheet-sorcery .sheet-wide-flex, -.sheet-artifacts .sheet-wide-flex, -.sheet-hearthstones .sheet-wide-flex -{ - -webkit-flex: 70%; - flex: 70%; +.ui-dialog .tab-content .charsheet .four-lines { + height: 20ex; } -.sheet-sorcery input, -.sheet-artifacts input, -.sheet-artifacts select, -.sheet-hearthstones input, -.sheet-hearthstones select, -.sheet-charm select, -.sheet-charm input, -.sheet-skills input, -.sheet-merit input[type=text], -.sheet-flaw input[type=text] { margin-right: 5px; } - -.sheet-artifacts select, -.sheet-hearthstones select:not(:first-of-type) { font-size: 21px; } - -label span -{ - -webkit-flex: 0 1 auto; - flex: 0 1 auto; - - margin-right: 20px; +.ui-dialog .tab-content .charsheet .three-lines { + height: 8ex; } -ul.sheet-craft-types -{ - -moz-border-radius: 5px; - -webkit-border-radius: 5px; - border-radius: 5px; - border: 1px solid #3f8ff3; - - background-color: #fefefe; - display: none; - list-style-type: none; - padding: 5px; - position: absolute; - width: 190px; - z-index: 5; +.ui-dialog .tab-content .charsheet .two-lines { + height: 5ex; } -div.sheet-craft-types:hover ul.sheet-craft-types + div { opacity: 0.4; } - -label input[type=text], -label:not(.sheet-dv) input[type=number], -label select, -.sheet-background > input, -.sheet-charm input, -.sheet-charm select, -.sheet-skills input, -.sheet-sorcery input, -.sheet-artifacts input, -.sheet-artifacts select, -.sheet-hearthstones > input, -.sheet-hearthstones select, -.sheet-languages input[type=text], -.sheet-specialty input[type=text], -.sheet-intimacy > input, -.sheet-familiar-health-row select, -.sheet-merit input, -.sheet-flaw input, -.sheet-familiar-attacks > tbody > tr > td > input, -.sheet-health-label, -.sheet-health-value, -.sheet-essence input:not([disabled]), -.sheet-fancy -{ - -moz-box-shadow: none; - -webkit-box-shadow: none; - box-shadow: none; - - background: transparent; - - border: 0; - border-bottom: 1px solid #000; - border-radius: 0; - - vertical-align: baseline; +.ui-dialog .tab-content .charsheet .regular { + width: 120px; } -.sheet-charm select, -.sheet-artifacts select, -.sheet-hearthstones select { margin-bottom: 0; } - -label input:focus, -label.sheet-essence input:focus, -label.sheet-soak input:focus, -.sheet-background > input:focus, -.sheet-charm input:focus, -.sheet-skills input:focus, -.sheet-sorcery input:focus, -.sheet-artifacts input:focus, -.sheet-hearthstones > input:focus, -.sheet-languages input[type=text]:focus, -.sheet-specialty input[type=text]:focus, -.sheet-intimacy > input:focus, -.sheet-merit input:focus, -.sheet-flaw input:focus, -.sheet-familiar-attacks > tbody > tr > td > input:focus, -.sheet-essence input:focus, -.sheet-armor > label > input:focus, -.sheet-familiar-row > label > input:focus, -.sheet-fancy:focus { box-shadow: rgba(83, 167, 235, 0.466667) 0 0 6px 0; } - -.sheet-soak, -.sheet-dv -{ - display: inline-block; - max-width: 70px; +.ui-dialog .tab-content .charsheet .narrow { + width: 96px; } -.sheet-dv { max-width: 100px; } - -.sheet-essence label:not(.sheet-committed), -.sheet-essence input[type=number] -{ - display: inline; - padding-right: 0; +.ui-dialog .tab-content .charsheet .very-narrow { + width: 40px; } -input[type=radio] -{ - opacity: 0; - width: 16px; - height: 16px; - position: relative; - top: 5px; - left: 6px; - margin: -10px; - cursor: pointer; - z-index: 1; +.ui-dialog .tab-content .charsheet .span-header { + display: inline-block; + + font-size: 110%; + font-weight: 700; + + margin: 0; + padding: 4px; } -input[type=checkbox] -{ - cursor: pointer; +.sheet-2colrow.span2 .sheet-col { + width: 250px; +} - top: 5px; - left: 6px; - width: 16px; - height: 16px; +.sheet-2colrow.span2 .sheet-col .span-header:first-child { + width: 200px; +} - margin: -10px; -# opacity: 0; -# position: relative; - z-index: 1; +.ui-dialog + .tab-content + .charsheet + [data-groupname="repeating_attack"] + div:not(:first-child) + .attack { + border-top: 1px solid #ccc; +} + +.ui-dialog + .tab-content + .charsheet + [data-groupname="repeating_intimacies"] + .repitem:nth-child(even) { + margin-left: 40px; +} + +.ui-dialog .tab-content .charsheet .combat-equipment .weapons { + display: inline-block; + vertical-align: top; +} + +.ui-dialog .tab-content .charsheet .weapons .rolls { + padding: 5px; +} + +.ui-dialog .tab-content .charsheet .weapons span { + border-right: 1px solid #000; + border-top: 3px solid #000; +} + +.ui-dialog .tab-content .charsheet .weapons span:first-of-type, +.ui-dialog .tab-content .charsheet .weapons .rolls, +.ui-dialog .tab-content .charsheet .weapons .attack input:first-of-type { + border-left: 3px solid #000; +} + +.ui-dialog .tab-content .charsheet .weapons span:last-of-type, +.ui-dialog .tab-content .charsheet .weapons .rolls, +.ui-dialog .tab-content .charsheet .weapons .attack input:last-of-type { + border-right: 3px solid #000; +} + +.ui-dialog .tab-content .charsheet .weapons .attack select { + height: 28px; + vertical-align: top; +} + +.ui-dialog .tab-content .charsheet .weapons .attack input, +.ui-dialog .tab-content .charsheet .weapons .attack select { + border: 1px solid #000; + border-left: none; + border-radius: 0; + + margin: 0; +} + +.ui-dialog + .tab-content + .charsheet + .repcontainer[data-groupname="repeating_attacks"] + .repitem:last-child + .rolls { + border-bottom: 3px solid #000; +} + +.ui-dialog .tab-content .charsheet .weapons .repcontrol { + width: 400px; +} + +.ui-dialog + .tab-content + .charsheet + .anima:first-of-type + > tbody + > tr + > td:last-child, +.ui-dialog + .tab-content + .charsheet + .anima:last-of-type + > thead + > tr:last-child + > th:last-child, +.ui-dialog + .tab-content + .charsheet + .anima:last-of-type + > tbody + > tr + > td:first-child { + padding-left: 10px; +} + +.ui-dialog .tab-content .charsheet .anima:last-of-type { + margin-top: 30px; +} + +.ui-dialog .tab-content .charsheet .anima:last-of-type > thead > tr > td { + width: 70px; +} + +.ui-dialog .tab-content .charsheet .anima th { + font-size: 18px; + text-align: left; +} + +.ui-dialog .tab-content .charsheet .anima td { + font-weight: 700; +} + +.ui-dialog .tab-content .charsheet .anima > thead > tr:first-child > th { + font-size: 20px; +} + +.ui-dialog + .tab-content + .charsheet + .familiar-attacks + > thead + > tr + > th:first-child { + text-align: left; +} + +.ui-dialog .tab-content .charsheet label, +.ui-dialog .tab-content .charsheet .background, +.ui-dialog .tab-content .charsheet .charm, +.ui-dialog .tab-content .charsheet .combo, +.ui-dialog .tab-content .charsheet .sorcery, +.ui-dialog .tab-content .charsheet .artifacts, +.ui-dialog .tab-content .charsheet .hearthstones, +.ui-dialog .tab-content .charsheet .languages, +.ui-dialog .tab-content .charsheet .specialty, +.ui-dialog .tab-content .charsheet .intimacy, +.ui-dialog .tab-content .charsheet .familiar-row, +.ui-dialog .tab-content .charsheet .merit, +.ui-dialog .tab-content .charsheet .flaw { + display: flex; + width: 100%; +} + +.ui-dialog .tab-content .charsheet .background input[type="text"], +.ui-dialog .tab-content .charsheet .charm input, +.ui-dialog .tab-content .charsheet .skills input:not(.narrow), +.ui-dialog .tab-content .charsheet .sorcery input:not(.regular):not(.narrow), +.ui-dialog .tab-content .charsheet .artifacts input, +.ui-dialog .tab-content .charsheet .hearthstones input[type="text"], +.ui-dialog .tab-content .charsheet .languages input[type="text"], +.ui-dialog .tab-content .charsheet .specialty input[type="text"], +.ui-dialog .tab-content .charsheet .intimacy > input, +.ui-dialog .tab-content .charsheet .merit input[type="text"], +.ui-dialog .tab-content .charsheet .flaw input[type="text"], +.ui-dialog .tab-content .charsheet label input, +.ui-dialog .tab-content .charsheet label select { + -webkit-flex: 1 1 auto; + flex: 1 1 auto; +} + +.ui-dialog .tab-content .charsheet .intimacy > input { + max-width: 220px; +} + +.ui-dialog .tab-content .charsheet .intimacy .dots { + width: 185px; +} + +.ui-dialog .tab-content .charsheet .sorcery .wide-flex, +.ui-dialog .tab-content .charsheet .artifacts .wide-flex, +.ui-dialog .tab-content .charsheet .hearthstones .wide-flex { + -webkit-flex: 70%; + flex: 70%; +} + +.ui-dialog .tab-content .charsheet .sorcery input, +.ui-dialog .tab-content .charsheet .artifacts input, +.ui-dialog .tab-content .charsheet .artifacts select, +.ui-dialog .tab-content .charsheet .hearthstones input, +.ui-dialog .tab-content .charsheet .hearthstones select, +.ui-dialog .tab-content .charsheet .charm select, +.ui-dialog .tab-content .charsheet .charm input, +.ui-dialog .tab-content .charsheet .skills input, +.ui-dialog .tab-content .charsheet .merit input[type="text"], +.ui-dialog .tab-content .charsheet .flaw input[type="text"] { + margin-right: 5px; +} + +.ui-dialog .tab-content .charsheet .artifacts select, +.ui-dialog .tab-content .charsheet .hearthstones select:not(:first-of-type) { + font-size: 21px; +} + +.ui-dialog .tab-content .charsheet label span { + -webkit-flex: 0 1 auto; + flex: 0 1 auto; + + margin-right: 20px; +} + +.ui-dialog .tab-content .charsheet ul.craft-types { + -moz-border-radius: 5px; + -webkit-border-radius: 5px; + border-radius: 5px; + border: 1px solid #3f8ff3; + + background-color: #fefefe; + display: none; + list-style-type: none; + padding: 5px; + position: absolute; + width: 190px; + z-index: 5; +} + +.ui-dialog .tab-content .charsheet div.craft-types:hover ul.craft-types + div { + opacity: 0.4; +} + +.ui-dialog .tab-content .charsheet label input[type="text"], +.ui-dialog .tab-content .charsheet label:not(.dv) input[type="number"], +.ui-dialog .tab-content .charsheet label select, +.ui-dialog .tab-content .charsheet .background > input, +.ui-dialog .tab-content .charsheet .charm input, +.ui-dialog .tab-content .charsheet .charm select, +.ui-dialog .tab-content .charsheet .skills input, +.ui-dialog .tab-content .charsheet .sorcery input, +.ui-dialog .tab-content .charsheet .artifacts input, +.ui-dialog .tab-content .charsheet .artifacts select, +.ui-dialog .tab-content .charsheet .hearthstones > input, +.ui-dialog .tab-content .charsheet .hearthstones select, +.ui-dialog .tab-content .charsheet .languages input[type="text"], +.ui-dialog .tab-content .charsheet .specialty input[type="text"], +.ui-dialog .tab-content .charsheet .intimacy > input, +.ui-dialog .tab-content .charsheet .familiar-health-row select, +.ui-dialog .tab-content .charsheet .merit input, +.ui-dialog .tab-content .charsheet .flaw input, +.ui-dialog .tab-content .charsheet .familiar-attacks > tbody > tr > td > input, +.ui-dialog .tab-content .charsheet .health-label, +.ui-dialog .tab-content .charsheet .health-value, +.ui-dialog .tab-content .charsheet .essence input:not([disabled]), +.ui-dialog .tab-content .charsheet .fancy { + -moz-box-shadow: none; + -webkit-box-shadow: none; + box-shadow: none; + + background: transparent; + + border: 0; + border-bottom: 1px solid #000; + border-radius: 0; + + vertical-align: baseline; +} + +.ui-dialog .tab-content .charsheet .charm select, +.ui-dialog .tab-content .charsheet .artifacts select, +.ui-dialog .tab-content .charsheet .hearthstones select { + margin-bottom: 0; +} + +.ui-dialog .tab-content .charsheet label input:focus, +.ui-dialog .tab-content .charsheet label.sheet-essence input:focus, +.ui-dialog .tab-content .charsheet label.sheet-soak input:focus, +.ui-dialog .tab-content .charsheet .background > input:focus, +.ui-dialog .tab-content .charsheet .charm input:focus, +.ui-dialog .tab-content .charsheet .skills input:focus, +.ui-dialog .tab-content .charsheet .sorcery input:focus, +.ui-dialog .tab-content .charsheet .artifacts input:focus, +.ui-dialog .tab-content .charsheet .hearthstones > input:focus, +.ui-dialog .tab-content .charsheet .languages input[type="text"]:focus, +.ui-dialog .tab-content .charsheet .specialty input[type="text"]:focus, +.ui-dialog .tab-content .charsheet .intimacy > input:focus, +.ui-dialog .tab-content .charsheet .merit input:focus, +.ui-dialog .tab-content .charsheet .flaw input:focus, +.ui-dialog + .tab-content + .charsheet + .familiar-attacks + > tbody + > tr + > td + > input:focus, +.ui-dialog .tab-content .charsheet .essence input:focus, +.ui-dialog .tab-content .charsheet .armor > label > input:focus, +.ui-dialog .tab-content .charsheet .familiar-row > label > input:focus, +.ui-dialog .tab-content .charsheet .fancy:focus { + box-shadow: rgba(83, 167, 235, 0.466667) 0 0 6px 0; +} + +.ui-dialog .tab-content .charsheet .soak, +.ui-dialog .tab-content .charsheet .dv { + display: inline-block; + max-width: 70px; +} + +.ui-dialog .tab-content .charsheet .dv { + max-width: 100px; +} + +.ui-dialog .tab-content .charsheet .essence label:not(.sheet-committed), +.ui-dialog .tab-content .charsheet .essence input[type="number"] { + display: inline; + padding-right: 0; +} + +.ui-dialog .tab-content .charsheet input[type="radio"] { + opacity: 0; + width: 16px; + height: 16px; + position: relative; + top: 5px; + left: 6px; + margin: -10px; + cursor: pointer; + z-index: 1; +} + +.ui-dialog .tab-content .charsheet input[type="checkbox"] { + cursor: pointer; + + top: 5px; + left: 6px; + width: 16px; + height: 16px; + + margin: -10px; + z-index: 1; } /* Fake radio */ -input[type="radio"] + span::before -{ - margin-right: 4px; - border: solid 1px #a8a8a8; - line-height: 14px; - text-align: center; - display: inline-block; - vertical-align: middle; - - -moz-box-shadow: 0 0 2px #ccc; - -webkit-box-shadow: 0 0 2px #ccc; - box-shadow: 0 0 2px #ccc; - - background: #f6f6f6; - background: -moz-radial-gradient(#f6f6f6, #dfdfdf); - background: -webkit-radial-gradient(#f6f6f6, #dfdfdf); - background: -ms-radial-gradient(#f6f6f6, #dfdfdf); - background: -o-radial-gradient(#f6f6f6, #dfdfdf); - background: radial-gradient(#f6f6f6, #dfdfdf); - - content: "•"; - width: 15px; - height: 15px; - font-size: 24px; - - -moz-border-radius: 50%; - -webkit-border-radius: 50%; - border-radius: 50%; +.ui-dialog .tab-content .charsheet input[type="radio"] + span::before { + margin-right: 4px; + border: solid 1px #a8a8a8; + line-height: 14px; + text-align: center; + display: inline-block; + vertical-align: middle; + + -moz-box-shadow: 0 0 2px #ccc; + -webkit-box-shadow: 0 0 2px #ccc; + box-shadow: 0 0 2px #ccc; + + background: #f6f6f6; + background: -moz-radial-gradient(#f6f6f6, #dfdfdf); + background: -webkit-radial-gradient(#f6f6f6, #dfdfdf); + background: -ms-radial-gradient(#f6f6f6, #dfdfdf); + background: -o-radial-gradient(#f6f6f6, #dfdfdf); + background: radial-gradient(#f6f6f6, #dfdfdf); + + content: "•"; + width: 15px; + height: 15px; + font-size: 24px; + + -moz-border-radius: 50%; + -webkit-border-radius: 50%; + border-radius: 50%; } /* Remove dot from all radios _after_ selected one */ -input[type="radio"]:checked ~ input[type="radio"] + span::before -{ - content: ""; +.ui-dialog + .tab-content + .charsheet + input[type="radio"]:checked + ~ input[type="radio"] + + span::before { + content: ""; } -input[type=checkbox] + span::before -{ - -moz-box-shadow: 0 0 2px #ccc; - -webkit-box-shadow: 0 0 2px #ccc; - box-shadow: 0 0 2px #ccc; +.ui-dialog .tab-content .charsheet input[type="checkbox"] + span::before { + -moz-box-shadow: 0 0 2px #ccc; + -webkit-box-shadow: 0 0 2px #ccc; + box-shadow: 0 0 2px #ccc; - background: radial-gradient(#f6f6f6,#dfdfdf); - border: solid 1px #a8a8a8; - display: inline-block; - line-height: 14px; - margin-right: 4px; - - text-align: center; - vertical-align: middle; - -moz-border-radius: 3px; - -webkit-border-radius: 3px; - border-radius: 3px; + background: radial-gradient(#f6f6f6, #dfdfdf); + border: solid 1px #a8a8a8; + display: inline-block; + line-height: 14px; + margin-right: 4px; - content: ""; - font-size: 12px; + text-align: center; + vertical-align: middle; + -moz-border-radius: 3px; + -webkit-border-radius: 3px; + border-radius: 3px; - width: 14px; - height: 14px; + content: ""; + font-size: 12px; + + width: 14px; + height: 14px; } -.sheet-essence-high input[type=number] -{ - display: inline; - padding-right: 0; +.ui-dialog .tab-content .charsheet .essence-high input[type="number"] { + display: inline; + padding-right: 0; } -input[type=radio] -{ - cursor: pointer; +.ui-dialog .tab-content .charsheet input[type="radio"] { + cursor: pointer; - top: 5px; - left: 6px; - width: 16px; - height: 16px; + top: 5px; + left: 6px; + width: 16px; + height: 16px; - margin: -10px; - opacity: 0; - position: relative; - z-index: 1; + margin: -10px; + opacity: 0; + position: relative; + z-index: 1; } -input[type=checkbox] -{ - cursor: pointer; +.ui-dialog .tab-content .charsheet input[type="checkbox"] { + cursor: pointer; - top: 5px; - left: 6px; - width: 16px; - height: 16px; + top: 5px; + left: 6px; + width: 16px; + height: 16px; - margin-left: 10px; - margin-right: 11px; -# opacity: 0; -# position: relative; - z-index: 1; + margin-left: 10px; + margin-right: 11px; + z-index: 1; } -input[type=radio] + span::before, -input[type=checkbox] + span::before -{ - -moz-box-shadow: 0 0 2px #ccc; - -webkit-box-shadow: 0 0 2px #ccc; - box-shadow: 0 0 2px #ccc; +.ui-dialog .tab-content .charsheet input[type="radio"] + span::before, +.ui-dialog .tab-content .charsheet input[type="checkbox"] + span::before { + -moz-box-shadow: 0 0 2px #ccc; + -webkit-box-shadow: 0 0 2px #ccc; + box-shadow: 0 0 2px #ccc; - background: radial-gradient(#f6f6f6,#dfdfdf); - border: solid 1px #a8a8a8; - display: inline-block; - line-height: 14px; - margin-right: 4px; + background: radial-gradient(#f6f6f6, #dfdfdf); + border: solid 1px #a8a8a8; + display: inline-block; + line-height: 14px; + margin-right: 4px; - text-align: center; - vertical-align: middle; + text-align: center; + vertical-align: middle; } -input[type=checkbox] + span::before -{ - -moz-border-radius: 3px; - -webkit-border-radius: 3px; - border-radius: 3px; +.ui-dialog .tab-content .charsheet input[type="checkbox"] + span::before { + -moz-border-radius: 3px; + -webkit-border-radius: 3px; + border-radius: 3px; - content: ""; - font-size: 12px; + content: ""; + font-size: 12px; - width: 14px; - height: 14px; + width: 14px; + height: 14px; } - -.sheet-dots input[type=checkbox]:first-child + span::before { opacity: 0.3; } - -.sheet-ability input[type=checkbox]:first-child:checked + span::before, -.sheet-will input[type=checkbox]:checked + span::before, -.sheet-hearthstones input[type=checkbox]:checked + span::before, -.sheet-languages input[type=checkbox]:checked + span::before, -.sheet-anima input[type=checkbox]:checked + span::before -{ - -moz-box-shadow: 0 0 2px #ccc; - -webkit-box-shadow: 0 0 2px #ccc; - box-shadow: 0 0 2px #ccc; - - background: radial-gradient(#f6f6f6,#dfdfdf); - color: #bea000; - content: "?"; +.ui-dialog + .tab-content + .charsheet + .dots + input[type="checkbox"]:first-child + + span::before { + opacity: 0.3; } -.sheet-hearthstones input[type=checkbox] + span::before -{ - margin-left: -15px; - margin-top: 5px; +.ui-dialog + .tab-content + .charsheet + .ability + input[type="checkbox"]:first-child:checked + + span::before, +.ui-dialog + .tab-content + .charsheet + .will + input[type="checkbox"]:checked + + span::before, +.ui-dialog + .tab-content + .charsheet + .hearthstones + input[type="checkbox"]:checked + + span::before, +.ui-dialog + .tab-content + .charsheet + .languages + input[type="checkbox"]:checked + + span::before, +.ui-dialog + .tab-content + .charsheet + .anima + input[type="checkbox"]:checked + + span::before { + -moz-box-shadow: 0 0 2px #ccc; + -webkit-box-shadow: 0 0 2px #ccc; + box-shadow: 0 0 2px #ccc; + + background: radial-gradient(#f6f6f6, #dfdfdf); + color: #bea000; + content: "?"; } -.sheet-dots input[type=checkbox]:first-child:checked + span::before -{ - -moz-box-shadow: 0 0 2px transparent; - -webkit-box-shadow: 0 0 2px transparent; - box-shadow: 0 0 2px transparent; - - background: transparent; - border: solid 1px transparent; - color: #a00; - content: "?"; +.ui-dialog + .tab-content + .charsheet + .hearthstones + input[type="checkbox"] + + span::before { + margin-left: -15px; + margin-top: 5px; } -.sheet-dots input[type=checkbox]:first-child:hover:checked + span::before, -.sheet-ability input[type=checkbox]:first-child + span::before -{ - -moz-box-shadow: 0 0 2px #ccc; - -webkit-box-shadow: 0 0 2px #ccc; - box-shadow: 0 0 2px #ccc; +.ui-dialog + .tab-content + .charsheet + .dots + input[type="checkbox"]:first-child:checked + + span::before { + -moz-box-shadow: 0 0 2px transparent; + -webkit-box-shadow: 0 0 2px transparent; + box-shadow: 0 0 2px transparent; - border: solid 1px #a8a8a8; - margin-right: 4px; + background: transparent; + border: solid 1px transparent; + color: #a00; + content: "?"; } -.sheet-dots input[type=checkbox]:checked ~ input[type=radio] + span { opacity: 0.5; } +.ui-dialog + .tab-content + .charsheet + .dots + input[type="checkbox"]:first-child:hover:checked + + span::before, +.ui-dialog + .tab-content + .charsheet + .ability + input[type="checkbox"]:first-child + + span::before { + -moz-box-shadow: 0 0 2px #ccc; + -webkit-box-shadow: 0 0 2px #ccc; + box-shadow: 0 0 2px #ccc; -.sheet-health-label,.sheet-health-value { width: 45px; } - -.sheet-familiar-health-row select.sheet-health-value { float: none; } - -input.sheet-tab -{ - width: 100px; - height: 18px; - - position:inherit; + border: solid 1px #a8a8a8; + margin-right: 4px; } -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 -{ - -moz-border-radius: 3px; - -webkit-border-radius: 3px; - border-radius: 3px; - - background-color: #DDC69A; - background-image: -webkit-gradient(linear, left top, left bottom, from(#DDC69A), to(#745035 )); - background-image: -webkit-linear-gradient(top, #DDC69A, #745035 ); - background-image: -moz-linear-gradient(top, #DDC69A, #745035 ); - background-image: -ms-linear-gradient(top, #DDC69A, #745035 ); - background-image: -o-linear-gradient(top, #DDC69A, #745035 ); - background-image: linear-gradient(to bottom, #DDC69A, #745035 ); - filter: progid: DXImageTransform.Microsoft.gradient(GradientType=0, startColorstr=#DDC69A, endColorstr=#745035 ); - - color: #f8f8f8; - content: attr(title); - - font-size: 14px; - font-weight: 700; - - width: 100px; - height: 18px; - - margin-left: -90px; - margin-right: 10px; - padding-top: 2px; - - text-shadow: -1px -1px 0 rgba(0,0,0,0.5); +.ui-dialog + .tab-content + .charsheet + .dots + input[type="checkbox"]:checked + ~ input[type="radio"] + + span { + opacity: 0.5; } -input.sheet-tab:checked + span::before -{ - background-color: #62442d; - background-image: -webkit-gradient(linear, left top, left bottom, from(#62442d), to(#d7bb87)); - background-image: -webkit-linear-gradient(top, #62442d, #d7bb87); - background-image: -moz-linear-gradient(top, #62442d, #d7bb87); - background-image: -ms-linear-gradient(top, #62442d, #d7bb87); - background-image: -o-linear-gradient(top, #62442d, #d7bb87); - background-image: linear-gradient(to bottom, #62442d, #d7bb87); - filter: progid: DXImageTransform.Microsoft.gradient(GradientType=0, startColorstr=#62442d, endColorstr=#d7bb87); - - border: 1px solid #6a7000; +.ui-dialog .tab-content .charsheet .health-label, +.ui-dialog .tab-content .charsheet .health-value { + width: 45px; } -.sheet-tab-content { display: none; } -.sheet-center, -h3.sheet-ability, -h4, -.sheet-familiar-attacks > tbody > tr > td:nth-child(2), -.sheet-familiar-attacks > tbody > tr > td:nth-child(3), -.sheet-familiar-attacks > tbody > tr > td:nth-child(5), -input[type=number] { text-align: center; } +.ui-dialog .tab-content .charsheet .familiar-health-row select.health-value { + float: none; +} -.sheet-right, -.sheet-background .sheet-dots, -.sheet-specialty .sheet-dots, -.sheet-intimacy .sheet-dots { text-align: right; } +.ui-dialog .tab-content .charsheet input.sheet-tab { + width: 100px; + height: 18px; -button[type=roll].sheet-blank-roll-button::before, -input[type=radio]:not(.sheet-tab):checked ~ input[type=radio] + span::before, -.sheet-dots input[type=checkbox]:checked ~ input[type=radio] + span::before { content: ""; } + position: inherit; +} -span.sheet-attribute + div, -span.sheet-ability + div, -.sheet-virtue, -[data-groupname=repeating_intimacies] .repitem, -.sheet-combat-equipment .sheet-armor { display: inline-block; } +.ui-dialog .tab-content .charsheet input.sheet-tab:first-of-type { + margin-left: 5px; +} -div.sheet-attribute div, -div.sheet-ability div, -.sheet-health-value { float: right; } +.ui-dialog + .tab-content + .charsheet + input.sheet-tab:first-of-type + + span::before { + margin-left: -85px; +} -[data-groupname=repeating_charms] .repitem, -.sheet-anima, -.sheet-familiar-attacks, -.sheet-familiar-attacks > tbody > tr > td > input[type=text] { width: 100%; } +.ui-dialog .tab-content .charsheet input.sheet-tab + span::before, +.ui-dialog + .tab-content + .charsheet + input.sheet-tab:checked + ~ input.sheet-tab + + span::before { + -moz-border-radius: 3px; + -webkit-border-radius: 3px; + border-radius: 3px; -.repcontrol, -.sheet-familiar-attacks > tbody > tr:not(:first-child) > td > input { margin-top: 5px; } + background-color: #ddc69a; + background-image: -webkit-gradient( + linear, + left top, + left bottom, + from(#ddc69a), + to(#745035) + ); + background-image: -webkit-linear-gradient(top, #ddc69a, #745035); + background-image: -moz-linear-gradient(top, #ddc69a, #745035); + background-image: -ms-linear-gradient(top, #ddc69a, #745035); + background-image: -o-linear-gradient(top, #ddc69a, #745035); + background-image: linear-gradient(to bottom, #ddc69a, #745035); + filter: progid: DXImageTransform.Microsoft.gradient(GradientType=0, startColorstr=#DDC69A, endColorstr=#745035 ); -div.sheet-craft-types:hover ul.sheet-craft-types, -.sheet-tab[value=information]:checked ~ .sheet-information-tab, -.sheet-tab[value=skills]:checked ~ .sheet-skills-tab, -.sheet-tab[value=weapons]:checked ~ .sheet-weapons-tab, -.sheet-tab[value=spells]:checked ~ .sheet-spells-tab { display: block; } + color: #f8f8f8; + content: attr(title); + font-size: 14px; + font-weight: 700; + width: 100px; + height: 18px; -div.sheet-ability > input[type=checkbox]:first-child + span::before, -.sheet-dots input[type=checkbox]:first-child:hover + span::before, -.sheet-dots input[type=checkbox]:first-child:checked + span::before { opacity: 1; } + margin-left: -90px; + margin-right: 10px; + padding-top: 2px; -.sheet-col select {width: 85px;} + text-shadow: -1px -1px 0 rgba(0, 0, 0, 0.5); +} -.sheet-skillselect { - width: 85px; - } - -.sheet-spelltable { - width:100%; - } +.ui-dialog .tab-content .charsheet input.sheet-tab:checked + span::before { + background-color: #62442d; + background-image: -webkit-gradient( + linear, + left top, + left bottom, + from(#62442d), + to(#d7bb87) + ); + background-image: -webkit-linear-gradient(top, #62442d, #d7bb87); + background-image: -moz-linear-gradient(top, #62442d, #d7bb87); + background-image: -ms-linear-gradient(top, #62442d, #d7bb87); + background-image: -o-linear-gradient(top, #62442d, #d7bb87); + background-image: linear-gradient(to bottom, #62442d, #d7bb87); + filter: progid: DXImageTransform.Microsoft.gradient(GradientType=0, startColorstr=#62442d, endColorstr=#d7bb87); - /* == ROLL TEMPLATE == */ + border: 1px solid #6a7000; +} + +.ui-dialog .tab-content .charsheet .tab-container { + display: none; +} +.ui-dialog .tab-content .charsheet .center, +.ui-dialog .tab-content .charsheet h3.ability, +.ui-dialog .tab-content .charsheet h4, +.ui-dialog + .tab-content + .charsheet + .familiar-attacks + > tbody + > tr + > td:nth-child(2), +.ui-dialog + .tab-content + .charsheet + .familiar-attacks + > tbody + > tr + > td:nth-child(3), +.ui-dialog + .tab-content + .charsheet + .familiar-attacks + > tbody + > tr + > td:nth-child(5), +.ui-dialog .tab-content .charsheet input[type="number"] { + text-align: center; +} + +.ui-dialog .tab-content .charsheet .right, +.ui-dialog .tab-content .charsheet .background .dots, +.ui-dialog .tab-content .charsheet .specialty .dots, +.ui-dialog .tab-content .charsheet .intimacy .dots { + text-align: right; +} + +.ui-dialog + .tab-content + .charsheet + button[type="roll"].blank-roll-button::before, +.ui-dialog + .tab-content + .charsheet + input[type="radio"]:not(.sheet-tab):checked + ~ input[type="radio"] + + span::before, +.ui-dialog + .tab-content + .charsheet + .dots + input[type="checkbox"]:checked + ~ input[type="radio"] + + span::before { + content: ""; +} + +.ui-dialog .tab-content .charsheet span.attribute + div, +.ui-dialog .tab-content .charsheet span.ability + div, +.ui-dialog .tab-content .charsheet .virtue, +.ui-dialog + .tab-content + .charsheet + [data-groupname="repeating_intimacies"] + .repitem, +.ui-dialog .tab-content .charsheet .combat-equipment .armor { + display: inline-block; +} + +.ui-dialog .tab-content .charsheet div.attribute div, +.ui-dialog .tab-content .charsheet div.ability div, +.ui-dialog .tab-content .charsheet .health-value { + float: right; +} + +.ui-dialog .tab-content .charsheet [data-groupname="repeating_charms"] .repitem, +.ui-dialog .tab-content .charsheet .anima, +.ui-dialog .tab-content .charsheet .familiar-attacks, +.ui-dialog + .tab-content + .charsheet + .familiar-attacks + > tbody + > tr + > td + > input[type="text"] { + width: 100%; +} + +.ui-dialog .tab-content .charsheet .repcontrol, +.ui-dialog + .tab-content + .charsheet + .familiar-attacks + > tbody + > tr:not(:first-child) + > td + > input { + margin-top: 5px; +} + +.ui-dialog .tab-content .charsheet div.craft-types:hover ul.craft-types, +.ui-dialog + .tab-content + .charsheet + .sheet-tab[value="information"]:checked + ~ .information-tab, +.ui-dialog + .tab-content + .charsheet + .sheet-tab[value="skills"]:checked + ~ .skills-tab, +.ui-dialog + .tab-content + .charsheet + .sheet-tab[value="weapons"]:checked + ~ .weapons-tab, +.ui-dialog + .tab-content + .charsheet + .sheet-tab[value="spells"]:checked + ~ .spells-tab { + display: block; +} + +.ui-dialog + .tab-content + .charsheet + div.ability + > input[type="checkbox"]:first-child + + span::before, +.ui-dialog + .tab-content + .charsheet + .dots + input[type="checkbox"]:first-child:hover + + span::before, +.ui-dialog + .tab-content + .charsheet + .dots + input[type="checkbox"]:first-child:checked + + span::before { + opacity: 1; +} + +.ui-dialog .tab-content .charsheet .sheet-col select { + width: 85px; +} + +.ui-dialog .tab-content .charsheet .skillselect { + width: 85px; +} + +.ui-dialog .tab-content .charsheet .spelltable { + width: 100%; +} + +/* == ROLL TEMPLATE == */ .sheet-rolltemplate-l5rdefault { - border:1px solid black; - border-radius:5px; - box-shadow: 3px 3px 5px black; - border-collapse:collapse; + border: 1px solid black; + border-radius: 5px; + box-shadow: 3px 3px 5px black; + border-collapse: collapse; } .sheet-rolltemplate-l5rdefault th { - background-color: #DDC69A; - background-image: -webkit-gradient(linear, left top, left bottom, from(#DDC69A), to(#745035 )); - background-image: -webkit-linear-gradient(top, #DDC69A, #745035 ); - background-image: -moz-linear-gradient(top, #DDC69A, #745035 ); - background-image: -ms-linear-gradient(top, #DDC69A, #745035 ); - background-image: -o-linear-gradient(top, #DDC69A, #745035 ); - background-image: linear-gradient(to bottom, #DDC69A, #745035 ); - filter: progid: DXImageTransform.Microsoft.gradient(GradientType=0, startColorstr=#DDC69A, endColorstr=#745035 ); - font-size:22pt; - color:white; - padding:7px; + background-color: #ddc69a; + background-image: -webkit-gradient( + linear, + left top, + left bottom, + from(#ddc69a), + to(#745035) + ); + background-image: -webkit-linear-gradient(top, #ddc69a, #745035); + background-image: -moz-linear-gradient(top, #ddc69a, #745035); + background-image: -ms-linear-gradient(top, #ddc69a, #745035); + background-image: -o-linear-gradient(top, #ddc69a, #745035); + background-image: linear-gradient(to bottom, #ddc69a, #745035); + filter: progid: DXImageTransform.Microsoft.gradient(GradientType=0, startColorstr=#DDC69A, endColorstr=#745035 ); + font-size: 22pt; + color: white; + padding: 7px; } .sheet-rolltemplate-l5rdefault tr { - border:1px solid black; + border: 1px solid black; } .sheet-rolltemplate-l5rdefault td { - padding:2px; + padding: 2px; } .sheet-rolltemplate-l5rdefault tr:nth-child(odd) { - background-color: #FEE8BD; + background-color: #fee8bd; } .sheet-rolltemplate-l5rdefault tr:nth-child(even) { - background-color:#ffffff; + background-color: #ffffff; } .sheet-rolltemplate-l5rdefault .sheet-tkey { - font-weight: bold; - padding:2px; + font-weight: bold; + padding: 2px; } .sheet-rolltemplate-l5rdefault .sheet-tvalue { - text-align:left; + text-align: left; } .sheet-rolltemplate-l5rdefault .sheet-rolltemplate-subtitle { - font-size:12pt; + font-size: 12pt; } .sheet-rolltemplate-l5rdefault .sheet-rolltemplate-flavor { - padding:3px; - margin-top:3px; - margin-left:3px; - border:1px dashed black; - width:90%; - height:90%; - text-align:center; + padding: 3px; + margin-top: 3px; + margin-left: 3px; + border: 1px dashed black; + width: 90%; + height: 90%; + text-align: center; } - .sheet-rolltemplate-l5r table { - width: 189px; - height: 189px; - padding: 2px; - background: url(http://i.imgur.com/xBk4U1p.jpg) top left; - background-size: 189px 189px; - background-repeat: no-repeat; - font-family: "Papyrus"; - font-weight: bold; - border-spacing: 0; + width: 189px; + height: 189px; + padding: 2px; + background: url(http://i.imgur.com/xBk4U1p.jpg) top left; + background-size: 189px 189px; + background-repeat: no-repeat; + font-family: "Papyrus"; + font-weight: bold; + border-spacing: 0; } - + .sheet-rolltemplate-l5r th { - color: rgb(112, 0, 0); - padding: 15px 2px 2px 20px; - line-height: 1.2em; - font-size: 1.2em; - text-align: left; + color: rgb(112, 0, 0); + padding: 15px 2px 2px 20px; + line-height: 1.2em; + font-size: 1.2em; + text-align: left; } - - + .sheet-rolltemplate-l5r td { - padding-left: 20px; - font-size: 1.0em; - vertical-align: top; + padding-left: 20px; + font-size: 1em; + vertical-align: top; } - + .sheet-rolltemplate-l5r .sheet-result { - font-size: 1.2em; - text-align: center; - color: rgb(112, 0, 0); - padding-bottom: 20px; + font-size: 1.2em; + text-align: center; + color: rgb(112, 0, 0); + padding-bottom: 20px; } - -.sheet-rolltemplate-l5r .inlinerollresult { - background-color: transparent; - color: #000000; - border: none; + +.sheet-rolltemplate-l5r .inlinerollresult { + background-color: transparent; + color: #000000; + border: none; } - + .sheet-rolltemplate-l5r .inlinerollresult.fullcrit { - color: #3FB315; - border: none; + color: #3fb315; + border: none; } - + .sheet-rolltemplate-l5r .inlinerollresult.fullfail { - color: #000000; - border: none; + color: #000000; + border: none; } - + .sheet-rolltemplate-l5r .inlinerollresult.importantroll { - color: #3FB315; - border: none; + color: #3fb315; + border: none; } - - diff --git a/L5R/sheet.html b/L5R/sheet.html index 93914179c7..5e149b3f4f 100644 --- a/L5R/sheet.html +++ b/L5R/sheet.html @@ -19,41 +19,47 @@ - +
| - + | + + | ||||||
| - | - | - | - | ||||
| - | - | - | + | + | + | + | + + |
| - | - - | - | + | + | + | + | + + | +
| + | + | + | |||||
| Acting | -+ |