Add rituals and tomes

This commit is contained in:
2025-02-07 08:34:57 +01:00
parent 270471f137
commit 2ac0f53c4f
29 changed files with 803 additions and 145 deletions

View File

@@ -16,6 +16,8 @@
@import "gear.less";
@import "arcane.less";
@import "archetype.less";
@import "ritual.less";
@import "tome.less";
}
@import "roll.less";

View File

@@ -294,20 +294,25 @@
align-items: center;
gap: 4px;
margin-left: 4px;
min-width: 12rem;
max-width: 12rem;
min-width: 12.3rem;
max-width: 12.3rem;
.rollable:hover,
.rollable:focus {
text-shadow: 0 0 8px var(--color-shadow-primary);
cursor: pointer;
}
.controls {
min-width: 2rem;
max-width: 2rem;
font-size: 0.7rem;
min-width: 1.8rem;
max-width: 1.8rem;
}
.score {
min-width: 1.2rem;
max-width: 1.2rem;
}
.name {
min-width: 11rem;
max-width: 11rem;
min-width: 10rem;
max-width: 10rem;
}
.item-img {
width: 24px;
@@ -340,8 +345,9 @@
min-width: 18rem;
max-width: 18rem;
.controls {
min-width: 2rem;
max-width: 2rem;
font-size: 0.7rem;
min-width: 1.8rem;
max-width: 1.8rem;
}
.name {
min-width: 12rem;
@@ -374,8 +380,9 @@
min-width: 14rem;
max-width: 14rem;
.controls {
min-width: 2rem;
max-width: 2rem;
font-size: 0.7rem;
min-width: 1.8rem;
max-width: 1.8rem;
}
.name {
min-width: 12rem;
@@ -400,8 +407,9 @@
min-width: 18rem;
max-width: 18rem;
.controls {
min-width: 2rem;
max-width: 2rem;
font-size: 0.7rem;
min-width: 1.8rem;
max-width: 1.8rem;
}
.name {
min-width: 14rem;
@@ -430,8 +438,9 @@
min-width: 16rem;
max-width: 16rem;
.controls {
min-width: 2rem;
max-width: 2rem;
font-size: 0.7rem;
min-width: 1.8rem;
max-width: 1.8rem;
}
.name {
min-width: 14rem;
@@ -472,8 +481,9 @@
cursor: pointer;
}
.controls {
min-width: 2rem;
max-width: 2rem;
font-size: 0.7rem;
min-width: 1.8rem;
max-width: 1.8rem;
}
.damage {
min-width: 6rem;
@@ -499,15 +509,16 @@
align-items: center;
gap: 4px;
min-width: 13rem;
max-width: 13srem;
max-width: 13rem;
.rollable:hover,
.rollable:focus {
text-shadow: 0 0 8px var(--color-shadow-primary);
cursor: pointer;
}
.controls {
min-width: 2rem;
max-width: 2rem;
font-size: 0.7rem;
min-width: 1.8rem;
max-width: 1.8rem;
}
.protection {
min-width: 5rem;
@@ -524,6 +535,7 @@
}
}
}
.gears {
display: grid;
grid-template-columns: repeat(3, 1fr);
@@ -533,23 +545,84 @@
align-items: center;
gap: 4px;
min-width: 13rem;
max-width: 13srem;
max-width: 13rem;
.rollable:hover,
.rollable:focus {
text-shadow: 0 0 8px var(--color-shadow-primary);
cursor: pointer;
}
.controls {
min-width: 2rem;
max-width: 2rem;
}
.damage {
min-width: 5rem;
max-width: 5rem;
font-size: 0.7rem;
min-width: 1.8rem;
max-width: 1.8rem;
}
.name {
min-width: 8rem;
max-width: 8rem;
min-width: 10rem;
max-width: 10rem;
}
.item-img {
width: 24px;
height: 24px;
margin: 4px 0 0 0;
}
}
}
.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;

22
styles/ritual.less Normal file
View File

@@ -0,0 +1,22 @@
.ritual-content {
.sheet-common();
.item-sheet-common();
fieldset {
margin-top: 8px;
background-color: var(--color-light-1);
}
.header {
background-color: var(--color-light-1);
display: flex;
img {
width: 50px;
height: 50px;
}
}
label {
flex: 10%;
}
}

22
styles/tome.less Normal file
View File

@@ -0,0 +1,22 @@
.tome-content {
.sheet-common();
.item-sheet-common();
fieldset {
margin-top: 8px;
background-color: var(--color-light-1);
}
.header {
background-color: var(--color-light-1);
display: flex;
img {
width: 50px;
height: 50px;
}
}
label {
flex: 10%;
}
}