Made several updates to Mutants & Masterminds 3E character sheet, using tabs pulled from D&D 3.5 character sheet.

This commit is contained in:
Shane Filiatrault
2016-04-07 20:20:10 -05:00
parent 828656b783
commit 6df94acb2a
2 changed files with 664 additions and 492 deletions
@@ -10,14 +10,14 @@ input[type="checkbox"] + span::before
display: inline-block;
vertical-align: middle;
content: "";
content: "?";
width: 14px;
height: 14px;
font-size: 12px;
}
input[type="checkbox"]:checked + span::before
{
content: "";
content: "?";
}
hr {
@@ -55,4 +55,128 @@ input[type="text"], select {
textarea {
width:95%;
}
}
/* Fake tabs style1 (reskinned radio button; fixed to work properly in firefox */
div.sheet-tab-content { display: none; }
input.sheet-tab1:checked ~ div.sheet-tab1,
input.sheet-tab2:checked ~ div.sheet-tab2,
input.sheet-tab11:checked ~ div.sheet-tab11,
input.sheet-tab12:checked ~ div.sheet-tab12,
input.sheet-tab13:checked ~ div.sheet-tab13,
input.sheet-tab99:checked ~ div.sheet-tab99 {
display: block;
}
input.sheet-tab1:checked + label.sheet-tab1,
input.sheet-tab2:checked + label.sheet-tab2,
input.sheet-tab11:checked ~ label.sheet-tab11,
input.sheet-tab12:checked ~ label.sheet-tab12,
input.sheet-tab13:checked ~ label.sheet-tab13,
input.sheet-tab99:checked ~ label.sheet-tab99 {
background: rgba(200,200,200,100);
color: black;
}
input.sheet-tab {
width: 70px;
height: 20px;
position: relative;
top: 5px;
left: 6px;
margin: 2.4px;
cursor: pointer;
opacity: 0;
z-index: 9999;
}
label.sheet-tab {
text-align: center;
display: inline-block;
font-size: 13px;
background: white;
color: black;
font-weight: bold;
width: 259px;
height: 20px;
cursor: pointer;
position: relative;
margin-left: -72.5px;
}
label.sheet-tab11, label.sheet-tab12, label.sheet-tab13, label.sheet-tab99 {
width: 120px;
}
input.sheet-tab::before {
content: attr(title);
border: solid 1px #a8a8a8;
border-bottom-color: black;
text-align: center;
display: inline-block;
background: #fff;
background: -moz-linear-gradient(to top, #c8c8c8, #fff, #c8c8c8);
background: -webkit-linear-gradient(to top, #c8c8c8, #fff, #c8c8c8);
background: -ms-linear-gradient(to top, #c8c8c8, #fff, #c8c8c8);
background: -o-linear-gradient(to top, #c8c8c8, #fff, #c8c8c8);
background: linear-gradient(to top, #c8c8c8, #fff, #c8c8c8);
width: 240px;
height: 20px;
font-size: 18px;
}
input.sheet-tab:checked::before {
background: #dcdcdc;
background: -moz-linear-gradient(to top, #fcfcfc, #dcdcdc, #fcfcfc);
background: -webkit-linear-gradient(to top, #fcfcfc, #dcdcdc, #fcfcfc);
background: -ms-linear-gradient(to top, #fcfcfc, #dcdcdc, #fcfcfc);
background: -o-linear-gradient(to top, #fcfcfc, #dcdcdc, #fcfcfc);
background: linear-gradient(to top, #fcfcfc, #dcdcdc, #fcfcfc);
border-bottom-color: #fff;
}
input.sheet-tab:not(:first-child)::before { border-left: none; }
div.sheet-tab-content {
border: 1px solid #a8a8a8;
border-top-color: #000;
margin: 2px 0 0 5px;
padding: 5px;
}
/* tabs style2 (with label) works even in firefox */
.sheet-character-sheet,
.sheet-expand {
display: none;
padding: 3px;
}
.sheet-expand:checked ~ .sheet-show {
display: block;
background-color: white;
margin: 1px 0px 0px -2px;
}
.sheet-tab {
display: inline-block;
text-align: center;
margin: -2px;
padding: 2px;
width: 124px;
height: 24px;
background-color: gray;
border-top-left-radius: 1em 3em;
border-top-right-radius: 1em 3em;
border: solid thin gray;
border-bottom: none;
}
.sheet-expand:checked ~ .sheet-tab { background-color: white; }
label { display: inline; }
label, label div { font-size: 12px; font-weight: normal; }
textarea { height: auto; color: black; }
input { color: black; }
input, select { width:100%; }
File diff suppressed because it is too large Load Diff