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;
|
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 input:focus,
|
||||||
.af-form select:focus,
|
.af-form select:focus,
|
||||||
.af-form textarea:focus,
|
.af-form textarea:focus,
|
||||||
|
|||||||
+34
-86
@@ -32,103 +32,51 @@
|
|||||||
<main class="af-shell">
|
<main class="af-shell">
|
||||||
<section class="af-card">
|
<section class="af-card">
|
||||||
<div class="af-card-header">
|
<div class="af-card-header">
|
||||||
<h1>About the Anomaly Front toolkit</h1>
|
<h1>Hey there! You found the Anomaly Front Stats Page by Fretux and Losernoob124</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>
|
|
||||||
</div>
|
</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">
|
<h2>Our Mission</h2>
|
||||||
<div class="af-card">
|
|
||||||
<div class="af-card-header">
|
|
||||||
<h2>How we work</h2>
|
|
||||||
<p>
|
<p>
|
||||||
Every number starts as a hypothesis. We iterate fast, log the results, and tag each change with
|
We created this platform to help the Anomaly Front community quickly and easily calculate gun DPS and DPM.
|
||||||
context so the community can track the why behind each adjustment.
|
No spreadsheets, no hassle. Whether you're theorycrafting a Deathwish loadout or comparing your sidearms,
|
||||||
|
our tool’s built to support your grind.
|
||||||
</p>
|
</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">
|
<ul class="af-list">
|
||||||
<li>Prototype numbers in the calculator.</li>
|
<li>Fretux – Frontend Developer & Data Specialist. Designs the UI and ensures stat accuracy.</li>
|
||||||
<li>Layer in modifiers and operative perks.</li>
|
<li>Losernoob124 – Backend Developer. Handles everything under the hood and makes sure the calculators work.</li>
|
||||||
<li>Review pacing against target roles.</li>
|
|
||||||
</ul>
|
</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">
|
<h2>Frequently Asked Questions</h2>
|
||||||
<div class="af-card">
|
<h3>How do you calculate DPS and DPM?</h3>
|
||||||
<div class="af-card-header">
|
|
||||||
<h2>Release posture</h2>
|
|
||||||
<p>
|
<p>
|
||||||
Everything shown here is a placeholder designed to help us think through combat pacing while the
|
We use data from Lanz1021's Stat Sheet, convert it into a JSON structure, and use it with formulas similar
|
||||||
data set is still evolving.
|
to what’s on the sheet.
|
||||||
</p>
|
</p>
|
||||||
</div>
|
<h3>How often are stats updated?</h3>
|
||||||
</div>
|
|
||||||
<div class="af-card">
|
|
||||||
<div class="af-card-header">
|
|
||||||
<h2>Team notes</h2>
|
|
||||||
<p>
|
<p>
|
||||||
This is a community-driven project. Use the feedback channel to share balancing ideas, feature
|
We update our database every time Anomaly Front releases a gameplay patch or changes weapon stats.
|
||||||
requests, and UI improvements.
|
|
||||||
</p>
|
</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>
|
</section>
|
||||||
</main>
|
</main>
|
||||||
|
|
||||||
|
|||||||
@@ -6,7 +6,7 @@
|
|||||||
<link rel="stylesheet" href="{{ url_for('static', filename='style.css') }}">
|
<link rel="stylesheet" href="{{ url_for('static', filename='style.css') }}">
|
||||||
<title>Anomaly Front | Weapon Factory</title>
|
<title>Anomaly Front | Weapon Factory</title>
|
||||||
</head>
|
</head>
|
||||||
<body class="af-body">
|
<body class="af-body af-calculator-page">
|
||||||
<header class="af-header">
|
<header class="af-header">
|
||||||
<div class="af-brand">
|
<div class="af-brand">
|
||||||
<div class="af-logo" aria-hidden="true">
|
<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>
|
<span class="af-field-hint">Pick an operative to load their unique modifiers.</span>
|
||||||
</label>
|
</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">
|
<div class="af-modifier-subset">
|
||||||
<p class="af-modifier-title">Operative modifiers</p>
|
|
||||||
<div class="af-checkbox-grid" id="af-operative-modifiers">
|
<div class="af-checkbox-grid" id="af-operative-modifiers">
|
||||||
<p class="af-empty-hint">Select an operative to see perk modifiers.</p>
|
<p class="af-empty-hint">Select an operative to see perk modifiers.</p>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
</details>
|
||||||
|
|
||||||
|
<details class="af-details">
|
||||||
|
<summary>Item buffs</summary>
|
||||||
<div class="af-modifier-subset">
|
<div class="af-modifier-subset">
|
||||||
<p class="af-modifier-title">Item buffs</p>
|
|
||||||
<div class="af-checkbox-grid" id="af-item-modifiers"></div>
|
<div class="af-checkbox-grid" id="af-item-modifiers"></div>
|
||||||
</div>
|
</div>
|
||||||
|
</details>
|
||||||
|
|
||||||
|
<details class="af-details">
|
||||||
|
<summary>Operative perks</summary>
|
||||||
<div class="af-modifier-subset">
|
<div class="af-modifier-subset">
|
||||||
<p class="af-modifier-title">Operative perks</p>
|
|
||||||
<div class="af-checkbox-grid" id="af-perk-modifiers"></div>
|
<div class="af-checkbox-grid" id="af-perk-modifiers"></div>
|
||||||
</div>
|
</div>
|
||||||
|
</details>
|
||||||
|
|
||||||
|
<details class="af-details">
|
||||||
|
<summary>Ability perks</summary>
|
||||||
<div class="af-modifier-subset">
|
<div class="af-modifier-subset">
|
||||||
<p class="af-modifier-title">Ability perks</p>
|
|
||||||
<div class="af-checkbox-grid" id="af-ability-modifiers"></div>
|
<div class="af-checkbox-grid" id="af-ability-modifiers"></div>
|
||||||
</div>
|
</div>
|
||||||
|
</details>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div class="af-active-modifiers">
|
<div class="af-active-modifiers">
|
||||||
|
|||||||
Reference in New Issue
Block a user