diff --git a/Nemesis/nemesis.css b/Nemesis/nemesis.css new file mode 100644 index 0000000000..9c697e1619 --- /dev/null +++ b/Nemesis/nemesis.css @@ -0,0 +1,656 @@ +/**********************************************************************************************************/ +/*************************** GLOBAL SETTINGS ***************************/ +/********************************************************************************************************/ + * { + box-sizing: border-box; + font-family: sans-serif;} + + button { + background-color: transparent; + background-image: none; + border-color: transparent; + border: none; + box-shadow: none; + font-family: Helvetica, Arial, sans-serif; + font-size: 0.8em; + text-shadow: none;} + + button:before {display: none;} + button:hover {background-color: transparent;} + + button[type="roll"], + button[type="action"] { + font-size: 1em; + margin: 0px; + padding: 0px;} + + button[type="action"]:hover { + color: #fff; + text-shadow: 1px 1px 2px black, 0 0 25px red, 0 0 5px #e31715;} + + div { + background-color: transparent;} + + fieldset { + background: transparent;} + + h1, h2, h3, h4 { + margin: 0px; + padding: 0px; + width: fit-content;} + + input[type="text"], + input[type="number"] { + background-color: transparent; + border : none; + border-bottom: 1px solid black; + border-radius: 0px;} + + input[type="text"]:hover, + input[type="number"]:hover, + input[type="text"]:focus, + input[type="number"]:focus { + color: white; + background: #929082; + padding-bottom: 1px; + outline: #39201e;} + + input[type="checkbox"], + input[type="radio"], + input[type="checkbox"] + span, + input[type="radio"] + span { + position: relative;} + + label { + display: inline-block; + margin : 0px; + padding: 0px; } + + span { + word-break: break-word;} + + textarea { + border-bottom : 1px dotted #FCD116; + font-size : 12px; + font-weight : normal; + height : 100px; + line-height : 18px; + min-height : 50px; + overflow : hidden; + overflow-wrap : break-word; + padding : 2px; + resize : vertical; + text-align : left; + vertical-align: top; + white-space : pre-line; + width : 95%;} + + .charsheet { + width: 850px;} + + .sheet-container { + margin-left: -2%; + width : 100%;} + + .sheet-container div { + box-sizing : border-box; + vertical-align: top;} + + .sheet-pc { + border : 2px solid black; + padding: 1%; + width : 100%;} + +/**********************************************************************************************************/ +/*************************** TAB ***************************/ +/********************************************************************************************************/ + div.sheet-tabs { + display : inline-block; + width : 100%;} + + div.sheet-tabs button { + margin: 0px 2%; + padding: 5%; + width : fit-content;} + + div.sheet-tabs div { + display: inline-block;} + + div.sheet-tabs div:nth-of-type(1) { + margin-right: 2em; + width: 20%;} + + div.sheet-tabs div:nth-of-type(2) { + margin-right: 2em; + width: 25%;} + + div.sheet-tabs div:nth-of-type(3) { + padding: 1%; + width: 16%;} + + div.sheet-tabs h1 { + color: #39201e; + text-shadow: + 3px 3px 0 #ba2c2c, + -1px -1px 0 #ba2c2c, + 1px -1px 0 #ba2c2c, + -1px 1px 0 #ba2c2c, + 1px 1px 0 #ba2c2c;} + + div.sheet-tabs h2 { + font-size: 0.8em;} + + input.sheet-whisper-toggle + button { + font-family: "pictos";} + +/**********************************************************************************************************/ +/*************************** PC ***************************/ +/********************************************************************************************************/ + div.sheet-info-row { + display : inline-block; + width : 100%;} + + div.sheet-flexcol { + display: inline-block; + width: 49%;} + + div.sheet-info-row div.sheet-flexcol div { + padding: 1% 0px;} + + /* INPUTS WITH ALL THE PLAYER AND CHARACTER DETAILS */ + /* DATE */ + div.sheet-details div:nth-of-type(1) input:nth-of-type(2) { + width: 30%;} + + /* SEX, HAIR, EYES.... */ + div.sheet-details div:nth-of-type(2) input { + width: 20%;} + + /* DOB/OCCUPATION/NATIONALITY */ + div.sheet-details div:nth-of-type(3) input { + width: 75%;} + + div.sheet-details div:nth-of-type(3) input:nth-of-type(1n+2) { + width: 78%;} + + /* AUTHORIZED */ + div.sheet-details div:nth-of-type(5) input { + width: 95%;} + + /* ID NO */ + div.sheet-details div:nth-of-type(6) input { + width: 85%;} + + div.sheet-details input[type="text"]:nth-of-type(1n+9) { + margin-bottom: 2%; + width : 100%;} + + div.sheet-details label { + font-size : 0.8em; + text-transform: uppercase; + font-weight : normal; + margin-right : 3%; + width : fit-content;} + + /* INPUTS FOR TRACKING DAMAGE? */ + div.sheet-wounds button[type="action"] { + font-family : fantasy; + font-weight : bold; + text-align : left; + text-transform: capitalize; + width : 25%;} + + div.sheet-wounds input[type="radio"] { + cursor : pointer; + height : 20px; + left : 11px; + margin : -10px; + opacity : 0; + position: relative; + top : -5px; + width : 20px; + z-index : 1;} + + /* STAST section */ + div.sheet-stats { + vertical-align: middle; + text-align: center;} + + div.sheet-stats label { + font-size: 0.85em; + font-weight: normal; + width: fit-content;} + + div.sheet-stats input[type="number"] { + background : radial-gradient(#f6f6f6, #dfdfdf); + border : 1px solid #ba2c2c; + border-radius: 50%; + display : inline-block; + height : 25px; + text-align : center; + width : 25px;} + + div.sheet-stats input[type="number"]:hover, + div.sheet-stats input[type="number"]:focus { + background: #929082;} + + /* Fake radio */ + div.sheet-wounds input[type="radio"] + span::before, + div.sheet-meters input[type="radio"] + span::before { + background : #333; + border : solid 1px #a8a8a8; + border-radius : 50%; + box-shadow : 0 0 2px #ccc; + content : ""; + display : inline-block; + height : 18px; + margin-right : 1%; + width : 18px;} + + div.sheet-meters input[type="radio"] + span::before { + border-radius: 2%; + box-shadow : 0 0 2px #658160; + height : 10px; + margin-right : 0px; + width : 10px;} + + div.sheet-meters input[type="radio"].sheet-failed + span::before { + background : #ba2c2c; + border-color: #ba2c2c;} + + div.sheet-meters input[type="radio"].sheet-hardened + span::before { + background : #658160; + border-color: #658160;} + + /* Remove dot from all radios _after_ selected one */ + div.sheet-wounds input[type="radio"]:checked ~ input[type="radio"] + span::before, + div.sheet-wounds input[type="hidden"][value="0"] ~ span::before, + div.sheet-meters input[type="radio"]:checked ~ input[type="radio"] + span::before, + div.sheet-meters input[type="hidden"][value="0"] ~ span::before { + background: #f6f6f6; + background: radial-gradient(#f6f6f6, #dfdfdf);} + + /* meters SECTION */ + div.sheet-meters button[type="action"] { + font-size: 1em; + width: 100%;} + + div.sheet-meters div.sheet-statcol { + display: inline-block; + width : 38%;} + + div.sheet-meters div.sheet-statcol:nth-of-type(2) { + width: 20%;} + + div.sheet-meters button[type="action"]:hover { + color: #fff; + text-shadow: 1px 1px 2px black, 0 0 25px red, 0 0 5px #658160;} + + div.sheet-meters label, + div.sheet-meters button[type="action"] { + color : #658160; + text-align : center; + text-transform: capitalize;} + + div.sheet-meters div.sheet-statcol label { + margin: auto 2%; + width: 100%;} + + div.sheet-meters input[type="number"] { + border : 1px solid #ba2c2c; + box-shadow: 0 0 10px #658160 inset; + height : 22px; + margin : 2% 20%; + text-align: center;} + + /* Fake radio squares for STASTS */ + div.sheet-meters input[type="radio"] { + cursor : pointer; + height : 12px; + left : 6px; + margin : 0px -6px; + opacity: 0; + top : -3px; + width : 12px; + z-index: 1;} + + /* EVERY LABEL AFTER PIPS */ + div.sheet-details label:nth-of-type(1n+9) { + width: fit-content;} + + div.sheet-notes-col { + margin-right: 1%;} + + /* WEAPONS */ + div.sheet-weapons h2 { + display: inline-block; + font-size: 1.8em; + width: 25%;} + + div.sheet-weapons label { + font-size : 0.8em; + text-align: center; + width : 11%;} + + div.sheet-weapons label:nth-of-type(1) { + width: 29%;} + + div.sheet-weapons label:nth-of-type(4), + div.sheet-weapons label:nth-of-type(5) { + width: 9%;} + + div.sheet-weapons input[type="text"] { + width: 8%;} + + div.sheet-weapons input[type="text"]:nth-of-type(1) { + width: 25%;} + + div.sheet-weapons input[type="text"]:nth-of-type(3), + div.sheet-weapons input[type="text"]:nth-of-type(5), + div.sheet-weapons input[type="text"]:nth-of-type(6) { + width: 12%;} + + /* SKILLS */ + div.sheet-skills-col { + display: inline-block; + width: 48%;} + + div.sheet-skills-col:nth-of-type(1) { + margin-right: 3%;} + + div.sheet-skills-col h3 { + margin-bottom: 5px;} + + div.sheet-skills-col h4 { + border-right : 1px solid #333; + color : #7b1915; + display : inline-block; + margin-bottom : 2%; + text-orientation: mixed; + width : 5%; + writing-mode : vertical-rl;} + + /* BODY HEADER */ + div.sheet-skills-col:nth-of-type(1) h4:nth-of-type(1) { + height: 250px;} + + /* COORDINATION HEADER */ + div.sheet-skills-col:nth-of-type(1) h4:nth-of-type(2) { + height: 360px;} + + /* SENSE HEADER */ + div.sheet-skills-col:nth-of-type(1) h4:nth-of-type(3) { + height: 150px;} + + /* MIND HEADER */ + div.sheet-skills-col:nth-of-type(2) h4:nth-of-type(1) { + height: 500px;} + + /* COMMAND & EMPATHY HEADER */ + div.sheet-skills-col:nth-of-type(2) h4:nth-of-type(2), + div.sheet-skills-col:nth-of-type(2) h4:nth-of-type(3) { + height: 150px;} + + div.sheet-skills-col label { + width: 83%; + margin-right: 2%; + font-size: 0.9em; + text-transform: capitalize;} + + div.sheet-skill-col { + display: inline-block; + margin-bottom: 5%; + width: 90%;} + + div.sheet-skill-col div { + padding: 1% 0px;} + + div.sheet-skill-col input[type="number"] { + height: 20px; + text-align: center; + width: 2em;} + + div.sheet-skill-col input[type="text"] { + height: 20px; + width: 3em;} + + /* CUSTOMIZE LABELS FOR SKILLS WITH TEXT INPTUS */ + div.sheet-skill-mar label { + width: 40%;} + + div.sheet-skill-mar input[type="text"] { + width: 38.9%;} + + div.sheet-skill-mel label { + width: 47%;} + + div.sheet-skill-mel input[type="text"] { + width: 31.9%;} + + div.sheet-skill-dri label { + width: 25%;} + + div.sheet-skill-dri input[type="text"] { + width: 53.9%;} + + div.sheet-skill-fire label { + width: 30%;} + + div.sheet-skill-fire input[type="text"] { + width: 48.9%;} + + div.sheet-skill-pil label { + width: 20%;} + + div.sheet-skill-pil input[type="text"]{ + width: 58.9%;} + + div.sheet-skill-sail label { + width: 15%;} + + div.sheet-skill-sail input[type="text"] { + width: 63.9%} + + div.sheet-skill-cust input[type="text"] { + width: 82.9%;} + + div.sheet-skill-lan label { + width: 35%;} + + div.sheet-skill-lan input[type="text"] { + width: 43.9%;} + + div.sheet-skill-mech label { + width: 33%;} + + div.sheet-skill-mech input[type="text"] { + width: 45.9%;} + + div.sheet-skill-perf label { + width: 42%;} + + div.sheet-skill-perf input[type="text"] { + width: 36.9%;} + +/**********************************************************************************************************/ +/*************************** NPC ***************************/ +/********************************************************************************************************/ + div.sheet-npc { + border : 1px solid black; + padding: 1%; + width : 65%;} + + div.sheet-npc div { + padding: 1% 0px;} + + div.sheet-npc input[type="text"][name*="character"] { + font-size : 2em; + margin-bottom: 2%; + text-align : left; + width : 100%;} + + div.sheet-npc label { + margin-right : 5%; + text-transform: capitalize; + width : 50%;} + + div.sheet-npc input[type="text"] { + text-align: center; + width: 8em;} + + div.sheet-npc-stat-block { + width: 80%;} + + div.sheet-npc-body-details div { + margin-left: 5%;} + + div.sheet-npc-body-details label { + margin-right: 5%; + width : 65%;} + + div.sheet-npc-extras input[type="text"] { + font-weight: bolder; + text-align: left; + width : 100%;} + +/**********************************************************************************************************/ +/*************************** HIDE & SHOW THINGS ***************************/ +/********************************************************************************************************/ + div.sheet-pc, + div.sheet-npc { + display: none;} + + input.sheet-type[value="pc"] ~ .sheet-pc, + input.sheet-type[value="npc"] ~ .sheet-npc { + display : block;} + + +/**********************************************************************************************************/ +/*************************** HIGHLIGHT BUTTONS ***************************/ +/********************************************************************************************************/ + input.sheet-whisper-toggle[value*="gm"] + button[name*="whisper"], + input.sheet-type[value="pc"] ~ div.sheet-tabs button[name*="pc"], + input.sheet-type[value="npc"] ~ div.sheet-tabs button[name*="npc"] { + color : #fff; + background-color: #7b1915; + box-shadow : inset 0px 0px 3px 1px #e31715;} + +/**********************************************************************************************************/ +/*************************** FOOTER ***************************/ +/********************************************************************************************************/ + .sheet-footer { + border: none; + font-size: 0.55em; + line-height: 15px; + margin-top: 15px; + text-align: left; + width: 700px;} + +/**********************************************************************************************************/ +/*************************** REPEATING SECTIONS *********************/ +/********************************************************************************************************/ + .repcontainer {} + + /* This will make the Add & Modify words transparent so that only our symbols below show up */ + .repcontrol .btn { + color: transparent;} + + /* This will put icons next to the buttons. A `+` for Add and a lock for edit */ + .repcontrol .repcontrol_edit:after, + .repcontrol .repcontrol_add:after { + color : #111518; + font-family : pictos; + font-size : 2.5em;} + + .repcontrol .repcontrol_edit:after { + content: '(';} + + .repcontrol .repcontrol_add:after { + content: '&';} + + .editmode ~ .repcontrol .repcontrol_edit:after { + content: ')';} + + /* These are the buttons that appear after the repcontrol_edit is clicked*/ + .itemcontrol { + z-index: 10;} + + .itemcontrol .repcontrol_del, + .itemcontrol .repcontrol_move { + font-size: 18px; + margin-top: 0px; + padding: 0px; + width: 15px;} + + .itemcontrol .repcontrol_del { + background-color: darkred; + font-family: pictos;} + +/**********************************************************************************************************/ +/*************************** ROLL TEMPLATE *********************/ +/********************************************************************************************************/ + .sheet-rolltemplate-rolls { + + } + + .sheet-rolltemplate-rolls .sheet-template-body { + border : 1px solid #000; + text-align: center;} + + .sheet-rolltemplate-rolls .sheet-template-header { + background-color: white; + border : 1px solid #000; + border-bottom : 2px solid #000; + color : black; + font-size : 20px; + font-variant : small-caps; + letter-spacing : 2px; + padding : 4px 0px 3px 0px; + text-align : center; + text-transform : capitalize;} + + .sheet-rolltemplate-rolls .sheet-template-row { + background-color: #555; + } + + /* Use this to alternate the background colors for each row */ + .sheet-rolltemplate-rolls .sheet-template-row:nth-child(2n+0) { + background-color: #1c1c1c; + } + + /* Remove some fo the built in styles around rolls */ + .sheet-rolltemplate-rolls .inlinerollresult { + background-color: transparent; + border : none; + color : black; + display :inline-block; + font-size : 25px; + padding : 5px; + } + + .sheet-rolltemplate-rolls .inlinerollresult.fullfail, + .sheet-rolltemplate-rolls .inlinerollresult.fullcrit, + .sheet-rolltemplate-rolls.inlinerollresult.importantroll { + border: none; + } + + /* Change the colors of Full Fails & Full Crits from their built in defaults */ + .sheet-rolltemplate-rolls .inlinerollresult.fullfail { + color: white; + } + + .sheet-rolltemplate-rolls .inlinerollresult.fullcrit { + color: white; + } + + +/**********************************************************************************************************/ +/*************************** FIREFOX ***************************/ +/********************************************************************************************************/ + input[type=number]::-webkit-outer-spin-button, + input[type=number]::-webkit-inner-spin-button { + -webkit-appearance: none; + margin: 0;} + + input[type=number] { + -moz-appearance:textfield;} \ No newline at end of file diff --git a/Nemesis/nemesis.html b/Nemesis/nemesis.html new file mode 100644 index 0000000000..e7320b9ede --- /dev/null +++ b/Nemesis/nemesis.html @@ -0,0 +1,562 @@ +