Wes
0ed82d7fd8
* Updating URLs adding Image Alien the Roleplaying Game • Changed the URLs of (Eight) images to be hosted from the Roll20 Repository on Github. Added (One) additional Image to the Images Folder. • Fixed a issue with the roll formula in the Panic Roll Button. * Small Update to Zweihander HTML and Template.json Small Update to give 2 attriburtes default values of zero so that a roll button will roll if those attributes do not change. Updated the roll template so that the dynamic i18n inputs and coded output were not showing double outputs in the roll template. * Tiny D6 Games Initial Commit • Adding HTML, CSS, Translation.json, sheet.json, Images Folder to the Roll20 Repository. * Rename TIny-D6-Games.css to Tiny-D6-Games.css Typos will be the death of me... * Rename TIny-D6-Games.html to Tiny-D6-Games.html Once again typos will be the death of me...
536 lines
12 KiB
CSS
536 lines
12 KiB
CSS
/* - - - - - - - - - - GRID STYLING - - - - - - - - - - */
|
|
.sheet-background-wrap {
|
|
background-color: #f5f5f5;
|
|
display: block;
|
|
min-width: 850px;
|
|
}
|
|
|
|
.sheet-grid-container {
|
|
display: grid;
|
|
grid-gap: 2px;
|
|
background-color: transparent;
|
|
padding: 2px;
|
|
border: 1px Dotted #f2f2f2;
|
|
}
|
|
|
|
.sheet-contains-two-columns {
|
|
grid-template-columns: 50% auto;
|
|
}
|
|
|
|
.sheet-contains-three-columns {
|
|
grid-template-columns: 33% 33% auto;
|
|
}
|
|
|
|
.sheet-contains-four-columns {
|
|
grid-template-columns: 25% 25% 25% auto;
|
|
}
|
|
|
|
.sheet-contains-six-columns {
|
|
grid-template-columns: 16.5% 16.5% 16.5% 16.5% 16.5% 16.5%;
|
|
}
|
|
|
|
.sheet-contains-eight-columns {
|
|
grid-template-columns: 12% 12% 12% 12% 12% 12% 12% auto;
|
|
}
|
|
|
|
.sheet-grid-item {
|
|
background-color: transparent;
|
|
border: 1px solid transparent;
|
|
border-radius: 5px;
|
|
padding: 0px;
|
|
text-align: left;
|
|
}
|
|
|
|
.sheet-span-one-two {
|
|
grid-column: 1 / 3;
|
|
}
|
|
|
|
.sheet-span-two-three {
|
|
grid-column: 2 / 4;
|
|
}
|
|
|
|
.sheet-span-one-to-six {
|
|
grid-column: 1 / 7;
|
|
}
|
|
|
|
.sheet-title-banner {
|
|
width: 100%;
|
|
}
|
|
|
|
.sheet-section-banner {
|
|
background-color: #262626; /* Black ( 15% Light ) */
|
|
background-size: 100%;
|
|
height: 38px;
|
|
border: 1px solid #262626;
|
|
padding: 0px 0px 0px 5px;
|
|
}
|
|
|
|
/* - - - - - - - GENERAL STYLING - - - - - - - */
|
|
.sheet-white-header {
|
|
color: white;
|
|
font-size: 2em;
|
|
}
|
|
|
|
.sheet-input-label {
|
|
color: #666666;
|
|
}
|
|
|
|
input.sheet-input-text {
|
|
color: Black;
|
|
width: 100%;
|
|
background: transparent;
|
|
border: 1px solid transparent;
|
|
border-bottom: 1px solid #666666;
|
|
border-radius: none;
|
|
padding: 2px 0px 1px 0px;
|
|
}
|
|
|
|
input.sheet-input-shorter {
|
|
width: 60%;
|
|
}
|
|
|
|
input.sheet-input-length-alpha {
|
|
width: calc(100% - 100px);
|
|
}
|
|
|
|
input.sheet-input-length-beta {
|
|
width: calc(100% - 50px);
|
|
}
|
|
|
|
input.sheet-input-length-gamma {
|
|
width: calc(100% - 60px);
|
|
}
|
|
|
|
input.sheet-repeating-text {
|
|
border: 1px solid transparent;
|
|
font-weight: bold;
|
|
}
|
|
|
|
.sheet-center {
|
|
text-align: center;
|
|
}
|
|
|
|
/* - - - - - - - - - - NUMBER STYLING - - - - - - - - - - */
|
|
input[type="number"].sheet-numbered-circle::-webkit-outer-spin-button,
|
|
input[type="number"].sheet-numbered-circle::-webkit-inner-spin-button {
|
|
-webkit-appearance: none;
|
|
margin: 0;
|
|
}
|
|
|
|
input[type="number"].sheet-numbered-circle {
|
|
-moz-appearance: textfield;
|
|
}
|
|
|
|
input[type="number"].sheet-numbered-circle {
|
|
color: white;
|
|
font-size: 2em;
|
|
font-weight: normal;
|
|
height: 1.5em;
|
|
width: 1.5em;
|
|
background-color: transparent;
|
|
border: 1px solid transparent;
|
|
border-radius: 50%;
|
|
text-align: center;
|
|
margin-top: -5px;
|
|
margin-left: 0px;
|
|
}
|
|
|
|
input[type="number"].sheet-numbered-circle-push {
|
|
margin-left: 52%;
|
|
}
|
|
|
|
input[type="number"].sheet-numbered-circle-two {
|
|
color: black;
|
|
font-size: 1.25em;
|
|
font-weight: normal;
|
|
height: 1.5em;
|
|
width: 3em;
|
|
background-color: transparent;
|
|
border: 1px solid #666666;
|
|
border-radius: 15%;
|
|
margin-top: -3px;
|
|
}
|
|
|
|
/* - - - - - - - DISPLAYING SELECTED DIVS STYLING - - - - - - - */
|
|
|
|
.sheet-dungeons, .sheet-frontiers {
|
|
display: none;
|
|
}
|
|
|
|
.sheet-toggle-display[value="dungeons"] ~ div.sheet-dungeons,
|
|
.sheet-toggle-display[value="frontiers"] ~ div.sheet-frontiers {
|
|
display: grid;
|
|
}
|
|
|
|
/* - - - - - - - BUTTON STYLING - - - - - - - */
|
|
button[type="action"].sheet-action-choice {
|
|
width: auto;
|
|
height: 1em;
|
|
background-color: transparent;
|
|
border: 1px solid transparent;
|
|
border-radius: 5px;
|
|
font-size: 1em;
|
|
color: #c0c0c0; /* Silver */
|
|
margin: 9px 0px 0px 0px;
|
|
}
|
|
|
|
button[type="action"].sheet-action-choice:hover {
|
|
color: #4682b4; /* SteelBlue */
|
|
background-color: transparent;
|
|
border: 1px solid transparent;
|
|
}
|
|
|
|
button[type="action"].sheet-action-choice:active {
|
|
color: #4682b4; /* SteelBlue */
|
|
background-color: transparent;
|
|
border: 1px solid transparent;
|
|
}
|
|
|
|
button[type="action"].sheet-action-choice:focus {
|
|
color: #4682b4; /* SteelBlue */
|
|
background-color: transparent;
|
|
border: 1px solid transparent;
|
|
}
|
|
|
|
button[type="roll"].sheet-button-test:before {
|
|
content: ""!important;
|
|
display: none;
|
|
border: none;
|
|
background-image: none;
|
|
}
|
|
|
|
button[type="roll"].sheet-button-test {
|
|
color: #808080;
|
|
font-size: 14px;
|
|
height: 20px;
|
|
line-height: 20px;
|
|
width: 90%;
|
|
margin: 1px;
|
|
background-color: #cccccc;
|
|
border: solid 1px #808080;
|
|
border-radius: 5px;
|
|
background-image: none;
|
|
display: inline;
|
|
}
|
|
|
|
button[type="roll"].sheet-button-test:hover {
|
|
color: #f5f5f5;
|
|
background: #4682b4;
|
|
}
|
|
|
|
button[type="roll"].sheet-button-test:active {
|
|
box-shadow: 0px 0px 10px #4682b4;
|
|
}
|
|
|
|
/* REP ITEMS -> This sets the formatting for all repcontrol buttons. */
|
|
.repcontrol {
|
|
display: flex;
|
|
justify-content: flex-end;
|
|
}
|
|
|
|
.repcontrol_add,
|
|
.repcontrol_edit,
|
|
.repcontrol_del {
|
|
color: #696969;
|
|
background: transparent;
|
|
box-shadow: none;
|
|
height: 14px;
|
|
width: 28px;
|
|
font-size: 0.75em;
|
|
padding: 0 1px 3px 1px;
|
|
margin: 1px;
|
|
}
|
|
|
|
.repcontrol_move {
|
|
cursor: move;
|
|
float: right;
|
|
margin-right: 5px;
|
|
}
|
|
|
|
/* - - - - - - - - - - AUTO EXPAND TEXTAREAS - - - - - - - - - - */
|
|
.sheet-auto-expand {
|
|
position: relative;
|
|
cursor: text;
|
|
word-wrap: break-word;
|
|
min-height: 2em;
|
|
border-bottom: 1px Dashed #666666;
|
|
}
|
|
.sheet-auto-expand span {
|
|
visibility: hidden;
|
|
white-space: pre-wrap;
|
|
display: block;
|
|
}
|
|
.sheet-auto-expand textarea {
|
|
position: absolute;
|
|
z-index: 1;
|
|
top: 0;
|
|
left: 0;
|
|
margin: 0;
|
|
overflow: hidden;
|
|
resize: none;
|
|
height: 100%;
|
|
width: 100%;
|
|
display: block;
|
|
box-sizing: border-box;
|
|
background: transparent;
|
|
border: none;
|
|
border-radius: 0;
|
|
box-shadow: none;
|
|
color: inherit;
|
|
font: inherit;
|
|
letter-spacing: inherit;
|
|
padding: inherit;
|
|
text-align: inherit;
|
|
text-transform: inherit;
|
|
}
|
|
|
|
.sheet-no-borders {
|
|
border: none;
|
|
}
|
|
|
|
/* - - - - - - - - - - VARIOUS CHECKBOX STYLING - - - - - - - - - - */
|
|
input.sheet-inventory-box {
|
|
width: 95%;
|
|
height: 60px;
|
|
position: relative;
|
|
top: 0px;
|
|
left: 0px;
|
|
margin: 1px;
|
|
cursor: pointer;
|
|
z-index: 5;
|
|
opacity: 0;
|
|
}
|
|
|
|
input.sheet-inventory-box + span::before {
|
|
content: "Empty";
|
|
color: #cccccc;
|
|
border: solid 1px #f2f2f2;
|
|
border-radius: 10px;
|
|
text-align: center;
|
|
display: inline-block;
|
|
background: #f2f2f2;
|
|
width: 95%;
|
|
height: 60px;
|
|
font-size: 14px;
|
|
margin: 1px 1px 1px -100%;
|
|
padding: 0px 0px 0px 0px;
|
|
line-height: 60px;
|
|
}
|
|
|
|
input.sheet-inventory-box:checked + span::before {
|
|
content: attr(title);
|
|
color: #ffffff;
|
|
background: rgba(70, 130, 180, 0.4); /* SteelBlue 40% Opacity*/
|
|
border: solid 1px #ffffff;
|
|
}
|
|
|
|
input.sheet-modifier-box {
|
|
width: 14px;
|
|
height: 14px;
|
|
position: relative;
|
|
top: 0px;
|
|
left: 0px;
|
|
margin-left: 0px;
|
|
cursor: pointer;
|
|
z-index: 5;
|
|
opacity: 0;
|
|
}
|
|
|
|
input.sheet-modifier-box + span::before {
|
|
content: attr(title);
|
|
color: #dcdcdc;
|
|
border: solid 1px #c0c0c0; /* Silver */
|
|
text-align: center;
|
|
display: inline-block;
|
|
background: #f5f5f5;
|
|
width: 14px;
|
|
height: 14px;
|
|
font-size: 9px;
|
|
margin-left: -14px;
|
|
margin-right: 2px;
|
|
padding: 0px 0px 0px 0px;
|
|
line-height: 14px;
|
|
}
|
|
|
|
input.sheet-modifier-box:checked + span::before {
|
|
color: #ffffff;
|
|
background: #4682b4; /* SteelBlue */
|
|
border: solid 1px #4682b4; /* SteelBlue */
|
|
}
|
|
|
|
input.sheet-numbered-box {
|
|
margin-left: 4px;
|
|
}
|
|
|
|
input.sheet-numbered-box:checked + span::before {
|
|
color: #ffffff;
|
|
background: #cc0000; /* Red at 40% Lightness */
|
|
border: solid 1px #cc0000; /* Red at 40% Lightness */
|
|
}
|
|
|
|
/* ROLL TEMPLATE STYLING */
|
|
.sheet-rolltemplate-tinydungeon .sheet-template-wrap {
|
|
background-color: hsl(0, 0%, 22%);
|
|
border: 1px solid #404040;
|
|
border-radius: 5px;
|
|
width: 100%;
|
|
margin-left: -10px;
|
|
padding: 5px;
|
|
}
|
|
|
|
.sheet-rolltemplate-tinydungeon .sheet-template-background {
|
|
background: url(https://s3.amazonaws.com/files.d20.io/images/85636219/yzFf9PYr1_W1gUYhAiEAOA/max.png?1562292705);
|
|
background-repeat: no-repeat;
|
|
background-size: contain;
|
|
background-position: center center;
|
|
}
|
|
|
|
.sheet-rolltemplate-tinydungeon .sheet-template-grid {
|
|
display: grid;
|
|
grid-gap: 3px;
|
|
background-color: transparent;
|
|
padding: 3px;
|
|
grid-template-columns: 31.5% 31.5% 31.5%;
|
|
}
|
|
|
|
.sheet-rolltemplate-tinydungeon .sheet-template-grid-item {
|
|
background-color: rgba(259, 259, 259, 0.05);
|
|
color: #ffffff;
|
|
border: none;
|
|
border-radius: 5px;
|
|
padding: 3px;
|
|
text-align: center;
|
|
}
|
|
|
|
.sheet-rolltemplate-tinydungeon .sheet-template-span-all-three {
|
|
grid-column: 1 / 4;
|
|
}
|
|
|
|
.sheet-rolltemplate-tinydungeon .sheet-template-span-left {
|
|
grid-column: 1 / 2;
|
|
}
|
|
|
|
.sheet-rolltemplate-tinydungeon .sheet-template-span-center {
|
|
grid-column: 2 / 3;
|
|
}
|
|
|
|
.sheet-rolltemplate-tinydungeon .sheet-template-span-right {
|
|
grid-column: 3 / 4;
|
|
}
|
|
|
|
.sheet-rolltemplate-tinydungeon .sheet-template-span-one {
|
|
grid-column: 1 / 2;
|
|
}
|
|
|
|
.sheet-rolltemplate-tinydungeon .sheet-template-span-two {
|
|
grid-column: 2 / 3;
|
|
}
|
|
|
|
.sheet-rolltemplate-tinydungeon .sheet-template-span-three {
|
|
grid-column: 3 / 4;
|
|
}
|
|
|
|
.sheet-rolltemplate-tinydungeon .sheet-template-span-center-right {
|
|
grid-column: 2 / 4;
|
|
}
|
|
|
|
.sheet-rolltemplate-tinydungeon .sheet-template-span-five {
|
|
grid-column: 5 / 6;
|
|
}
|
|
|
|
.sheet-rolltemplate-tinydungeon .sheet-template-span-shix {
|
|
grid-column: 6 / 7;
|
|
}
|
|
|
|
.sheet-rolltemplate-tinydungeon .sheet-template-to-the-left {
|
|
text-align: left;
|
|
}
|
|
|
|
.sheet-rolltemplate-tinydungeon .inlinerollresult {
|
|
font-size: 1.1em;
|
|
background-color: transparent;
|
|
border: none;
|
|
padding: 0px;
|
|
}
|
|
|
|
.sheet-rolltemplate-tinydungeon .inlinerollresult.fullcrit {
|
|
color: #ffffff;
|
|
border: none;
|
|
}
|
|
|
|
.sheet-rolltemplate-tinydungeon .inlinerollresult.fullfail {
|
|
color: #ffffff;
|
|
border: none;
|
|
}
|
|
|
|
.sheet-rolltemplate-tinydungeon .inlinerollresult.importantroll {
|
|
color: #ffffff;
|
|
border: none;
|
|
}
|
|
|
|
.sheet-rolltemplate-tinydungeon .sheet-template-six-success {
|
|
height: 60px;
|
|
width: 60px;
|
|
background-image: url(https://s3.amazonaws.com/files.d20.io/images/124928745/OieM9EeH4U28PNcjh1Iy1w/max.png?1587325384);
|
|
background-size: 100% 100%;
|
|
background-position: center;
|
|
}
|
|
|
|
.sheet-rolltemplate-tinydungeon .sheet-template-five-success {
|
|
height: 60px;
|
|
width: 60px;
|
|
background-image: url(https://s3.amazonaws.com/files.d20.io/images/124930570/wAEmzj3375gVxHE6cAdzjg/max.png?1587325555);
|
|
background-size: 100% 100%;
|
|
background-position: center;
|
|
}
|
|
|
|
.sheet-rolltemplate-tinydungeon .sheet-template-four-success {
|
|
height: 60px;
|
|
width: 60px;
|
|
background-image: url(https://s3.amazonaws.com/files.d20.io/images/124930854/cEb5gFXusXSkMH3BPakqrg/max.png?1587325578);
|
|
background-size: 100% 100%;
|
|
background-position: center;
|
|
}
|
|
|
|
.sheet-rolltemplate-tinydungeon .sheet-template-four-solo {
|
|
height: 60px;
|
|
width: 60px;
|
|
background-image: url(https://s3.amazonaws.com/files.d20.io/images/124931365/H9B1zsfyVbEac5_d2pnEGw/max.png?1587325629);
|
|
background-size: 100% 100%;
|
|
background-position: center;
|
|
}
|
|
|
|
.sheet-rolltemplate-tinydungeon .sheet-template-three-success {
|
|
height: 60px;
|
|
width: 60px;
|
|
background-image: url(https://s3.amazonaws.com/files.d20.io/images/124931148/Wyf-QnQ68PNAVBN-1YWs7w/max.png?1587325601);
|
|
background-size: 100% 100%;
|
|
background-position: center;
|
|
}
|
|
|
|
.sheet-rolltemplate-tinydungeon .sheet-template-three-solo {
|
|
height: 60px;
|
|
width: 60px;
|
|
background-image: url(https://s3.amazonaws.com/files.d20.io/images/124931677/9WpHiiz06xGt_Is7wkswnw/max.png?1587325661
|
|
);
|
|
background-size: 100% 100%;
|
|
background-position: center;
|
|
}
|
|
|
|
.sheet-rolltemplate-tinydungeon .sheet-template-two-solo {
|
|
height: 60px;
|
|
width: 60px;
|
|
background-image: url(https://s3.amazonaws.com/files.d20.io/images/124931978/31bjtbdS9DrHuN8K6kfciw/max.png?1587325695
|
|
);
|
|
background-size: 100% 100%;
|
|
background-position: center;
|
|
}
|
|
|
|
.sheet-rolltemplate-tinydungeon .sheet-template-one-solo {
|
|
height: 60px;
|
|
width: 60px;
|
|
background-image: url(https://s3.amazonaws.com/files.d20.io/images/124932194/QlivmrvCOWQAmAD8JqVN0g/max.png?1587325717);
|
|
background-size: 100% 100%;
|
|
background-position: center;
|
|
}
|