Synk fra arbeidsrepoet

2026-08-30 02:30:47 +02:00
parent 3a0182852a
commit 475bb8054d
12 changed files with 54 additions and 113 deletions
@@ -0,0 +1,175 @@
+/* Vaultnord-preg på hvelvet.
+   Legges oppå Bitwarden-klienten utenfra av brand-proxyen, så den overlever en
+   oppgradering av hvelvet. Prisen er at vi henger på klassenavn og CSS-variabler
+   fra web-klienten: ser noe rart ut etter en oppdatering, er det her du ser
+   først. Til gjengjeld er fiksen en CSS-linje, ikke en byggejobb.
+
+   Variabelnavnene under er hentet fra web-klientens egen styles.css, der de er
+   definert per tema som RGB-tripler uten rgb(). */
+
+/* --- logo ------------------------------------------------------------ */
+/* To steder: den statiske i index.html før appen starter, og den Angular
+   tegner etterpå som inline SVG i <bit-landing-header>. Begge må tas. */
+.theme_light img.new-logo-themed { content: url(/_vaultnord/logo.png) !important; }
+.theme_dark  img.new-logo-themed { content: url(/_vaultnord/logo-white.png) !important; }
+img.new-logo-themed { width: 190px !important; height: auto !important; }
+
+/* Klienten merker logoene sine med aria-label. Det er mer stabilt å henge på
+   enn komponentnavn, og treffer både innloggingssidene og skallet innenfor. */
+bit-svg[aria-label*="logo" i] {
+    display: none !important;
+}
+a:has(> bit-svg[aria-label*="logo" i]),
+bit-landing-header a:has(bit-svg) {
+    display: block !important;
+    min-width: 150px;
+    height: 40px;
+    background: url(/_vaultnord/logo-white.png) left center / contain no-repeat;
+}
+.theme_light a:has(> bit-svg[aria-label*="logo" i]),
+.theme_light bit-landing-header a:has(bit-svg) {
+    background-image: url(/_vaultnord/logo.png);
+}
+
+/* Logoen i sidemenyen når man er logget inn. Den ligger i <bit-nav-logo> og
+   har ingen aria-label å henge på, så komponentnavnet må brukes. Menyen er
+   mørk i begge temaer, derfor alltid den lyse logoen. */
+bit-nav-logo bit-svg,
+bit-nav-logo svg {
+    display: none !important;
+}
+bit-nav-logo a {
+    background: url(/_vaultnord/logo-white.png) center / 170px auto no-repeat;
+}
+
+/* --- farger ---------------------------------------------------------- */
+/* Klienten bygger alt på en fargetrapp (--color-brand-050 … 950) som de
+   semantiske variablene peker inn i: knapper bruker --color-bg-brand-strong,
+   som igjen er var(--color-brand-800). Bytter vi trappa, følger resten med -
+   knapper, lenker, fokusringer - uten at vi må jakte enkeltklasser. */
+.theme_light, .theme_dark, :root {
+    --color-brand-050: #f0faf9;
+    --color-brand-100: #d7f2f0;
+    --color-brand-200: #b0e6e2;
+    --color-brand-300: #7ed6d1;
+    --color-brand-400: #47c2bc;
+    --color-brand-500: #2aa9a4;
+    --color-brand-600: #1f918d;
+    --color-brand-700: #17807d;
+    --color-brand-800: #12666a;
+    --color-brand-900: #0e4e52;
+    --color-brand-950: #082f33;
+
+    /* Den gamle primary-trappa lever fortsatt enkelte steder. */
+    --color-primary-100: 227 241 240;
+    --color-primary-300: 42 169 164;
+    --color-primary-600: 23 128 125;
+    --color-primary-700: 18 102 106;
+}
+.theme_dark {
+    /* På mørk bunn er trappa speilvendt i klienten: bg-brand-strong peker på
+       brand-200, ikke 800. Da må de lyse trinnene være de mettede. */
+    --color-brand-050: #082f33;
+    --color-brand-100: #0e4e52;
+    --color-brand-200: #3dd2cc;
+    --color-brand-300: #7ed6d1;
+    --color-brand-400: #3dd2cc;
+    --color-brand-500: #2aa9a4;
+    --color-brand-600: #1f918d;
+    --color-brand-700: #17807d;
+    --color-brand-800: #3dd2cc;
+    --color-brand-900: #0e4e52;
+    --color-brand-950: #082f33;
+
+    --color-primary-100: 20 60 62;
+    --color-primary-300: 42 169 164;
+    --color-primary-600: 61 210 204;
+    --color-primary-700: 143 188 187;
+}
+
+/* --- illustrasjoner -------------------------------------------------- */
+/* Safen og bakgrunnsfigurene er inline SVG-er som henter fargene sine fra
+   variabler. Å legge et hue-filter på dem gjetter feil figur og gir rare
+   resultater - variablene treffer presist. */
+.theme_light {
+    --color-illustration-bg-primary: 176 230 226;
+    --color-illustration-bg-secondary: 126 214 209;
+    --color-illustration-bg-tertiary: 240 250 249;
+    --color-illustration-outline: 18 102 106;
+    --color-illustration-logo: 23 128 125;
+    --color-illustration-tertiary: 235 203 139;
+}
+.theme_dark {
+    --color-illustration-bg-primary: 26 110 108;
+    --color-illustration-bg-secondary: 61 210 204;
+    --color-illustration-bg-tertiary: 243 246 249;
+    --color-illustration-outline: 8 47 51;
+    --color-illustration-logo: 255 255 255;
+    --color-illustration-tertiary: 235 203 139;
+}
+
+/* --- klientens egen bunntekst ---------------------------------------- */
+/* Rekkefølgen i <bit-landing-footer>: miljøvelger, produktnavn, versjon, br,
+   ansvarsfraskrivelse. Vi skjuler produktnavnet og setter vårt eget foran
+   versjonstallet - tallet blir stående som det er, så det følger hvelvet ved
+   oppgradering i stedet for å ruste fast i en CSS-fil.
+   Ansvarsfraskrivelsen (#vw-disclaimer) røres ikke: den skal stå, både av
+   hensyn til AGPL og til Bitwardens varemerke. */
+bit-landing-footer footer > div:nth-of-type(2) {
+    display: none !important;
+}
+bit-landing-footer footer > div:nth-of-type(3)::before {
+    content: "Vaultnord \2014 bygger på Vaultwarden ";
+}
+
+/* --- bunntekst med kildekodelenke ------------------------------------ */
+/* Bunnteksten skal alltid være synlig - det er der kildekodelenken bor - men
+   klientens layout er min-h-screen, så deres egen bunntekst havner nøyaktig der
+   en fast stripe ligger. Padding hjelper ikke, for stripen følger vinduet.
+   Løsningen er å krympe "en skjermhøyde" med akkurat stripens høyde. */
+body.layout_frontend .tw-min-h-screen {
+    min-height: calc(100vh - 46px) !important;
+}
+body.layout_frontend .tw-h-screen {
+    height: calc(100vh - 46px) !important;
+}
+/* Og når innholdet er høyere enn vinduet: uten denne ligger stripen oppå det
+   siste avsnittet når man har rullet helt ned. Begge deler trengs - den ene
+   for korte sider, den andre for lange. */
+body.layout_frontend {
+    padding-bottom: 46px !important;
+}
+
+/* Inne i det innloggede skallet er det ingen plass å ta - der har klienten sin
+   egen rullebeholder med fast høyde. Kildekodelenken står uansett på
+   innloggingssiden, som er der alle begynner. */
+body:not(.layout_frontend) #vaultnord-footer {
+    display: none !important;
+}
+
+#vaultnord-footer {
+    position: fixed;
+    bottom: 0;
+    left: 0;
+    right: 0;
+    height: 46px;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    padding: 0 12px;
+    font: 12px/1.4 ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
+    color: #55617a;
+    background: #f3f6fa;
+    border-top: 1px solid #dbe2ec;
+    text-align: center;
+    z-index: 2147483000;
+}
+#vaultnord-footer a { color: #17807d; }
+
+.theme_dark #vaultnord-footer,
+body.theme_dark #vaultnord-footer {
+    color: #9aa5b8;
+    background: #202733;
+    border-top-color: #434c5e;
+}
+.theme_dark #vaultnord-footer a { color: #8fbcbb; }
@@ -0,0 +1,47 @@
+<!doctype html>
+<html lang="no">
+<head>
+<meta charset="utf-8">
+<meta name="viewport" content="width=device-width, initial-scale=1">
+<title>Kildekode og lisens — Vaultnord</title>
+<style>
+ body { margin:0; background:#f3f6fa; color:#2e3440;
+        font:16px/1.65 ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, sans-serif; }
+ main { max-width:44rem; margin:0 auto; padding:3rem 1.5rem 4rem; }
+ h1 { font-size:1.6rem; letter-spacing:-.02em; margin:0 0 1.5rem; }
+ h2 { font-size:1.05rem; margin:2rem 0 .5rem; }
+ p, li { color:#55617a; }
+ a { color:#17807d; }
+ code { background:#e3f1f0; border-radius:5px; padding:.1rem .4rem; font-size:.9em; color:#12666a; }
+ .card { background:#fff; border:1px solid #dbe2ec; border-radius:12px; padding:1.5rem; }
+</style>
+</head>
+<body>
+<main>
+  <h1>Kildekode og lisens</h1>
+  <div class="card">
+    <p>Passordhvelvet du bruker kjører <strong>Vaultwarden</strong>, fri programvare
+       lisensiert under <strong>GNU Affero General Public License v3</strong>.</p>
+
+    <h2>Kildekoden</h2>
+    <ul>
+      <li>Original: <a href="https://github.com/dani-garcia/vaultwarden">github.com/dani-garcia/vaultwarden</a></li>
+      <li>Vår kopi: <a href="https://git.skui.io/vaultnord.no/vaultwarden">git.skui.io/vaultnord.no/vaultwarden</a></li>
+      <li>Vår endrede utgave (Dockerfile og ressurser): <a href="https://git.skui.io/vaultnord.no/vaultnord-brand">git.skui.io/vaultnord.no/vaultnord-brand</a></li>
+    </ul>
+
+    <h2>Hva vi har endret</h2>
+    <p>Ingen endringer i serverkoden. Vi bygger fra det offisielle imaget og legger
+       til statiske filer i den ferdigbygde web-klienten: vår CSS, våre ikoner og
+       denne bunnteksten. Dockerfilen og ressursene ligger i
+       <code>vaultnord-brand</code> over.</p>
+    <p>Administrasjonspanelet på <a href="https://vaultnord.no">vaultnord.no</a> er
+       et selvstendig program som snakker med hvelvet over API. Det er ikke en del
+       av Vaultwarden og deles ikke under AGPL.</p>
+
+    <h2>Lisensteksten</h2>
+    <p><a href="https://www.gnu.org/licenses/agpl-3.0.html">gnu.org/licenses/agpl-3.0</a></p>
+  </div>
+</main>
+</body>
+</html>
@@ -0,0 +1,29 @@
+<!doctype html>
+<html lang="no">
+<head>
+<meta charset="utf-8">
+<meta name="viewport" content="width=device-width, initial-scale=1">
+<title>Ukjent adresse — Vaultnord</title>
+<style>
+ body { margin:0; min-height:100vh; display:flex; align-items:center; justify-content:center;
+        background:#f3f6fa; color:#2e3440;
+        font:16px/1.65 ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, sans-serif; }
+ .card { max-width:30rem; margin:1.5rem; padding:2rem; background:#fff;
+         border:1px solid #dbe2ec; border-radius:12px; }
+ h1 { font-size:1.35rem; letter-spacing:-.02em; margin:0 0 1rem; }
+ p { color:#55617a; margin:0 0 1rem; }
+ a { color:#17807d; }
+ .logo { height:1.8rem; margin-bottom:1.5rem; display:block; }
+</style>
+</head>
+<body>
+  <div class="card">
+    <img class="logo" src="/_vaultnord/logo.png" alt="Vaultnord">
+    <h1>Her er det ingenting</h1>
+    <p>Adressen finnes ikke hos oss. Sjekk at du har skrevet den riktig — hvelvet
+       til bedriften din ligger på <code>firmanavn.vaultnord.no</code>.</p>
+    <p>Usikker? <a href="https://vaultnord.no">vaultnord.no</a> eller
+       <a href="mailto:post@vaultnord.no">post@vaultnord.no</a>.</p>
+  </div>
+</body>
+</html>
@@ -0,0 +1,28 @@
+<!doctype html>
+<html lang="no">
+<head>
+<meta charset="utf-8">
+<meta name="viewport" content="width=device-width, initial-scale=1">
+<title>Hvelvet er utilgjengelig — Vaultnord</title>
+<style>
+ body { margin:0; min-height:100vh; display:flex; align-items:center; justify-content:center;
+        background:#f3f6fa; color:#2e3440;
+        font:16px/1.65 ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, sans-serif; }
+ .card { max-width:30rem; margin:1.5rem; padding:2rem; background:#fff;
+         border:1px solid #dbe2ec; border-radius:12px; }
+ h1 { font-size:1.35rem; letter-spacing:-.02em; margin:0 0 1rem; }
+ p { color:#55617a; margin:0 0 1rem; }
+ a { color:#17807d; }
+ .logo { height:1.8rem; margin-bottom:1.5rem; display:block; }
+</style>
+</head>
+<body>
+  <div class="card">
+    <img class="logo" src="/_vaultnord/logo.png" alt="Vaultnord">
+    <h1>Hvelvet er midlertidig utilgjengelig</h1>
+    <p>Passordene deres er trygge og uendret — hvelvet svarer bare ikke akkurat nå.</p>
+    <p>Har dette vart en stund, ta kontakt på
+       <a href="mailto:post@vaultnord.no">post@vaultnord.no</a>, så finner vi ut av det.</p>
+  </div>
+</body>
+</html>