mirror of
https://github.com/Nighthawk42/roll20-character-sheets.git
synced 2026-09-10 00:52:28 +00:00
Brett Nash
76b6cf5747
Work continues on improving 'stuff' (aka Inventory or items). So first up we have casting penalties for armor calculated and working. This may may the spell casters in your group most unhappy. I hope they stocked up on Transcendance. We have also added a 'pack' and 'store'. A pack is backpack or similar item you can drop if in combat. Or maybe on your horse. There is a toggle button to carry or not carry it. Encumberance pnealties are calcualted depending if carried or not. Store is for stuff you character doesn't have with them. Homewares or buried treaures. You can move items between the three lists easily. Then there is a pile of small items; Spells persist previous ranks on lealup is the most notable. Lots of people have asked for this - Enjoy! - Stuff (aka Inventory) - Spell equipped correctly. - Items only count to encumberance% if equipped (w/ test) - Add Store & Backpack sections - Add toggle for backpack carried - Allow items to move between sections with a click - Add support for transcendance and spell Enc% penalties - Make bleed a local (internal change) - Reset current round/phase on new combat. - Show the current round in the action box - Don't set negative PP on the character sheet (min 0) - Spells remember how many you got on level up.
1223 lines
25 KiB
CSS
1223 lines
25 KiB
CSS
/**/
|
|
|
|
.choice {
|
|
display: none;
|
|
}
|
|
|
|
.choice-showing {
|
|
display: block;
|
|
}
|
|
|
|
|
|
|
|
@font-face {
|
|
font-family: myPragRoman;
|
|
src: url(https://raw.githubusercontent.com/Roll20/roll20-character-sheets/master/RolemasterUnified_Official/fonts/PragRoman.ttf) format('truetype'),
|
|
url(https://raw.githubusercontent.com/Roll20/roll20-character-sheets/master/RolemasterUnified_Official/fonts/PragRoman.woff) format('woff');
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
/*@import url('https://fonts.googleapis.com/css2?family=Caveat:wght@500&display=swap&options=tnum');
|
|
@import
|
|
url('https://fonts.googleapis.com/css2?family=Material+Icons|Material+Icons+Outlined|Material+Icons+Two+Tone|Material+Icons+Round|Material+Icons+Sharp');
|
|
*/
|
|
@font-face {
|
|
font-family: "PragRoman";
|
|
src: url("https://db.onlinewebfonts.com/t/311c85b74d202c797a636fe182cde796.eot");
|
|
src: url("https://db.onlinewebfonts.com/t/311c85b74d202c797a636fe182cde796.eot?#iefix")format("embedded-opentype"),
|
|
url("https://db.onlinewebfonts.com/t/311c85b74d202c797a636fe182cde796.woff2")format("woff2"),
|
|
url("https://db.onlinewebfonts.com/t/311c85b74d202c797a636fe182cde796.woff")format("woff"),
|
|
url("https://db.onlinewebfonts.com/t/311c85b74d202c797a636fe182cde796.ttf")format("truetype"),
|
|
url("https://db.onlinewebfonts.com/t/311c85b74d202c797a636fe182cde796.svg#PragRoman")format("svg");
|
|
}
|
|
|
|
|
|
/* phttps://wiki.roll20.net/Character_Sheet_Development/Dark_Mode */
|
|
|
|
|
|
h2 {
|
|
font-family: 'PragRoman', 'myPragRoman', 'IM Fell DW Pica', 'Kaushan Script', 'Chalkduster', 'Trattatello', 'Luminari', fantasy, serif;
|
|
}
|
|
|
|
h3 {
|
|
font-family: 'PragRoman', 'myPragRoman', 'IM Fell DW Pica', 'Kaushan Script', 'Chalkduster', 'Trattatello', 'Luminari', fantasy, serif;
|
|
}
|
|
|
|
.sheet-hangingindent, .hangingindent {
|
|
padding-left: 1em;
|
|
text-indent: -1em;
|
|
}
|
|
|
|
|
|
.creaturesheet {
|
|
display: none;
|
|
}
|
|
.sheetselect[value='creaturesheet'] + .creaturesheet {
|
|
display: block;
|
|
}
|
|
.sheetselect[value='creaturesheet'] + .playercharactersheet {
|
|
display: none;
|
|
}
|
|
|
|
|
|
.fancybutton {
|
|
font-family: 'PragRoman', 'myPragRoman', 'IM Fell DW Pica', 'Kaushan Script', 'Chalkduster', 'Trattatello', 'Luminari', fantasy, serif;
|
|
}
|
|
|
|
|
|
.fancybutton {
|
|
align-self: center;
|
|
background: rgb(255,249,71);
|
|
background: linear-gradient(145deg, rgba(253,255,205,1) 0%, rgba(247,247,39,1) 100%);
|
|
border-radius: 15px 225px 255px 15px 15px 255px 225px 15px;
|
|
border-style: solid;
|
|
border-width: 2px;
|
|
box-shadow: 6px 6px 4px 1px rgba(0,0,0,0.4);
|
|
box-sizing: border-box;
|
|
color: #41403e;
|
|
cursor: pointer;
|
|
display: inline-block;
|
|
line-height: 23px;
|
|
outline: none;
|
|
padding: .75rem;
|
|
text-decoration: none;
|
|
transition: all 235ms ease-in-out;
|
|
border-bottom-left-radius: 15px 255px;
|
|
border-bottom-right-radius: 225px 15px;
|
|
border-top-left-radius: 255px 15px;
|
|
border-top-right-radius: 15px 225px;
|
|
user-select: none;
|
|
-webkit-user-select: none;
|
|
touch-action: manipulation;
|
|
}
|
|
|
|
.fancybutton.fancybuttoninline {
|
|
padding: 0.2em;
|
|
line-height: 15px;
|
|
border-bottom-left-radius: 8px 125px;
|
|
border-bottom-right-radius: 125px 8px;
|
|
border-top-left-radius: 125px 8px;
|
|
border-top-right-radius: 11px 115px;
|
|
box-shadow: 3px 3px 2px 1px rgba(0,0,0,0.4);
|
|
}
|
|
|
|
.fancybutton:hover {
|
|
box-shadow: rgba(0, 0, 0, .3) 2px 8px 8px -5px;
|
|
transform: translate3d(0, 2px, 0);
|
|
}
|
|
|
|
.fancybutton:focus {
|
|
box-shadow: rgba(0, 0, 0, .3) 2px 8px 4px -6px;
|
|
}
|
|
|
|
.fancytext {
|
|
font-family: 'PragRoman', 'myPragRoman', 'IM Fell DW Pica', 'Kaushan Script', 'Chalkduster', 'Trattatello', 'Luminari', fantasy, serif;
|
|
}
|
|
|
|
.editbutton {
|
|
border: none;
|
|
padding: 0;
|
|
background: none;
|
|
}
|
|
|
|
button[type=roll].sheet-d6-dice::before {
|
|
font-family: 'dicefontd10';
|
|
content: 't';
|
|
}
|
|
|
|
|
|
/* Icons */
|
|
.zmaterial-icons-round {
|
|
font-variation-settings: 'FILL' 0, 'wght' 400, 'GRAD' 0, 'opsz' 24;
|
|
font-size: smaller;
|
|
vertical-align: middle;
|
|
font-weight: normal;
|
|
line-height: 1;
|
|
letter-spacing: normal;
|
|
text-transform: none;
|
|
display: inline-block;
|
|
white-space: nowrap;
|
|
word-wrap: normal;
|
|
direction: ltr;
|
|
-webkit-font-feature-settings: 'liga';
|
|
-webkit-font-smoothing: antialiased;
|
|
}
|
|
|
|
/*
|
|
{ span class="material-symbols-rounded"}
|
|
visibility // Eye
|
|
visibility_off // Eye with slsh through it
|
|
info
|
|
{/span }
|
|
*/
|
|
|
|
|
|
.two-even-columns {
|
|
display: grid;
|
|
grid-template-columns: 1fr 1fr;
|
|
}
|
|
|
|
|
|
.toggle { display: none }
|
|
input:not(:checked).toggle + .toggler { display: none; }
|
|
|
|
|
|
|
|
.stat {
|
|
display: grid;
|
|
grid-template-columns: 1fr 2em 2em;
|
|
}
|
|
|
|
/* Same as stat, but for create
|
|
The cms_small_number class is 3em wide; so these columns are that ana bit */
|
|
.create_stat {
|
|
display: grid;
|
|
grid-template-columns: 1fr 3.2em 3.2em 3.2em;
|
|
}
|
|
|
|
.stat_names {
|
|
grid-column: 1;
|
|
}
|
|
|
|
.stat_abbr::before {
|
|
content: '(';
|
|
}
|
|
.stat_abbr::after {
|
|
content: ')';
|
|
}
|
|
.stat_abbr {
|
|
font-style: italic;
|
|
padding-left: 0.5em;
|
|
color: rgb(100,100,100);
|
|
}
|
|
|
|
.stat_value_potential {
|
|
grid-column: 2;
|
|
}
|
|
|
|
.stat_value_create {
|
|
grid-column: 3;
|
|
}
|
|
|
|
.stat_value_spare {
|
|
grid-column: 4;
|
|
}
|
|
|
|
|
|
.stat:nth-child(even) {
|
|
background: #eed;
|
|
}
|
|
|
|
.stat_value {
|
|
grid-column: 2;
|
|
}
|
|
.stat_attr {
|
|
grid-column: 3;
|
|
}
|
|
|
|
|
|
|
|
/**
|
|
* Categories in the big list
|
|
*
|
|
* Category stats Cost
|
|
* Skill Ranks +Bonus
|
|
* Skill Ranks +Bonus
|
|
*/
|
|
|
|
|
|
.skilllist {
|
|
column-count: auto;
|
|
column-width: 18em;
|
|
column-gap: 1em;
|
|
}
|
|
|
|
|
|
.category, .cmcategory {
|
|
display: block;
|
|
width:100%;
|
|
}
|
|
|
|
.category_head {
|
|
background: #cce;
|
|
}
|
|
|
|
.category_cost {
|
|
padding-left: 1em;
|
|
}
|
|
|
|
.skill_stat {
|
|
font-size: smaller;
|
|
font-style: italic;
|
|
padding-left: 1em;
|
|
color: rgb(100,100,100);
|
|
}
|
|
.skill_stat::before {
|
|
content: '{';
|
|
}
|
|
.skill_stat::after {
|
|
content: '}';
|
|
}
|
|
|
|
.skill, .skill_specialization, .skill_subskill {
|
|
display: grid;
|
|
|
|
grid-template-columns: 1fr 2em 3em 2em;
|
|
-webkit-column-break-inside: avoid;
|
|
break-inside: avoid;
|
|
}
|
|
|
|
.skill:nth-of-type(even) {
|
|
background: #eed;
|
|
}
|
|
|
|
.cmskill {
|
|
padding-left: 1em;
|
|
}
|
|
|
|
.cmskill:nth-child(even) {
|
|
background: #eed;
|
|
}
|
|
|
|
.cmspecialization {
|
|
padding-left: 1em;
|
|
}
|
|
|
|
.cmspecialization:nth-child(even) {
|
|
background: #dee;
|
|
}
|
|
|
|
|
|
.skill_specialization {
|
|
font-style: italic;
|
|
padding-left: 1em;
|
|
}
|
|
|
|
|
|
.repitem:nth-of-type(even) .skill_specialization {
|
|
background: #eed;
|
|
}
|
|
|
|
.skill_ranks {
|
|
text-align: right;
|
|
grid-column: 2 / 3;
|
|
}
|
|
.skill_bonus {
|
|
text-align: right;
|
|
grid-column: 3 / 3;
|
|
}
|
|
.skill_bonus_specialization {
|
|
font-style: italic !important;
|
|
color: rgb(124,136,123) !important;
|
|
}
|
|
|
|
.skill_roll {
|
|
text-align: right;
|
|
grid-column: 4 / 4;
|
|
}
|
|
|
|
.subskill_name {
|
|
padding-left: 3px;
|
|
font-family: cursive;
|
|
}
|
|
|
|
.skill_subskill {
|
|
padding-left: 2em;
|
|
}
|
|
|
|
|
|
/*
|
|
* Generic 2 column prop value
|
|
*/
|
|
.prop_pair {
|
|
display: grid;
|
|
grid-template-columns: repeat(2, minmax(0, 1fr));
|
|
}
|
|
|
|
.prop_prop {
|
|
font-family: 'PragRoman', 'myPragRoman', 'IM Fell DW Pica', 'Kaushan Script', 'Chalkduster', 'Trattatello', 'Luminari', fantasy, serif;
|
|
grid-column: 1;
|
|
}
|
|
|
|
.prop_prop_plain {
|
|
grid-column: 1;
|
|
}
|
|
|
|
.prop_value{
|
|
grid-column: 2;
|
|
}
|
|
|
|
|
|
|
|
/**
|
|
* Icon font things
|
|
*/
|
|
/* Info about the curernt item thing (eg the description of hot to derive the stat)*/
|
|
.icon {
|
|
display: inline-block;
|
|
position: relative;
|
|
color: rgba(100,100,100,0.8);
|
|
}
|
|
|
|
.iconwrap {
|
|
position: relative;
|
|
}
|
|
|
|
/**
|
|
* Popup for the stat info
|
|
*/
|
|
.stat_info {
|
|
visibility: hidden;
|
|
position: absolute;
|
|
z-index: 100;
|
|
font-family: 'Caveat', 'Shadows Into Light', 'Caveat', cursive;
|
|
font-variant-numeric: tabular-nums;
|
|
border: 3px solid rgb(20,21,22);
|
|
padding: 1ex;
|
|
white-space: pre;
|
|
width: fit-content;
|
|
border-radius: 255px 15px 225px 15px/15px 225px 15px 255px;
|
|
text-align: left;
|
|
|
|
background-size: 20px 20px;
|
|
background-image: linear-gradient(to right, rgba(137,207,240,1.0) 1px, transparent 1px),
|
|
linear-gradient(to bottom, rgba(137,207,240,1.0) 1px, white 1px);
|
|
}
|
|
|
|
/*Popup on the right */
|
|
.skill_info {
|
|
visibility: hidden;
|
|
position: absolute;
|
|
z-index: 100;
|
|
top: 2em;
|
|
font-family: 'Caveat', 'Shadows Into Light', 'Caveat', cursive;
|
|
font-variant-numeric: tabular-nums;
|
|
border: 3px solid rgb(20,21,22);
|
|
padding: 1ex;
|
|
white-space: pre;
|
|
width: fit-content;
|
|
border-radius: 255px 15px 225px 15px/15px 225px 15px 255px;
|
|
|
|
background-size: 20px 20px;
|
|
background-image: linear-gradient(to right, rgba(137,207,240,1.0) 1px, transparent 1px),
|
|
linear-gradient(to bottom, rgba(137,207,240,1.0) 1px, white 1px);
|
|
}
|
|
|
|
.icon:hover + .stat_info,
|
|
.icon:hover + .skill_info
|
|
{
|
|
visibility: visible;
|
|
}
|
|
|
|
/* Only show the edit specialisation when you hover over the line */
|
|
.edit_specialization {
|
|
line-height: inherit; /* override button */
|
|
visibility: hidden;
|
|
border: none; /* kill default */
|
|
}
|
|
|
|
.skill_specialization:hover .edit_specialization {
|
|
visibility: visible;
|
|
}
|
|
|
|
/**
|
|
* RRs
|
|
*/
|
|
.rr {
|
|
display: grid;
|
|
grid-template-columns: 2fr 3em;
|
|
}
|
|
|
|
.rr:nth-child(even) {
|
|
background: #eed; /* FIXME: same as the other skill one */
|
|
}
|
|
|
|
.rr .rr_name {
|
|
grid-column: 1 / 2;
|
|
}
|
|
|
|
.rr .rr_bonus {
|
|
text-align: right;
|
|
grid-column: 2 / 2;
|
|
}
|
|
|
|
/* FIXME: Same as realm stat, should use same class */
|
|
.rr .rr_stat {
|
|
font-size: smaller;
|
|
font-style: italic;
|
|
padding-left: 1em;
|
|
color: rgb(100,100,100);
|
|
}
|
|
.rr .rr_stat::before {
|
|
content: '{';
|
|
}
|
|
.rr .rr_stat::after {
|
|
content: '}';
|
|
}
|
|
|
|
.rr .rr_info {
|
|
visibility: hidden;
|
|
position: absolute;
|
|
}
|
|
|
|
.xp {
|
|
width: 8em !important;
|
|
}
|
|
|
|
|
|
div.attacks {
|
|
display: grid;
|
|
grid-template-columns: 1fr 3em 3em;
|
|
}
|
|
|
|
.repitem:nth-of-type(even) .attacks {
|
|
background: #eed;
|
|
}
|
|
|
|
|
|
div.foe {
|
|
display: grid;
|
|
grid-template-columns: 1fr 1fr 1fr 1fr;
|
|
background: linear-gradient(to right, #d3cce3, #e9e4f0);
|
|
border-radius: 3px;
|
|
border-style: solid;
|
|
border-width: 1px;
|
|
}
|
|
|
|
|
|
/**
|
|
* The big popup and overlay for dialogs
|
|
*/
|
|
.overlay {
|
|
/* FIXME: The charactermancer kills this */
|
|
display: none;
|
|
position: fixed;
|
|
top: 0;
|
|
left: 0;
|
|
right: 0;
|
|
bottom: 0;
|
|
background: rgba(0,0,20,0.7);
|
|
transition: opacity 100ms;
|
|
z-index:100;
|
|
}
|
|
|
|
.sheet-toggle[value="true"] ~ .overlay {
|
|
display: none;
|
|
}
|
|
|
|
.popup {
|
|
position: relative;
|
|
width: 70%;
|
|
min-width: 500px;
|
|
max-height: 80vh;
|
|
background: white;
|
|
margin: 70px auto;
|
|
border-radius: 5px;
|
|
border: solid 3px black;
|
|
overflow-y: scroll;
|
|
|
|
z-index:200;
|
|
}
|
|
|
|
.overlay-skillchange {
|
|
position: fixed;
|
|
top: 0;
|
|
left: 0;
|
|
right: 0;
|
|
bottom: 0;
|
|
background: rgba(20,0,20,0.7);
|
|
transition: opacity 100ms;
|
|
z-index:300;
|
|
}
|
|
|
|
.sheet-toggle-skillchange[value="false"] ~ .overlay-skillchange {
|
|
display: none;
|
|
}
|
|
|
|
.skillchange {
|
|
position: relative;
|
|
width: 70%;
|
|
min-width: 500px;
|
|
background: white;
|
|
margin: 70px auto;
|
|
border-radius: 5px;
|
|
border: solid 3px black;
|
|
|
|
z-index:400;
|
|
}
|
|
|
|
|
|
.overlay-editbox {
|
|
position: fixed;
|
|
top: 0;
|
|
left: 0;
|
|
right: 0;
|
|
bottom: 0;
|
|
background: rgba(20,0,20,0.7);
|
|
transition: opacity 100ms;
|
|
z-index:300;
|
|
}
|
|
|
|
.toggle-editbox[value="false"] ~ .overlay-editbox {
|
|
display: none;
|
|
}
|
|
|
|
.editbox {
|
|
position: relative;
|
|
width: 70%;
|
|
min-width: 500px;
|
|
background: white;
|
|
margin: 70px auto;
|
|
border-radius: 5px;
|
|
border: solid 3px black;
|
|
|
|
z-index:400;
|
|
}
|
|
|
|
/* Title of the edit box toggle to edit */
|
|
.editbox .doedit, .editbox .noedit {
|
|
display: none;
|
|
}
|
|
|
|
.edit-name-toggle[value="true"] ~ .doedit {
|
|
display: inline;
|
|
}
|
|
.edit-name-toggle[value="false"] ~ .noedit {
|
|
display: inline;
|
|
}
|
|
|
|
|
|
/* Tabs for Our creation */
|
|
/** Source: https://codepen.io/markcaron/pen/MvGRYV */
|
|
.tabset > input[type='radio'] {
|
|
position: absolute;
|
|
left: -200vw;
|
|
}
|
|
|
|
.tabset .tab-panel {
|
|
display: none;
|
|
}
|
|
|
|
.tabset > input:first-child:checked ~ .tab-panels > .tab-panel:first-child,
|
|
.tabset > input:nth-child(3):checked ~ .tab-panels > .tab-panel:nth-child(2),
|
|
.tabset > input:nth-child(5):checked ~ .tab-panels > .tab-panel:nth-child(3),
|
|
.tabset > input:nth-child(7):checked ~ .tab-panels > .tab-panel:nth-child(4),
|
|
.tabset > input:nth-child(9):checked ~ .tab-panels > .tab-panel:nth-child(5),
|
|
.tabset > input:nth-child(11):checked ~ .tab-panels > .tab-panel:nth-child(6) {
|
|
display: block;
|
|
}
|
|
|
|
/*
|
|
Styling
|
|
*/
|
|
|
|
.tabset > label {
|
|
position: relative;
|
|
display: inline-block;
|
|
padding: 15px 15px 25px;
|
|
border: 1px solid transparent;
|
|
border-bottom: 0;
|
|
cursor: pointer;
|
|
font-weight: 600;
|
|
width: 5em;
|
|
font-family: 'PragRoman', 'myPragRoman', 'IM Fell DW Pica', 'Kaushan Script', 'Chalkduster', 'Trattatello', 'Luminari', fantasy, serif;
|
|
}
|
|
|
|
.tabset > label::after {
|
|
content: "";
|
|
position: absolute;
|
|
left: 15px;
|
|
bottom: 10px;
|
|
width: 22px;
|
|
height: 4px;
|
|
background: #8d8d8d;
|
|
}
|
|
|
|
.tabset > label:hover,
|
|
.tabset > input:focus + label {
|
|
color: #06c;
|
|
}
|
|
|
|
.tabset > label:hover::after,
|
|
.tabset > input:focus + label::after,
|
|
.tabset > input:checked + label::after {
|
|
background: #06c;
|
|
}
|
|
|
|
.tabset > input:checked + label {
|
|
border-color: #ccc;
|
|
border-bottom: 1px solid #fff;
|
|
margin-bottom: -1px;
|
|
}
|
|
|
|
.tab-panel {
|
|
padding: 30px 0;
|
|
border-top: 1px solid #ccc;
|
|
}
|
|
|
|
/* The profession select tab */
|
|
.realm_select_enable[value='true'] ~ span.attr_realm {
|
|
display: none;
|
|
border: solid 1px red;
|
|
}
|
|
|
|
.realm_select_enable[value='false'] ~ select {
|
|
display: none;
|
|
border: solid 1px red;
|
|
}
|
|
|
|
label.plainlabel {
|
|
font-size: 1em;
|
|
font-weight: normal;
|
|
display: inline;
|
|
}
|
|
|
|
.sheet-hilite {
|
|
border: solid 1px red;
|
|
}
|
|
|
|
/* Hide repeating on most places; then turn it specidically below */
|
|
div.repcontrol {
|
|
display: none;
|
|
}
|
|
|
|
.favorite_group div.repcontrol {
|
|
display: block;
|
|
}
|
|
|
|
.editbox div.repcontrol {
|
|
display: block;
|
|
}
|
|
|
|
.small_number {
|
|
width: 4em;
|
|
}
|
|
|
|
.edit_spell_toggle[value='on'] ~ div.repcontrol {
|
|
display: block;
|
|
}
|
|
|
|
|
|
/* Should style selects at some point */
|
|
.fancyselect {
|
|
width: 10em;
|
|
padding: 1px;
|
|
background: rgb(255,249,71);
|
|
background: linear-gradient(145deg, rgba(253,255,205,1) 0%, rgba(247,247,39,1) 100%);
|
|
border-radius: 15px 225px 255px 15px 15px 255px 225px 15px;
|
|
border-style: solid;
|
|
border-width: 2px;
|
|
box-shadow: 4px 4px 2px 1px rgba(0,0,0,0.4);
|
|
box-sizing: border-box;
|
|
}
|
|
|
|
/*
|
|
Charactermancer stuff
|
|
*/
|
|
.cm_small_number {
|
|
width: 3em;
|
|
}
|
|
|
|
.smallselect {
|
|
width: 10em;
|
|
}
|
|
|
|
.cm_info {
|
|
border: 3px solid rgb(20,21,22);
|
|
border-radius: 255px 15px 225px 15px/15px 225px 15px 255px;
|
|
}
|
|
|
|
|
|
/*
|
|
* Levelup DP box. Starts in the usual spot but sticks to the top so we can see costs all
|
|
* the time.
|
|
*/
|
|
.sticktop {
|
|
position: sticky;
|
|
position: -webkit-sticky;
|
|
top: 0;
|
|
background: white;/* FIXME: should be styled based on color */
|
|
}
|
|
|
|
|
|
button.nodie::before {
|
|
content: "" !important;
|
|
}
|
|
button.nodie {
|
|
font-size: 1em !important;
|
|
padding: 0 !important;
|
|
}
|
|
|
|
/* Stylesheet for roll boxes */
|
|
.sheet-rolltemplate-rmurollbox {
|
|
padding: 1rem;
|
|
width: 95%;
|
|
box-shadow: 0 5px 20px 0 rgba(0,0,0,0.25), 0 5px 10px 0 rgba(0,0,0,0.17);
|
|
background-image: linear-gradient(to right bottom, rgba(241,242,11,1) 20%, rgba(248,161,27,1) 80%);
|
|
border-radius: 0.5rem;
|
|
line-height: 1.5em;
|
|
|
|
border-left: 0 solid #fca80f;
|
|
transition: border-left 300ms ease-in-out, padding-left 300ms ease-in-out;
|
|
}
|
|
|
|
.sheet-rolltemplate-darkmode .sheet-rolltemplate-rmurollbox {
|
|
background-image: linear-gradient(to right bottom, #8e2de2, #4a00e0);
|
|
box-shadow: 0 2px 5px 0 rgba(241,242,11,0.5), 0 4px 6px 0 rgba(248,161,27,0.17);
|
|
}
|
|
|
|
.sheet-rolltemplate-rmucritical {
|
|
padding: 1rem;
|
|
width: 95%;
|
|
box-shadow: 0 5px 20px 0 rgba(0,0,0,0.25), 0 5px 10px 0 rgba(0,0,0,0.17);
|
|
background-color: #ADF4F5;
|
|
border-radius: 0.5rem;
|
|
line-height: 1.5em;
|
|
border-left: 0 solid #F5ADC4;
|
|
transition: border-left 300ms ease-in-out, padding-left 300ms ease-in-out;
|
|
}
|
|
|
|
|
|
.sheet-rolltemplate-darkmode.sheet-rolltemplate-rmucritical {
|
|
background-image: linear-gradient(to right bottom, #000000, #923cb5);
|
|
box-shadow: 0 2px 5px 0 rgba(241,242,11,0.5), 0 4px 6px 0 rgba(248,161,27,0.17);
|
|
}
|
|
|
|
.sheet-rolltemplate-rmucritical:hover {
|
|
box-shadow: 0 4px 7px 0 rgba(241,242,11,0.8), 0 6px 8px 0 rgba(248,161,27,0.5);
|
|
}
|
|
|
|
|
|
|
|
/* Stylesheet for roll boxes */
|
|
.sheet-rolltemplate-rmuinitbox {
|
|
background-color: rgb(216, 255, 131);
|
|
}
|
|
|
|
.sheet-rolltemplate-rmurollbox:hover {
|
|
padding-left: 0.5rem;
|
|
border-left: 0.5rem solid #fca80f;
|
|
box-shadow: 0 10px 25px 0 rgba(0,0,0,0.7), 0 10px 20px 0 rgba(0,0,0,0.8);
|
|
}
|
|
.sheet-rolltemplate-darkmode .sheet-rolltemplate-rmurollbox:hover {
|
|
box-shadow: 0 3px 7px 0 rgba(241,242,11,0.8), 0 6px 8px 0 rgba(248,161,27,0.6);
|
|
}
|
|
|
|
.sheet-rolltemplate-rmurollbox > :first-child {
|
|
margin-top: 0;
|
|
}
|
|
|
|
.sheet-rolltemplate-rmurollbox > :last-child {
|
|
margin-bottom: 0;
|
|
}
|
|
|
|
.sheet-rolltemplate.rmurollbox > span {
|
|
border-radius: 3px !important;
|
|
}
|
|
|
|
.rollbutton.jq {
|
|
border: 1px solid red;
|
|
}
|
|
|
|
|
|
.sheet-rolltemplate-rmurollbox .inlinerollresult,
|
|
.sheet-rolltemplate-rmuattacktarget .inlinerollresult,
|
|
.sheet-rolltemplate-noboxes .inlinerollresult
|
|
{
|
|
background-color: transparent !important;
|
|
border: none !important;
|
|
padding: 0;
|
|
font-weight: inherit;
|
|
cursor: help;
|
|
font-size: 1em;
|
|
}
|
|
|
|
/* Stylesheet for roll boxes */
|
|
.sheet-rolltemplate-rmumsg {
|
|
padding: 1rem;
|
|
width: 95%;
|
|
}
|
|
|
|
|
|
|
|
.repitem:nth-of-type(even) .specificinjury {
|
|
background: #eed;
|
|
}
|
|
|
|
|
|
/* So hide the next element if this is 0 */
|
|
.hidenext[value='0'] + * {
|
|
display: none;
|
|
}
|
|
.hidenext:not([value]) + * {
|
|
display: none;
|
|
}
|
|
|
|
/* Small attributes: two columns of two items */
|
|
.smallattrs {
|
|
display: grid;
|
|
grid-template-columns: repeat(4, minmax(0, 1fr));
|
|
}
|
|
|
|
|
|
/**/
|
|
|
|
.actionblock {
|
|
display: grid;
|
|
grid-template-columns: 1fr 1fr 1fr 1fr;
|
|
}
|
|
|
|
|
|
.aptrackerbox {
|
|
display: flex;
|
|
margin: 1px;
|
|
gap: 2px;
|
|
}
|
|
|
|
.aptrack {
|
|
order: 1;
|
|
border: 1px solid black;
|
|
border-radius: 6px !important;
|
|
background: grey;
|
|
height: 12px !important;
|
|
width: 12px !important;
|
|
appearance: none;
|
|
-webkit-appearance: none;
|
|
cursor: pointer;
|
|
z-index: 1;
|
|
}
|
|
|
|
.aptrack:checked {
|
|
opacity: 0;
|
|
z-index: 0;
|
|
position: absolute;
|
|
}
|
|
|
|
.aptrack:checked ~ .aptrack {
|
|
order: 3;
|
|
background-color: transparent;
|
|
}
|
|
|
|
.aptrack.reset {
|
|
order: 2;
|
|
background-color: black;
|
|
}
|
|
|
|
/* vim: set sts=2 sw=2 syn=css : */
|
|
|
|
|
|
.attackadd {
|
|
display:none;
|
|
}
|
|
|
|
.attackaddshow[value='on'] ~ .attackadd {
|
|
display: block;
|
|
}
|
|
|
|
.attackaddcontent {
|
|
display: grid;
|
|
grid-template-columns: 1fr 1fr;
|
|
}
|
|
|
|
/* vim: set sts=2 sw=2 syn=css : */
|
|
|
|
|
|
/* A normal inventory item */
|
|
.inventory {
|
|
display: grid;
|
|
/*grid-template-columns: 5em 1fr 2em 2em;*/
|
|
/* 10em unitl I get icons */
|
|
grid-template-columns: 5em 1fr 10em 10em 12em;
|
|
}
|
|
|
|
.inventorytitle {
|
|
font-weight: bold;
|
|
}
|
|
|
|
.inventoryadd {
|
|
border: red 1px solid;
|
|
display:none;
|
|
}
|
|
|
|
.inventoryaddshow[value='on'] ~ .inventoryadd {
|
|
display: block;
|
|
}
|
|
|
|
.inventoryaddcontent {
|
|
padding: 1em;
|
|
display: grid;
|
|
grid-template-columns: 1fr 1fr;
|
|
}
|
|
|
|
/* */
|
|
.inventoryarmorshow[value='on'] ~ .inventoryarmortoggle {
|
|
display: block;
|
|
}
|
|
.inventoryarmortoggle {
|
|
display: none;
|
|
}
|
|
|
|
.inventoryshieldshow[value='on'] ~ .inventoryshieldtoggle {
|
|
display: block;
|
|
}
|
|
.inventoryshieldtoggle {
|
|
display: none;
|
|
}
|
|
|
|
.inventoryweaponshow[value='on'] ~ .inventoryweapontoggle {
|
|
display: block;
|
|
}
|
|
.inventoryweapontoggle {
|
|
display: none;
|
|
}
|
|
|
|
/* all repcontrol items hidden by default */
|
|
|
|
|
|
|
|
|
|
/* Spells:
|
|
Spells have the list name, Followed by Ranks, SCR then Mastery
|
|
On a new line, we have the spells.
|
|
*/
|
|
.spellgroup {
|
|
display: block;
|
|
width: 100%;
|
|
/* Name, Ranks, SCR, Mastery */
|
|
}
|
|
|
|
/* The row with the title of the group 'Base' or 'Closed' */
|
|
.spellgroupheading {
|
|
background: #cce;
|
|
|
|
grid-template-columns: 1fr 4em 5em 8em 2em;
|
|
display: grid;
|
|
border-bottom: 2px;
|
|
margin-bottom: 2px;
|
|
box-shadow: 0 2px 2px 0 rgba(0,0,0,0.3);
|
|
}
|
|
|
|
.spellname {
|
|
grid-column: 1 / 1;
|
|
}
|
|
.spellranks {
|
|
grid-column: 2 / 2;
|
|
}
|
|
.spellscr {
|
|
grid-column: 3 / 3;
|
|
}
|
|
.spellmastery {
|
|
grid-column: 4 / 4;
|
|
}
|
|
.knownspells {
|
|
grid-column: 1 / 4;
|
|
font-size: smaller;
|
|
margin-left: 2em;
|
|
}
|
|
|
|
|
|
.repitem:nth-of-type(even) .spelllist {
|
|
background: #eed;
|
|
}
|
|
|
|
.spellinfo {
|
|
grid-template-columns: 1fr 4em 5em 10em;
|
|
display: grid;
|
|
}
|
|
|
|
.spelllisttype {
|
|
font-family: 'PragRoman', 'myPragRoman', 'IM Fell DW Pica', 'Kaushan Script', 'Chalkduster', 'Trattatello', 'Luminari', fantasy, serif;
|
|
}
|
|
|
|
|
|
.castspell {
|
|
background: transparent;
|
|
border: none;
|
|
}
|
|
|
|
.castspell:hover {
|
|
font-style: italic;
|
|
}
|
|
/* vim: set sts=4 sw=4 syn=css : */
|
|
|
|
|
|
|
|
|
|
|
|
.cmtalent {
|
|
background-color: #ACC3F5;
|
|
margin: 1em;
|
|
box-shadow: 0 4px 12px 0 rgba(0,0,0,0.4);
|
|
padding: 3px;
|
|
}
|
|
|
|
|
|
.choice-showing.talent_inline {
|
|
display: inline !important;
|
|
}
|
|
|
|
|
|
.talent:nth-of-type(even) .cmtalent {
|
|
background-color: #ADF4F5;
|
|
}
|
|
|
|
@media (prefers-color-scheme: dark) {
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
/* The talents on the main page */
|
|
.talent_name {
|
|
font-weight: bold;
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.creaturetitle {
|
|
font-family: 'PragRoman', 'IM Fell DW Pica', fantasy, serif;
|
|
}
|
|
|
|
.creatureheading {
|
|
font-family: 'PragRoman', 'IM Fell DW Pica', fantasy, serif;
|
|
grid-column:1 / -1;
|
|
text-align: center;
|
|
font-size: larger;
|
|
}
|
|
|
|
|
|
.creaturestats {
|
|
width: 8em;
|
|
display: grid;
|
|
grid-template-columns: 1fr 1fr;
|
|
float: left;
|
|
|
|
padding: 0.5em; border: 1px solid rgb(22,11,12); border-radius: 0.3em; margin: 1em; box-shadow: 0 5px 20px 0 rgba(0,0,0,0.25), 0 5px 10px 0 rgba(0,0,0,0.17);;
|
|
|
|
background-image: radial-gradient(circle farthest-side, #fceabb, #f8b500);
|
|
}
|
|
|
|
.creaturedefenses {
|
|
display: grid;
|
|
grid-template-columns: repeat(2, 1fr);
|
|
|
|
padding: 0.5em; border: 1px solid rgb(22,11,12); border-radius: 0.3em; margin: 1em; box-shadow: 0 5px 20px 0 rgba(0,0,0,0.25), 0 5px 10px 0 rgba(0,0,0,0.17);;
|
|
background-image: linear-gradient(to right, #ffefba, #ffffff);
|
|
}
|
|
|
|
.creaturerrs {
|
|
display: grid;
|
|
grid-template-columns: repeat(2, 1fr);
|
|
|
|
padding: 0.5em; border: 1px solid rgb(22,11,12); border-radius: 0.3em; margin: 1em; box-shadow: 0 5px 20px 0 rgba(0,0,0,0.25), 0 5px 10px 0 rgba(0,0,0,0.17);;
|
|
background-image: linear-gradient(to right, #8e9eab, #eef2f3);
|
|
}
|
|
|
|
.creatureattacks {
|
|
padding: 0.5em; border: 1px solid rgb(22,11,12); border-radius: 0.3em; margin: 1em; box-shadow: 0 5px 20px 0 rgba(0,0,0,0.25), 0 5px 10px 0 rgba(0,0,0,0.17);;
|
|
background-image: linear-gradient(to right, rgb(242, 112, 156), rgb(255, 148, 114));
|
|
}
|
|
|
|
.creatureactions {
|
|
padding: 0.5em; border: 1px solid rgb(22,11,12); border-radius: 0.3em; margin: 1em; box-shadow: 0 5px 20px 0 rgba(0,0,0,0.25), 0 5px 10px 0 rgba(0,0,0,0.17);;
|
|
background-image: linear-gradient(25deg,#d64c7f,#ee4758 50%);
|
|
}
|
|
|
|
.creaturestatus {
|
|
padding: 0.5em; border: 1px solid rgb(22,11,12); border-radius: 0.3em; margin: 1em; box-shadow: 0 5px 20px 0 rgba(0,0,0,0.25), 0 5px 10px 0 rgba(0,0,0,0.17);;
|
|
background-image: linear-gradient(to right, #4776e6, #8e54e9);
|
|
}
|
|
|
|
.creaturemove {
|
|
padding: 0.5em; border: 1px solid rgb(22,11,12); border-radius: 0.3em; margin: 1em; box-shadow: 0 5px 20px 0 rgba(0,0,0,0.25), 0 5px 10px 0 rgba(0,0,0,0.17);;
|
|
background-image: linear-gradient(to right, #ff512f, #f09819);
|
|
}
|
|
|
|
.creatureskills {
|
|
padding: 0.5em; border: 1px solid rgb(22,11,12); border-radius: 0.3em; margin: 1em; box-shadow: 0 5px 20px 0 rgba(0,0,0,0.25), 0 5px 10px 0 rgba(0,0,0,0.17);;
|
|
background-image: linear-gradient(to right, #ff9966, #ff5e62);
|
|
}
|
|
|
|
.creaturehacks {
|
|
padding: 0.5em; border: 1px solid rgb(22,11,12); border-radius: 0.3em; margin: 1em; box-shadow: 0 5px 20px 0 rgba(0,0,0,0.25), 0 5px 10px 0 rgba(0,0,0,0.17);;
|
|
background-image: linear-gradient(to right, #abbaab, #ffffff);
|
|
}
|
|
|
|
|
|
.creaturespells {
|
|
padding: 0.5em; border: 1px solid rgb(22,11,12); border-radius: 0.3em; margin: 1em; box-shadow: 0 5px 20px 0 rgba(0,0,0,0.25), 0 5px 10px 0 rgba(0,0,0,0.17);;
|
|
background-image: linear-gradient(to right, #FFD194, #D1913C);
|
|
grid-column: span 3;
|
|
}
|
|
|
|
.creaturenotes {
|
|
padding: 0.5em; border: 1px solid rgb(22,11,12); border-radius: 0.3em; margin: 1em; box-shadow: 0 5px 20px 0 rgba(0,0,0,0.25), 0 5px 10px 0 rgba(0,0,0,0.17);;
|
|
background-image: linear-gradient(to right, #9796f0, #fbc7d4);
|
|
grid-column: span 3;
|
|
}
|
|
|
|
|
|
|
|
.creaturebg {
|
|
|
|
}
|
|
|
|
.creature-multicolumn {
|
|
column-count: auto;
|
|
column-width: 18em;
|
|
column-gap: 1em;
|
|
}
|
|
|
|
.creature-multicolumn div {
|
|
break-inside: avoid;
|
|
|
|
}
|
|
|
|
/* vim: set sts=4 sw=4 syn=css : */
|
|
|
|
/* https://cssloaders.github.io */
|
|
|
|
.loader{
|
|
width: 100px;
|
|
height: 75px;
|
|
margin: 0 auto;
|
|
background: #fff;
|
|
position: relative;
|
|
border-radius: 100%;
|
|
}
|
|
.loader:before {
|
|
content: '';
|
|
position: absolute;
|
|
box-sizing: border-box;
|
|
border: 15px solid transparent;
|
|
border-top: 25px solid #fff;
|
|
transform: rotate(45deg);
|
|
top: 50px;
|
|
left: -15px;
|
|
}
|
|
@keyframes flash {
|
|
0% {
|
|
background-color: rgba(255, 255, 200, 0.25);
|
|
box-shadow: 20px 0 rgba(255, 60, 0, 0.25), -20px 0 #FF3D00;
|
|
}
|
|
50% {
|
|
background-color: #FF3D00;
|
|
box-shadow: 20px 0 rgba(255, 60, 0, 0.25), -20px 0 rgba(255, 255, 200, 0.25);
|
|
}
|
|
100% {
|
|
background-color: rgba(255, 60, 0, 0.25);
|
|
box-shadow: 20px 0 #FF3D00, -20px 0 rgba(255, 60, 0, 0.25);
|
|
}
|
|
}
|
|
|
|
|
|
|
|
/* vim: set sts=4 sw=4 syn=css : */
|
|
|