Skip to content

Commit ef965bc

Browse files
committed
commit d4f5e6a7b8c9d0e1f2g3h4i5j6k7l8m9n0o1p2q3
1 parent a72af9f commit ef965bc

1 file changed

Lines changed: 187 additions & 1 deletion

File tree

templates/dashboard_security.html

Lines changed: 187 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -4,7 +4,193 @@
44
<div class="card">
55
<h1>Security</h1>
66
<p class="muted">Security settings, access control, and audit logs.</p>
7-
<p>This is a placeholder page for Security settings.</p>
7+
8+
<section aria-labelledby="sec-overview">
9+
<h2 id="sec-overview">Overview</h2>
10+
<p>
11+
Manage your account and organization security settings from one place. Use the controls below to enforce
12+
authentication policies, review and revoke active sessions, manage API keys and OAuth applications, and
13+
inspect audit logs for important events.
14+
</p>
15+
</section>
16+
17+
<hr />
18+
19+
<section aria-labelledby="sec-authentication">
20+
<h2 id="sec-authentication">Authentication</h2>
21+
<p class="muted">Password policy, multi-factor authentication (MFA), and SSO settings.</p>
22+
23+
<div class="form-grid">
24+
<div>
25+
<h3>Password policy</h3>
26+
<p>
27+
Enforce strong passwords across your organization. We recommend requiring a minimum length of 12
28+
characters and enabling checks for common leaked passwords.
29+
</p>
30+
<form method="post" action="#">
31+
<!-- Placeholder controls; wiring to server can be added later -->
32+
<label>
33+
Minimum password length
34+
<input type="number" name="min_length" value="12" min="8" max="128" />
35+
</label>
36+
<label>
37+
Require character classes
38+
<select name="char_classes">
39+
<option value="recommended">Recommended (upper, lower, digits, symbols)</option>
40+
<option value="optional">Optional</option>
41+
</select>
42+
</label>
43+
<button class="btn" disabled>Save (not wired)</button>
44+
</form>
45+
</div>
46+
47+
<div>
48+
<h3>Multi-factor authentication (MFA)</h3>
49+
<p>
50+
Add an extra layer of security by requiring a second verification factor (TOTP, SMS, or hardware
51+
security keys) when users sign in.
52+
</p>
53+
<ul>
54+
<li>TOTP (Authenticator apps like Google Authenticator or Authy)</li>
55+
<li>SMS (text messages) — note: less secure than TOTP</li>
56+
<li>Hardware security keys (WebAuthn / U2F)</li>
57+
</ul>
58+
<div class="muted">Use the buttons below to enable per-account MFA or enforce organization-wide MFA.</div>
59+
<div class="actions">
60+
<button class="btn" disabled>Enable MFA for my account</button>
61+
<button class="btn" disabled>Enforce MFA organization-wide</button>
62+
</div>
63+
</div>
64+
</div>
65+
</section>
66+
67+
<hr />
68+
69+
<section aria-labelledby="sec-sessions">
70+
<h2 id="sec-sessions">Session & Access Management</h2>
71+
<p class="muted">View and revoke active sessions, and configure session timeouts and device policies.</p>
72+
<div>
73+
<h3>Active sessions</h3>
74+
<p class="muted">Signed-in devices and recent sessions (last 30 days).</p>
75+
<table class="table">
76+
<thead>
77+
<tr><th>Device</th><th>Location</th><th>IP</th><th>Started</th><th>Actions</th></tr>
78+
</thead>
79+
<tbody>
80+
<tr><td>Browser — Chrome on Linux</td><td>Unknown</td><td>192.0.2.1</td><td>Today, 10:12 UTC</td><td><button class="btn" disabled>Revoke</button></td></tr>
81+
<tr><td>Mobile — iOS</td><td>San Francisco, CA</td><td>198.51.100.23</td><td>Sep 1, 2025</td><td><button class="btn" disabled>Revoke</button></td></tr>
82+
</tbody>
83+
</table>
84+
<div class="muted">Tip: Revoke any sessions you don't recognize immediately.</div>
85+
</div>
86+
87+
<div style="margin-top:1rem;">
88+
<h3>Session timeout</h3>
89+
<p>Configure how long sessions remain valid before requiring re-authentication.</p>
90+
<form method="post" action="#">
91+
<label>
92+
Inactivity timeout (minutes)
93+
<input type="number" name="timeout" value="60" min="5" max="43200" />
94+
</label>
95+
<button class="btn" disabled>Save (not wired)</button>
96+
</form>
97+
</div>
98+
</section>
99+
100+
<hr />
101+
102+
<section aria-labelledby="sec-api">
103+
<h2 id="sec-api">API Keys & OAuth Applications</h2>
104+
<p class="muted">Manage API tokens and connected third-party applications.</p>
105+
<div>
106+
<h3>API tokens</h3>
107+
<p>API tokens grant programmatic access. Treat them like passwords — store them securely and rotate regularly.</p>
108+
<ul>
109+
<li>Create scoped tokens for automation and CI.</li>
110+
<li>Rotate tokens periodically and revoke unused tokens.</li>
111+
</ul>
112+
<div class="actions"><button class="btn" disabled>Create token</button></div>
113+
</div>
114+
115+
<div style="margin-top:1rem;">
116+
<h3>OAuth applications</h3>
117+
<p>Review and revoke third-party applications that have access to your account data.</p>
118+
<table class="table">
119+
<thead><tr><th>Application</th><th>Scope</th><th>Connected</th><th>Actions</th></tr></thead>
120+
<tbody>
121+
<tr><td>Example App</td><td>read:user, repo</td><td>Aug 10, 2025</td><td><button class="btn" disabled>Revoke</button></td></tr>
122+
</tbody>
123+
</table>
124+
</div>
125+
</section>
126+
127+
<hr />
128+
129+
<section aria-labelledby="sec-access">
130+
<h2 id="sec-access">Access Control & Roles</h2>
131+
<p class="muted">Control who can view and modify resources in your organization.</p>
132+
<ul>
133+
<li>Role-based access control (RBAC): assign roles like Admin, Maintainer, and Viewer to users and groups.</li>
134+
<li>Least privilege: grant only the permissions necessary for a user to perform their job.</li>
135+
<li>Audit membership and role changes regularly.</li>
136+
</ul>
137+
</section>
138+
139+
<hr />
140+
141+
<section aria-labelledby="sec-audit">
142+
<h2 id="sec-audit">Audit Logs & Monitoring</h2>
143+
<p class="muted">Search and export audit logs for security reviews and incident investigations.</p>
144+
<p>
145+
Audit logs include sign-ins, failed login attempts, token creation/revocation, role changes, and configuration updates.
146+
Use filters by date, actor, or event type to find relevant entries.
147+
</p>
148+
<div class="actions">
149+
<button class="btn" disabled>Download recent logs (CSV)</button>
150+
<button class="btn" disabled>Open audit viewer</button>
151+
</div>
152+
</section>
153+
154+
<hr />
155+
156+
<section aria-labelledby="sec-encryption">
157+
<h2 id="sec-encryption">Encryption & Data Handling</h2>
158+
<p class="muted">How we protect your data at rest and in transit.</p>
159+
<ul>
160+
<li>TLS 1.2+ is enforced for all network traffic.</li>
161+
<li>Data at rest is encrypted using AES-256 (where applicable).</li>
162+
<li>Secrets and API tokens are stored hashed or encrypted; access is limited by role.</li>
163+
</ul>
164+
</section>
165+
166+
<hr />
167+
168+
<section aria-labelledby="sec-incident">
169+
<h2 id="sec-incident">Incident Response & Reporting</h2>
170+
<p class="muted">Report suspicious activity and learn how incidents are handled.</p>
171+
<p>
172+
If you suspect your account has been compromised, immediately revoke active sessions and API tokens, change
173+
your password, and contact our security team at <a href="mailto:security@example.com">security@example.com</a>.
174+
</p>
175+
<div class="actions">
176+
<button class="btn" disabled>Report an incident</button>
177+
</div>
178+
</section>
179+
180+
<hr />
181+
182+
<section aria-labelledby="sec-actions">
183+
<h2 id="sec-actions">Quick actions</h2>
184+
<ul>
185+
<li><button class="btn" disabled>Change password</button></li>
186+
<li><button class="btn" disabled>Enable MFA</button></li>
187+
<li><button class="btn" disabled>Revoke all sessions</button></li>
188+
<li><button class="btn" disabled>Rotate all API keys</button></li>
189+
</ul>
190+
</section>
191+
192+
<p class="muted small">This page provides guidance and controls for security-related settings. Where controls are marked
193+
"not wired" or disabled, they serve as a UI blueprint and require backend wiring to take effect.</p>
8194
</div>
9195
</div>
10196
{% endblock %}

0 commit comments

Comments
 (0)