515 lines
13 KiB
CSS
515 lines
13 KiB
CSS
h1 {
|
|
text-align: center;
|
|
}
|
|
|
|
textarea {
|
|
width: 100%;
|
|
box-sizing: border-box;
|
|
background: #ffffff88;
|
|
}
|
|
|
|
.sheet-grid-container {
|
|
display: grid;
|
|
grid-template-columns: 360px 60px 235px 235px 60px 810px;
|
|
grid-template-rows: 80px 1fr 50px max-content;
|
|
gap: 0px 0px;
|
|
grid-template-areas:
|
|
". . sheet-header sheet-header sheet-header ."
|
|
"sheet-pc . sheet-abilities sheet-skills . sheet-bonds"
|
|
"sheet-pc . . . . sheet-bonds"
|
|
"sheet-pc . sheet-resources sheet-resources . sheet-moves";
|
|
width: 1760px;
|
|
}
|
|
|
|
.sheet-bonds {
|
|
grid-area: sheet-bonds;
|
|
}
|
|
|
|
.sheet-header {
|
|
grid-area: sheet-header;
|
|
}
|
|
|
|
.sheet-pc {
|
|
grid-area: sheet-pc;
|
|
display: grid;
|
|
grid-template-columns: 1fr;
|
|
grid-template-rows: repeat(5, 30px) 55px repeat(2, 30px) 55px repeat(8, 30px);
|
|
gap: 0px 0px;
|
|
grid-template-areas:
|
|
"sheet-name"
|
|
"sheet-player"
|
|
"sheet-fran"
|
|
"sheet-arch"
|
|
"sheet-vice-header"
|
|
"sheet-vice-desc"
|
|
"sheet-motive"
|
|
"sheet-project-header"
|
|
"sheet-project-desc"
|
|
"sheet-faction"
|
|
"sheet-plot-armor-header"
|
|
"sheet-plot-armor-subheader"
|
|
"sheet-plot-armor"
|
|
"sheet-authority-header"
|
|
"sheet-authority-line-one"
|
|
"sheet-authority-line-two";
|
|
margin: 0 5px;
|
|
}
|
|
|
|
.sheet-abilities {
|
|
grid-area: sheet-abilities;
|
|
|
|
display: grid;
|
|
grid-template-columns: 1fr 1fr 1fr 1fr;
|
|
grid-template-rows: repeat(6, max-content);
|
|
gap: 0px 0px;
|
|
grid-template-areas:
|
|
"sheet-feats-header sheet-feats-header sheet-feats-header sheet-feats-header"
|
|
"sheet-feats-sub sheet-feats-sub sheet-feats-sub sheet-feats-sub"
|
|
"sheet-malice sheet-malice sheet-malice sheet-malice"
|
|
"sheet-deceit sheet-deceit sheet-deceit sheet-deceit"
|
|
"sheet-intimidation sheet-intimidation sheet-intimidation sheet-intimidation"
|
|
"sheet-knowledge sheet-knowledge sheet-knowledge sheet-knowledge";
|
|
margin: 0 5px;
|
|
}
|
|
|
|
.sheet-feats-header { grid-area: sheet-feats-header; }
|
|
|
|
.sheet-feats-sub { grid-area: sheet-feats-sub; }
|
|
|
|
.sheet-malice { grid-area: sheet-malice; }
|
|
|
|
.sheet-five-point-line {
|
|
display: grid;
|
|
grid-template-columns: 1fr max-content;
|
|
grid-template-rows: 1fr;
|
|
}
|
|
|
|
.sheet-deceit { grid-area: sheet-deceit; }
|
|
|
|
.sheet-intimidation { grid-area: sheet-intimidation; }
|
|
|
|
.sheet-knowledge { grid-area: sheet-knowledge; }
|
|
|
|
.sheet-skills {
|
|
grid-area: sheet-skills;
|
|
display: grid;
|
|
grid-template-columns: 1fr 1fr 1fr 1fr;
|
|
grid-template-rows: repeat(10, max-content);
|
|
gap: 0px 0px;
|
|
grid-template-areas:
|
|
"sheet-skills-headers sheet-skills-headers sheet-skills-headers sheet-skills-headers"
|
|
"sheet-skills-sub sheet-skills-sub sheet-skills-sub sheet-skills-sub"
|
|
"sheet-fight sheet-fight sheet-fight sheet-fight"
|
|
"sheet-shooting sheet-shooting sheet-shooting sheet-shooting"
|
|
"sheet-theft sheet-theft sheet-theft sheet-theft"
|
|
"sheet-science sheet-science sheet-science sheet-science"
|
|
"sheet-magic sheet-magic sheet-magic sheet-magic"
|
|
"sheet-business sheet-business sheet-business sheet-business"
|
|
"sheet-torture sheet-torture sheet-torture sheet-torture"
|
|
"sheet-manipulation sheet-manipulation sheet-manipulation sheet-manipulation";
|
|
margin: 0 5px;
|
|
}
|
|
|
|
.sheet-skills-headers { grid-area: sheet-skills-headers; }
|
|
|
|
.sheet-skills-sub { grid-area: sheet-skills-sub; }
|
|
|
|
.sheet-fight { grid-area: sheet-fight; }
|
|
|
|
.sheet-shooting { grid-area: sheet-shooting; }
|
|
|
|
.sheet-theft { grid-area: sheet-theft; }
|
|
|
|
.sheet-science { grid-area: sheet-science; }
|
|
|
|
.sheet-magic { grid-area: sheet-magic; }
|
|
|
|
.sheet-business { grid-area: sheet-business; }
|
|
|
|
.sheet-torture { grid-area: sheet-torture; }
|
|
|
|
.sheet-manipulation { grid-area: sheet-manipulation; }
|
|
|
|
.sheet-resources {
|
|
grid-area: sheet-resources;
|
|
|
|
display: grid;
|
|
grid-template-columns: 1fr 1fr 1fr 1fr;
|
|
grid-template-rows: repeat(3, max-content);
|
|
gap: 0px 0px;
|
|
grid-template-areas:
|
|
"sheet-resource-header sheet-resource-header sheet-resource-header sheet-resource-header"
|
|
"sheet-resource-sub sheet-resource-sub sheet-resource-sub sheet-resource-sub"
|
|
"sheet-resource-personal sheet-resource-personal sheet-resource-org sheet-resource-org";
|
|
}
|
|
|
|
.sheet-resource-header { grid-area: sheet-resource-header; }
|
|
|
|
.sheet-resource-sub { grid-area: sheet-resource-sub; }
|
|
|
|
.sheet-resource-personal {
|
|
grid-area: sheet-resource-personal;
|
|
display: grid;
|
|
grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr;
|
|
grid-template-rows: 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr;
|
|
gap: 0px 0px;
|
|
grid-template-areas:
|
|
"sheet-personal-header sheet-personal-header sheet-personal-header sheet-personal-header sheet-personal-header sheet-personal-header"
|
|
"sheet-personal-servants sheet-personal-servants sheet-personal-servants sheet-personal-servants sheet-personal-servants sheet-personal-servants"
|
|
"sheet-personal-wealth sheet-personal-wealth sheet-personal-wealth sheet-personal-wealth sheet-personal-wealth sheet-personal-wealth"
|
|
"sheet-personal-power sheet-personal-power sheet-personal-power sheet-personal-power sheet-personal-power sheet-personal-power"
|
|
"sheet-personal-base sheet-personal-base sheet-personal-base sheet-personal-base sheet-personal-base sheet-personal-base"
|
|
"sheet-personal-weapon sheet-personal-weapon sheet-personal-weapon sheet-personal-weapon sheet-personal-weapon sheet-personal-weapon"
|
|
"sheet-personal-reputation sheet-personal-reputation sheet-personal-reputation sheet-personal-reputation sheet-personal-reputation sheet-personal-reputation"
|
|
"sheet-personal-prehistory sheet-personal-prehistory sheet-personal-prehistory sheet-personal-prehistory sheet-personal-prehistory sheet-personal-prehistory";
|
|
margin: 0 5px;
|
|
}
|
|
|
|
.sheet-personal-header { grid-area: sheet-personal-header; }
|
|
|
|
.sheet-personal-servants { grid-area: sheet-personal-servants; }
|
|
|
|
.sheet-personal-wealth { grid-area: sheet-personal-wealth; }
|
|
|
|
.sheet-personal-power { grid-area: sheet-personal-power; }
|
|
|
|
.sheet-personal-base { grid-area: sheet-personal-base; }
|
|
|
|
.sheet-personal-weapon { grid-area: sheet-personal-weapon; }
|
|
|
|
.sheet-personal-reputation { grid-area: sheet-personal-reputation; }
|
|
|
|
.sheet-personal-prehistory { grid-area: sheet-personal-prehistory; }
|
|
|
|
.sheet-resource-org {
|
|
grid-area: sheet-resource-org;
|
|
display: grid;
|
|
grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr;
|
|
grid-template-rows: 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr;
|
|
gap: 0px 0px;
|
|
grid-template-areas:
|
|
"sheet-org-header sheet-org-header sheet-org-header sheet-org-header sheet-org-header sheet-org-header"
|
|
"sheet-org-servants sheet-org-servants sheet-org-servants sheet-org-servants sheet-org-servants sheet-org-servants"
|
|
"sheet-org-wealth sheet-org-wealth sheet-org-wealth sheet-org-wealth sheet-org-wealth sheet-org-wealth"
|
|
"sheet-org-power sheet-org-power sheet-org-power sheet-org-power sheet-org-power sheet-org-power"
|
|
"sheet-org-base sheet-org-base sheet-org-base sheet-org-base sheet-org-base sheet-org-base"
|
|
"sheet-org-weapon sheet-org-weapon sheet-org-weapon sheet-org-weapon sheet-org-weapon sheet-org-weapon"
|
|
"sheet-org-reputation sheet-org-reputation sheet-org-reputation sheet-org-reputation sheet-org-reputation sheet-org-reputation"
|
|
". . . . . .";
|
|
margin: 0 5px;
|
|
}
|
|
.sheet-org-header { grid-area: sheet-org-header; }
|
|
|
|
.sheet-org-servants { grid-area: sheet-org-servants; }
|
|
|
|
.sheet-org-wealth { grid-area: sheet-org-wealth; }
|
|
|
|
.sheet-org-power { grid-area: sheet-org-power; }
|
|
|
|
.sheet-org-base { grid-area: sheet-org-base; }
|
|
|
|
.sheet-org-weapon { grid-area: sheet-org-weapon; }
|
|
|
|
.sheet-org-reputation { grid-area: sheet-org-reputation; }
|
|
|
|
.sheet-moves {
|
|
grid-area: sheet-moves;
|
|
margin: 0 5px;
|
|
}
|
|
|
|
.sheet-name {
|
|
grid-area: sheet-name;
|
|
}
|
|
|
|
.sheet-player {
|
|
grid-area: sheet-player;
|
|
}
|
|
|
|
.sheet-fran {
|
|
grid-area: sheet-fran;
|
|
}
|
|
|
|
.sheet-arch {
|
|
grid-area: sheet-arch;
|
|
}
|
|
|
|
.sheet-motive {
|
|
grid-area: sheet-motive;
|
|
}
|
|
|
|
.sheet-project-header {
|
|
grid-area: sheet-project-header;
|
|
}
|
|
|
|
.sheet-project-desc {
|
|
grid-area: sheet-project-desc;
|
|
position: relative;
|
|
cursor: text;
|
|
word-wrap: break-word;
|
|
}
|
|
.sheet-vice-desc {
|
|
grid-area: sheet-vice-desc;
|
|
position: relative;
|
|
cursor: text;
|
|
word-wrap: break-word;
|
|
}
|
|
|
|
.sheet-vice-desc textarea,
|
|
.sheet-project-desc textarea {
|
|
position: absolute;
|
|
z-index: 1;
|
|
top: 0;
|
|
left: 0;
|
|
margin: 0;
|
|
overflow: hidden;
|
|
resize: none;
|
|
height: 75%;
|
|
width: 100%;
|
|
display: block;
|
|
box-sizing: border-box;
|
|
background: transparent;
|
|
border-radius: 0;
|
|
box-shadow: none;
|
|
color: inherit;
|
|
font: inherit;
|
|
letter-spacing: inherit;
|
|
padding: inherit;
|
|
text-align: inherit;
|
|
text-transform: inherit;
|
|
}
|
|
|
|
.sheet-faction {
|
|
grid-area: sheet-faction;
|
|
}
|
|
|
|
.sheet-plot-armor-header {
|
|
grid-area: sheet-plot-armor-header;
|
|
}
|
|
|
|
.sheet-plot-armor-subheader {
|
|
grid-area: sheet-plot-armor-subheader;
|
|
}
|
|
|
|
.sheet-plot-armor {
|
|
grid-area: sheet-plot-armor;
|
|
}
|
|
|
|
.sheet-authority-header {
|
|
grid-area: sheet-authority-header;
|
|
}
|
|
|
|
.sheet-authority-line-one {
|
|
grid-area: sheet-authority-line-one;
|
|
}
|
|
|
|
.sheet-authority-line-two {
|
|
grid-area: sheet-authority-line-two;
|
|
|
|
}
|
|
|
|
.sheet-input-attribute-no-roll {
|
|
display: flex;
|
|
align-items: baseline;
|
|
}
|
|
|
|
.sheet-wide {
|
|
flex: 5 0 240px;
|
|
}
|
|
|
|
.sheet-counter-line {
|
|
display: flex;
|
|
width: 100%;
|
|
}
|
|
|
|
.sheet-pony {
|
|
font-style: italic;
|
|
font-size: x-small;
|
|
}
|
|
|
|
.sheet-dots{
|
|
display:flex;
|
|
}
|
|
button.sheet-dot {
|
|
padding: 0;
|
|
margin: 1px;
|
|
border: solid 2px black;
|
|
background: white;
|
|
cursor: pointer;
|
|
width: 10px;
|
|
height: 10px;
|
|
display: flex;
|
|
justify-content: center;
|
|
align-items: center;
|
|
}
|
|
|
|
button.sheet-dot > span {
|
|
width: 10px;
|
|
height: 10px;
|
|
background: #d80017;
|
|
}
|
|
|
|
input.sheet-dot[value="0"] ~ button.sheet-gt-0 > span.sheet-checked {
|
|
display: none;
|
|
}
|
|
input.sheet-dot[value="1"] ~ button.sheet-gt-1 > span.sheet-checked {
|
|
display: none;
|
|
}
|
|
input.sheet-dot[value="2"] ~ button.sheet-gt-2 > span.sheet-checked {
|
|
display: none;
|
|
}
|
|
input.sheet-dot[value="3"] ~ button.sheet-gt-3 > span.sheet-checked {
|
|
display: none;
|
|
}
|
|
input.sheet-dot[value="4"] ~ button.sheet-gt-4 > span.sheet-checked {
|
|
display: none;
|
|
}
|
|
input.sheet-dot[value="5"] ~ button.sheet-gt-5 > span.sheet-checked {
|
|
display: none;
|
|
}
|
|
input.sheet-dot[value="6"] ~ button.sheet-gt-6 > span.sheet-checked {
|
|
display: none;
|
|
}
|
|
input.sheet-dot[value="7"] ~ button.sheet-gt-7 > span.sheet-checked {
|
|
display: none;
|
|
}
|
|
input.sheet-dot[value="8"] ~ button.sheet-gt-8 > span.sheet-checked {
|
|
display: none;
|
|
}
|
|
input.sheet-dot[value="9"] ~ button.sheet-gt-9 > span.sheet-checked {
|
|
display: none;
|
|
}
|
|
input.sheet-dot[value="10"] ~ button.sheet-gt-10 > span.sheet-checked {
|
|
display: none;
|
|
}
|
|
input.sheet-dot[value="11"] ~ button.sheet-gt-11 > span.sheet-checked {
|
|
display: none;
|
|
}
|
|
input.sheet-dot[value="12"] ~ button.sheet-gt-12 > span.sheet-checked {
|
|
display: none;
|
|
}
|
|
input.sheet-dot[value="13"] ~ button.sheet-gt-13 > span.sheet-checked {
|
|
display: none;
|
|
}
|
|
input.sheet-dot[value="14"] ~ button.sheet-gt-14 > span.sheet-checked {
|
|
display: none;
|
|
}
|
|
input.sheet-dot[value="15"] ~ button.sheet-gt-15 > span.sheet-checked {
|
|
display: none;
|
|
}
|
|
input.sheet-dot[value="16"] ~ button.sheet-gt-16 > span.sheet-checked {
|
|
display: none;
|
|
}
|
|
input.sheet-dot[value="17"] ~ button.sheet-gt-17 > span.sheet-checked {
|
|
display: none;
|
|
}
|
|
input.sheet-dot[value="18"] ~ button.sheet-gt-18 > span.sheet-checked {
|
|
display: none;
|
|
}
|
|
input.sheet-dot[value="19"] ~ button.sheet-gt-19 > span.sheet-checked {
|
|
display: none;
|
|
}
|
|
input.sheet-dot[value="20"] ~ button.sheet-gt-20 > span.sheet-checked {
|
|
display: none;
|
|
}
|
|
input.sheet-dot[value="21"] ~ button.sheet-gt-21 > span.sheet-checked {
|
|
display: none;
|
|
}
|
|
input.sheet-dot[value="22"] ~ button.sheet-gt-22 > span.sheet-checked {
|
|
display: none;
|
|
}
|
|
input.sheet-dot[value="23"] ~ button.sheet-gt-23 > span.sheet-checked {
|
|
display: none;
|
|
}
|
|
|
|
button.sheet-zero
|
|
{
|
|
opacity: 0;
|
|
}
|
|
|
|
button.sheet-zero:hover {
|
|
opacity: 0.25;
|
|
}
|
|
|
|
|
|
.sheet-move-main {
|
|
display: flex;
|
|
align-items: baseline;
|
|
justify-content: space-around;
|
|
}
|
|
|
|
.sheet-move-select {
|
|
flex: 0 1 50px;
|
|
}
|
|
|
|
.sheet-move-label {
|
|
flex: 0 1 10px;
|
|
}
|
|
|
|
.sheet-rolltemplate-customcheck {
|
|
border: 2px solid black;
|
|
background: white;
|
|
text-align: center;
|
|
}
|
|
|
|
.sheet-rolltemplate-check-result {
|
|
background: #d80017;
|
|
color: white;
|
|
font-weight: bold;
|
|
text-align: center;
|
|
}
|
|
|
|
.sheet-moves-button {
|
|
background: #d80017;
|
|
word-wrap: break-word;
|
|
color: white;
|
|
text-align: center;
|
|
padding: 0;
|
|
margin: 1px;
|
|
border: solid 2px black;
|
|
cursor: pointer;
|
|
}
|
|
|
|
.sheet-overlay {
|
|
position: fixed;
|
|
top: 0;
|
|
bottom: 0;
|
|
left: 0;
|
|
right: 0;
|
|
background: rgba(0, 0, 0, 0.7);
|
|
transition: opacity 500ms;
|
|
visibility: hidden;
|
|
opacity: 0;
|
|
z-index: 5;
|
|
overflow: scroll;
|
|
}
|
|
.sheet-overlay:target {
|
|
visibility: visible;
|
|
opacity: 1;
|
|
}
|
|
.sheet-popup {
|
|
margin: 70px auto;
|
|
padding: 20px;
|
|
background: #fff;
|
|
border-radius: 5px;
|
|
width: 50%;
|
|
position: relative;
|
|
transition: all 5s ease-in-out;
|
|
}
|
|
.sheet-popup h2 {
|
|
margin-top: 0;
|
|
color: #333;
|
|
font-family: Tahoma, Arial, sans-serif;
|
|
}
|
|
.sheet-popup .sheet-close {
|
|
position: absolute;
|
|
top: 20px;
|
|
right: 30px;
|
|
transition: all 200ms;
|
|
font-size: 30px;
|
|
font-weight: bold;
|
|
text-decoration: none;
|
|
color: #333;
|
|
}
|
|
.sheet-popup .sheet-content {
|
|
max-height: 30%;
|
|
} |