diff --git a/.env.example b/.env.example
index bfdc357d8..45d488e17 100644
--- a/.env.example
+++ b/.env.example
@@ -205,6 +205,8 @@ TINYAUTH_UI_TITLE="Tinyauth"
TINYAUTH_UI_FORGOTPASSWORDMESSAGE="You can change your password by changing the configuration."
# Path to the background image.
TINYAUTH_UI_BACKGROUNDIMAGE="/background.webp"
+# Value of the CSS background property, takes precedence over the background image.
+TINYAUTH_UI_BACKGROUNDCSS=
# Enable UI warnings.
TINYAUTH_UI_WARNINGSENABLED=true
diff --git a/frontend/src/components/layout/layout.tsx b/frontend/src/components/layout/layout.tsx
index 3139022f1..e0b3f8a8f 100644
--- a/frontend/src/components/layout/layout.tsx
+++ b/frontend/src/components/layout/layout.tsx
@@ -15,11 +15,15 @@ const BaseLayout = ({ children }: { children: React.ReactNode }) => {
return (
diff --git a/frontend/src/schemas/app-context-schema.ts b/frontend/src/schemas/app-context-schema.ts
index f8740a704..82647d2b3 100644
--- a/frontend/src/schemas/app-context-schema.ts
+++ b/frontend/src/schemas/app-context-schema.ts
@@ -18,6 +18,7 @@ const uiSchema = z.object({
title: z.string(),
forgotPasswordMessage: z.string(),
backgroundImage: z.string(),
+ backgroundCss: z.string(),
warningsEnabled: z.boolean(),
});
diff --git a/internal/controller/context_controller.go b/internal/controller/context_controller.go
index abfabaad3..780edd04d 100644
--- a/internal/controller/context_controller.go
+++ b/internal/controller/context_controller.go
@@ -56,6 +56,7 @@ type ACRUI struct {
Title string `json:"title"`
ForgotPasswordMessage string `json:"forgotPasswordMessage"`
BackgroundImage string `json:"backgroundImage"`
+ BackgroundCSS string `json:"backgroundCss"`
WarningsEnabled bool `json:"warningsEnabled"`
}
@@ -161,6 +162,7 @@ func (controller *ContextController) appContextHandler(c *gin.Context) {
Title: controller.config.UI.Title,
ForgotPasswordMessage: controller.config.UI.ForgotPasswordMessage,
BackgroundImage: controller.config.UI.BackgroundImage,
+ BackgroundCSS: controller.config.UI.BackgroundCSS,
WarningsEnabled: controller.config.UI.WarningsEnabled,
},
App: ACRApp{
diff --git a/internal/controller/context_controller_test.go b/internal/controller/context_controller_test.go
index 2a3bc5459..c188adec6 100644
--- a/internal/controller/context_controller_test.go
+++ b/internal/controller/context_controller_test.go
@@ -45,6 +45,7 @@ func TestContextController(t *testing.T) {
Title: cfg.UI.Title,
ForgotPasswordMessage: cfg.UI.ForgotPasswordMessage,
BackgroundImage: cfg.UI.BackgroundImage,
+ BackgroundCSS: cfg.UI.BackgroundCSS,
WarningsEnabled: cfg.UI.WarningsEnabled,
},
App: ACRApp{
diff --git a/internal/model/config.go b/internal/model/config.go
index 24ba63028..9d5143904 100644
--- a/internal/model/config.go
+++ b/internal/model/config.go
@@ -205,6 +205,7 @@ type UIConfig struct {
Title string `description:"The title of the UI." yaml:"title,omitempty"`
ForgotPasswordMessage string `description:"Message displayed on the forgot password page." yaml:"forgotPasswordMessage,omitempty"`
BackgroundImage string `description:"Path to the background image." yaml:"backgroundImage,omitempty"`
+ BackgroundCSS string `description:"Value of the CSS background property, takes precedence over the background image." yaml:"backgroundCss,omitempty"`
WarningsEnabled bool `description:"Enable UI warnings." yaml:"warningsEnabled,omitempty"`
}