Add starship, creature and vehicle

This commit is contained in:
2025-03-15 20:31:50 +01:00
parent 9013229c20
commit 7eee4fab7e
23 changed files with 1080 additions and 746 deletions

View File

@@ -39,11 +39,9 @@
align-items: center;
input {
flex: none;
width: 2rem;
margin-left: 4px;
}
.damage-bonus {
font-size: calc(var(--font-size-standard) * 0.8);
width: 2.5rem;
margin-left: 2px;
margin-right: 4px;
}
.hp-separator {
font-size: calc(var(--font-size-standard) * 1.2);
@@ -77,6 +75,28 @@
flex-direction: column;
gap: 5px;
.creature-spec {
label {
max-width: 8rem;
}
select {
max-width: 10rem;
}
input {
max-width: 6rem;
}
.dice-2d6 {
max-width: 1.5rem;
}
.rollable:hover,
.rollable:focus {
text-shadow: 0 0 8px var(--color-shadow-primary);
cursor: pointer;
}
.rollable {
}
}
.creature-name {
display: flex;
input {
@@ -85,87 +105,6 @@
width: 400px;
}
}
.san {
align-content: flex-start;
input {
min-width: 2.2rem;
max-width: 2.2rem;
margin-bottom: 4px;
}
select {
min-width: 6rem;
max-width: 6rem;
}
.rollable:hover,
.rollable:focus {
text-shadow: 0 0 8px var(--color-shadow-primary);
cursor: pointer;
font-size: 0.9rem;
}
.button {
min-width: 4rem;
max-width: 4rem;
}
.san-checkbox {
min-width: 1rem;
max-width: 1rem;
}
.label-short-field {
font-size: 0.9rem;
max-width: 3rem;
min-width: 3rem;
flex-grow: 1;
}
.label-recovery {
margin-left: 4px;
}
.label-field {
font-size: 0.9rem;
max-width: 6rem;
min-width: 6rem;
flex-grow: 1;
}
.label-bp {
flex-grow: 1;
max-width: 3rem;
min-width: 3rem;
margin-left: 4px;
}
.label-insanity {
flex-grow: 1;
margin-left: 4px;
max-width: 8rem;
min-width: 8rem;
}
.spacing {
margin-left: 4px;
}
.d100 {
flex: 0;
}
}
.willpower {
input {
min-width: 2.4rem;
max-width: 2.4rem;
}
input[type="checkbox"] {
min-width: 1rem;
max-width: 1rem;
}
.label-field {
flex-grow: 1;
margin-left: 4px;
max-width: 5rem;
min-width: 5rem;
font-size: 0.9rem;
}
.checkbox {
flex-grow: 0;
min-width: 1rem;
max-width: 1rem;
}
}
label {
min-width: 120px;
}
@@ -180,24 +119,29 @@
min-width: 650px;
}
.creature-characteristics {
.creature-skills {
background-color: var(--color-light-1);
display: flex;
flex-direction: column;
gap: 5px;
flex: 1;
.creature-characteristic {
.creature-skill {
display: flex;
align-items: center;
.icon-skill {
width: 24px;
height: 24px;
margin-right: 4px;
}
.rollable:hover,
.rollable:focus {
text-shadow: 0 0 8px var(--color-shadow-primary);
cursor: pointer;
}
.rollable {
min-width: 3rem;
max-width: 3rem;
min-width: 4.5rem;
max-width: 4.5rem;
}
.char-text {
margin-left: 0.5rem;
@@ -218,11 +162,11 @@
}
}
.creature-characteristic-play {
.creature-skill-play {
min-width: 225px;
}
.creature-characteristic-edit {
.creature-skill-edit {
min-width: 400px;
}
}
@@ -239,12 +183,24 @@
margin-left: 8px;
}
.adapted {
.rank {
display: grid;
grid-template-columns: repeat(5, 1fr);
gap: 8px;
label {
min-width: 6rem;
}
input {
max-width: 4rem;
}
}
.biodata {
display: grid;
grid-template-columns: repeat(2, 1fr);
gap: 8px;
label {
min-width: 20rem;
min-width: 12rem;
}
}
@@ -285,79 +241,6 @@
padding-left: 5px;
}
}
.armors {
display: grid;
grid-template-columns: repeat(3, 1fr);
gap: 4px;
.armor {
display: flex;
align-items: center;
gap: 4px;
min-width: 13rem;
max-width: 13rem;
.rollable:hover,
.rollable:focus {
text-shadow: 0 0 8px var(--color-shadow-primary);
cursor: pointer;
}
.controls {
font-size: 0.7rem;
min-width: 1.8rem;
max-width: 1.8rem;
}
.protection {
min-width: 5rem;
max-width: 5rem;
}
.name {
min-width: 8rem;
max-width: 8rem;
}
.item-img {
width: 24px;
height: 24px;
margin: 4px 0 0 0;
}
}
}
.weapons {
display: grid;
grid-template-columns: repeat(2, 1fr);
gap: 4px;
.weapon {
display: flex;
align-items: center;
gap: 4px;
min-width: 13rem;
max-width: 13rem;
.rollable:hover,
.rollable:focus {
text-shadow: 0 0 8px var(--color-shadow-primary);
cursor: pointer;
}
.controls {
font-size: 0.7rem;
min-width: 1.8rem;
max-width: 1.8rem;
}
.damage {
min-width: 6rem;
max-width: 6rem;
}
.name {
min-width: 10rem;
max-width: 10rem;
}
.item-img {
width: 24px;
height: 24px;
margin: 4px 0 0 0;
}
}
}
.skills {
display: grid;
grid-template-columns: repeat(3, 1fr);
@@ -528,7 +411,7 @@
}
}
.tab.creature-equipment {
.tab.creature-traits {
background-color: var(--color-light-1);
display: grid;
grid-template-columns: 1fr;
@@ -539,11 +422,248 @@
}
}
.gears {
.traits {
display: grid;
grid-template-columns: repeat(2, 1fr);
gap: 4px;
.trait {
display: flex;
align-items: center;
gap: 4px;
min-width: 13rem;
max-width: 13rem;
.rollable:hover,
.rollable:focus {
text-shadow: 0 0 8px var(--color-shadow-primary);
cursor: pointer;
}
.controls {
font-size: 0.7rem;
min-width: 1.8rem;
max-width: 1.8rem;
}
.damage {
min-width: 6rem;
max-width: 6rem;
}
.name {
min-width: 10rem;
max-width: 10rem;
}
.item-img {
width: 24px;
height: 24px;
margin: 4px 0 0 0;
}
}
}
.abilities {
display: grid;
grid-template-columns: repeat(2, 1fr);
gap: 4px;
.ability {
display: flex;
align-items: center;
gap: 4px;
min-width: 13rem;
max-width: 13rem;
.rollable:hover,
.rollable:focus {
text-shadow: 0 0 8px var(--color-shadow-primary);
cursor: pointer;
}
.controls {
font-size: 0.7rem;
min-width: 1.8rem;
max-width: 1.8rem;
}
.damage {
min-width: 6rem;
max-width: 6rem;
}
.name {
min-width: 10rem;
max-width: 10rem;
}
.item-img {
width: 24px;
height: 24px;
margin: 4px 0 0 0;
}
}
}
.psionics {
display: grid;
grid-template-columns: repeat(2, 1fr);
gap: 4px;
.psionic {
display: flex;
align-items: center;
gap: 4px;
min-width: 13rem;
max-width: 13rem;
.rollable:hover,
.rollable:focus {
text-shadow: 0 0 8px var(--color-shadow-primary);
cursor: pointer;
}
.controls {
font-size: 0.7rem;
min-width: 1.8rem;
max-width: 1.8rem;
}
.damage {
min-width: 6rem;
max-width: 6rem;
}
.name {
min-width: 10rem;
max-width: 10rem;
}
.item-img {
width: 24px;
height: 24px;
margin: 4px 0 0 0;
}
}
}
}
.tab.creature-equipment {
background-color: var(--color-light-1);
display: grid;
grid-template-columns: 1fr;
legend {
a {
font-size: calc(var(--font-size-standard) * 1.4);
padding-left: 5px;
}
}
.encumbrance {
display: grid;
grid-template-columns: repeat(4, 1fr);
gap: 4px;
input {
max-width: 4rem;
}
.encumbered {
color: red;
font-weight: bold;
}
}
.implants {
display: grid;
grid-template-columns: repeat(2, 1fr);
gap: 4px;
.implant {
display: flex;
align-items: center;
gap: 4px;
min-width: 13rem;
max-width: 13rem;
.rollable:hover,
.rollable:focus {
text-shadow: 0 0 8px var(--color-shadow-primary);
cursor: pointer;
}
.controls {
font-size: 0.7rem;
min-width: 1.8rem;
max-width: 1.8rem;
}
.damage {
min-width: 6rem;
max-width: 6rem;
}
.name {
min-width: 10rem;
max-width: 10rem;
}
.item-img {
width: 24px;
height: 24px;
margin: 4px 0 0 0;
}
}
}
.weapons {
display: grid;
grid-template-columns: repeat(2, 1fr);
gap: 4px;
.weapon {
display: flex;
align-items: center;
gap: 4px;
min-width: 13rem;
max-width: 13rem;
.rollable:hover,
.rollable:focus {
text-shadow: 0 0 8px var(--color-shadow-primary);
cursor: pointer;
}
.controls {
font-size: 0.7rem;
min-width: 1.8rem;
max-width: 1.8rem;
}
.damage {
min-width: 6rem;
max-width: 6rem;
}
.name {
min-width: 10rem;
max-width: 10rem;
}
.item-img {
width: 24px;
height: 24px;
margin: 4px 0 0 0;
}
}
}
.armors {
display: grid;
grid-template-columns: repeat(2, 1fr);
gap: 4px;
.armor {
display: flex;
align-items: center;
gap: 4px;
min-width: 13rem;
max-width: 13rem;
.controls {
font-size: 0.7rem;
min-width: 1.8rem;
max-width: 1.8rem;
}
.protection {
min-width: 6rem;
max-width: 6rem;
}
.name {
min-width: 10rem;
max-width: 10rem;
}
.item-img {
width: 24px;
height: 24px;
margin: 4px 0 0 0;
}
}
}
.equipments {
display: grid;
grid-template-columns: repeat(3, 1fr);
gap: 4px;
.gear {
.equipment {
display: flex;
align-items: center;
gap: 4px;
@@ -571,70 +691,6 @@
}
}
.rituals {
display: grid;
grid-template-columns: repeat(2, 1fr);
gap: 4px;
.ritual {
display: flex;
align-items: center;
gap: 4px;
min-width: 20rem;
max-width: 20rem;
.rollable:hover,
.rollable:focus {
text-shadow: 0 0 8px var(--color-shadow-primary);
cursor: pointer;
}
.controls {
font-size: 0.7rem;
min-width: 1.8rem;
max-width: 1.8rem;
}
.name {
min-width: 17rem;
max-width: 17rem;
}
.item-img {
width: 24px;
height: 24px;
margin: 4px 0 0 0;
}
}
}
.tomes {
display: grid;
grid-template-columns: repeat(2, 1fr);
gap: 4px;
.tome {
display: flex;
align-items: center;
gap: 4px;
min-width: 20rem;
max-width: 20rem;
.rollable:hover,
.rollable:focus {
text-shadow: 0 0 8px var(--color-shadow-primary);
cursor: pointer;
}
.controls {
font-size: 0.7rem;
min-width: 1.8rem;
max-width: 1.8rem;
}
.name {
min-width: 17rem;
max-width: 17rem;
}
.item-img {
width: 24px;
height: 24px;
margin: 4px 0 0 0;
}
}
}
prose-mirror.inactive {
min-height: 40px;
}

View File

@@ -34,6 +34,15 @@
}
}
.spec {
label {
max-width: 5rem;
}
input {
max-width: 3rem;
}
}
}
.starship-right {
@@ -50,6 +59,42 @@
}
}
.capacity {
.dice-2d6 {
max-width: 1.5rem;
margin-left: 0.2rem;
}
.rollable:hover,
.rollable:focus {
text-shadow: 0 0 8px var(--color-shadow-primary);
cursor: pointer;
}
label {
margin-left: 0.2rem;
max-width: 10rem;
}
input {
max-width: 4rem;
}
select {
max-width: 5rem;
}
}
.cargo {
label {
margin-left: 0.2rem;
max-width: 10rem;
}
input {
max-width: 4rem;
}
select {
max-width: 5rem;
}
}
.starship-infos {
display: flex;
flex-direction: column;
@@ -104,7 +149,7 @@
}
}
.starship-biography {
.starship-description {
background-color: var(--color-light-1);
prose-mirror.inactive {
min-height: 40px;

View File

@@ -50,6 +50,17 @@
}
}
.cargo,
.capacity {
label {
max-width: 5rem;
}
input {
max-width: 3.5rem;
margin-right: 0.5rem;
}
}
.vehicle-infos {
display: flex;
flex-direction: column;
@@ -104,7 +115,7 @@
}
}
.vehicle-biography {
.vehicle-description {
background-color: var(--color-light-1);
prose-mirror.inactive {
min-height: 40px;
@@ -179,11 +190,12 @@
}
}
}
.gears {
.equipments {
display: grid;
grid-template-columns: repeat(3, 1fr);
gap: 4px;
.gear {
.equipment {
display: flex;
align-items: center;
gap: 4px;