Cypher System v1.2

1) It's now possible to change the style/look of the sheet to the ones
of the generic Cypher System, Numenéra or The Strange.
2) By popular demand, the stat/skill roll template has been unified and
only rolls one d20 dice (for the 3D dice users out there), whatever is
the "Difficulty" roll parameter from the "Action" section. If the
difficulty parameter has been set to 0, the beaten difficulty is no
longer calculated (due to Roll20 limitations), but the raw d20 dice is
shown, as the special natural rolls (1 or 17+), and the steps modifiying
the difficulty are displayed (and summed).
3) New "Artifact" repeating section with integrated Depletion roll.
This commit is contained in:
Natha
2015-10-04 01:56:11 +02:00
parent 50624129bf
commit 82beb2d8f8
14 changed files with 911 additions and 304 deletions
+276 -8
View File
@@ -187,6 +187,30 @@ td,
th{
box-sizing: border-box;
}
span.sheet-smallspan{
font-size:11px;
color: #888888;
text-align:left;
}
input[type=radio].sheet-styleCypher,
input[type=radio].sheet-styleNumenera,
input[type=radio].sheet-styleTheStrange{
margin-right:85px;
margin-left: 5px;
text-align:left;
}
input[type=radio].sheet-styleCypher:after,
input[type=radio].sheet-styleNumenera:after,
input[type=radio].sheet-styleTheStrange:after{
margin-left:15px;
content: attr(title);
font-size:11px;
color: #888888;
text-align:left;
whitespace: nowrap;
display:inline-block;
width: 85px;
}
button[type=roll].sheet-basicbt {
padding: 2px 0px 0px 1px;
margin: 0px 0px 0px 0px;
@@ -200,16 +224,64 @@ button[type=roll].sheet-basicbt {
font-size: 1.2em;
font-weight: normal;
color:#22428F;
border-width: 2px;
border-width: 1px;
border-style: solid;
border-color: rgba(255,255,255,0.5);
border-color: rgba(34,66,143,0.5);
border-radius: 10px;
transition: border 1s;
}
button[type=roll].sheet-basicbt:hover{
border-width: 2px;
border-color:#22428F;
font-weight: bold;
}
input[type=radio].sheet-styleNumenera:checked ~ div.sheet-main button[type=roll].sheet-basicbt {
padding: 2px 0px 0px 1px;
margin: 0px 0px 0px 0px;
text-shadow: none;
box-shadow: none;
text-align:center;
vertical-align: middle;
line-height: 0px;
height: 20px;
width: 20px;
font-size: 1.2em;
font-weight: bold;
color: #A09C90;
border-width: 1px;
border-style: solid;
border-color: #A09C90;
border-radius: 10px;
}
input[type=radio].sheet-styleNumenera:checked ~ div.sheet-main button[type=roll].sheet-basicbt:hover{
border-width: 2px;
color: #53628A;
border-color:#53628A;
font-weight: bold;
}
input[type=radio].sheet-styleTheStrange:checked ~ div.sheet-main button[type=roll].sheet-basicbt {
padding: 2px 0px 0px 1px;
margin: 0px 0px 0px 0px;
text-shadow: none;
box-shadow: none;
text-align:center;
vertical-align: middle;
line-height: 0px;
height: 20px;
width: 20px;
font-size: 1.2em;
font-weight: normal;
color: #050E29;
border-width: 1px;
border-style: solid;
border-color: rgba(5,14,41,0.5);
border-radius: 10px;
}
input[type=radio].sheet-styleTheStrange:checked ~ div.sheet-main button[type=roll].sheet-basicbt:hover{
border-width: 2px;
color: #050E29;
border-color:#050E29;
font-weight: bold;
}
button[type=roll].sheet-apibt{
padding: 2px 0px 0px 0px;
margin: 0px 0px 0px 0px;
@@ -223,9 +295,8 @@ button[type=roll].sheet-apibt{
width:15px;
height: 15px;
color: #6D0100;
border: 1px solid rgba(255,255,255,0.5);
border: 1px solid #CC9F9F;
border-radius: 0px 3px 0px 3px;
transition: border 1s;
}
button[type=roll].sheet-apibt:hover{
border-color: #6D0100;
@@ -247,14 +318,60 @@ td{
white-space: nowrap;
text-align: center;
}
input, select{
/* padding-bottom: 2px; */
input[type=text]{
margin: 0px;
padding-left: 0.3em;
padding-right: 0.1em;
padding-top: 0.1em;
padding-bottom: 0.1em;
background-color: white;
}
input[type=radio].sheet-styleNumenera:checked ~ div.sheet-main input[type=text]{
margin: 0px;
padding-left: 0.3em;
padding-right: 0.1em;
padding-top: 0.1em;
padding-bottom: 0.1em;
background-color: #F5F7FC;
}
input[type=radio].sheet-styleTheStrange:checked ~ div.sheet-main input[type=text]{
margin: 0px;
padding-left: 0.3em;
padding-right: 0.1em;
padding-top: 0.1em;
padding-bottom: 0.1em;
background-color: white;
border-radius: 0px;
}
select{
height: 20px;
margin: 0px;
padding-left: 0.3em;
padding-right: 0.2em;
padding-top: 0.2em;
padding-bottom: 0.1em;
background-color: white;
}
input[type=radio].sheet-styleNumenera:checked ~ div.sheet-main select{
height: 20px;
margin: 0px;
padding-left: 0.3em;
padding-right: 0.2em;
padding-top: 0.2em;
padding-bottom: 0.1em;
background-color: #F5F7FC;
}
input[type=radio].sheet-styleNumenera:checked ~ div.sheet-main select{
height: 20px;
margin: 0px;
padding-left: 0.3em;
padding-right: 0.2em;
padding-top: 0.2em;
padding-bottom: 0.1em;
background-color: #F5F7FC;
}
input[type=radio].sheet-styleNumenera:checked ~ div.sheet-main textarea{
background-color: #F5F7FC;
}
input[type="number"]{
text-align: right;
@@ -265,6 +382,16 @@ input[type="number"]{
padding-top: 0.2em;
padding-bottom: 0.1em;
}
input[type=radio].sheet-styleNumenera:checked ~ div.sheet-main input[type="number"]{
text-align: right;
height: 20px;
margin: 0px;
padding-left: 0.3em;
padding-right: 0.2em;
padding-top: 0.2em;
padding-bottom: 0.1em;
background-color: #F5F7FC;
}
input[type="radio"]{
padding: 0px;
margin: 0px;
@@ -275,11 +402,32 @@ input[type="radio"]{
width: 1056px;
padding: 10px;
}
.sheet-whiteinput{
input[type=radio].sheet-styleNumenera:checked ~ .sheet-main{
background: white;
width: 1056px;
padding: 10px;
}
input[type=radio].sheet-styleTheStrange:checked ~ .sheet-main{
background: linear-gradient(#1B1E30, #DBDCDE, #E0E7ED, white);
width: 1056px;
padding: 10px;
}
input[type=text].sheet-whiteinput{
background: white;
height: 25px;
border-width: 0px 0px 3px 0px;
font-weight: bold;
border-color: #22428F;
}
input[type=radio].sheet-styleNumenera:checked ~ div.sheet-main input[type=text].sheet-whiteinput{
background: white;
border-color: #53628A;
border-width: 0px 0px 2px 0px;
}
input[type=radio].sheet-styleTheStrange:checked ~ div.sheet-main input[type=text].sheet-whiteinput{
border-color: #050E29;
border-width: 0px 0px 1px 0px;
}
.sheet-underwhite{
color: white;
background-color: #BDC3DC;
@@ -292,17 +440,82 @@ input[type="radio"]{
font-size: 10px;
font-weight: bold;
}
input[type=radio].sheet-styleNumenera:checked ~ div.sheet-main .sheet-underwhite{
color: #53628A;
background: linear-gradient(to right,#E7DEB0,#FDF9F4);/* #E7DEB0;*/
border: none;
border-bottom-right-radius: 7px;
padding-left: 3px;
padding-top: 0px;
padding-bottom: 0px;
margin-bottom: 5px;
font-size: 10px;
font-weight: bold;
}
input[type=radio].sheet-styleTheStrange:checked ~ div.sheet-main .sheet-underwhite{
color: #DCDFE4;
background: transparent;
border: none;
border-bottom-right-radius: 0px;
padding-left: 3px;
padding-top: 0px;
padding-bottom: 0px;
margin-bottom: 5px;
font-size: 10px;
font-weight: normal;
font-style: italic;
}
.sheet-text1{
color: #22428F;
background: transparent;
font-weight: bold;
font-size: 12px;
}
input[type=radio].sheet-styleNumenera:checked ~ div.sheet-main .sheet-text1{
color: #7F2E23;
background: transparent;
font-weight: bold;
font-size: 12px;
}
input[type=radio].sheet-styleTheStrange:checked ~ div.sheet-main .sheet-text1{
color: #050E29;
background: transparent;
font-weight: bold;
font-size: 12px;
}
.sheet-text2{
color: #22428F;
background: transparent;
font-size: 11px;
}
input[type=radio].sheet-styleNumenera:checked ~ div.sheet-main .sheet-text2{
color: #53628A;
background: transparent;
font-size: 11px;
}
input[type=radio].sheet-styleTheStrange:checked ~ div.sheet-main .sheet-text2{
color: #050E29;
background: transparent;
font-size: 11px;
}
.sheet-textfat{
color: #22428F;
background: transparent;
font-weight: bold;
font-size: 12px;
}
input[type=radio].sheet-styleNumenera:checked ~ div.sheet-main .sheet-textfat{
color: #7F2E23;
background: transparent;
font-weight: bold;
font-size: 12px;
}
input[type=radio].sheet-styleTheStrange:checked ~ div.sheet-main .sheet-textfat{
color: white;
background: transparent;
font-weight: bold;
font-size: 12px;
}
.sheet-supblock{
width: 340px;
text-align: center;
@@ -316,15 +529,70 @@ input[type="radio"]{
text-align: center;
margin-bottom: 5px;
}
input[type=radio].sheet-styleNumenera:checked ~ div.sheet-main .sheet-blublock{
padding: 0px 0px 0px 2px;
background-color: #53628A;
/* border-bottom-left-radius: 7px;
border-top-right-radius: 7px; */
border-radius: 7px;
border: 1px solid #53628A;
text-align: center;
margin-bottom: 5px;
}
input[type=radio].sheet-styleTheStrange:checked ~ div.sheet-main .sheet-blublock{
padding: 2px;
background-color: #050E29;
border-radius: 0px;
border: 1px solid white;
text-align: center;
margin-bottom: 5px;
}
.sheet-inpblock{
background-color: #E0E0ED;
border: none;
border-radius: 7px;
padding:0px 4px 0px 4px;
}
input[type=radio].sheet-styleNumenera:checked ~ div.sheet-main .sheet-inpblock{
/* background-color: white;*/
background: radial-gradient(#FDF9F4 40%,#E7DEB0);
border: none;
border-radius: 7px;
padding:0px 4px 0px 4px;
}
input[type=radio].sheet-styleTheStrange:checked ~ div.sheet-main .sheet-inpblock{
background-color: #DCDFE4;
border: none;
border-radius: 0px;
padding:0px 4px 0px 4px;
}
.sheet-inpblock2{
background-color: #C8C8DF;
border: none;
border-radius: 7px;
padding:0px 4px 0px 4px;
}
input[type=radio].sheet-styleNumenera:checked ~ div.sheet-main .sheet-inpblock2{
background: radial-gradient(#FDF9F4 40%,#E7DEB0);
border: none;
border-radius: 7px;
padding:0px 4px 0px 4px;
}
input[type=radio].sheet-styleTheStrange:checked ~ div.sheet-main .sheet-inpblock2{
background-color: #DCDFE4;
border: none;
border-radius: 0px;
padding:0px 4px 0px 4px;
}
input[type=radio].sheet-styleCypher:checked ~ div.sheet-main img.sheet-gamelogo{
content: url("https://lh4.googleusercontent.com/-T_PWRmd-TxE/Vfs9cEqYWbI/AAAAAAAAW0I/rUC1JdU-UXg/w900-h263/Roll20_cypher_logo.png");
width: 330px;
}
input[type=radio].sheet-styleNumenera:checked ~ div.sheet-main img.sheet-gamelogo{
content: url("http://upload.wikimedia.org/wikipedia/en/8/8e/Numenera_Logo.png");
width: 330px;
}
input[type=radio].sheet-styleTheStrange:checked ~ div.sheet-main img.sheet-gamelogo{
content: url("http://www.thestrangerpg.com/wp-content/uploads/2013/10/The-Strange-Logo-Color-Large.png");
width: 330px;
}