Files
roll20-character-sheets/ADnD_1E/1ESheet.css
T
2024-06-01 00:17:36 -07:00

906 lines
21 KiB
CSS

.charsheet .hidden {
display: none;
}
/* announcements */
.charsheet .announcements-title {
vertical-align: text-bottom;
color: #1e90ff;
font-weight: bold;
}
.charsheet .announcements {
background-color: #f0f8ff;
border: 1px solid #000000;
padding: 10px;
margin: 0 5px 0 5px;
height: 200px;
overflow-y: scroll;
}
/* abilities */
.charsheet div.abilities tr td.center:first-child {
background-color: #1f1f1f;
color: #fff;
font-family: serif;
width: 4.5em;
}
.charsheet div.abilities tr td:nth-child(2) {
width: 14%;
text-align: center;
white-space: nowrap;
}
.charsheet div.abilities tr td:nth-child(2) input.input-small {
width: 50%;
}
.charsheet .options {
display: flex;
}
.charsheet .options label {
font-size: 1em;
}
/* dark mode */
.sheet-darkmode .tab-content .tab-pane,
.sheet-darkmode .tab-content .tab-pane .background,
.sheet-darkmode .tab-content .tab-pane .background .wrapper,
.sheet-darkmode .tab-content .tab-pane .background .wrapper .announcements,
.sheet-darkmode .tab-content .tab-pane .background .wrapper input,
.sheet-darkmode .tab-content .tab-pane .background .wrapper table tr td {
background-color: #000;
color: #e1e1e1;
font-weight: normal;
}
.sheet-darkmode .tab-content .tab-pane .background .wrapper .announcements,
.sheet-darkmode .tab-content .tab-pane .background .wrapper .announcements h4 {
background-color: #333;
color: #e1e1e1;
font-weight: normal;
}
.charsheet .logo-box {
padding-top: 10px;
}
.charsheet .logo-box.normal-mode img,
.charsheet .logo-box.dark-mode img {
max-width: 240px;
width: 50%;
display: inline-block;
}
.charsheet .logo-box.dark-mode {
display: none;
}
.sheet-darkmode .tab-content .tab-pane .background .wrapper .logo-box.normal-mode {
display: none;
}
.sheet-darkmode .tab-content .tab-pane .background .wrapper .logo-box.dark-mode {
display: block;
}
/* background toggle */
.charsheet .wrapper {
margin: 0;
padding: 5px;
}
.charsheet .background {
min-width: 770px;
}
.charsheet .useBackground input[value="1"]:checked~.background {
background-image: none;
background-color: white;
}
.charsheet .useBackground input[value="2"]:checked~.background {
background-image: url("https://raw.githubusercontent.com/Roll20/roll20-character-sheets/master/ADnD_1E/images/back.jpg");
background-size: cover;
background-position: center top;
}
.charsheet .useBackground input[value="3"]:checked~.background {
background-image: none;
background-color: #f4d74f;
}
.charsheet .useBackground input[value="4"]:checked~.background {
background-image: none;
background-color: #b5dcb3;
}
/* converting from tables */
.charsheet .table {
justify-content: center;
width: 100%;
}
.charsheet .table-row {
display: flex;
width: 100%;
line-height: 1em;
}
.charsheet .table-row span {
margin: 0 2px 0 2px;
}
.charsheet .data {
display: table-cell;
vertical-align: bottom;
}
.charsheet .left {
text-align: left;
}
.charsheet .right {
text-align: right;
}
.charsheet .center {
text-align: center;
}
.charsheet .border {
border: 1px solid gray;
border-radius: 10px;
border-collapse: separate;
box-sizing: border-box;
margin: 2px 0 2px 0;
padding: 2px;
}
.charsheet div span.input textarea.macro-text-short {
width: 100%;
height: 1em;
margin: 0 0 0 2px;
}
.charsheet span.input-sm {
width: 6em;
}
.charsheet span.input-sm1 {
width: 10em;
}
.charsheet span.input-med {
width: 12em;
}
.charsheet span.input-med1 {
width: 16em;
}
.charsheet span.input-long {
width: 30em;
}
.charsheet .input-select {
width: 100%;
margin: 0;
padding: 3px 0 0 9px;
height: 1.85em;
}
/* Spell tabs */
.charsheet div.spell-display {
display: none;
}
.charsheet input.toggle-show[value="1"]~div.spell-display {
display: inherit;
}
.charsheet .spell-tabs {
display: flex;
justify-content: space-around;
width: 99%;
padding: 0 0 0 3px;
margin: -1px 0 5px 0;
border-bottom: 1px solid #767471;
}
.charsheet span.tab {
width: 9%;
height: 1.75em;
display: inline-block;
border: 1px solid #5a5957;
border-top-left-radius: 10px;
border-top-right-radius: 10px;
text-align: center;
background-color: rgba(148, 148, 148, 0.5);
color: #ffffff;
}
.charsheet input[type="radio"].tab-hidden+span.tab::before {
display: none;
}
.charsheet input[type="radio"].tab-hidden:not(:checked)+span.tab {
color: #ffffff;
background-color: #1f1f1f;
}
.charsheet input[type="radio"].tab-hidden:not(:checked):hover+span.tab {
background-color: #333333;
height: 2em;
margin: -3px 0 0 0;
}
.charsheet input[type="radio"].tab-hidden:checked+span.tab {
background-color: white;
color: #000;
font-weight: bold;
height: 2em;
margin: -4px 0 0 0;
box-shadow: 2px 1px 5px #000;
z-index: 1;
}
.charsheet div.spell-tabs>input.tab-hidden {
opacity: 0;
position: relative;
margin: 0 -5em 0 0;
width: 8%;
height: 1.2em;
z-index: 1;
}
.charsheet table,
.charsheet tr {
width: 100%;
}
.charsheet table,
.charsheet tr,
.charsheet td {
font-size: 12px;
font-weight: bold;
}
.charsheet input {
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
background-color: transparent;
border: 1px transparent;
border-bottom: 1px solid;
box-sizing: border-box;
color: #262626;
font-family: cursive;
font-size: 1.1em;
height: auto;
min-width: 2em;
text-align: center;
vertical-align: middle;
}
.charsheet .input-small,
.charsheet input[type="number"].input-small,
.charsheet input[type="text"].input-small {
width: 3.75em;
height: 1.85em;
}
.charsheet .input-medium,
.charsheet input[type="number"].input-medium,
.charsheet input[type="text"].input-medium {
width: 80%;
height: 1.85em;
}
.charsheet input[type="text"].input-large,
.charsheet input[type="number"].input-large,
.charsheet input[type="number"].input-large {
width: 100%;
height: 1.85em;
min-width: 7em;
}
.charsheet input[disabled],
.charsheet select[disabled],
.charsheet textarea[disabled],
.charsheet input[readonly] {
cursor: not-allowed;
background-color: rgba(245, 245, 245, 0.85);
}
.charsheet select {
background-color: transparent;
cursor: pointer;
}
.charsheet button[type=roll].button-url {
background-color: transparent;
background-image: none;
padding: 0;
margin: 0;
font-size: 1em;
color: #1e90ff;
text-decoration: underline;
border: none;
vertical-align: bottom;
box-shadow: none;
}
.charsheet button[type=roll].button-url::before {
content: '';
display: none;
}
.charsheet button[type=roll].button {
font-size: 1em;
background-image: none;
white-space: break-spaces;
line-height: normal;
}
.sheet-darkmode .tab-content .background button[type=roll].button {
background-color: #1f1f1f;
color: #fff;
font-weight: normal;
text-shadow: none;
}
.charsheet button.initiative {
margin-right:-50px;
}
.charsheet .sect {
margin-bottom: 10px;
}
.charsheet .sect > table {
width: 99%;
}
.charsheet .header {
display: inline-block;
font-size: 16px;
font-weight: bold;
margin: 0 -5px 0 0;
}
.charsheet hr {
border-top: 1px solid #8c8b8b;
margin: 5px;
}
.charsheet .text-small {
font-size: 10px;
}
.charsheet .text-large {
font-size: 14px;
font-weight: bold;
}
.charsheet div.table-row textarea {
width: 94%;
resize: vertical;
margin: 0 10px 5px 20px;
height: 60px;
background-color: transparent;
}
/*hide and seek magic*/
.charsheet input[type="checkbox"].sect-show {
opacity: 0;
position: relative;
height: 1em;
z-index: 1;
cursor: pointer;
}
.charsheet .sect-show:not(:checked)~.sect {
display: none;
}
.charsheet input[type="checkbox"]+span:not(.not-sheet-show)::before {
display: inline-block;
content: '►';
width: 14px;
height: 16px;
font-size: .85em;
vertical-align: text-bottom;
margin-bottom: 1px;
}
.charsheet input[type="checkbox"]:checked+span:not(.not-sheet-show)::before {
content: '▼';
}
/*rep-items counter*/
.charsheet .repeating-fields {
counter-reset: sheet-rep-items -1;
}
.charsheet input[type="checkbox"].counted+span:not(.not-sheet-show)::before {
counter-increment: sheet-rep-items;
content: counter(sheet-rep-items) '. ';
width: auto;
}
.charsheet input[type="checkbox"].counted:checked+span:not(.not-sheet-show)::before {
counter-increment: sheet-rep-items;
content: counter(sheet-rep-items) '. ';
width: auto;
}
.charsheet .personal_attributes,
.charsheet .abilities,
.charsheet .saves,
.charsheet .weapons,
.charsheet .to_hit_AC,
.charsheet .thac0,
.charsheet .thief_skills,
.charsheet .wealth,
.charsheet .equipment,
.charsheet .special_abilities,
.charsheet .nonweapon_proficiencies,
.charsheet .spells,
.charsheet .notes {
margin-top: 0;
}
.charsheet .personal_attributes {
margin: -40px 0 10px 0;
}
.charsheet .personal_attributes td input {
max-width: 100%;
min-width: 3em;
width: 100%;
}
.charsheet .header-middle {
margin-top:20px;
}
.charsheet .hp-box {
padding:10px 5px 10px 40px;
}
.charsheet .ac-box {
padding: 10px 5px 10px 12px;
}
.charsheet td:has(> .ac-box) {
align-items: center;
display: flex;
text-align: center;
width: auto;
}
.charsheet .inline-label {
align-items: center;
display: flex;
font-size: 1em;
margin-inline: auto;
width: 100%;
}
.charsheet .exceptional {
width: 2.5em;
}
/*to-hit AC*/
.charsheet .box {
border: 1px solid #000;
height: 30px;
width: 50px;
font-size: 14px;
}
.charsheet tr.to-hit td:nth-child(odd) {
background-color: rgba(148, 148, 148, 0.5);
color: #ffffff;
}
.charsheet tr.to-hit td:nth-child(even) {
background-color: rgba(236, 236, 236, 0.85);
color: initial;
}
.charsheet .to_hit_AC table * {
max-width: 3em;
min-width: 0;
}
.charsheet .to-hit-input input {
width: 100%;
height: 24px;
text-align: center;
}
.charsheet div.footer span.data input[type="text"] {
width: 21em;
height: 1.5em;
border: none;
background-color: transparent;
margin-top: -2px;
}
/*repeating sections*/
.charsheet span.data.center input {
width: 5.5em;
height: 2em;
}
.charsheet span.data.center {
padding: 0 4px 0 4px;
}
.charsheet textarea.weapons {
width: 22em;
resize: vertical;
height: 1.3em;
overflow: hidden;
white-space: nowrap;
background-color: transparent;
margin: 0;
}
.charsheet textarea.macro-text {
width: 5.5em;
resize: vertical;
height: 1.3em;
overflow: hidden;
white-space: pre-line;
background-color: transparent;
margin: 0;
}
.charsheet .version {
max-width: 3em;
height: 1.5em;
border: none;
background-color: transparent;
text-align: left;
}
/* align equipment fields to column headings */
.charsheet table.sect td>input[title^="@{repeating_equipment"] {
width: 100%;
}
/*Roll Templates*/
/* darkmode help */
.sheet-rolltemplate-darkmode.sheet-rolltemplate-attacks table.sheet-rolltemplate-attacks tbody tr,
.sheet-rolltemplate-darkmode.sheet-rolltemplate-general table.sheet-rolltemplate-general tbody tr {
background-color: #000;
color: #e1e1e1;
font-weight: normal;
}
.sheet-rolltemplate-darkmode.sheet-rolltemplate-attacks table.sheet-rolltemplate-attacks tr:nth-child(odd),
.sheet-rolltemplate-darkmode.sheet-rolltemplate-general table.sheet-rolltemplate-general tr:nth-child(odd) {
background-color: #222;
}
.sheet-rolltemplate-darkmode.sheet-rolltemplate-attacks table.sheet-rolltemplate-attacks tr:nth-child(odd) .sheet-tcat,
.sheet-rolltemplate-darkmode.sheet-rolltemplate-general table.sheet-rolltemplate-general tr:nth-child(odd) .sheet-tcat {
background-color: transparent;
}
.sheet-rolltemplate-darkmode.sheet-rolltemplate-attacks table.sheet-rolltemplate-attacks tbody .sheet-tcat,
.sheet-rolltemplate-darkmode.sheet-rolltemplate-attacks table.sheet-rolltemplate-attacks tbody .sheet-text,
.sheet-rolltemplate-darkmode.sheet-rolltemplate-attacks table.sheet-rolltemplate-attacks tbody .sheet-ToHit,
.sheet-rolltemplate-darkmode.sheet-rolltemplate-general table.sheet-rolltemplate-general tbody .sheet-tcat,
.sheet-rolltemplate-darkmode.sheet-rolltemplate-general table.sheet-rolltemplate-general tbody .sheet-text,
.sheet-rolltemplate-darkmode.sheet-rolltemplate-general table.sheet-rolltemplate-general tbody tr {
background-color: #000;
color: #e1e1e1;
font-weight: normal;
}
.sheet-rolltemplate-darkmode.sheet-rolltemplate-attacks table.sheet-rolltemplate-attacks tbody .sheet-ToHit span.inlinerollresult,
.sheet-rolltemplate-darkmode.sheet-rolltemplate-attacks table.sheet-rolltemplate-attacks tbody span.inlinerollresult,
.sheet-rolltemplate-darkmode.sheet-rolltemplate-general table.sheet-rolltemplate-general tbody .inlinerollresult,
.sheet-rolltemplate-darkmode.sheet-rolltemplate-general table.sheet-rolltemplate-general tbody tr td.sheet-subheader {
color: #fff;
font-weight: normal;
}
/*Attacks*/
.sheet-rolltemplate-attacks table {
width: 100%;
background-color: white;
border: 2px solid #000;
border-spacing: 0;
border-collapse: separate;
border-radius: 5px;
-moz-box-shadow: 2px 2px 5px #000;
-webkit-box-shadow: 2px 2px 5px #000;
box-shadow: 2px 2px 5px #000;
overflow: hidden;
}
.sheet-rolltemplate-attacks th {
background-color: #000;
color: white;
font-family: "Helvetica Neue", Helvetica, sans-serif;
font-size: 1em;
font-weight: bold;
text-align: center;
}
.sheet-rolltemplate-attacks .sheet-subheader {
background-color: #000;
color: white;
font-family: "Helvetica Neue", Helvetica, sans-serif;
font-size: 0.9em;
text-align: center;
padding-bottom: 5px;
}
.sheet-rolltemplate-attacks .sheet-tcat {
font-weight: bold;
}
.sheet-rolltemplate-attacks td {
color: initial;
padding: 2px;
line-height: 1em;
vertical-align: top;
text-align: right;
}
.sheet-rolltemplate-attacks .sheet-text {
color: initial;
padding: 2px;
line-height: 1em;
vertical-align: top;
text-align: left;
}
.sheet-rolltemplate-attacks .sheet-ToHit {
font-family: monospace;
font-size: 10px;
line-height: .80em !important;
}
.sheet-rolltemplate-attacks td.sheet-ToHit .inlinerollresult {
border: none;
padding: 2px 0 0 0;
font-size: 10px;
}
.sheet-rolltemplate-attacks tr:nth-child(odd) {
background-color: #E6E6E6;
}
.sheet-rolltemplate-attacks tr:nth-child(even) {
background-color: #A3A3A3;
}
.sheet-rolltemplate-attacks .inlinerollresult {
display: inline-block;
min-width: 1em;
min-height: 1em;
text-align: right;
border: 1px solid #000;
padding: 2px;
}
.sheet-rolltemplate-attacks .inlinerollresult.fullcrit {
border: 2px solid #3FB315;
}
.sheet-rolltemplate-attacks .inlinerollresult.fullfail {
border: 2px solid #B31515;
}
.sheet-rolltemplate-attacks .inlinerollresult.importantroll {
border: 2px solid #4A57ED;
}
.sheet-rolltemplate-attacks .sheet-ToHit strong,
.sheet-rolltemplate-attacks .sheet-ToHit span {
min-width: 1.1em;
}
/*General*/
.sheet-rolltemplate-general table {
width: 100%;
background-color: white;
border: 2px solid #000;
border-spacing: 0;
border-collapse: separate;
border-radius: 5px;
-moz-box-shadow: 2px 2px 5px #000;
-webkit-box-shadow: 2px 2px 5px #000;
box-shadow: 2px 2px 5px #000;
overflow: hidden;
}
.sheet-rolltemplate-general th {
background-color: #000;
color: white;
font-family: "Helvetica Neue", Helvetica, sans-serif;
font-size: 1em;
font-weight: bold;
text-align: center;
text-shadow: -1px -1px 0 #000, 1px -1px 0 #000, -1px 1px 0 #000, 1px 1px 0 #000;
}
.sheet-rolltemplate-general .sheet-subheader {
background-color: #000;
color: white;
font-family: "Helvetica Neue", Helvetica, sans-serif;
font-size: 0.9em;
text-align: center;
padding-bottom: 5px;
text-shadow: -1px -1px 0 #000, 1px -1px 0 #000, -1px 1px 0 #000, 1px 1px 0 #000;
}
.sheet-rolltemplate-general .sheet-text {
padding: 2px;
line-height: 1em;
vertical-align: top;
text-align: left;
}
.sheet-rolltemplate-attacks.sheet-color-white th,
.sheet-rolltemplate-attacks.sheet-color-white .sheet-subheader,
.sheet-rolltemplate-general.sheet-color-white th,
.sheet-rolltemplate-general.sheet-color-white .sheet-subheader {
background-color: #ffffff;
}
.sheet-rolltemplate-attacks.sheet-color-grey th,
.sheet-rolltemplate-attacks.sheet-color-grey .sheet-subheader,
.sheet-rolltemplate-general.sheet-color-grey th,
.sheet-rolltemplate-general.sheet-color-grey .sheet-subheader {
background-color: #A3A3A3;
}
.sheet-rolltemplate-attacks.sheet-color-darkgrey th,
.sheet-rolltemplate-attacks.sheet-color-darkgrey .sheet-subheader,
.sheet-rolltemplate-general.sheet-color-darkgrey th,
.sheet-rolltemplate-general.sheet-color-darkgrey .sheet-subheader {
background-color: #525252;
}
.sheet-rolltemplate-attacks.sheet-color-red th,
.sheet-rolltemplate-attacks.sheet-color-red .sheet-subheader,
.sheet-rolltemplate-general.sheet-color-red th,
.sheet-rolltemplate-general.sheet-color-red .sheet-subheader {
background-color: #D60010;
}
.sheet-rolltemplate-attacks.sheet-color-darkred th,
.sheet-rolltemplate-attacks.sheet-color-darkred .sheet-subheader,
.sheet-rolltemplate-general.sheet-color-darkred th,
.sheet-rolltemplate-general.sheet-color-darkred .sheet-subheader {
background-color: #85000A;
}
.sheet-rolltemplate-attacks.sheet-color-orange th,
.sheet-rolltemplate-attacks.sheet-color-orange .sheet-subheader,
.sheet-rolltemplate-general.sheet-color-orange th,
.sheet-rolltemplate-general.sheet-color-orange .sheet-subheader {
background-color: #DC6B00;
}
.sheet-rolltemplate-attacks.sheet-color-darkorange th,
.sheet-rolltemplate-attacks.sheet-color-darkorange .sheet-subheader,
.sheet-rolltemplate-general.sheet-color-darkorange th,
.sheet-rolltemplate-general.sheet-color-darkorange .sheet-subheader {
background-color: #7F3E00;
}
.sheet-rolltemplate-attacks.sheet-color-yellow th,
.sheet-rolltemplate-attacks.sheet-color-yellow .sheet-subheader,
.sheet-rolltemplate-general.sheet-color-yellow th,
.sheet-rolltemplate-general.sheet-color-yellow .sheet-subheader {
background-color: #FCED24;
}
.sheet-rolltemplate-attacks.sheet-color-darkyellow th,
.sheet-rolltemplate-attacks.sheet-color-darkyellow .sheet-subheader,
.sheet-rolltemplate-general.sheet-color-darkyellow th,
.sheet-rolltemplate-general.sheet-color-darkyellow .sheet-subheader {
background-color: #dbcb00;
}
.sheet-rolltemplate-attacks.sheet-color-green th,
.sheet-rolltemplate-attacks.sheet-color-green .sheet-subheader,
.sheet-rolltemplate-general.sheet-color-green th,
.sheet-rolltemplate-general.sheet-color-green .sheet-subheader {
background-color: #11B400;
}
.sheet-rolltemplate-attacks.sheet-color-darkgreen th,
.sheet-rolltemplate-attacks.sheet-color-darkgreen .sheet-subheader,
.sheet-rolltemplate-general.sheet-color-darkgreen th,
.sheet-rolltemplate-general.sheet-color-darkgreen .sheet-subheader {
background-color: #0B7000;
}
.sheet-rolltemplate-attacks.sheet-color-blue th,
.sheet-rolltemplate-attacks.sheet-color-blue .sheet-subheader,
.sheet-rolltemplate-general.sheet-color-blue th,
.sheet-rolltemplate-general.sheet-color-blue .sheet-subheader {
background-color: #325eff;
}
.sheet-rolltemplate-attacks.sheet-color-darkblue th,
.sheet-rolltemplate-attacks.sheet-color-darkblue .sheet-subheader,
.sheet-rolltemplate-general.sheet-color-darkblue th,
.sheet-rolltemplate-general.sheet-color-darkblue .sheet-subheader {
background-color: #001896;
}
.sheet-rolltemplate-attacks.sheet-color-purple th,
.sheet-rolltemplate-attacks.sheet-color-purple .sheet-subheader,
.sheet-rolltemplate-general.sheet-color-purple th,
.sheet-rolltemplate-general.sheet-color-purple .sheet-subheader {
background-color: #740091;
}
.sheet-rolltemplate-attacks.sheet-color-darkpurple th,
.sheet-rolltemplate-attacks.sheet-color-darkpurple .sheet-subheader,
.sheet-rolltemplate-general.sheet-color-darkpurple th,
.sheet-rolltemplate-general.sheet-color-darkpurple .sheet-subheader {
background-color: #430054;
}
.sheet-rolltemplate-general .sheet-tcat {
font-weight: bold;
}
.sheet-rolltemplate-general td {
color: initial;
padding: 2px;
line-height: 1em;
vertical-align: top;
text-align: center;
}
.sheet-rolltemplate-general tr:nth-child(odd) {
background-color: #E6E6E6;
}
.sheet-rolltemplate-general tr:nth-child(even) {
background-color: #A3A3A3;
}
.sheet-rolltemplate-general .inlinerollresult {
display: inline-block;
min-width: 1em;
min-height: 1em;
text-align: right;
border: 1px solid #000;
padding: 2px;
}
.sheet-rolltemplate-general .inlinerollresult.fullcrit {
border: 2px solid #3FB315;
}
.sheet-rolltemplate-general .inlinerollresult.fullfail {
border: 2px solid #B31515;
}
.sheet-rolltemplate-general .inlinerollresult.importantroll {
border: 2px solid #4A57ED;
}
.sheet-rolltemplate-general .sheet-savethrow .inlinerollresult.importantroll {
border: 2px solid #3FB315;
}
.sheet-rolltemplate-general .sheet-savethrow {
vertical-align: inherit;
font-weight: bold;
}