diff --git a/Star Wars Saga Edition/StarWarsSagaEdition.css b/Star Wars Saga Edition/StarWarsSagaEdition.css index 366c866cce..58902f9bb2 100644 --- a/Star Wars Saga Edition/StarWarsSagaEdition.css +++ b/Star Wars Saga Edition/StarWarsSagaEdition.css @@ -5,6 +5,11 @@ src: local('Play-Bold'), url(http://themes.googleusercontent.com/static/fonts/play/v4/ZzUearZLklGfoL18Ti0GaQ.woff) format('woff'); } +/* Insert color variables here when the sheet is updated from Legacy to CSE. + https://github.com/Roll20/roll20-character-sheets/blob/master/HarnMaster3/harnstyle.css + Use something like this. +*/ + .charsheet { background-image: url(""); background-color: white; @@ -396,106 +401,40 @@ input.sheet-skillsNotes{ width: 100%; } -/* sheet roll template for Saga Default */ -.sheet-rolltemplate-sagadefault table { +/* ROLL TEMPLATES */ + + /* All roll templates (or most of them, anyway) */ +.sheet-rolltemplate-sagadefault table, +.sheet-rolltemplate-attack table, +.sheet-rolltemplate-skill table, +.sheet-rolltemplate-second-wind table, +.sheet-rolltemplate-statBlock table { width:100%; font-size: 1em; + background-color: transparent; + color: black; font-family: "Helvetica Neue", Helvetica, sans-serif; border-collapse:separate; border:solid black 1px; - border-top-right-radius:5px; - border-top-left-radius:5px; - -moz-border-radius-topleft: 5px; - -moz-border-radius-topright: 5px; - -webkit-border-top-left-radius: 5px; - -webkit-border-top-right-radius: 5px; + border-top-left-radius:5px; + border-top-right-radius:5px; } - -.sheet-rolltemplate-sagadefault th { + +.sheet-rolltemplate-sagadefault th, +.sheet-rolltemplate-attack th, +.sheet-rolltemplate-skill th, +.sheet-rolltemplate-second-wind th, +.sheet-rolltemplate-statBlock th { background-color: #000000; color: #ffffff; - padding: 2px; + text-align: center; line-height: 1.6em; font-size: 1.2em; - border-top: none; -} -.sheet-rolltemplate-sagadefault .sheet-subheader { - background-color: #333333; - color: #ffffff; - font-size: 1em; - font-style: italic; - text-align: center; -} -.sheet-rolltemplate-sagadefault .sheet-tcat { - font-weight: bold; -} - -.sheet-rolltemplate-sagadefault td { - padding: 5px; - border: 1px solid black; - color: black; - text-align: left; -} - -.sheet-rolltemplate-sagadefault tr:nth-child(odd) { - background-color: #ffffff; -} - -.sheet-rolltemplate-sagadefault tr:nth-child(even) { - background-color: #ededed; -} - -.sheet-rolltemplate-sagadefault .inlinerollresult { - display: inline-block; - min-width: 1.5em; - text-align: center; - border: 2px solid #000000; /*Cool Gray 6 C*/ - background-color: #000000; /*Cool Gray 6 C*/ - color: whitesmoke; -} - -.sheet-rolltemplate-sagadefault .inlinerollresult.fullcrit { - background-color: #3FB315; - color: #f5f5f5; -} - -.sheet-rolltemplate-sagadefault .inlinerollresult.fullfail { - background-color: #B31515; - color: white; -} - -.sheet-rolltemplate-sagadefault .inlinerollresult.importantroll { - background-color: #4A57ED; - color: white; -} -.sheet-rolltemplate-sagadefault div{ - width:100%; - max-width:400px; -} -/* Sheet roll template for Attacks */ -.sheet-rolltemplate-attack table { - width:100%; - font-size: 1em; - color: black; - font-family: "Helvetica Neue", Helvetica, sans-serif; - border-collapse:separate; - border:solid black 1px; - border-top-right-radius:5px; - border-top-left-radius:5px; - -moz-border-radius-topleft: 5px; - -moz-border-radius-topright: 5px; - -webkit-border-top-left-radius: 5px; - -webkit-border-top-right-radius: 5px; -} - -.sheet-rolltemplate-attack th { - background-color: #000000; - color: #ffffff; - padding: 2px; - line-height: 1.6em; - font-size: 1.2em; - border-top: none; + border-top-left-radius: 2.5px; + border-top-right-radius: 2.5px; } + +.sheet-rolltemplate-sagadefault .sheet-subheader, .sheet-rolltemplate-attack .sheet-subheader { background-color: #333333; color: #ffffff; @@ -503,228 +442,251 @@ input.sheet-skillsNotes{ font-style: italic; text-align: center; } -.sheet-rolltemplate-attack .sheet-tcat { + +.sheet-rolltemplate-sagadefault .sheet-tcat, +.sheet-rolltemplate-attack .sheet-tcat, +.sheet-rolltemplate-skill .sheet-tcat, +.sheet-rolltemplate-second-wind .sheet-tcat, +.sheet-rolltemplate-statBlock .sheet-tcat { font-weight: bold; } - -.sheet-rolltemplate-attack td { + +.sheet-rolltemplate-sagadefault td, +.sheet-rolltemplate-attack td, +.sheet-rolltemplate-skill td, +.sheet-rolltemplate-second-wind td { padding: 5px; border: 1px solid black; text-align: left; } - -.sheet-rolltemplate-attack tr:nth-child(odd) { +.sheet-rolltemplate-sagadefault tr:nth-child(odd), +.sheet-rolltemplate-attack tr:nth-child(odd), +.sheet-rolltemplate-skill tr:nth-child(odd), +.sheet-rolltemplate-second-wind tr:nth-child(odd) { background-color: #ffffff; } -.sheet-rolltemplate-attack tr:nth-child(even) { +.sheet-rolltemplate-sagadefault tr:nth-child(even), +.sheet-rolltemplate-attack tr:nth-child(even), +.sheet-rolltemplate-skill tr:nth-child(even), +.sheet-rolltemplate-second-wind tr:nth-child(even) { background-color: #ededed; } - -.sheet-rolltemplate-attack .inlinerollresult { - display: inline-block; - min-width: 1.5em; - text-align: center; - border: 2px solid #a7a8aa; /*Cool Gray 6 C*/ - background-color: #000000; /*Cool Gray 6 C*/ - color: #f5f5f5; -} - -.sheet-rolltemplate-attack .inlinerollresult.fullcrit { - background-color: #3FB315; - color: white; -} - -.sheet-rolltemplate-attack .inlinerollresult.fullfail { - background-color: #B31515; - color: white; -} - -.sheet-rolltemplate-attack .inlinerollresult.importantroll { - background-color: #4A57ED; - color: white; -} -.sheet-rolltemplate-attack div{ - width:100%; - max-width:400px; -} - -/* sheet roll template for skills */ -.sheet-rolltemplate-skill table { - background-color: #ffffff; - color: #000000; - width:100%; - font-size: 1em; - font-family: "Helvetica Neue", Helvetica, sans-serif; - border-collapse:separate; - border:solid black 1px; - border-radius:5px; - -moz-border-radius: 5px; - -webkit-border-radius: 5px; -} -.sheet-rolltemplate-skill .sheet-tcat { - font-weight: bold; -} -.sheet-rolltemplate-skill th { - background-color: #000000; - color: #ffffff; - padding: 2px; - border-top: none; - line-height: 1.6em; - font-size: 1.2em; - text-align: center; -} - -.sheet-rolltemplate-skill td { - padding: 5px; - border:solid black 1px; - text-align:left; -} - -.sheet-rolltemplate-skill tr:nth-child(odd) { - background-color: #ffffff; -} - -.sheet-rolltemplate-skill tr:nth-child(even) { - background-color: #ededed; -} - -.sheet-rolltemplate-skill tr:first-child td{ - text-align: center; - border-left: none; - width: 75px; -} -.sheet-rolltemplate-skill .inlinerollresult { + + /*inline roll formatting for most templates*/ +.sheet-rolltemplate-sagadefault .inlinerollresult, +.sheet-rolltemplate-attack .inlinerollresult, +.sheet-rolltemplate-skill .inlinerollresult, +.sheet-rolltemplate-second-wind .inlinerollresult { display: inline-block; min-width: 1.5em; text-align: center; border: 2px solid #a7a8aa; /*Cool Gray 6 C*/ - background-color: #000000; - color: #f5f5f5; + border-radius: 5px; + background-color: #000000; + color: whitesmoke; } -.sheet-rolltemplate-skill .inlinerollresult.fullcrit { - border: 2px solid #a7a8aa; /*Cool Gray 6 C*/ - background-color: #008000; +.sheet-rolltemplate-sagadefault .inlinerollresult.fullcrit, +.sheet-rolltemplate-attack .inlinerollresult.fullcrit, +.sheet-rolltemplate-skill .inlinerollresult.fullcrit, +.sheet-rolltemplate-second-wind .inlinerollresult.fullcrit { + background-color: #3fb315; } - -.sheet-rolltemplate-skill .inlinerollresult.fullfail { - border: 2px solid #a7a8aa; /*Cool Gray 6 C*/ - background-color: #FF0000; + +.sheet-rolltemplate-sagadefault .inlinerollresult.fullfail, +.sheet-rolltemplate-attack .inlinerollresult.fullfail, +.sheet-rolltemplate-skill .inlinerollresult.fullfail, +.sheet-rolltemplate-second-wind .inlinerollresult.fullfail { + background-color: #B31515; } - -.sheet-rolltemplate-skill .inlinerollresult.importantroll { - border: 2px solid #a7a8aa; /*Cool Gray 6 C*/ - background-color: #c5c6c7; + +.sheet-rolltemplate-sagadefault .inlinerollresult.importantroll, +.sheet-rolltemplate-attack .inlinerollresult.importantroll, +.sheet-rolltemplate-skill .inlinerollresult.importantroll, +.sheet-rolltemplate-second-wind .inlinerollresult.importantroll { + background-color: #4A57ED; } -.sheet-rolltemplate-skill div{ + +.sheet-rolltemplate-sagadefault div, +.sheet-rolltemplate-attack div, +.sheet-rolltemplate-skill div, +.sheet-rolltemplate-second-wind div { width:100%; max-width:400px; } -/* sheet roll template for Second Wind */ + +/* INDIVIDUAL ROLL TEMPLATES*/ + + /* Sheet roll template for Saga Default */ + /* There are no special elements for Saga Default template.*/ + + /* Sheet roll template for Attacks */ + /* There are no special elements for Attack template.*/ + + /* Sheet roll template for Skills */ +.sheet-rolltemplate-skill table { + border-radius: 5px; +} + +.sheet-rolltemplate-skill th { + /* Most properties defined in general section */ + border-top-left-radius: 2.5px; + border-top-right-radius: 0px; + text-align: center; +} + + /* All of the border-(location)-radius elements are to make it nice and rounded, both by itself and when there are notes. */ +.sheet-rolltemplate-skill tr:first-child td { + text-align: center; + border-left: none; + border-top-right-radius: 2.5px; + width: 75px; +} + +.sheet-rolltemplate-skill tr:last-child td { + border-bottom-left-radius: 2.5px; + border-bottom-right-radius: 2.5px; +} + +.sheet-rolltemplate-skill tr:only-child th{ + border-bottom-left-radius: 2.5px; +} + +.sheet-rolltemplate-skill tr:only-child td{ + border-top-right-radius: 2.5px; + border-bottom-right-radius: 2.5px; + border-bottom-left-radius: 0px; +} + + /* Sheet roll template for Second Wind */ .sheet-rolltemplate-second-wind table { - width:100%; - font-size: 1em; - color: black; - font-family: "Helvetica Neue", Helvetica, sans-serif; - border-collapse:separate; - border:solid black 1px; border-radius:5px; - -moz-border-radius: 5px; - -webkit-border-radius: 5px; } .sheet-rolltemplate-second-wind .sheet-tcat { font-weight: bold; } .sheet-rolltemplate-second-wind th { - background-color: #000000; - color: #ffffff; - padding: 2px; - border-top: none; - line-height: 1.6em; - font-size: 1.2em; text-align: center; } -.sheet-rolltemplate-second-wind td { - padding: 5px; - border:solid black 1px; - text-align:left; -} - -.sheet-rolltemplate-second-wind tr:nth-child(odd) { - background-color: #ffffff; -} - -.sheet-rolltemplate-second-wind tr:nth-child(even) { - background-color: #ededed; -} - .sheet-rolltemplate-second-wind tr:first-child td{ text-align: center; border-left: none; width: 75px; } -.sheet-rolltemplate-second-wind .inlinerollresult { - display: inline-block; - min-width: 1.5em; - text-align: center; - border: 2px solid #a7a8aa; /*Cool Gray 6 C*/ - background-color: #000000; - color: #f5f5f5; + +.sheet-rolltemplate-second-wind tr:last-child td { + border-bottom-left-radius: 2.5px; + border-bottom-right-radius: 2.5px; } -.sheet-rolltemplate-second-wind .inlinerollresult.fullcrit { - border: 2px solid #a7a8aa; /*Cool Gray 6 C*/ - background-color: #008000; -} - -.sheet-rolltemplate-second-wind .inlinerollresult.fullfail { - border: 2px solid #a7a8aa; /*Cool Gray 6 C*/ - background-color: #FF0000; -} - -.sheet-rolltemplate-second-wind .inlinerollresult.importantroll { - border: 2px solid #a7a8aa; /*Cool Gray 6 C*/ - background-color: #c5c6c7; -} -.sheet-rolltemplate-second-wind div{ - width:100%; - max-width:400px; -} -/* sheet roll template for stat block */ -.sheet-rolltemplate-statBlock table { - width:100%; - font-size: 1em; - font-family: "Helvetica Neue", Helvetica, sans-serif; - border-collapse:separate; - border:solid black 1px; - border-radius:5px; - -moz-border-radius: 5px; - -webkit-border-radius: 5px; -} -.sheet-rolltemplate-statBlock .sheet-tcat { - font-weight: bold; -} -.sheet-rolltemplate-statBlock th { - background-color: #000000; - color: #ffffff; - padding: 2px; - border-top: none; - line-height: 1.6em; - font-size: 1.2em; - text-align: center; -} - + /* Sheet roll template for stat block */ .sheet-rolltemplate-statBlock td { text-align:left; background-color: #ffffff; + padding: 2px; } .sheet-rolltemplate-statBlock .inlinerollresult { - display: inline-block; - text-align: left; - background-color: #ffffff; + /* This makes the roll appear as regular text, though the formula is still displayed if hovered. */ + display: inline; + background-color: transparent; font-weight: normal; + font-size: 1em; + padding: 0px; border: 0px; } + +/* DARK MODE FOR ROLL TEMPLATES*/ + /* This section is for when the sheet is updated from Legacy to CSE, but is useless until then. */ + +.sheet-darkmode .sheet-rolltemplate-sagadefault th, +.sheet-darkmode .sheet-rolltemplate-attack th, +.sheet-darkmode .sheet-rolltemplate-second-wind th { + color: #e6e6e6; +} + +.sheet-darkmode .sheet-rolltemplate-sagadefault .sheet-subheader, +.sheet-darkmode .sheet-rolltemplate-attack .sheet-subheader { + background-color: #06063c; + color: #e3e3e3; +} + +.sheet-darkmode .sheet-rolltemplate-sagadefault tr:nth-child(odd), +.sheet-darkmode .sheet-rolltemplate-attack tr:nth-child(odd), +.sheet-darkmode .sheet-rolltemplate-skill tr:nth-child(odd) { + background-color: #2e2e46; +} + +.sheet-darkmode .sheet-rolltemplate-sagadefault tr:nth-child(even), +.sheet-darkmode .sheet-rolltemplate-attack tr:nth-child(even), +.sheet-darkmode .sheet-rolltemplate-skill tr:nth-child(even) { + background-color: #404062; +} + + /* dark mode inline roll results */ +.sheet-darkmode .sheet-rolltemplate-sagadefault .inlinerollresult, +.sheet-darkmode .sheet-rolltemplate-attack .inlinerollresult, +.sheet-darkmode .sheet-rolltemplate-skill .inlinerollresult, +.sheet-darkmode .sheet-rolltemplate-second-wind .inlinerollresult { + border: 2px solid #732d95; + background-color: #4a206c; + color: whitesmoke; +} + +.sheet-darkmode .sheet-rolltemplate-sagadefault .inlinerollresult.fullcrit, +.sheet-darkmode ..sheet-rolltemplate-attack .inlinerollresult.fullcrit, +.sheet-darkmode .sheet-rolltemplate-skill .inlinerollresult.fullcrit, +.sheet-darkmode .sheet-rolltemplate-second-wind .inlinerollresult.fullcrit { + border: 2px solid #46c419; + background-color: #247905; +} + +.sheet-darkmode .sheet-rolltemplate-sagadefault .inlinerollresult.fullfail, +.sheet-darkmode .sheet-rolltemplate-attack .inlinerollresult.fullfail, +.sheet-darkmode .sheet-rolltemplate-skill .inlinerollresult.fullfail, +.sheet-darkmode .sheet-rolltemplate-second-wind .inlinerollresult.fullfail { + border: 2px solid #b31515; + background-color: #7b0e0e; +} + +.sheet-darkmode .sheet-rolltemplate-sagadefault .inlinerollresult.importantroll, +.sheet-darkmode .sheet-rolltemplate-attack .inlinerollresult.importantroll, +.sheet-darkmode .sheet-rolltemplate-skill .inlinerollresult.importantroll, +.sheet-darkmode .sheet-rolltemplate-second-wind .inlinerollresult.importantroll { + border: 2px solid #4a57ed; + background-color: #3944ca; +} + + /* DARK MODE for Saga Default Roll Template */ +.sheet-darkmode .sheet-rolltemplate-sagadefault td { + color: #dddddd; +} + + /* DARK MODE for Attack Roll Template*/ + /* There are no special elements for dark mode Attack template. */ + + /* DARK MODE for Skill Roll Template */ +.sheet-darkmode .sheet-rolltemplate-skill table { + background-color: #000000; + color: #e6e6e6; +} + +.sheet-darkmode .sheet-rolltemplate-skill th { + background-color: #000000; + color: #whitesmoke; +} + +.sheet-darkmode .sheet-rolltemplate-skill tr:first-child td{ + background-color: #404061; +} + + /* DARK MODE for Second Wind Roll Template */ +.sheet-darkmode .sheet-rolltemplate-second-wind tr:first-child td{ + text-align: center; + border-left: none; + width: 75px; +} + /* DARK MODE for statBlock Template*/ + /* Still need to do these. */