diff --git a/hosts/koi/containers/kanidm/default.nix b/hosts/koi/containers/kanidm/default.nix index a2982ca..98727f8 100644 --- a/hosts/koi/containers/kanidm/default.nix +++ b/hosts/koi/containers/kanidm/default.nix @@ -24,10 +24,12 @@ in { }; virtualisation.oci-containers.containers.kanidm = { - image = "kanidm/server:1.3.3"; + image = "kanidm/server:1.4.2"; volumes = [ "/srv/kanidm/data:/data/db" "${./server.toml}:/data/server.toml" + "${./style.css}:/hpkg/style.css" + "${./fish.png}:/hpkg/img/fish.png" "${(secrets.file config "kanidm-tls-key")}:/data/key.pem" "${(secrets.file config "kanidm-tls-cert")}:/data/chain.pem" ]; diff --git a/hosts/koi/containers/kanidm/fish.png b/hosts/koi/containers/kanidm/fish.png new file mode 100644 index 0000000..05db6c1 Binary files /dev/null and b/hosts/koi/containers/kanidm/fish.png differ diff --git a/hosts/koi/containers/kanidm/style.css b/hosts/koi/containers/kanidm/style.css new file mode 100644 index 0000000..0f8a9d0 --- /dev/null +++ b/hosts/koi/containers/kanidm/style.css @@ -0,0 +1,239 @@ +:root { + --totp-width-and-height: 30px; + --totp-stroke-width: 60px; +} + +html, +body { + height: 100%; +} + +.form-cred-reset-body { + max-width: 500px; +} + +#settings-window .form-cred-reset-body { + max-width: unset; +} + +.form-signin { + max-width: 680px; +} + +/* + * Sidebar + */ + +.side-menu { + min-width: 180px; +} + +.side-menu-item { + --icon-size: 24px; + padding: .4rem .7rem; + text-decoration: none; + + &.active { + font-weight: 600; + } + + &:hover, + &.active { + background-color: var(--bs-gray-300); + } + + .icon-container img { + filter: invert(40%); + width: 100%; + height: 100%; + object-fit: contain; + } +} + +/* + * Personal Settings sidemenu + */ + + +/* + * Navbar + */ + +.kanidm_logo { + width: 12em; + height: 12em; +} + +.identity-verification-container { + display: flex; + flex-direction: column; + max-width: fit-content; + align-items: center; + margin: auto; +} + +.totp-display-container { + padding: 5px 10px; + display: flex; + flex-direction: row; + max-width: fit-content; + align-items: center; + margin: auto; + border-radius: 15px; + background: #21252915; + box-shadow: -5px -5px 11px #ededed, 5px 5px 11px #ffffff; + margin: 15px; +} + +.totp-display { + font-size: 35px; + margin: 10px; +} + +.totp-timer { + margin: 10px; + position: relative; + height: var(--totp-width-and-height); + width: var(--totp-width-and-height); +} + +/* Removes SVG styling that would hide the time label */ +.totp-timer__circle { + fill: none; + stroke: none; +} + +.totp-timer__path-remaining { + stroke-width: var(--totp-stroke-width); + + /* Makes sure the animation starts at the top of the circle */ + transform: rotate(90deg); + transform-origin: center; + + /* One second aligns with the speed of the countdown timer */ + transition: 1s linear all; + + stroke: currentColor; +} + +.totp-timer__svg { + transform: scaleX(-1); +} + +.totp-timer__path-remaining.green { + color: rgb(65, 184, 131); +} + +.totp-timer__path-remaining.orange { + color: orange; +} + +.totp-timer__path-remaining.red { + color: red; +} + +.totp-timer__path-remaining.no-transition { + -webkit-transition: none !important; + -moz-transition: none !important; + -o-transition: none !important; + transition: none !important; +} + +.card>a { + height: 150px; +} + +.oauth2-img { + max-width: 100%; + max-height: 90%; + padding: 10px; + height: 100%; +} + +.btn-tiny { + --bs-btn-padding-y: .05rem; + --bs-btn-padding-x: .4rem; + --bs-btn-font-size: .75rem; +} + +#cred-update-commit-bar { + display: block; + /* + position: fixed; + bottom: .5rem; + left: 50%; + transform: translateX(-50%); + */ + background: white; +} + +.icon-container { + padding: 2px; + width: var(--icon-size); + height: var(--icon-size); +} + +/* stupid.fish customizations */ +.kanidm_logo { + width: 0; + height: 0; + background: url(/pkg/img/fish.png) no-repeat; + background-size: contain; + padding: 4em 8em; +} + +.footer .text-muted::after { + content: ' and some stupidity'; +} + +.form-signin h3 { + margin-bottom: 1em; +} + +/* ayu mirage */ +@media (prefers-color-scheme: dark) { + body { + background: #242936; + color: #cccac2; + --bs-body-bg: #242936; + --bs-body-color: #cccac2; + --bs-border-color: #707a8c45; + } + + .form-control { + background-color: #1f2430; + } + + .bg-light, + .bg-dark { + background-color: #1f2430 !important; + } + + .text-muted { + color: #b8cfe680 !important; + } + + .btn-dark { + --bs-btn-color: #cccac2; + --bs-btn-bg: #1f2430; + --bs-btn-border-color: #1f2430; + --bs-btn-hover-color: #cccac2; + --bs-btn-hover-bg: #2e3037; + --bs-btn-hover-border-color: #2e3037; + --bs-btn-focus-shadow-rgb: 66, 70, 73; + --bs-btn-active-color: #cccac2; + --bs-btn-active-bg: #2e3037; + --bs-btn-active-border-color: #2e3037; + --bs-btn-active-shadow: none; + --bs-btn-disabled-color: #b8cfe680; + --bs-btn-disabled-bg: #1f2430; + --bs-btn-disabled-border-color: #1f2430; + } + + .alert-light { + --bs-alert-color: #cccac2; + --bs-alert-bg: #1f2430; + --bs-alert-border-color: transparent; + --bs-alert-link-color: #cccac2; + } +} \ No newline at end of file