Added quick-buy and bulk-buying qol features to both shop and garden.

This commit is contained in:
sarah committed 2026-09-03 21:00:30 +02:00
1 parent cce44b1b0e
commit a055a74148
4 files changed
+769 -58

No files matched your search

+141
View File
@@ -415,6 +415,140 @@ input, button, textarea, select {
}
}
.GardenQuickBuyPanel {
margin-bottom: 1rem;
padding: 0.75rem;
}
.GardenQuickBuyHeader {
display: flex;
flex-wrap: wrap;
gap: 0.75rem;
align-items: center;
justify-content: space-between;
margin-bottom: 0.75rem;
}
.GardenQuickBuyHeader h2 {
margin: 0;
}
.QuickBuyAmountList {
display: flex;
flex-wrap: wrap;
gap: 0.5rem;
}
.QuickBuyAmountButton {
min-width: 3.25rem;
padding: 0.4rem 0.55rem;
cursor: pointer;
color: var(--Text);
background-color: var(--Surface0);
border: 3px solid var(--Surface2);
border-radius: 0;
box-shadow: 2px 2px 0 var(--Crust);
appearance: none;
}
.QuickBuyAmountButton:hover:not(:disabled) {
color: var(--Green);
border-color: var(--Green);
}
.QuickBuyAmountButton[aria-current="true"] {
color: var(--Green);
background-color: var(--Surface1);
border-color: var(--Green);
}
.QuickBuyAmountButton:disabled {
cursor: not-allowed;
}
.QuickBuyAmountButton:focus-visible,
.QuickBuyPlantButton:focus-visible {
outline: 3px solid var(--Yellow);
outline-offset: 3px;
}
.QuickBuyPlantList {
display: flex;
gap: 0.65rem;
padding-bottom: 0.45rem;
overflow-x: auto;
overflow-y: hidden;
}
.QuickBuyPlantButton {
display: flex;
flex: 0 0 7rem;
width: 7rem;
padding: 0;
flex-direction: column;
cursor: pointer;
color: var(--Text);
border-color: var(--Surface2);
border-radius: 0;
box-shadow: 3px 3px 0 var(--Crust);
appearance: none;
}
.QuickBuyPlantButton:hover:not(:disabled) {
border-color: var(--Green);
transform: translate(1px, 1px);
box-shadow: 2px 2px 0 var(--Crust);
}
.QuickBuyPlantButton:disabled {
cursor: not-allowed;
}
.QuickBuyPlantName {
display: flex;
width: 100%;
min-width: 0;
min-height: 1.7rem;
padding: 0.25rem 0.35rem;
align-items: center;
justify-content: center;
overflow: hidden;
color: var(--Subtext1);
background-color: var(--Mantle);
border-bottom: 2px solid var(--Surface2);
font-size: 0.75rem;
line-height: 1;
text-align: center;
text-overflow: ellipsis;
white-space: nowrap;
}
.QuickBuyPlantVisual {
display: flex;
width: 100%;
aspect-ratio: 1;
align-items: center;
justify-content: center;
overflow: hidden;
background-color: var(--Surface0);
}
.QuickBuyPlantMissing {
padding: 0.35rem;
color: var(--Overlay1);
font-size: 0.75rem;
text-align: center;
}
.QuickBuyEmpty {
flex: 0 0 100%;
margin: 0;
padding: 0.75rem;
color: var(--Subtext1);
background-color: var(--Mantle);
border: 3px solid var(--Surface2);
}
.GardenLayout {
display: grid;
grid-template-columns: minmax(0, 1fr) 12rem;
@@ -1077,6 +1211,13 @@ input, button, textarea, select {
padding: 0.65rem 0.8rem;
}
.ShopSeedBuyOptions {
display: flex;
flex-direction: column;
gap: 0.5rem;
margin-top: auto;
}
.ShopBuyButton:disabled {
cursor: not-allowed;
color: var(--Overlay1);