Privatae
120 lines
4.9 KiB
CSS
120 lines
4.9 KiB
CSS
/* policy.css — the "what would be stopped" view (uipolicy.go).
|
|
|
|
ADDITIONS ONLY, the rule given.css:1-10 states and agents.css:3-5 repeats:
|
|
app.css carries the page, and every colour here is one of its variables rather
|
|
than a literal, so the pages cannot drift into different looks.
|
|
|
|
It repeats the observation-card rules that agents.css also has rather than
|
|
linking that file. Each page in this UI stands on app.css plus its own sheet
|
|
(given.css, setup.css, agents.css), and borrowing another unit's sheet would
|
|
mean this page changes shape whenever that unit restyles theirs. Forty lines
|
|
of duplication against a page that silently reflows: the duplication is the
|
|
cheaper of the two.
|
|
|
|
No inline style= anywhere. This page's CSP is `default-src 'self'`
|
|
(uipolicy.go renderPolicy), which covers style-src, so an inline style is
|
|
dropped and the policy wins against the markup. app.css:169-173 records the
|
|
one time that happened. */
|
|
|
|
a { color: var(--ink); }
|
|
a:hover { color: var(--warn); }
|
|
|
|
.backlink { max-width: 46rem; margin: 0 auto 1.25rem; font-size: 0.85rem; }
|
|
h3 { max-width: 46rem; margin: 1.6rem auto 0.5rem; font-size: 0.95rem; }
|
|
h3 + .sub { margin-bottom: 0.8rem; }
|
|
|
|
/* ── the rule itself ───────────────────────────────────────────────────────
|
|
Shown on the page because a person asked to review false positives cannot do
|
|
it against a rule they have to read the source to find. */
|
|
|
|
.rule {
|
|
max-width: 46rem;
|
|
margin: 0 auto 1.25rem;
|
|
padding: 0.85rem 1.1rem 0.85rem 2.2rem;
|
|
border: 1px solid var(--line);
|
|
border-radius: 6px;
|
|
background: var(--panel);
|
|
font-size: 0.87rem;
|
|
}
|
|
.rule li { margin-top: 0.3rem; }
|
|
.rule li:first-child { margin-top: 0; }
|
|
|
|
.term {
|
|
font-weight: 600;
|
|
color: var(--ink);
|
|
margin-right: 0.3rem;
|
|
}
|
|
|
|
/* ── one observation ───────────────────────────────────────────────────────
|
|
The left edge carries the verdict so a column of twenty reads down without
|
|
reading a word: amber is something this rule would stop, green is something
|
|
it leaves alone, red is a verdict it could not reach.
|
|
|
|
Amber and not red for a would-stop, deliberately. Nothing has been stopped —
|
|
the page is a rehearsal — and a rehearsal that renders in alarm colours is a
|
|
page people stop opening, which is the one failure this measurement cannot
|
|
survive (agents.css:17-26 sets the same order for the same reason). Red is
|
|
kept for the state that genuinely needs a person: a verdict this machine
|
|
could not reach. */
|
|
|
|
.obs {
|
|
max-width: 46rem;
|
|
margin: 0 auto 0.6rem;
|
|
border: 1px solid var(--line);
|
|
border-left-width: 3px;
|
|
border-radius: 6px;
|
|
background: var(--panel);
|
|
padding: 0.85rem 1.1rem;
|
|
}
|
|
.obs.bare { border-left-color: var(--warn); }
|
|
.obs.vouched { border-left-color: var(--ok); }
|
|
.obs.unknown { border-left-color: var(--bad); }
|
|
.obs.dormant { border-left-color: var(--line); }
|
|
.obs.past { border-style: dashed; border-left-style: solid; }
|
|
|
|
.obs-head { display: flex; gap: 0.5rem; align-items: baseline; flex-wrap: wrap; }
|
|
.obs-head .obs-name { font-weight: 600; word-break: break-all; }
|
|
.obs-why { margin: 0.45rem 0 0; font-size: 0.85rem; color: var(--dim); }
|
|
|
|
/* The kind chip is a CLASSIFICATION and takes no colour: being an agent is not
|
|
a fault, and most of what is on this list on a working machine is the user's
|
|
own editor. The chip beside it carries the only verdict this page makes. */
|
|
.tag.kind { background: var(--line); color: var(--dim); }
|
|
|
|
/* ── the terms behind one verdict ──────────────────────────────────────────
|
|
Every term, not only the one that decided it, one per line. The plane this
|
|
reads from reports a LIST of typed reasons rather than a verdict
|
|
(origin.go:51-57); running them together into a sentence is exactly the
|
|
compression that turns evidence back into a verdict. */
|
|
|
|
.terms {
|
|
margin: 0.6rem 0 0;
|
|
padding: 0;
|
|
list-style: none;
|
|
font-size: 0.78rem;
|
|
color: var(--dim);
|
|
}
|
|
.terms li {
|
|
margin-top: 0.25rem;
|
|
padding-left: 0.6rem;
|
|
border-left: 2px solid var(--line);
|
|
word-break: break-word;
|
|
}
|
|
.terms li.points-stop { border-left-color: var(--warn); }
|
|
.terms li.points-leave { border-left-color: var(--ok); }
|
|
.terms li.points-unknown { border-left-color: var(--bad); }
|
|
|
|
.tier {
|
|
display: inline-block;
|
|
min-width: 5.2rem;
|
|
padding: 0.02rem 0.4rem;
|
|
margin-right: 0.4rem;
|
|
border-radius: 999px;
|
|
font-size: 0.68rem;
|
|
font-weight: 600;
|
|
text-align: center;
|
|
}
|
|
.tier.verified { background: rgba(78,169,107,0.16); color: var(--ok); }
|
|
.tier.known { background: rgba(215,154,60,0.16); color: var(--warn); }
|
|
.tier.ambiguous { background: rgba(154,161,173,0.16); color: var(--dim); }
|