diff --git a/Star Trek Adventures 2d20/README.md b/Star Trek Adventures 2d20/README.md new file mode 100644 index 0000000000..ac90205934 --- /dev/null +++ b/Star Trek Adventures 2d20/README.md @@ -0,0 +1,39 @@ +# Star Trek Adventures 2d20 Character Sheet +This is the for use on Roll20.net with the Modiphius' Star Trek Adventures. The sheet is designed to be usable by all Roll20 users regardless of subscription level. + +## Features + +* High performance worker scripts used throughout the sheet +* Styling that matches the official sheet from Modiphius +* Character or Starship sheets available +* Challenge Rolls pre-configured including setting difficulty of the task, adding additional dice rolls, and incorporating a trait - all styled in the Star Trek LCARS format + + +[](https://raw.githubusercontent.com/Roll20/roll20-character-sheets/master/Star Trek Adventures 2d20/Star Trek Adventures 2d20.PNG) + +### [Changelog](https://raw.githubusercontent.com/Roll20/roll20-character-sheets/master/Star Trek Adventures 2d20/changelog.md) + +## Sheet Releases +When I release a new version, it takes time to reach the public. Roll20 must merge my changes (typically Mondays/Tuesdays) and then release the code to the public (typically Tuesdays/Wednesdays). You can track [Roll20's pull requests on their github](https://github.com/Roll20/roll20-character-sheets/pulls). I have no control over when they release. + +## How to Update the sheet yourself (as Pro): + +1. Copy the [html](https://raw.githubusercontent.com/GrumpyOldDM/STA_DemoSheet/master/Star%20Trek%20Adventures%202d20.html) from GitHub +2. In Roll20 go to campaign settings and choose a custom character sheet. +3. In the HTML tab paste the HTML code +4. Copy the [css](https://raw.githubusercontent.com/GrumpyOldDM/STA_DemoSheet/master/Star%20Trek%20Adventures%202d20.css) from GitHub +5. On Roll20 in the CSS tab paste the CSS code. +6. Hit save. + +*If you are ever concerned about data loss I recommend you duplicate your campaign and use that to copy to see how it'll work. * + +## Testing new versions +I regularly release new versions. If you'd like to be involved in the testing period follow this thread. You can also see the latest code on [Star Trek Adventures (Workshop)](https://app.roll20.net/join/2363663/M4ln3Q) + +## Contributors +This sheet wouldn't be possible without the help of the following users: +Rob - https://app.roll20.net/users/28243/rob + +--- + +David Collier ([GrumpyOldDM](https://app.roll20.net/users/1486161/david-c) on roll20) diff --git a/Star Trek Adventures 2d20/Star Trek Adventures 2d20.PNG b/Star Trek Adventures 2d20/Star Trek Adventures 2d20.PNG index 1e261407cc..da197d796d 100644 Binary files a/Star Trek Adventures 2d20/Star Trek Adventures 2d20.PNG and b/Star Trek Adventures 2d20/Star Trek Adventures 2d20.PNG differ diff --git a/Star Trek Adventures 2d20/Star Trek Adventures 2d20.css b/Star Trek Adventures 2d20/Star Trek Adventures 2d20.css index f19e838fac..a290349d52 100644 --- a/Star Trek Adventures 2d20/Star Trek Adventures 2d20.css +++ b/Star Trek Adventures 2d20/Star Trek Adventures 2d20.css @@ -1,107 +1,663 @@ -/* === GENERAL === */ .charsheet { - min-width: 820px; - background: #FFFFFF; - background-image: url("https://raw.githubusercontent.com/Roll20/roll20-character-sheets/master/Star Trek Adventures 2d20/Sheet_blank.PNG"); - background-repeat: no-repeat; - background-position: 0px 40px; + background: white; } -.sheet-section { - float: left; - width: calc(100% - 85px); - margin: 0px 0px 0px 85px; - padding: 1px; - box-sizing: border-box; +.sheet-controls { + width: 100%; + display: inline-block; } -.sheet-half { - max-width: calc(50% - 85px); +.sheet-character, +.sheet-starship, +.sheet-settings +{ + display: none; } -.sheet-half input[type="number"] { - width: 50px; +.sheet-character_type[value="character"] ~ .sheet-character, +.sheet-character_type[value="starship"] ~ .sheet-starship, +{ + display: block; } -.sheet-break { - clear: both; +.sheet-settings_toggle[value="on"] ~ .sheet-character, +.sheet-settings_toggle[value="on"] ~ .sheet-starship +{ + display: None; +} + +.sheet-settings_toggle[value="on"] ~ .sheet-settings { + display: block; +} + +.sheet-character_type[value="starship"] ~ .sheet-sidedeco1, +.sheet-settings_toggle[value="on"] ~ .sheet-sidedeco1, +.sheet-settings_toggle[value="on"] ~ .sheet-sidedeco1, +.sheet-settings_toggle[value="on"] ~ .sheet-sidedeco2 +{ + display: none; +} + +.sheet-topback.sheet-character, +.sheet-topback.sheet-settings +{ + width: 875px; +} + +.sheet-topback.sheet-starship{ + width: 1070px; +} + +.sheet-bottomback.sheet-character, +.sheet-bottomback.sheet-settings +{ + width: 925px; +} + +.sheet-bottomback.sheet-starship { + width: 1120px; +} + +.sheet-rolltemplates { + display: none; +} + +button[type="roll"] { + display: inline-block; + background-image: none; + text-shadow: none; + box-shadow: none; + border: 2px solid; + color: white; + font-family: Impact; + font-weight: 100; + font-size: 13px; + line-height: 14px; + width: 87px; + text-align: right; + padding: 0px; + border-top-left-radius: 20px; + border-bottom-left-radius: 20px; + margin-right: 3px; +} + +button[type="roll"] * { + pointer-events: none; +} + +button[type="roll"] span { + display: block; + font-size: 13px; + line-height: 14px; +} + +.sheet-attributecontainer button[type="roll"] { + border-color: darkviolet; + background-color: darkviolet; +} + +.sheet-attributecontainer button[type="roll"]:hover { + background-color: white; + color: darkviolet; } -.sheet-header-main { - margin-bottom: 4px; - padding: 2px 2px; +button[type="roll"]:before { + content: "" !important; +} + +::-webkit-scrollbar { + border: 1px solid #9999cc; + border-top-right-radius: 15px; + border-bottom-right-radius: 15px; + width: 15px; +} + +::-webkit-scrollbar-thumb { + background: #ff9900; +} + +::-webkit-scrollbar-button:decrement { + border-top-right-radius: 15px; + border: 1px solid #9999cc; + background: #9999cc; +} + +::-webkit-scrollbar-button:increment { + border-bottom-right-radius: 15px; + border: 1px solid #9999cc; + background: #9999cc; +} + +.sheet-vertdeco { + position: relative; + left: 550px; + top: -30px; + height: 40px; + margin-bottom: -40px; + width: 10px; + background: white; +} + +.repcontrol { + border-radius: 25px; + background: #cc6699; +} + +.repcontrol .repcontrol_add { + border: none; + border-radius: 20px 0px 0px 20px; + border-right: 6px solid white; + background: #cc6699; + font-size: 10px; + color: white; + +} + +.repcontrol .repcontrol_add:hover{ + background: #cc99cc; +} + +.repcontrol .repcontrol_edit { + border: none; + border-radius: 0px 20px 20px 0px; + border-left: 6px solid white; + background: #cc6699; + font-size: 10px; + color: white; + +} + +.repcontrol .repcontrol_edit:hover{ + background: #cc99cc; +} + +.sheet-sidedeco1 { + position: relative; + height: 80px; + margin-bottom: -155px; + width: 108px; + top: 200px; + border-top: 15px solid white; + border-bottom: 15px solid white; + background: darkviolet; +} + +.sheet-sidedeco2 { + position: relative; + height: 500px; + margin-bottom: -475px; + width: 108px; + top: 490px; + border-top: 15px solid white; + background: #cc6699; +} + +.sheet-character_type[value="starship"] ~ .sheet-sidedeco2 { + width: 128px; + margin-bottom: -520px; +} + +.sheet-topback { + background: #ff9900 url("https://raw.githubusercontent.com/Roll20/roll20-character-sheets/master/Star Trek Adventures 2d20/toplogo.png") no-repeat 24px 30px; + border-bottom-left-radius: 130px; + margin-bottom: 10px; + padding-left: 100px; +} + +.sheet-character.sheet-topback, +.sheet-settings.sheet-topback +{ + height: 250px; +} + +.sheet-starship.sheet-topback { + height: 200px; +} + +.sheet-bottomback { + background: #9999cc; + border-top-left-radius: 130px; + height: 800px; + padding-top: 10px; + padding-left: 50px; +} + +.sheet-topsection { + background: white; + border-bottom-left-radius: 70px; + height: 93%; + float: right; +} + +.sheet-character .sheet-topsection, +.sheet-settings .sheet-topsection +{ + width: 90%; + padding-left: 50px; +} + +.sheet-starship .sheet-topsection { + width: 93%; + padding-left: 30px; +} + +.sheet-attributecontainer select { + border-radius: 20px; + width: 100%; + border: 1px solid darkviolet; + background-color: darkviolet; + color: white; + font-family: Impact; +} + +.sheet-topsection h1 { + display: inline-block; text-align: right; - background: #FFFFFF; - color: #FF9900; - font-weight: bold; - font-size: 30px; + color: #ff9900; + font-size: 25px; + line-height: 35px; + font-family: Impact; + margin-left: 10px; } -.sheet-header { - margin-bottom: 4px; - padding: 2px 4px; - border-radius: 25px; - background: #FF9900; - color: black; - text-align: center; - font-weight: bold; +.sheet-bottomsection { + background: white; + width: 90%; + border-top-left-radius: 70px; + float: right; + height: 100%; + padding-top: 30px; + padding-left: 35px; } -.sheet-attribute { - margin-bottom: 4px; - padding: 2px 4px; - border-radius: 25px; - background: #cc6699; - color: white; - text-align: center; - font-weight: bold; +.sheet-sectionheader { + background-color: #ff9900; + width: 100%; + border-radius: 20px; + height: 15px; + margin-bottom: 20px; + padding-left: 10px } -.sheet-center { +.sheet-sectionheader .sheet-label { + background-color: white; + color: DarkMagenta; + font-family: Impact; + font-weight: 100; + font-size: 15.5px; + line-height: 15px; + margin: 0px; + padding-left: 2px; + padding-right: 2px; +} + +.sheet-charinfocontainer { + display: inline-block; + width: 100%; +} + +.sheet-settings .sheet-sectionheader { + margin-top: 15px; + margin-bottom: 10px; +} + +.sheet-charinfocontainer .sheet-label { + font-family: Impact; + color: darkviolet; + width: 130px; + line-height: 35px; + margin-right: 5px; + float: left; +} + +.sheet-character .sheet-charinfocontainer .sheet-label { + font-size: 20px; +} + +.sheet-starship .sheet-charinfocontainer .sheet-label, +.sheet-settings .sheet-label +{ + font-size: 18px; +} + +.sheet-charinfocontainer input[type="text"] { + border-width: 0px 0px 3px 0px; + border-radius: 0px; + border-color: darkviolet; + width: calc(100% - 135px); + font-family: Impact; +} + + + +.sheet-attributes, +.sheet-disciplines, +.sheet-values, +.sheet-talents, +.sheet-focuses, +.sheet-stress, +.sheet-injuries, +.sheet-other_equipment, +.sheet-weapons, +.sheet-departments, +.sheet-shields, +.sheet-launch-bay, +.sheet-power +{ + margin-top: 27px; +} + +.sheet-attributecontainer .sheet-label, +.sheet-weaponscontainer .sheet-label, +.sheet-weaponscontainer .sheet-iconlabel, +.sheet-weaponscontainer button[type="roll"] +{ + display: inline-block; + float: left; + border: 2px solid; + color: white; + font-family: Impact; + font-weight: 100; + font-size: 13px; + line-height: 18px; + width: 87px; + text-align: right; + padding-right: 1px; + margin-right: 4px; + border-top-left-radius: 20px; + border-bottom-left-radius: 20px; +} + +.sheet-settings .sheet-label { + width: 60px; +} + +.sheet-attributecontainer .sheet-label { + border-color: darkviolet; + background-color: darkviolet; +} + +.sheet-attributecontainer .sheet-breaches .sheet-label { + border: none; + background: none; + float: left; + text-align: left; + vertical-align: bottom; + font-size: 10px; + margin-left: 2px; + font-style: lighter; + color: #9370DB; + width: 40px; +} + +.sheet-scale { + height: 150px; + width: 139%; + padding: 0px; + position: relative; + left: -39%; + background: white url("https://raw.githubusercontent.com/Roll20/roll20-character-sheets/master/Star Trek Adventures 2d20/starshipdiagram.png") center center no-repeat; + background-size: contain; +} + +.sheet-scale .sheet-attributecontainer { + position: absolute; + bottom: 5px; + right: 0px; +} + +.sheet-scale .sheet-attributecontainer .sheet-label { + width: 50px; + background: #ff9900; + border-color: #ff9900; +} + +.sheet-scale .sheet-attributecontainer input[type="number"] { + border-color: #ff9900; + color: #ff9900; +} + + +.sheet-power .sheet-attributecontainer .sheet-label, +.sheet-crew .sheet-attributecontainer .sheet-label +{ + width: 75px; +} + +.sheet-weaponscontainer .sheet-label, +.sheet-weaponscontainer .sheet-iconlabel, +.sheet-weaponscontainer button[type="roll"] +{ + border-color: #cc6699; + background-color: #cc6699; +} + +.sheet-weaponscontainer .sheet-iconlabel, +.sheet-weaponscontainer button[type="roll"] +{ + width: 25px; + height: 22px; + background-image: url("https://raw.githubusercontent.com/Roll20/roll20-character-sheets/master/Star Trek Adventures 2d20/logosmall.png"); + background-repeat: no-repeat; + background-position: center center; +} + + +.sheet-attributecontainer input[type="text"], +.sheet-weaponscontainer input[type="text"] +{ + border: 2px solid; + font-weight: bold; + font-size: 9px; + line-height: 9px; + border-top-right-radius: 20px; + border-bottom-right-radius: 20px; + padding-right: 15px; + padding-left: 3px; +} + +input[type="checkbox"] { + opacity: 0; + z-index: 1; + position: relative; + top: -5px; + margin-right: -42px; + width: 40px; + height: 20px; + border: 1px dotted red; + border-radius: 20px; + background-color: transparent; + margin-left: 15px; +} + +input[type="checkbox"] + span { + display: inline-block; + width: 40px; + height: 20px; + border: 1px solid #cc99cc; + border-radius: 20px; + background-color: transparent; + margin: 0px; +} + +input[type="checkbox"]:checked + span { + background-color: #cc99cc; +} + +.sheet-determination-values, +.sheet-momentum-values +{ + display: inline-block; + padding: 0px; + height: 15.5px; + float: right; + line-height: 20px; + margin-right: 3px; + position: relative; + top: -2px; +} + +.sheet-controls { + display: inline-block; + text-align: right; + width: 99%; + padding: 0px 5px 0px 0px; +} + +.sheet-controls input[type="checkbox"] { + opacity: 0; + z-index: 1; + position: relative; + top: -7px; + margin-right: -36px; + height: 20px; + width: 30px; +} + +.sheet-controls input[type="checkbox"] + span { + position: relative; + top: -4px; + left: 5px; + font-family: pictos; text-align: center; + font-size: 18px; + color: #ff9900; + display: inline-block; + height: 20px; + width: 30px; + border: 1px solid #cc99cc; + border-radius: 20px; + background-color: transparent; + border-color: #ff9900; } - -.sheet-break { - clear: both; +.sheet-controls input[type="checkbox"]:checked + span { + background-color: #ff9900; + color: white; } +div.sheet-breaches { + width: 138px; +} +.sheet-attributecontainer .sheet-breaches input[type="checkbox"] { + position: relative; + top: 0px; + left: -16.25px; + width: 12px; + height: 10px; +} -label, -select { - margin: 0; +.sheet-attributecontainer .sheet-breaches input[type="checkbox"] + span +{ + margin-left: 12px; + margin-top 25px; + width: 12px; + height: 10px; +} + +input[type="number"] { + border: 2px solid; + text-align: center; + font-weight: bold; + font-size: 10px; + padding: 0 0 0 3px; + border-top-right-radius: 20px; + border-bottom-right-radius: 20px; + appearance: none; + -webkit-appearance: none; + -moz-appearance: textfield; + margin-right: 7px; +} + +input[type="number"]:hover, +input[type="number"]:focus +{ + -moz-appearance: number-input; +} + +.sheet-attributecontainer input[type="number"] { + border-color: darkviolet; + color: darkviolet; +} + +.sheet-weaponscontainer { + display: inline-block; +} + +.sheet-weaponscontainer input[type="number"] { + border-color: #cc6699; + color: #cc6699; +} + +.sheet-weaponscontainer input[type="text"] { + border-color: #cc6699; +} + +.sheet-weaponscontainer input[type="text"][name="attr_weaponqualities"] { + width: calc(100% - 101px); +} + +hr { + color: #cc6699; + display: block; + height: 1px; + border: 0; + border-top: 1px solid #cc6699; + margin: 1em 0; + padding: 0; } textarea { - margin: 0; - width: 100%; - height: 215px; - resize: vertical; - box-sizing: border-box; + border: 0px; + background-color: transparent; + width: 100%; + color: #9370DB; + resize: vertical; + background-image: + linear-gradient(to right, transparent 15px, transparent 15px), + linear-gradient(to left, transparent 15px, transparent 15px), + repeating-linear-gradient(transparent, transparent 30px, #9370DB 30px, #9370DB 31px, white 31px); + background-attachment: local; + line-height: 31px; + font-size: 15px; + padding: 8px 5px; } -.sheet-repitem, -.repitem { - margin-bottom: 2px; +.sheet-col input[type="checkbox"] { + margin-bottom: 5px; +} + +.sheet-momentum .sheet-label, +.sheet-determination .sheet-label +{ + font-size: 15.5px; + font-weight: bold; + font-style: lighter; + color: #9370DB; } -/* Override Roll20 Button styling for something less conspicious */ -button { - height: 22px; - line-height: 16px; - margin: 0 !important; - border-radius: 0 !important; - background-image: none !important; - border: none !important; - box-shadow: none !important; +.sheet-values textarea, +.sheet-injuries textarea { + height: 125px; } -.repitem button { - height: 28px; - line-height: 20px; +.sheet-talents textarea { + height: 175px; +} + +.sheet-focuses textarea { + height: 300px; +} + +.sheet-other_equipment textarea { + height: 250px; +} + +.sheet-additional-notes textarea { + height: 650px; } /* Rolltemplate */ @@ -160,3 +716,9 @@ button { color: #3FB315; border: none; } + +input[type="hidden"][value="false"] + input[type="checkbox"], +input[type="hidden"][value="false"] + input[type="checkbox"] + span, +{ + display: none; +} \ No newline at end of file diff --git a/Star Trek Adventures 2d20/Star Trek Adventures 2d20.html b/Star Trek Adventures 2d20/Star Trek Adventures 2d20.html index dedf0b7bea..faa919e289 100644 --- a/Star Trek Adventures 2d20/Star Trek Adventures 2d20.html +++ b/Star Trek Adventures 2d20/Star Trek Adventures 2d20.html @@ -1,155 +1,1035 @@ + + -
CONTROL |
- FITNESS |
- PRESENCE |
-
DARING |
- INSIGHT |
- REASON |
-
COMMAND |
- SECURITY |
- SCIENCE |
-
CONN |
- ENGINEERING |
- MEDICINE |
-
DETERMINATION |
- - | - | - |
| Name/Type: | -DR: | -
| Qualities: | -|
| Name/Type: | -DR: | -
| Qualities: | -|
| Name/Type: | -DR: | -
| Qualities: | -|
| - | - | - | - | - | - |
| {{#roll_name}}{{roll_name}}{{/roll_name}} |
|---|
| + {{#diff_num}} + Task Difficulty: {{diff_num}} + {{/diff_num}} + |
| + {{#attr}} + {{attr}}: {{attr_num}} + {{/attr}} + |
| + {{#discp}} + {{discp}}: {{discp_num}} + {{/discp}} + |
| {{result}} Successes | +