From 12c7d3bca8b75cb83be441617641e325c122376e Mon Sep 17 00:00:00 2001 From: David Walter Date: Thu, 11 Jun 2026 16:01:54 +0200 Subject: [PATCH 1/2] feat: use branded login background via --oc-login-background-image Replace the default login background with the ownCloud branding artwork and apply it through the --oc-login-background-image CSS custom property (set by the Plain layout from theme.json, consumed in login.scss) so a future branding update only needs to change one value. The oCIS IDP login uses the same custom property. Co-Authored-By: Claude Fable 5 Signed-off-by: David Walter --- .../enhancement-branded-login-background.md | 9 +++++++++ .../design-system/src/styles/theme/login.scss | 1 + packages/web-runtime/src/layouts/Plain.vue | 2 +- .../owncloud/assets/loginBackground.jpg | Bin 88069 -> 124835 bytes 4 files changed, 11 insertions(+), 1 deletion(-) create mode 100644 changelog/unreleased/enhancement-branded-login-background.md diff --git a/changelog/unreleased/enhancement-branded-login-background.md b/changelog/unreleased/enhancement-branded-login-background.md new file mode 100644 index 00000000000..c55ae815bd8 --- /dev/null +++ b/changelog/unreleased/enhancement-branded-login-background.md @@ -0,0 +1,9 @@ +Enhancement: ownCloud branded login background + +The default login page background has been replaced with the ownCloud branding +background. The background image is now applied through the CSS custom +property `--oc-login-background-image`, so a future branding update only needs +to change one value. The image itself still comes from the theme +(`loginPage.backgroundImg` in theme.json) and remains fully customizable. + +https://github.com/owncloud/web/pull/13875 diff --git a/packages/design-system/src/styles/theme/login.scss b/packages/design-system/src/styles/theme/login.scss index 4b517cae83e..e69974764ff 100644 --- a/packages/design-system/src/styles/theme/login.scss +++ b/packages/design-system/src/styles/theme/login.scss @@ -1,6 +1,7 @@ .oc-login { @extend .oc-background-cover; + background-image: var(--oc-login-background-image); position: relative; &-logo { diff --git a/packages/web-runtime/src/layouts/Plain.vue b/packages/web-runtime/src/layouts/Plain.vue index a25df0319d0..2fa7a5cd7b8 100644 --- a/packages/web-runtime/src/layouts/Plain.vue +++ b/packages/web-runtime/src/layouts/Plain.vue @@ -1,7 +1,7 @@