✨Feature: add town systems, saves, recovery, and level progression
This commit is contained in:
Keith Solomon
173
src/styles.css
173
src/styles.css
@@ -111,6 +111,27 @@ select {
|
||||
rgba(48, 22, 18, 0.92);
|
||||
}
|
||||
|
||||
.alert-banner-victory {
|
||||
background:
|
||||
linear-gradient(90deg, rgba(45, 93, 54, 0.92), rgba(26, 46, 29, 0.92)),
|
||||
rgba(26, 46, 29, 0.92);
|
||||
border-color: rgba(125, 219, 150, 0.28);
|
||||
}
|
||||
|
||||
.alert-banner-defeat {
|
||||
background:
|
||||
linear-gradient(90deg, rgba(113, 33, 33, 0.92), rgba(48, 18, 18, 0.92)),
|
||||
rgba(48, 18, 18, 0.92);
|
||||
border-color: rgba(232, 123, 123, 0.3);
|
||||
}
|
||||
|
||||
.alert-banner-level {
|
||||
background:
|
||||
linear-gradient(90deg, rgba(133, 87, 24, 0.92), rgba(59, 38, 14, 0.92)),
|
||||
rgba(59, 38, 14, 0.92);
|
||||
border-color: rgba(244, 205, 120, 0.32);
|
||||
}
|
||||
|
||||
.alert-kicker {
|
||||
display: block;
|
||||
color: #ffbf78;
|
||||
@@ -156,6 +177,10 @@ select {
|
||||
grid-column: span 12;
|
||||
}
|
||||
|
||||
.panel-saves {
|
||||
grid-column: span 8;
|
||||
}
|
||||
|
||||
.panel-town-hub {
|
||||
grid-column: span 8;
|
||||
}
|
||||
@@ -183,7 +208,7 @@ select {
|
||||
|
||||
.stat-strip {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(4, minmax(0, 1fr));
|
||||
grid-template-columns: repeat(5, minmax(0, 1fr));
|
||||
gap: 0.75rem;
|
||||
}
|
||||
|
||||
@@ -228,6 +253,80 @@ select {
|
||||
margin-top: 1rem;
|
||||
}
|
||||
|
||||
.town-services {
|
||||
display: grid;
|
||||
gap: 0.75rem;
|
||||
margin-top: 1rem;
|
||||
}
|
||||
|
||||
.recovery-panel {
|
||||
margin-top: 1.25rem;
|
||||
padding-top: 1.25rem;
|
||||
border-top: 1px solid rgba(255, 231, 196, 0.12);
|
||||
}
|
||||
|
||||
.recovery-grid {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(3, minmax(0, 1fr));
|
||||
gap: 0.75rem;
|
||||
margin-top: 1rem;
|
||||
}
|
||||
|
||||
.recovery-card {
|
||||
padding: 1rem;
|
||||
border: 1px solid rgba(255, 231, 196, 0.1);
|
||||
background: rgba(255, 245, 223, 0.04);
|
||||
}
|
||||
|
||||
.recovery-card strong {
|
||||
display: block;
|
||||
margin-top: 0.25rem;
|
||||
color: #fff2d6;
|
||||
font-size: 1.05rem;
|
||||
}
|
||||
|
||||
.town-ledger {
|
||||
margin-top: 1.25rem;
|
||||
padding-top: 1.25rem;
|
||||
border-top: 1px solid rgba(255, 231, 196, 0.12);
|
||||
}
|
||||
|
||||
.town-ledger-grid {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(3, minmax(0, 1fr));
|
||||
gap: 0.75rem;
|
||||
margin-top: 1rem;
|
||||
}
|
||||
|
||||
.town-ledger-card {
|
||||
padding: 1rem;
|
||||
border: 1px solid rgba(255, 231, 196, 0.1);
|
||||
background: rgba(255, 245, 223, 0.04);
|
||||
}
|
||||
|
||||
.town-ledger-card h3 {
|
||||
margin: 0 0 0.75rem;
|
||||
color: #fff2d6;
|
||||
font-size: 1.05rem;
|
||||
}
|
||||
|
||||
.town-service-card {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
gap: 1rem;
|
||||
align-items: center;
|
||||
padding: 1rem;
|
||||
border: 1px solid rgba(255, 231, 196, 0.1);
|
||||
background: rgba(255, 245, 223, 0.04);
|
||||
}
|
||||
|
||||
.town-service-card strong {
|
||||
display: block;
|
||||
margin-top: 0.25rem;
|
||||
color: #fff2d6;
|
||||
font-size: 1.05rem;
|
||||
}
|
||||
|
||||
.room-title {
|
||||
margin: 0 0 0.35rem;
|
||||
font-size: 1.5rem;
|
||||
@@ -249,6 +348,26 @@ select {
|
||||
margin-top: 1rem;
|
||||
}
|
||||
|
||||
.treasure-row {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
gap: 1rem;
|
||||
align-items: center;
|
||||
padding: 0.75rem 0;
|
||||
border-top: 1px solid rgba(255, 231, 196, 0.08);
|
||||
}
|
||||
|
||||
.treasure-row:first-of-type {
|
||||
border-top: 0;
|
||||
padding-top: 0;
|
||||
}
|
||||
|
||||
.treasure-actions {
|
||||
display: flex;
|
||||
gap: 0.5rem;
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
|
||||
.button {
|
||||
border: 1px solid rgba(255, 217, 163, 0.24);
|
||||
background: rgba(255, 245, 223, 0.04);
|
||||
@@ -287,9 +406,23 @@ select {
|
||||
margin-top: 1rem;
|
||||
}
|
||||
|
||||
.combat-summary-grid {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(3, minmax(0, 1fr));
|
||||
gap: 0.75rem;
|
||||
margin-top: 1rem;
|
||||
}
|
||||
|
||||
.combat-feed {
|
||||
display: grid;
|
||||
gap: 0.75rem;
|
||||
margin-top: 1rem;
|
||||
}
|
||||
|
||||
.move-list,
|
||||
.mini-map,
|
||||
.enemy-list {
|
||||
.enemy-list,
|
||||
.save-list {
|
||||
display: grid;
|
||||
gap: 0.75rem;
|
||||
}
|
||||
@@ -301,7 +434,8 @@ select {
|
||||
|
||||
.move-card,
|
||||
.map-node,
|
||||
.enemy-card {
|
||||
.enemy-card,
|
||||
.save-card {
|
||||
width: 100%;
|
||||
text-align: left;
|
||||
padding: 0.95rem;
|
||||
@@ -347,13 +481,28 @@ select {
|
||||
}
|
||||
|
||||
.move-card em,
|
||||
.enemy-card span {
|
||||
.enemy-card span,
|
||||
.save-card span {
|
||||
display: block;
|
||||
margin-top: 0.3rem;
|
||||
font-style: normal;
|
||||
color: rgba(244, 239, 227, 0.7);
|
||||
}
|
||||
|
||||
.save-card strong {
|
||||
display: block;
|
||||
margin-top: 0.3rem;
|
||||
font-size: 1rem;
|
||||
color: #fff2d6;
|
||||
}
|
||||
|
||||
.save-actions {
|
||||
display: flex;
|
||||
gap: 0.5rem;
|
||||
margin-top: 1rem;
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
|
||||
.map-node-active {
|
||||
border-color: rgba(243, 186, 115, 0.55);
|
||||
background: rgba(243, 186, 115, 0.12);
|
||||
@@ -405,7 +554,23 @@ select {
|
||||
grid-template-columns: repeat(2, minmax(0, 1fr));
|
||||
}
|
||||
|
||||
.combat-summary-grid,
|
||||
.town-summary-grid {
|
||||
grid-template-columns: 1fr;
|
||||
}
|
||||
|
||||
.town-service-card {
|
||||
flex-direction: column;
|
||||
align-items: stretch;
|
||||
}
|
||||
|
||||
.recovery-grid,
|
||||
.town-ledger-grid {
|
||||
grid-template-columns: 1fr;
|
||||
}
|
||||
|
||||
.treasure-row {
|
||||
flex-direction: column;
|
||||
align-items: stretch;
|
||||
}
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user