Merge pull request #5 from Fretuks/update-about-us-page-and-calculator-styling
Rework About page and compact modifier UI
This commit is contained in:
GitHub
@@ -762,6 +762,50 @@ body.menu-open {
|
||||
font-size: 0.95rem;
|
||||
}
|
||||
|
||||
.af-calculator-page input[type="text"],
|
||||
.af-calculator-page input[type="number"],
|
||||
.af-calculator-page select,
|
||||
.af-calculator-page textarea {
|
||||
background: rgba(15, 23, 42, 0.7);
|
||||
color: #f8fafc;
|
||||
border: 1px solid rgba(148, 163, 184, 0.3);
|
||||
}
|
||||
|
||||
.af-details {
|
||||
margin-top: 12px;
|
||||
padding: 12px 16px;
|
||||
border-radius: 16px;
|
||||
border: 1px solid rgba(148, 163, 184, 0.25);
|
||||
background: rgba(2, 6, 23, 0.6);
|
||||
}
|
||||
|
||||
.af-details summary {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 10px;
|
||||
cursor: pointer;
|
||||
font-weight: 600;
|
||||
color: #e2e8f0;
|
||||
list-style: none;
|
||||
}
|
||||
|
||||
.af-details summary::-webkit-details-marker {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.af-details summary::before {
|
||||
content: "▸";
|
||||
transition: transform 0.2s ease;
|
||||
}
|
||||
|
||||
.af-details[open] summary::before {
|
||||
transform: rotate(90deg);
|
||||
}
|
||||
|
||||
.af-details .af-modifier-subset {
|
||||
margin-top: 12px;
|
||||
}
|
||||
|
||||
.af-form input:focus,
|
||||
.af-form select:focus,
|
||||
.af-form textarea:focus,
|
||||
|
||||
+34
-86
@@ -32,103 +32,51 @@
|
||||
<main class="af-shell">
|
||||
<section class="af-card">
|
||||
<div class="af-card-header">
|
||||
<h1>About the Anomaly Front toolkit</h1>
|
||||
<p>
|
||||
This is the war room for balancing the Anomaly Front sandbox. We are rebuilding every tool from the ground
|
||||
up to avoid legacy stats, outdated data, and mismatched tuning guidelines.
|
||||
</p>
|
||||
<h1>Hey there! You found the Anomaly Front Stats Page by Fretux and Losernoob124</h1>
|
||||
</div>
|
||||
<div class="af-copy-grid">
|
||||
<div>
|
||||
<h2>Purpose</h2>
|
||||
<p>
|
||||
Provide a shared workspace for balancing weapons, capturing loadout notes, and testing combat pacing
|
||||
as the library grows.
|
||||
</p>
|
||||
</div>
|
||||
<div>
|
||||
<h2>What is live today</h2>
|
||||
<ul>
|
||||
<li>Baseline combat calculator</li>
|
||||
<li>Modifiers + operative stacks</li>
|
||||
<li>Feedback capture workflow</li>
|
||||
</ul>
|
||||
</div>
|
||||
<div>
|
||||
<h2>What comes next</h2>
|
||||
<ul>
|
||||
<li>Shared weapon library for early drafts</li>
|
||||
<li>Attachment tuning stacks</li>
|
||||
<li>Operative perks and passive effects</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
<div class="af-stat-grid">
|
||||
<div class="af-stat-card">
|
||||
<p class="af-stat-label">Weapon types tracked</p>
|
||||
<p class="af-stat-value">20+</p>
|
||||
</div>
|
||||
<div class="af-stat-card">
|
||||
<p class="af-stat-label">Community draft builds</p>
|
||||
<p class="af-stat-value">120+</p>
|
||||
</div>
|
||||
<div class="af-stat-card">
|
||||
<p class="af-stat-label">Balance focus</p>
|
||||
<p class="af-stat-value">Time-to-eliminate</p>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section class="af-grid">
|
||||
<div class="af-card">
|
||||
<div class="af-card-header">
|
||||
<h2>How we work</h2>
|
||||
<h2>Our Mission</h2>
|
||||
<p>
|
||||
Every number starts as a hypothesis. We iterate fast, log the results, and tag each change with
|
||||
context so the community can track the why behind each adjustment.
|
||||
We created this platform to help the Anomaly Front community quickly and easily calculate gun DPS and DPM.
|
||||
No spreadsheets, no hassle. Whether you're theorycrafting a Deathwish loadout or comparing your sidearms,
|
||||
our tool’s built to support your grind.
|
||||
</p>
|
||||
</div>
|
||||
<p>
|
||||
Got ideas or stat suggestions? Hit us up on Discord or submit feedback via our Suggestions Page.
|
||||
</p>
|
||||
|
||||
<h2>Our Story</h2>
|
||||
<p>
|
||||
It started with a spreadsheet... and frustration. Calculating DPS manually was tedious and we knew we could
|
||||
do better. What began as a side hobby by Losernoob124 was reignited by Fretux and evolved into a full web app
|
||||
through plenty of bug fixing, community help, and caffeine.
|
||||
</p>
|
||||
|
||||
<h2>The Team</h2>
|
||||
<ul class="af-list">
|
||||
<li>Prototype numbers in the calculator.</li>
|
||||
<li>Layer in modifiers and operative perks.</li>
|
||||
<li>Review pacing against target roles.</li>
|
||||
<li>Fretux – Frontend Developer & Data Specialist. Designs the UI and ensures stat accuracy.</li>
|
||||
<li>Losernoob124 – Backend Developer. Handles everything under the hood and makes sure the calculators work.</li>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="af-card">
|
||||
<div class="af-card-header">
|
||||
<h2>Community signals</h2>
|
||||
<p>
|
||||
We highlight the most requested tweaks, theme them by role, and bring them into each balancing pass.
|
||||
</p>
|
||||
</div>
|
||||
<div class="af-pill-grid">
|
||||
<span class="af-pill">Time-to-eliminate feels heavy</span>
|
||||
<span class="af-pill">Operative synergy clarity</span>
|
||||
<span class="af-pill">Reload pacing in late waves</span>
|
||||
<span class="af-pill">Attachment power spikes</span>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section class="af-grid">
|
||||
<div class="af-card">
|
||||
<div class="af-card-header">
|
||||
<h2>Release posture</h2>
|
||||
<h2>Frequently Asked Questions</h2>
|
||||
<h3>How do you calculate DPS and DPM?</h3>
|
||||
<p>
|
||||
Everything shown here is a placeholder designed to help us think through combat pacing while the
|
||||
data set is still evolving.
|
||||
We use data from Lanz1021's Stat Sheet, convert it into a JSON structure, and use it with formulas similar
|
||||
to what’s on the sheet.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="af-card">
|
||||
<div class="af-card-header">
|
||||
<h2>Team notes</h2>
|
||||
<h3>How often are stats updated?</h3>
|
||||
<p>
|
||||
This is a community-driven project. Use the feedback channel to share balancing ideas, feature
|
||||
requests, and UI improvements.
|
||||
We update our database every time Anomaly Front releases a gameplay patch or changes weapon stats.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<h2>Special Thanks</h2>
|
||||
<ul class="af-list">
|
||||
<li>gameknight90999 (holdenn): Helped with various stat and weapon data and ideas</li>
|
||||
<li>Kris HD: Motivation + bug hunting</li>
|
||||
<li>Lanz1021: Feedback & review</li>
|
||||
<li>YOU: For visiting — thank you!</li>
|
||||
</ul>
|
||||
<p>Thanks for using Anomaly Front Stats</p>
|
||||
</section>
|
||||
</main>
|
||||
|
||||
|
||||
@@ -6,7 +6,7 @@
|
||||
<link rel="stylesheet" href="{{ url_for('static', filename='style.css') }}">
|
||||
<title>Anomaly Front | Weapon Factory</title>
|
||||
</head>
|
||||
<body class="af-body">
|
||||
<body class="af-body af-calculator-page">
|
||||
<header class="af-header">
|
||||
<div class="af-brand">
|
||||
<div class="af-logo" aria-hidden="true">
|
||||
@@ -161,27 +161,37 @@
|
||||
<span class="af-field-hint">Pick an operative to load their unique modifiers.</span>
|
||||
</label>
|
||||
|
||||
<p class="af-field-hint">Expand each section to keep the page compact while you tweak modifiers.</p>
|
||||
|
||||
<details class="af-details">
|
||||
<summary>Operative modifiers</summary>
|
||||
<div class="af-modifier-subset">
|
||||
<p class="af-modifier-title">Operative modifiers</p>
|
||||
<div class="af-checkbox-grid" id="af-operative-modifiers">
|
||||
<p class="af-empty-hint">Select an operative to see perk modifiers.</p>
|
||||
</div>
|
||||
</div>
|
||||
</details>
|
||||
|
||||
<details class="af-details">
|
||||
<summary>Item buffs</summary>
|
||||
<div class="af-modifier-subset">
|
||||
<p class="af-modifier-title">Item buffs</p>
|
||||
<div class="af-checkbox-grid" id="af-item-modifiers"></div>
|
||||
</div>
|
||||
</details>
|
||||
|
||||
<details class="af-details">
|
||||
<summary>Operative perks</summary>
|
||||
<div class="af-modifier-subset">
|
||||
<p class="af-modifier-title">Operative perks</p>
|
||||
<div class="af-checkbox-grid" id="af-perk-modifiers"></div>
|
||||
</div>
|
||||
</details>
|
||||
|
||||
<details class="af-details">
|
||||
<summary>Ability perks</summary>
|
||||
<div class="af-modifier-subset">
|
||||
<p class="af-modifier-title">Ability perks</p>
|
||||
<div class="af-checkbox-grid" id="af-ability-modifiers"></div>
|
||||
</div>
|
||||
</details>
|
||||
</div>
|
||||
|
||||
<div class="af-active-modifiers">
|
||||
|
||||
Reference in New Issue
Block a user