mirror of
https://github.com/Nighthawk42/roll20-character-sheets.git
synced 2026-08-30 19:52:29 +00:00
VHPaiva
1e42176bc4
- [Bugfix] Attack roll from homunculi sheet referenced a renamed attribute - [Added] Button for Iniciative roll, adding to tracker
794 lines
14 KiB
CSS
794 lines
14 KiB
CSS
/* Flexbox */
|
|
.flexrow,
|
|
.sheet-flexrow {
|
|
display: flex;
|
|
flex-direction: row;
|
|
flex-wrap: wrap;
|
|
justify-content: flex-start;
|
|
}
|
|
.flexrow.reverse {
|
|
flex-direction: row-reverse;
|
|
}
|
|
.flexcol,
|
|
.sheet-flexcol {
|
|
display: flex;
|
|
flex-direction: column;
|
|
flex-wrap: nowrap;
|
|
justify-content: flex-start;
|
|
}
|
|
.flexcol.reverse {
|
|
flex-direction: column-reverse;
|
|
}
|
|
.flexrow > *,
|
|
.flexcol > *,
|
|
.sheet-flexrow > *,
|
|
.sheet-flexcol > * {
|
|
flex: 1;
|
|
}
|
|
.flexcol.chflex0 > *,
|
|
.flexrow.chflex0 > * {
|
|
flex: 0;
|
|
}
|
|
|
|
.flexrow > .flex0,
|
|
.flexcol > .flex0 {
|
|
/* display: block; */
|
|
flex: 0;
|
|
}
|
|
.flexrow > .flex1,
|
|
.flexcol > .flex1 {
|
|
flex: 1;
|
|
}
|
|
.flexrow > .flex2,
|
|
.flexcol > .flex2 {
|
|
flex: 2;
|
|
}
|
|
.flexrow > .flex3,
|
|
.flexcol > .flex3 {
|
|
flex: 3;
|
|
}
|
|
|
|
.flexrow > .flex100,
|
|
.flexcol > .flex100 {
|
|
flex: 0 0 100%;
|
|
}
|
|
|
|
|
|
|
|
.no-wrap {
|
|
flex-wrap: nowrap;
|
|
}
|
|
|
|
.spaced {
|
|
justify-content: space-between;
|
|
}
|
|
.space-around {
|
|
justify-content: space-around;
|
|
}
|
|
|
|
.flexrow label {
|
|
max-width: 50%;
|
|
}
|
|
|
|
/* /Flexbox */
|
|
|
|
/* Inputs */
|
|
@media (min-width: 10px) {
|
|
textarea {
|
|
min-width: 90%;
|
|
max-width: 90%;
|
|
margin: 0 auto;
|
|
flex: none!important;
|
|
}
|
|
}
|
|
.gaia-sheet {
|
|
min-width: 840px;
|
|
background-color: white;
|
|
}
|
|
|
|
/* Inputs */
|
|
@media (min-width: 10px) {
|
|
.gaia-border {
|
|
position: relative;
|
|
/* border: 2px solid black; */
|
|
/* overflow: hidden; */
|
|
padding: 5px;
|
|
box-shadow: inset 0px 0px 0px 2px black;
|
|
align-content: center;
|
|
}
|
|
|
|
.section-left, .section-right {
|
|
min-width: 406;
|
|
}
|
|
|
|
.section-left .gaia-border, .section-right .gaia-border {
|
|
margin-bottom: 20px;
|
|
padding: 10px;
|
|
}
|
|
.gaia-border > * {
|
|
z-index: 2;
|
|
}
|
|
.gaia-border-corner-container {
|
|
position: absolute;
|
|
overflow: hidden;
|
|
width: 100%;
|
|
height: 100%;
|
|
top: 0;
|
|
left: 0;
|
|
z-index: 1;
|
|
}
|
|
.gaia-border-corner {
|
|
position: absolute;
|
|
background-color: white;
|
|
border: 2px solid black;
|
|
border-radius: 0px 0px 3px 0px;
|
|
border-radius: 3px;
|
|
width: 9px;
|
|
height: 9px;
|
|
}
|
|
.gaia-border-corner.topleft {
|
|
/* border-radius: 0px 0px 3px 0px; */
|
|
top: -2px;
|
|
left: -2px;
|
|
border-top: none;
|
|
border-left: none;
|
|
}
|
|
.gaia-border-corner.topright {
|
|
/* border-radius: 0px 0px 0px 3px; */
|
|
top: -2px;
|
|
right: -2px;
|
|
border-top: none;
|
|
border-right: none;
|
|
}
|
|
.gaia-border-corner.botleft {
|
|
/* border-radius: 0px 3px 0px 0px; */
|
|
bottom: -2px;
|
|
left: -2px;
|
|
border-bottom: none;
|
|
border-left: none;
|
|
}
|
|
.gaia-border-corner.botright {
|
|
/* border-radius: 3px 0px 0px 0px; */
|
|
bottom: -2px;
|
|
right: -2px;
|
|
border-bottom: none;
|
|
border-right: none;
|
|
}
|
|
.gaia-character-info .form-group {
|
|
max-width: fit-content;
|
|
}
|
|
.gaia-character-info .gaia-border input,
|
|
.gaia-character-info .gaia-border input:focus,
|
|
.gaia-character-info .gaia-border input:focus-visible {
|
|
width: 170px;
|
|
border: none;
|
|
outline: none;
|
|
z-index: 2;
|
|
position: relative;
|
|
margin: 0 10px;
|
|
}
|
|
.recurso:not(.exaustao) .gaia-border {
|
|
border-left: none;
|
|
}
|
|
.gaia-border input {
|
|
max-height: 26px;
|
|
}
|
|
}
|
|
/* SpellCircle */
|
|
@media (min-width: 10px) {
|
|
.outer-circle, .inner-circle,
|
|
.top-circle, .bot-circle, .right-circle, .left-circle,
|
|
.diamond {
|
|
border: 1px solid black;
|
|
position: absolute;
|
|
z-index: 5;
|
|
}
|
|
.outer-circle {
|
|
width: 65px;
|
|
height: 65px;
|
|
border-radius: 50px;
|
|
top: -20px;
|
|
}
|
|
.inner-circle {
|
|
width: 55px;
|
|
height: 55px;
|
|
border-radius: 50px;
|
|
top: -15px;
|
|
}
|
|
.diamond {
|
|
width: 48px;
|
|
height: 48px;
|
|
top: -11px;
|
|
transform: rotate(-45deg);
|
|
}
|
|
.top-circle, .bot-circle,
|
|
.right-circle, .left-circle {
|
|
border-radius: 50px;
|
|
width: 10px;
|
|
height: 10px;
|
|
}
|
|
.top-circle {
|
|
top: -26px;
|
|
}
|
|
.bot-circle {
|
|
bottom: -26px;
|
|
}
|
|
.right-circle {
|
|
right: -16px;
|
|
top: 7px;
|
|
}
|
|
.left-circle {
|
|
left: -16px;
|
|
top: 7px;
|
|
}
|
|
.recurso input {
|
|
z-index: 6;
|
|
}
|
|
.recurso span.placeholder {
|
|
z-index: 7;
|
|
}
|
|
}
|
|
/* HOMUNCULARIUM */
|
|
@media (min-width: 10px) {
|
|
.tab-1 {
|
|
display: block;
|
|
}
|
|
.tab-2 {
|
|
display: none;
|
|
}
|
|
nav.sheet-nav:has(input.homuncularium:checked ) ~ .tab-1 {
|
|
/* display: none;*/
|
|
}
|
|
nav.sheet-nav:has(input.homuncularium:checked ) ~ .tab-2 {
|
|
/* display: block;*/
|
|
}
|
|
|
|
.homuncularium {
|
|
display: none;
|
|
}
|
|
.gaia-sheet:has(input.homuncularium:checked ) .homuncularium {
|
|
display: flex;
|
|
}
|
|
.gaia-sheet:has(input.homuncularium:checked ) .legado {
|
|
display: none;
|
|
}
|
|
}
|
|
/* Tabs */
|
|
@media (min-width: 10px) {
|
|
nav.sheet-nav-1 {
|
|
max-height: 30px;
|
|
}
|
|
nav.sheet-nav-1 label {
|
|
margin: none;
|
|
padding: 5px;
|
|
text-align: center;
|
|
}
|
|
nav.sheet-nav-1 label input {
|
|
display: none;
|
|
}
|
|
|
|
nav.sheet-nav-1 label:has(input:checked) {
|
|
background-color: #392b3e;
|
|
color: white;
|
|
}
|
|
|
|
.secondary-tab {
|
|
display: none;
|
|
padding: 10px;
|
|
}
|
|
.secondary-tab h3 {
|
|
max-height: 25px;
|
|
}
|
|
|
|
nav.sheet-nav-1:has(input.notas:checked ) ~ .secondary-tab.notas,
|
|
nav.sheet-nav-1:has(input.inventario:checked ) ~ .secondary-tab.inventario,
|
|
nav.sheet-nav-1:has(input.equipamento:checked ) ~ .secondary-tab.equipamento,
|
|
nav.sheet-nav-1:has(input.habilidades:checked ) ~ .secondary-tab.habilidades {
|
|
display: flex;
|
|
}
|
|
}
|
|
/* /Tabs */
|
|
@media (min-width: 10px) {
|
|
.header-middle {
|
|
align-items: center;
|
|
}
|
|
.header-middle .gaia-dados-morte {
|
|
width: 100%;
|
|
}
|
|
|
|
.header-middle .gaia-dados-morte .gaia-radio {
|
|
flex: 0 0 16px;
|
|
}
|
|
.header-middle .gaia-dados-morte .separator {
|
|
flex: 0 0 20px;
|
|
height: 10px;
|
|
border-top: 1px solid black;
|
|
border-bottom: 1px solid black;
|
|
}
|
|
}
|
|
.movimentacao {
|
|
margin-right: 10px;
|
|
max-width: 140px;
|
|
}
|
|
label.title {
|
|
padding: 0;
|
|
width: 100%;
|
|
text-align: center;
|
|
max-width: 100%;
|
|
}
|
|
|
|
.input-placeholder {
|
|
position: relative;
|
|
display: flex;
|
|
justify-content: center;
|
|
min-height: 27px;
|
|
}
|
|
.hiddenattr .input-placeholder,
|
|
.ability .input-placeholder {
|
|
margin: 5px;
|
|
}
|
|
.ability input.item-name {
|
|
width: 140px;
|
|
}
|
|
.ability input.item-name2 {
|
|
max-width: 44%;
|
|
}
|
|
|
|
.input-placeholder span.placeholder {
|
|
position: absolute;
|
|
font-size: 14px;
|
|
text-align: center;
|
|
white-space: nowrap;
|
|
bottom: -65%;
|
|
left: 50%;
|
|
transform: scale(0.7) translate(-50%, -50%);
|
|
transform: translate(-50%, -50%) scale(0.7);
|
|
background-color: whitesmoke;
|
|
}
|
|
|
|
.exaustao, .recurso {
|
|
height: 70px;
|
|
flex: 0 0 230px;
|
|
position: relative;
|
|
padding-top: 15px;
|
|
margin: 10px 0px 25px;
|
|
}
|
|
.exaustao {
|
|
text-align: center;
|
|
padding: 0;
|
|
}
|
|
.exaustao .recurso-nome {
|
|
font-weight: bold;
|
|
position: relative;
|
|
top: -5px;
|
|
}
|
|
.exaustao .flexrow {
|
|
width: 160px;
|
|
height: 30px;
|
|
margin: auto;
|
|
flex: 0;
|
|
}
|
|
.exaustao .gaia-border{
|
|
bottom: 5px;
|
|
}
|
|
|
|
|
|
.exaustao .gaia-border, .recurso .gaia-border {
|
|
height: 35px;
|
|
}
|
|
.recurso .recurso-nome {
|
|
float: right;
|
|
position: absolute;
|
|
top: -5px;
|
|
right: 0;
|
|
font-weight: bold;
|
|
width: 140px;
|
|
}
|
|
|
|
.recurso .input-placeholder3 {
|
|
position: relative;
|
|
/* flex: 1;*/
|
|
}
|
|
|
|
.recurso .input-placeholder3 input {
|
|
min-width: 70px;
|
|
}
|
|
|
|
.recurso .input-placeholder3::after {
|
|
position: absolute;
|
|
content: attr(data-placeholder);
|
|
pointer-events: none;
|
|
bottom: -10;
|
|
left: 35%;
|
|
transform: scale(0.7) translate(-50%, 0%);
|
|
background-color: whitesmoke;
|
|
}
|
|
|
|
/*.parametro-linha .parametros-extra .input-placeholder3*/
|
|
.input-placeholder3 {
|
|
position: relative;
|
|
flex: 0;
|
|
min-height: 37px;
|
|
}
|
|
|
|
/*.parametro-linha .parametros-extra .input-placeholder3 input {*/
|
|
.input-placeholder3 input {
|
|
min-width: 40px;
|
|
}
|
|
|
|
/*.parametro-linha .parametros-extra .input-placeholder3::after {*/
|
|
.input-placeholder3::after {
|
|
position: absolute;
|
|
content: attr(data-placeholder);
|
|
pointer-events: none;
|
|
bottom: 0;
|
|
left: 35%;
|
|
transform: scale(0.7) translate(-50%, 0%);
|
|
background-color: whitesmoke;
|
|
}
|
|
|
|
|
|
.attb-list label {
|
|
flex: 0 0 80px;
|
|
font-size: 14px;
|
|
padding-right: 5px;
|
|
}
|
|
.parametro-linha {
|
|
position: relative;
|
|
margin: 0;
|
|
padding-top: 10px;
|
|
border: 1px solid transparent;
|
|
border-top: none;
|
|
border-bottom: none;
|
|
}
|
|
|
|
.parametro-linha .parametros-extra {
|
|
display: none;
|
|
position: absolute;
|
|
top: -2em;
|
|
width: 100%;
|
|
text-align: center;
|
|
flex-flow: nowrap;
|
|
z-index: 2;
|
|
background-color: white;
|
|
padding: 2px 0px;
|
|
border: 1px solid black;
|
|
border-bottom: none;
|
|
z-index: 4;
|
|
left: -1px;
|
|
/* background-color: rgba(0, 0, 0, 0.5);*/
|
|
}
|
|
.parametro-linha .parametros-extra.iniciativa {
|
|
bottom:-2.3em;
|
|
top: unset;
|
|
border: 1px solid black;
|
|
border-top: none;
|
|
}
|
|
.parametro-linha:hover {
|
|
border: 1px solid black;
|
|
border-top: none;
|
|
border-bottom: none;
|
|
}
|
|
|
|
/*.parametro-linha:first-of-type .parametros-extra,*/
|
|
.parametro-linha .parametros-extra:hover,
|
|
.parametro-linha:hover .parametros-extra {
|
|
display: flex;
|
|
justify-content: space-around;
|
|
}
|
|
.input-placeholder select {
|
|
margin: 0;
|
|
}
|
|
select.aptidao {
|
|
max-width: 80px;
|
|
margin: 0 5px;
|
|
}
|
|
button {
|
|
max-height: 24px;
|
|
}
|
|
button.roll-parametro {
|
|
flex: 0 0 auto;
|
|
min-width: 80px;
|
|
max-width: 80px;
|
|
height: 18px;
|
|
font-size: 14px!important;
|
|
margin: 0px 5px 0px 0px!important;
|
|
}
|
|
|
|
button.roll-parametro::before {
|
|
display: none;
|
|
}
|
|
|
|
.rollbtn {
|
|
flex: 0 0 11px;
|
|
max-width: 18px;
|
|
height: 18px;
|
|
margin: 0px!important;
|
|
}
|
|
|
|
.number-field {
|
|
flex: 0 0 2em;
|
|
width: 3em;
|
|
height: 28px!important;
|
|
text-align: center;
|
|
}
|
|
|
|
.sheet-list-header-col,
|
|
.list-header-col {
|
|
font-size: 10px;
|
|
line-height: 12px;
|
|
display: flex;
|
|
flex-direction: column;
|
|
justify-content: flex-end;
|
|
}
|
|
|
|
|
|
input.gaia-radio {
|
|
visibility: hidden;
|
|
}
|
|
|
|
input.gaia-radio::before {
|
|
visibility: visible;
|
|
content: '';
|
|
display: inline-block;
|
|
padding: 5px;
|
|
border: 1px solid black;
|
|
transform: rotate(-45deg);
|
|
/*border-radius: 50%;*/
|
|
}
|
|
.exaustao .gaia-radio::before {
|
|
padding: 8px;
|
|
}
|
|
|
|
input.gaia-radio.temporario::before {
|
|
background-color: #22f3cc;
|
|
}
|
|
|
|
input.gaia-radio:has(~ :checked)::before,
|
|
input.gaia-radio:checked::before {
|
|
background-color: #9c4bbf;
|
|
}
|
|
|
|
/* Item List */
|
|
|
|
.colbutton {
|
|
opacity: 0!important;
|
|
cursor: default!important;
|
|
}
|
|
.pda-value {
|
|
flex: 0 0 30px;
|
|
max-width: 30px;
|
|
text-align: center;
|
|
}
|
|
|
|
.gaia-border-magic {
|
|
display: flex;
|
|
flex: 0 0 75px;
|
|
/* margin-left: 5px; */
|
|
}
|
|
.recurso .gaia-border-magic::before {
|
|
content: '';
|
|
background: url(https://raw.githubusercontent.com/VHPaiva/roll20-character-sheets/master/Gaia/assets/recurso-max.png) no-repeat;
|
|
background-size: contain;
|
|
display: block;
|
|
width: 120px;
|
|
height: 120px;
|
|
position: absolute;
|
|
top: -40px;
|
|
left: -30px;
|
|
}
|
|
|
|
.gaia-border-magic2 {
|
|
background: url(https://raw.githubusercontent.com/VHPaiva/roll20-character-sheets/master/Gaia/assets/recurso-max.png) no-repeat;
|
|
background-size: contain;
|
|
width: 50%;
|
|
position: absolute;
|
|
height: 120px;
|
|
top: -20px;
|
|
left: -45px;
|
|
z-index: 5;
|
|
}
|
|
.gaia-border-magic2 input {
|
|
border: none;
|
|
background-color: unset;
|
|
}
|
|
.recurso .gaia-border {
|
|
position: absolute;
|
|
width: 170px;
|
|
width: 210px;
|
|
right: 0;
|
|
}
|
|
|
|
.resource-max {
|
|
flex: 0 0 50px;
|
|
max-width: 50px;
|
|
text-align: center;
|
|
|
|
}
|
|
|
|
.resource-value {
|
|
flex: 0 0 40px;
|
|
max-width: 40px;
|
|
text-align: center;
|
|
}
|
|
.resource-temp {
|
|
flex: 0 0 40px;
|
|
max-width: 40px;
|
|
text-align: center;
|
|
}
|
|
.sheet-item-name,
|
|
.item-name {
|
|
flex: 0 0 120px;
|
|
max-width: 120px;
|
|
}
|
|
.sheet-item-bonus,
|
|
.item-bonus {
|
|
flex: 0 0 40px;
|
|
max-width: 40px;
|
|
text-align: center;
|
|
}
|
|
.sheet-item-param,
|
|
.item-param {
|
|
flex: 0 0 100px;
|
|
max-width: 100px;
|
|
text-align: center;
|
|
}
|
|
.sheet-item-formula,
|
|
.item-formula {
|
|
flex: 0 0 60px;
|
|
max-width: 60px;
|
|
text-align: center;
|
|
}
|
|
|
|
.sheet-item-header,
|
|
.item-header {
|
|
flex: 0 0 110px;
|
|
max-width: 110px;
|
|
text-align: center;
|
|
}
|
|
|
|
.sheet-item-text,
|
|
.item-text {
|
|
flex: 0 0 200px;
|
|
max-width: 200px;
|
|
}
|
|
.sheet-item-rollformula,
|
|
.item-rollformula {
|
|
flex: 0 0 95%;
|
|
max-width: 95%;
|
|
text-align: center;
|
|
}
|
|
|
|
.sheet-item-edit,
|
|
.item-edit {
|
|
flex: 0 0 20px;
|
|
width: 20px;
|
|
max-width: 20px;
|
|
visibility: hidden;
|
|
}
|
|
|
|
.sheet-controls {
|
|
width: 0;
|
|
}
|
|
|
|
.sheet-controls::after {
|
|
visibility: visible;
|
|
font-family: Pictos;
|
|
content: "y";
|
|
font-size: 18px;
|
|
vertical-align: middle;
|
|
vertical-align: -webkit-baseline-middle;
|
|
}
|
|
|
|
.sheet-controls::after {
|
|
opacity: .7;
|
|
}
|
|
.sheet-controls:checked::after {
|
|
opacity: 1;
|
|
}
|
|
|
|
.sheet-controls.item-edit:checked + * {
|
|
display: flex;
|
|
}
|
|
.sheet-controls.item-edit:not(:checked) + * {
|
|
display: none;
|
|
}
|
|
/* /Item List */
|
|
|
|
|
|
/* Roll Template */
|
|
|
|
.sheet-rolltemplate-gaia-attack,
|
|
.sheet-rolltemplate-gaia-ability,
|
|
.sheet-rolltemplate-gaia-roll {
|
|
border: 1px solid black;
|
|
text-align: center;
|
|
background-color: wheat;
|
|
min-height: 5em;
|
|
display: flex;
|
|
flex-direction: column;
|
|
}
|
|
.sheet-rolltemplate-gaia-attack > * ,
|
|
.sheet-rolltemplate-gaia-ability > * ,
|
|
.sheet-rolltemplate-gaia-roll > * {
|
|
flex: 1;
|
|
}
|
|
|
|
.sheet-rolltemplate-gaia-attack .sheet-rolltemplate_header,
|
|
.sheet-rolltemplate-gaia-ability .sheet-rolltemplate_header,
|
|
.sheet-rolltemplate-gaia-roll .sheet-rolltemplate_header {
|
|
font-size: 1.3em;
|
|
line-height: 1.3em;
|
|
color: black;
|
|
}
|
|
|
|
.sheet-rolltemplate-gaia-attack .sheet-rolltemplate_rolls ,
|
|
.sheet-rolltemplate-gaia-ability .sheet-rolltemplate_rolls ,
|
|
.sheet-rolltemplate-gaia-roll .sheet-rolltemplate_rolls {
|
|
display: flex;
|
|
justify-content: space-around;
|
|
font-size: 1.5em;
|
|
color: black;
|
|
}
|
|
|
|
.sheet-rolltemplate-gaia-attack .sheet-rolltemplate_rolls .inlinerollresult ,
|
|
.sheet-rolltemplate-gaia-ability .sheet-rolltemplate_rolls .inlinerollresult ,
|
|
.sheet-rolltemplate-gaia-roll .sheet-rolltemplate_rolls .inlinerollresult {
|
|
font-size: 32px;
|
|
line-height: 36px;
|
|
display: block;
|
|
color: white!important;
|
|
}
|
|
|
|
.sheet-rolltemplate-darkmode .inlinerollresult {
|
|
color: white!important;
|
|
}
|
|
|
|
.sheet-rolltemplate-gaia-attack .sheet-rolltemplate_rolls .sheet-rolllabel {
|
|
font-size: 14px;
|
|
color: black;
|
|
}
|
|
|
|
.sheet-rolltemplate-gaia-attack .sheet-rolltemplate_propriedades,
|
|
.sheet-rolltemplate-gaia-ability .sheet-rolltemplate_propriedades,
|
|
.sheet-rolltemplate-gaia-roll .sheet-rolltemplate_propriedades {
|
|
color: black;
|
|
text-align: center;
|
|
max-width: 90%;
|
|
margin: auto;
|
|
}
|
|
|
|
.sheet-rolltemplate-gaia-attack .sheet-rolltemplate_extra,
|
|
.sheet-rolltemplate-gaia-ability .sheet-rolltemplate_extra,
|
|
.sheet-rolltemplate-gaia-roll .sheet-rolltemplate_extra {
|
|
color: black;
|
|
margin: 0 5px;
|
|
text-align: justify;
|
|
}
|
|
|
|
.sheet-rolltemplate-gaia-roll .sheet-roll-result {
|
|
display: flex;
|
|
}
|
|
|
|
/* /Roll Template */
|
|
.repcontainer .hiddenattr {
|
|
min-width: 300px;
|
|
}
|
|
.hiddenattr,
|
|
.wip-border,
|
|
.sheet-section {
|
|
position: relative;
|
|
/* border: 1px solid blue; */
|
|
/* padding: 10px 5px; */
|
|
/* margin: 0 0 20px; */
|
|
}
|
|
.gaia-border .section-title,
|
|
.sheet-section .section-title {
|
|
position: absolute;
|
|
top: -15px;
|
|
background-color: white;
|
|
border: 2px solid black;
|
|
padding: 0 5px;
|
|
z-index: 1;
|
|
}
|