blackroad-os/blackroad-os-docs
9
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Extract border-radius to CSS custom property --radius-pill

Browse Source 
Co-authored-by: blackboxprogramming <118287761+blackboxprogramming@users.noreply.github.com>
This commit is contained in:
copilot-swe-agent[bot]
2025-11-21 01:57:36 +00:00
parent 9e7b56be16
commit f24866bd58
1 changed files with 7 additions and 4 deletions
Download Patch File Download Diff File Expand all files Collapse all files

11
backend/static/index.html
View File

@@ -5,6 +5,9 @@
<title>BlackRoad OS</title> <title>BlackRoad OS</title>
<meta name="viewport" content="width=device-width, initial-scale=1" /> <meta name="viewport" content="width=device-width, initial-scale=1" />
<style> <style>
:root {
--radius-pill: 999px;
}
body { body {
margin: 0; margin: 0;
min-height: 100vh; min-height: 100vh;
@@ -33,7 +36,7 @@
text-transform: uppercase; text-transform: uppercase;
letter-spacing: 0.12em; letter-spacing: 0.12em;
padding: 0.25rem 0.75rem; padding: 0.25rem 0.75rem;
border-radius: 999px; border-radius: var(--radius-pill);
background: rgba(34, 197, 94, 0.1); background: rgba(34, 197, 94, 0.1);
border: 1px solid rgba(34, 197, 94, 0.4); border: 1px solid rgba(34, 197, 94, 0.4);
color: #bbf7d0; color: #bbf7d0;
@@ -58,7 +61,7 @@
.pill { .pill {
font-size: 0.75rem; font-size: 0.75rem;
padding: 0.35rem 0.8rem; padding: 0.35rem 0.8rem;
border-radius: 999px; border-radius: var(--radius-pill);
border: 1px solid rgba(148, 163, 184, 0.5); border: 1px solid rgba(148, 163, 184, 0.5);
background: rgba(15, 23, 42, 0.9); background: rgba(15, 23, 42, 0.9);
} }
@@ -67,7 +70,7 @@
align-items: center; align-items: center;
gap: 0.5rem; gap: 0.5rem;
padding: 0.6rem 1.4rem; padding: 0.6rem 1.4rem;
border-radius: 999px; border-radius: var(--radius-pill);
border: 1px solid rgba(59, 130, 246, 0.8); border: 1px solid rgba(59, 130, 246, 0.8);
background: radial-gradient(circle at top left, rgba(59, 130, 246, 0.45), rgba(37, 99, 235, 0.2)); background: radial-gradient(circle at top left, rgba(59, 130, 246, 0.45), rgba(37, 99, 235, 0.2));
color: #dbeafe; color: #dbeafe;
@@ -79,7 +82,7 @@
display: inline-block; display: inline-block;
width: 0.4rem; width: 0.4rem;
height: 0.4rem; height: 0.4rem;
border-radius: 999px; border-radius: var(--radius-pill);
background: #22c55e; background: #22c55e;
box-shadow: 0 0 12px #22c55e; box-shadow: 0 0 12px #22c55e;
} }