sarah/srhtnin.github.io
1
0 Fork 0
mirror of https://git.srhtnin.garden/sarah/srhtnin.github.io.git synced 2026-10-14 02:38:12 +02:00
Code Issues Packages Projects Releases Wiki Activity

Made styling more coherent, shortened CSS, and added some other little

Browse Source 
sprinkles of neatness.
This commit is contained in:
sarah committed 2026-09-05 11:49:01 +02:00
1 parent 7b804feba8
commit ab0d858fef
9 files changed
+389 -286
Download Patch File Download Diff File Expand all files Collapse all files

No files matched your search

Pages/Garden.php
+5 -7
View File
@@ -53,8 +53,6 @@ $PageSection = "Garden";
id="GardenInfoPanel"
class="StatusPanel GardenInfoPanel"
>
<h2 class="GardenInfoHeading">Info</h2>
<div class="GardenInfoRow GardenInfoTopRow">
<div class="GardenInfoSection GardenInfoPrimarySection">
<div class="GardenStatusLine">
@@ -170,7 +168,7 @@ $PageSection = "Garden";
id="QuickBuy"
class="Panel GardenQuickBuyPanel"
>
<div class="GardenQuickBuyHeader">
<div class="PanelHeader PanelHeaderInset GardenQuickBuyHeader">
<h2>Quick-buy</h2>
<div
@@ -214,7 +212,7 @@ $PageSection = "Garden";
id="Tools"
class="Panel GardenToolsPanel"
>
<h2>Tools</h2>
<h2 class="PanelHeader PanelHeaderInset">Tools</h2>
<div
id="ToolList"
@@ -226,7 +224,7 @@ $PageSection = "Garden";
id="Seeds"
class="Panel GardenInventoryPanel"
>
<h2>Inventory</h2>
<h2 class="PanelHeader PanelHeaderInset">Inventory</h2>
<div
id="SeedList"
@@ -238,7 +236,7 @@ $PageSection = "Garden";
id="Plots"
class="Panel GardenPlotsPanel"
>
<h2>Plots</h2>
<h2 class="PanelHeader PanelHeaderInset">Plots</h2>
<div class="GardenGridViewport">
<div
@@ -256,7 +254,7 @@ $PageSection = "Garden";
id="Player"
class="Panel GardenUser"
>
<h2>Player</h2>
<h2 class="PanelHeader PanelHeaderInset">Player</h2>
<p>
Username:
Pages/Profile.php
+5 -5
View File
@@ -27,7 +27,7 @@ $PageTitle = "Profile";
id="Player"
class="Panel ProfileSection"
>
<h2>Player</h2>
<h2 class="PanelHeader PanelHeaderInset">Player</h2>
<form id="ProfileUsernameForm">
<label
@@ -103,7 +103,7 @@ $PageTitle = "Profile";
id="GardenDisplay"
class="Panel ProfileSection"
>
<h2>Garden display</h2>
<h2 class="PanelHeader PanelHeaderInset">Garden display</h2>
<h3>Tool selection</h3>
@@ -223,7 +223,7 @@ $PageTitle = "Profile";
id="Statistics"
class="Panel ProfileSection"
>
<h3>Statistics</h3>
<h3 class="PanelHeader PanelHeaderInset">Statistics</h3>
<div class="ProfileStatistics">
<div class="ProfileStatistic">
@@ -283,7 +283,7 @@ $PageTitle = "Profile";
id="Account"
class="Panel ProfileSection"
>
<h2>Account</h2>
<h2 class="PanelHeader PanelHeaderInset">Account</h2>
<p>
Your Account Key is the secret key used
@@ -392,7 +392,7 @@ $PageTitle = "Profile";
id="Import"
class="Panel ProfileSection"
>
<h3>Import Account</h3>
<h3 class="PanelHeader PanelHeaderInset">Import Account</h3>
<p>
To use an existing Garden account on
Pages/Social.php
+1 -1
View File
@@ -20,7 +20,7 @@ $PageSection = "Social";
id="Leaderboard"
class="Panel Leaderboard"
>
<h2>Leaderboard</h2>
<h2 class="PanelHeader PanelHeaderInset">Leaderboard</h2>
<div class="LeaderboardTableContainer">
<table class="LeaderboardTable">
Scripts/Garden/MutationEncyclopedia.js
+83 -41
View File
@@ -117,13 +117,24 @@ function RenderMutationEncyclopedia() {
)
: [];
const HintLimit =
GetMutationHintsDisplayLimit(
MutationEncyclopediaSave
);
const DisplayedHints =
AvailableHints.slice(
0,
HintLimit
);
const SearchQuery =
MutationEncyclopediaSearchQuery
.trim()
.toLocaleLowerCase();
const VisibleHints =
AvailableHints.filter(
DisplayedHints.filter(
Mutation =>
DoesMutationHintMatchSearch(
Mutation,
@@ -145,13 +156,16 @@ function RenderMutationEncyclopedia() {
);
for (
const Mutation
of VisibleHints
) {
if (VisibleHints.length > 0) {
List.appendChild(
CreateMutationHintCard(
Mutation.Hint
VisibleHints.map(
Mutation =>
Mutation.Hint
),
GetMutationHintsLevel(
MutationEncyclopediaSave
)
)
);
}
@@ -205,18 +219,6 @@ function RenderMutationEncyclopedia() {
.toLocaleString() +
" discovered mutations."
);
if (AvailableHints.length > 0) {
MessageParts.push(
"Showing " +
VisibleHints.length
.toLocaleString() +
" of " +
AvailableHints.length
.toLocaleString() +
" available hints."
);
}
} else {
MessageParts.push(
DiscoveredMutations.length === 1
@@ -225,16 +227,20 @@ function RenderMutationEncyclopedia() {
.toLocaleString() +
" mutations discovered."
);
}
if (AvailableHints.length > 0) {
MessageParts.push(
AvailableHints.length === 1
? "1 hint available."
: AvailableHints.length
.toLocaleString() +
" hints available."
);
}
if (AvailableHints.length > 0) {
MessageParts.push(
"Showing " +
VisibleHints.length
.toLocaleString() +
" of " +
AvailableHints.length
.toLocaleString() +
(AvailableHints.length === 1
? " available hint."
: " available hints.")
);
}
SetMutationEncyclopediaMessage(
@@ -645,7 +651,8 @@ function DoesPlantMatchHintMatcher(
function CreateMutationHintCard(
Hint
Hints,
Level
) {
const Card =
document.createElement(
@@ -662,7 +669,7 @@ function CreateMutationHintCard(
);
Header.className =
"MutationEncyclopediaHeader";
"PanelHeader MutationEncyclopediaHeader";
const Name =
@@ -671,7 +678,9 @@ function CreateMutationHintCard(
);
Name.textContent =
"Mutation hint";
Level >= MutationHintsMaximumLevel
? "Mutation hints"
: "Mutation hint";
Header.appendChild(Name);
@@ -685,20 +694,53 @@ function CreateMutationHintCard(
"MutationEncyclopediaBody";
const HintText =
document.createElement(
"p"
if (
Level < MutationHintsMaximumLevel
) {
const HintText =
document.createElement(
"p"
);
HintText.className =
"MutationEncyclopediaDescription";
HintText.textContent =
String(
Hints[0] ?? ""
).trim();
Body.appendChild(
HintText
);
} else {
const HintList =
document.createElement(
"ul"
);
HintText.className =
"MutationEncyclopediaDescription";
HintList.className =
"MutationHintList";
HintText.textContent =
Hint.trim();
for (const Hint of Hints) {
const Item =
document.createElement(
"li"
);
Body.appendChild(
HintText
);
Item.textContent =
"- " +
String(Hint).trim();
HintList.appendChild(
Item
);
}
Body.appendChild(
HintList
);
}
Card.append(
@@ -733,7 +775,7 @@ function CreateMutationEncyclopediaCard(
);
Header.className =
"MutationEncyclopediaHeader";
"PanelHeader MutationEncyclopediaHeader";
const Number =
Scripts/Garden/PlantEncyclopedia.js
+1 -1
View File
@@ -367,7 +367,7 @@ function CreatePlantEncyclopediaCard(
);
Header.className =
"PlantEncyclopediaHeader";
"PanelHeader PlantEncyclopediaHeader";
const Number =
Scripts/Garden/Save.js
+18 -3
View File
@@ -392,7 +392,7 @@ function CreateNewSave() {
return NormalizeSaveData({
Version: 4,
Version: 5,
Revision: 0,
LastSavedAt: Date.now(),
@@ -432,7 +432,8 @@ function CreateNewSave() {
PlantInformation: false,
GardenOverview: false,
GardenEconomy: false,
MutationHints: false
MutationHints: false,
MutationHintsLevel: 0
},
Preferences: {
@@ -469,7 +470,7 @@ function NormalizeSaveData(
Number(
SaveData.Version ?? 1
),
4
5
);
SaveData.Revision = Number(
@@ -688,6 +689,20 @@ function NormalizeSaveData(
SaveData.Upgrades.MutationHints ===
true;
SaveData.Upgrades.MutationHintsLevel =
Math.max(
0,
Math.min(
1,
Math.floor(
Number(
SaveData.Upgrades
.MutationHintsLevel ?? 0
) || 0
)
)
);
SaveData.Preferences ??= {};
Scripts/Garden/Shop.js
+114 -94
View File
@@ -485,7 +485,7 @@ function CreateTrowelToolCard() {
);
Header.className =
"ShopItemHeader ShopItemHeaderOwned";
"PanelHeader PanelHeaderInset ShopItemHeader ShopItemHeaderOwned";
const Name =
@@ -584,7 +584,7 @@ function CreateToolUnlockCard(
);
Header.className =
"ShopItemHeader" +
"PanelHeader PanelHeaderInset ShopItemHeader" +
(
IsOwned
? " ShopItemHeaderOwned"
@@ -724,7 +724,7 @@ function CreateShovelToolCard() {
);
Header.className =
"ShopItemHeader" +
"PanelHeader PanelHeaderInset ShopItemHeader" +
(
IsOwned
? " ShopItemHeaderOwned"
@@ -761,27 +761,22 @@ function CreateShovelToolCard() {
Details.append(
CreateShopStat(
"Status",
"Current",
IsOwned
? "Unlocked"
? GetShovelLevelDescription(
Level
)
: "Locked"
),
CreateShopStat(
IsOwned
? "Current"
: "On unlock",
GetShovelLevelDescription(
Level
)
),
CreateShopStat(
IsOwned
? "Next"
: "First upgrade",
"Next",
IsOwned &&
Level >= ShovelMaximumLevel
? "Maximum level"
: GetShovelLevelDescription(
Level + 1
IsOwned
? Level + 1
: 0
)
)
);
@@ -860,18 +855,18 @@ function GetShovelLevelDescription(
Level
) {
if (Level <= 0) {
return "Level 0 - returns nothing";
return "Returns nothing";
}
if (Level === 1) {
return "Level 1 - returns 33% of seed cost";
return "Returns 33% of seed cost";
}
if (Level === 2) {
return "Level 2 - returns 66% of seed cost";
return "Returns 66% of seed cost";
}
return "Level 3 - returns the planted seed";
return "Returns the planted seed";
}
@@ -910,7 +905,7 @@ function CreateFertilizerToolCard() {
);
Header.className =
"ShopItemHeader" +
"PanelHeader PanelHeaderInset ShopItemHeader" +
(
IsOwned
? " ShopItemHeaderOwned"
@@ -946,12 +941,6 @@ function CreateFertilizerToolCard() {
"ShopItemDetails";
Details.append(
CreateShopStat(
"Status",
IsOwned
? "Unlocked"
: "Locked"
),
CreateShopStat(
"Current uses",
Number(
@@ -960,30 +949,23 @@ function CreateFertilizerToolCard() {
).toLocaleString()
),
CreateShopStat(
"Current",
IsOwned
? "Current"
: "On unlock",
"Level " +
Level +
" - " +
FertilizerGrowthMinutes[
Level
] +
" minutes"
? FertilizerGrowthMinutes[
Level
] + " minutes"
: "Locked"
),
CreateShopStat(
IsOwned
? "Next"
: "First upgrade",
"Next",
IsOwned &&
Level >= FertilizerMaximumLevel
? "Maximum level"
: "Level " +
(Level + 1) +
" - " +
FertilizerGrowthMinutes[
Level + 1
] +
" minutes"
: FertilizerGrowthMinutes[
IsOwned
? Level + 1
: 0
] + " minutes"
)
);
@@ -1184,7 +1166,7 @@ function CreateGardenExpansionCard(
);
Header.className =
"ShopItemHeader";
"PanelHeader PanelHeaderInset ShopItemHeader";
const Name =
@@ -1311,7 +1293,7 @@ function CreateNewGardenCard() {
);
Header.className =
"ShopItemHeader";
"PanelHeader PanelHeaderInset ShopItemHeader";
const Name =
@@ -1420,7 +1402,7 @@ function CreatePlantInformationUpgradeCard() {
);
Header.className =
"ShopItemHeader" +
"PanelHeader PanelHeaderInset ShopItemHeader" +
(
IsOwned
? " ShopItemHeaderOwned"
@@ -1541,7 +1523,7 @@ function CreateGardenOverviewUpgradeCard() {
);
Header.className =
"ShopItemHeader" +
"PanelHeader PanelHeaderInset ShopItemHeader" +
(
IsOwned
? " ShopItemHeaderOwned"
@@ -1662,7 +1644,7 @@ function CreateGardenEconomyUpgradeCard() {
);
Header.className =
"ShopItemHeader" +
"PanelHeader PanelHeaderInset ShopItemHeader" +
(
IsOwned
? " ShopItemHeaderOwned"
@@ -1757,14 +1739,25 @@ function CreateGardenEconomyUpgradeCard() {
function CreateMutationHintsUpgradeCard() {
const Cost =
GetMutationHintsUpgradeCost();
const IsOwned =
const IsUnlocked =
HasMutationHintsUpgrade(
ShopSave
);
const Level =
GetMutationHintsLevel(
ShopSave
);
const Cost =
GetMutationHintsUpgradeCost(
ShopSave
);
const IsMaximumLevel =
IsUnlocked &&
Level >= MutationHintsMaximumLevel;
const Card =
document.createElement(
@@ -1781,9 +1774,9 @@ function CreateMutationHintsUpgradeCard() {
);
Header.className =
"ShopItemHeader" +
"PanelHeader PanelHeaderInset ShopItemHeader" +
(
IsOwned
IsMaximumLevel
? " ShopItemHeaderOwned"
: ""
);
@@ -1806,7 +1799,7 @@ function CreateMutationHintsUpgradeCard() {
);
Description.textContent =
"Show subtle hints for undiscovered mutations once you've discovered the plants needed to attempt them. Hints appear in the Mutation encyclopedia without revealing the recipe.";
"Show subtle hints for undiscovered mutations once you've discovered the plants needed to attempt them. The first level shows one hint; the upgrade shows every available hint, up to 10.";
const Details =
@@ -1819,44 +1812,52 @@ function CreateMutationHintsUpgradeCard() {
Details.append(
CreateShopStat(
"Mutation hints",
IsOwned
? "Unlocked"
: "Locked"
"Current",
!IsUnlocked
? "Locked"
: Level >= MutationHintsMaximumLevel
? "All hints (max 10)"
: "1 hint at a time"
),
CreateShopStat(
"Requirements",
"Required plants discovered"
"Next",
!IsUnlocked
? "1 hint at a time"
: IsMaximumLevel
? "Maximum level"
: "All hints (max 10)"
)
);
const BuyButton =
const ActionButton =
document.createElement(
"button"
);
BuyButton.className =
ActionButton.className =
"ActionButton ShopBuyButton";
BuyButton.type = "button";
ActionButton.type = "button";
if (IsOwned) {
BuyButton.textContent =
"Purchased";
if (Cost === null) {
ActionButton.textContent =
"Maximum level";
BuyButton.disabled = true;
ActionButton.disabled = true;
} else {
BuyButton.textContent =
"Buy - " +
ActionButton.textContent =
(IsUnlocked
? "Upgrade - "
: "Buy - ") +
Cost.toLocaleString() +
" Dew";
BuyButton.disabled =
ActionButton.disabled =
ShopSave.Currency.Dew < Cost ||
ShopPurchasePending;
BuyButton.addEventListener(
ActionButton.addEventListener(
"click",
BuyMutationHintsUpgrade
);
@@ -1867,7 +1868,7 @@ function CreateMutationHintsUpgradeCard() {
Header,
Description,
Details,
BuyButton
ActionButton
);
@@ -1893,7 +1894,7 @@ function CreateShopSeedCard(
);
Header.className =
"ShopItemHeader";
"PanelHeader PanelHeaderInset ShopItemHeader";
const Name =
@@ -3028,25 +3029,33 @@ async function BuyGardenEconomyUpgrade() {
async function BuyMutationHintsUpgrade() {
if (
ShopPurchasePending ||
HasMutationHintsUpgrade(
ShopSave
)
) {
if (ShopPurchasePending) {
return;
}
const IsUnlocked =
HasMutationHintsUpgrade(
ShopSave
);
const Cost =
GetMutationHintsUpgradeCost();
GetMutationHintsUpgradeCost(
ShopSave
);
if (Cost === null) {
return;
}
if (
ShopSave.Currency.Dew <
Cost
) {
SetShopMessage(
"You don't have enough Dew for Mutation hints."
IsUnlocked
? "You don't have enough Dew to upgrade Mutation hints."
: "You don't have enough Dew for Mutation hints."
);
return;
@@ -3062,16 +3071,27 @@ async function BuyMutationHintsUpgrade() {
ShopSave.Statistics.CurrencySpent.Dew +=
Cost;
UnlockMutationHints(
ShopSave
);
if (IsUnlocked) {
UpgradeMutationHints(
ShopSave
);
SetShopMessage(
"Upgraded Mutation hints for " +
Cost.toLocaleString() +
" Dew. Up to 10 eligible hints are now shown at once."
);
} else {
UnlockMutationHints(
ShopSave
);
SetShopMessage(
"Bought Mutation hints for " +
Cost.toLocaleString() +
" Dew. Eligible hints are now visible in the Mutation encyclopedia."
);
SetShopMessage(
"Bought Mutation hints for " +
Cost.toLocaleString() +
" Dew. The lowest-ID eligible hint is now visible in the Mutation encyclopedia."
);
}
RenderShop();
Scripts/Garden/Upgrades.js
+102 -3
View File
@@ -23,7 +23,10 @@ const GardenExpansionBaseCost = 1000;
const PlantInformationUpgradeCost = 500;
const GardenOverviewUpgradeCost = 1000;
const GardenEconomyUpgradeCost = 1000;
const MutationHintsUpgradeCost = 1500;
const MutationHintsUnlockCost = 1500;
const MutationHintsUpgradeCostMultiplier = 2;
const MutationHintsMaximumLevel = 1;
const MutationHintsMaximumVisible = 10;
const NewGardenBaseCost = 4000;
const NewGardenCostMultiplier = 1.5;
@@ -290,8 +293,73 @@ function HasMutationHintsUpgrade(
}
function GetMutationHintsUpgradeCost() {
return MutationHintsUpgradeCost;
function GetMutationHintsLevel(
SaveData
) {
return Math.max(
0,
Math.min(
MutationHintsMaximumLevel,
Math.floor(
Number(
SaveData
?.Upgrades
?.MutationHintsLevel ?? 0
) || 0
)
)
);
}
function GetMutationHintsDisplayLimit(
SaveData
) {
if (
!HasMutationHintsUpgrade(
SaveData
)
) {
return 0;
}
return GetMutationHintsLevel(
SaveData
) >= MutationHintsMaximumLevel
? MutationHintsMaximumVisible
: 1;
}
function GetMutationHintsUpgradeCost(
SaveData
) {
if (
!HasMutationHintsUpgrade(
SaveData
)
) {
return MutationHintsUnlockCost;
}
const Level =
GetMutationHintsLevel(
SaveData
);
if (
Level >= MutationHintsMaximumLevel
) {
return null;
}
return Math.round(
MutationHintsUnlockCost *
Math.pow(
MutationHintsUpgradeCostMultiplier,
Level + 1
)
);
}
@@ -301,6 +369,37 @@ function UnlockMutationHints(
SaveData.Upgrades ??= {};
SaveData.Upgrades.MutationHints =
true;
SaveData.Upgrades.MutationHintsLevel =
0;
}
function UpgradeMutationHints(
SaveData
) {
if (
!HasMutationHintsUpgrade(
SaveData
)
) {
return false;
}
const Level =
GetMutationHintsLevel(
SaveData
);
if (
Level >= MutationHintsMaximumLevel
) {
return false;
}
SaveData.Upgrades.MutationHintsLevel =
Level + 1;
return true;
}
Styles/Style.css
+60 -131
View File
@@ -76,6 +76,25 @@ body {
border: 4px solid var(--Mauve);
}
.PanelHeader {
display: flex;
flex-wrap: wrap;
gap: 0.75rem;
align-items: baseline;
margin: 0;
padding: 0.75rem 1rem;
background-color: var(--Surface0);
border-bottom: 3px solid var(--Surface2);
}
.PanelHeaderInset {
margin: -0.75rem -0.75rem 0.75rem;
}
.PanelHeader h2, .PanelHeader h3 {
margin: 0;
}
.StatusPanel {
margin-bottom: 1.5rem;
padding: 0.75rem 1rem;
@@ -87,12 +106,6 @@ body {
padding: 0;
}
.GardenInfoHeading {
margin: 0;
padding: 0.75rem 1rem;
border-bottom: 3px solid var(--Surface2);
}
.GardenInfoRow {
display: grid;
grid-template-columns: repeat( 2, minmax(0, 1fr) );
@@ -440,16 +453,8 @@ input, button, textarea, select {
}
.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 {
@@ -575,12 +580,6 @@ input, button, textarea, select {
padding: 0.75rem;
}
.GardenToolsPanel h2,
.GardenInventoryPanel h2,
.GardenPlotsPanel h2 {
margin-bottom: 0.75rem;
}
.GardenToolsPanel .ToolList,
.GardenInventoryPanel .SeedList {
flex-direction: row;
@@ -798,11 +797,7 @@ input, button, textarea, select {
.GardenUser, .Leaderboard {
margin-top: 1.5rem;
padding: 1rem;
}
.GardenUser h2, .Leaderboard h2 {
margin-bottom: 1rem;
padding: 0.75rem;
}
.GardenUser input, .GardenUser button {
@@ -959,14 +954,10 @@ input, button, textarea, select {
.ProfileSection {
margin-top: 1.5rem;
padding: 1rem;
padding: 0.75rem;
}
.ProfileSection h2 {
margin-bottom: 1rem;
}
.ProfileSection h3 {
.ProfileSection h3:not(.PanelHeader) {
margin-top: 1.5rem;
}
@@ -1334,16 +1325,11 @@ input, button, textarea, select {
}
.ShopItemHeader {
display: flex;
flex-wrap: wrap;
gap: 0.5rem;
align-items: baseline;
padding-bottom: 0.5rem;
border-bottom: 3px solid var(--Surface2);
}
.ShopItemHeader h3 {
margin: 0;
.ShopItem > .PanelHeaderInset {
margin-bottom: 0;
}
.ShopItemHeaderOwned {
@@ -1556,33 +1542,26 @@ input, button, textarea, select {
/* * Plant encyclopedia */
.PlantEncyclopediaList {
.PlantEncyclopediaList,
.MutationEncyclopediaList {
display: flex;
flex-direction: column;
gap: 1rem;
margin-top: 0;
}
.PlantEncyclopediaCard {
.PlantEncyclopediaCard,
.MutationEncyclopediaCard {
overflow: hidden;
box-shadow: 3px 3px 0 var(--Crust);
}
.PlantEncyclopediaHeader {
display: flex;
gap: 0.75rem;
align-items: baseline;
padding: 0.75rem 1rem;
background-color: var(--Surface0);
border-bottom: 3px solid var(--Surface2);
}
.PlantEncyclopediaHeader h2 {
margin: 0;
color: var(--Green);
}
.PlantEncyclopediaNumber {
.PlantEncyclopediaNumber,
.MutationEncyclopediaNumber {
flex: 0 0 auto;
color: var(--Overlay2);
font-size: 1.1rem;
@@ -1614,7 +1593,8 @@ input, button, textarea, select {
margin-bottom: 0.75rem;
}
.PlantEncyclopediaStat {
.PlantEncyclopediaStat,
.MutationEncyclopediaStat {
display: flex;
justify-content: space-between;
gap: 0.75rem;
@@ -1626,12 +1606,14 @@ input, button, textarea, select {
border-bottom: 0;
}
.PlantEncyclopediaStatName {
.PlantEncyclopediaStatName,
.MutationEncyclopediaStatName {
flex: 0 0 auto;
color: var(--Subtext1);
}
.PlantEncyclopediaStat > :last-child {
.PlantEncyclopediaStat > :last-child,
.MutationEncyclopediaStat > :last-child {
min-width: 0;
text-align: right;
overflow-wrap: anywhere;
@@ -1651,12 +1633,7 @@ input, button, textarea, select {
border-top: 3px solid var(--Surface2);
}
.PlantEncyclopediaRelationGroup h3 {
margin-bottom: 0.5rem;
color: var(--Peach);
font-size: 1rem;
}
.PlantEncyclopediaRelationGroup h3,
.PlantEncyclopediaRelationList {
max-height: 7rem;
margin: 0;
@@ -1664,15 +1641,20 @@ input, button, textarea, select {
overflow-y: auto;
}
.PlantEncyclopediaRelationList li {
.PlantEncyclopediaRelationList li,
.MutationEncyclopediaRelationList li {
margin-bottom: 0.35rem;
}
.PlantEncyclopediaRelationList li:last-child {
.PlantEncyclopediaRelationList li:last-child,
.MutationEncyclopediaRelationList li:last-child {
margin-bottom: 0;
}
.PlantEncyclopediaRelationUnknown, .PlantEncyclopediaRelationEmpty {
.PlantEncyclopediaRelationUnknown,
.PlantEncyclopediaRelationEmpty,
.MutationEncyclopediaRelationUnknown,
.MutationEncyclopediaRelationEmpty {
color: var(--Overlay1);
}
@@ -1688,11 +1670,13 @@ input, button, textarea, select {
justify-self: center;
}
.PlantEncyclopediaStat > :last-child {
.PlantEncyclopediaStat > :last-child,
.MutationEncyclopediaStat > :last-child {
text-align: left;
}
.PlantEncyclopediaStat {
.PlantEncyclopediaStat,
.MutationEncyclopediaStat {
flex-direction: column;
gap: 0.2rem;
}
@@ -1700,38 +1684,10 @@ input, button, textarea, select {
/* * Mutation encyclopedia */
.MutationEncyclopediaList {
display: flex;
flex-direction: column;
gap: 1rem;
margin-top: 0;
}
.MutationEncyclopediaCard {
overflow: hidden;
box-shadow: 3px 3px 0 var(--Crust);
}
.MutationEncyclopediaHeader {
display: flex;
gap: 0.75rem;
align-items: baseline;
padding: 0.75rem 1rem;
background-color: var(--Surface0);
border-bottom: 3px solid var(--Surface2);
}
.MutationEncyclopediaHeader h2 {
margin: 0;
color: var(--Mauve);
}
.MutationEncyclopediaNumber {
flex: 0 0 auto;
color: var(--Overlay2);
font-size: 1.1rem;
}
.MutationEncyclopediaBody {
padding: 1rem;
}
@@ -1753,6 +1709,17 @@ input, button, textarea, select {
color: var(--Subtext1);
}
.MutationHintList {
margin: 0;
padding: 0;
color: var(--Subtext1);
list-style: none;
}
.MutationHintList li + li {
margin-top: 0.35rem;
}
.MutationEncyclopediaStats {
display: grid;
grid-template-columns: repeat( 2, minmax(0, 1fr) );
@@ -1760,24 +1727,6 @@ input, button, textarea, select {
margin-bottom: 1.25rem;
}
.MutationEncyclopediaStat {
display: flex;
justify-content: space-between;
gap: 0.75rem;
padding: 0.35rem 0;
border-bottom: 2px solid var(--Surface0);
}
.MutationEncyclopediaStatName {
flex: 0 0 auto;
color: var(--Subtext1);
}
.MutationEncyclopediaStat > :last-child {
min-width: 0;
text-align: right;
overflow-wrap: anywhere;
}
.MutationEncyclopediaRecipeSection {
margin-bottom: 1.25rem;
@@ -1876,18 +1825,6 @@ input, button, textarea, select {
padding-left: 1.25rem;
}
.MutationEncyclopediaRelationList li {
margin-bottom: 0.35rem;
}
.MutationEncyclopediaRelationList li:last-child {
margin-bottom: 0;
}
.MutationEncyclopediaRelationUnknown, .MutationEncyclopediaRelationEmpty {
color: var(--Overlay1);
}
@media (max-width: 700px) {
.MutationEncyclopediaStats, .MutationEncyclopediaRelations {
grid-template-columns: 1fr;
@@ -1902,14 +1839,6 @@ input, button, textarea, select {
transform: rotate(90deg);
}
.MutationEncyclopediaStat {
flex-direction: column;
gap: 0.2rem;
}
.MutationEncyclopediaStat > :last-child {
text-align: left;
}
}
/* * Admin editors */