matt
/
monacousa-portal
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Fix Edge browser black background issue in Board and Member portals
Build And Push Image / docker (push) Successful in 2m11s Details 

- Added background-color: #fafafa to v-app element in both layouts
- Added solid background-color fallback to .glass-main class before gradients
- Ensures Edge and other browsers show light background even without gradient support
- Fixes transparent rgba gradient rendering issues in Edge

🤖 Generated with [Claude Code](https://claude.ai/code)

Co-Authored-By: Claude <noreply@anthropic.com>
This commit is contained in:
Matt 2025-09-05 14:55:05 +02:00
parent 1162d0c9ca
commit 183bba0c9e
2 changed files with 10 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
layouts/board.vue
View File

@ -1,5 +1,5 @@
<template> <template>
<v-app> <v-app style="background-color: #fafafa;">
<v-navigation-drawer <v-navigation-drawer
v-model="drawer" v-model="drawer"
:rail="miniVariant" :rail="miniVariant"
@ -710,6 +710,10 @@ watch(width, (newWidth) => {
// Glass Main Background // Glass Main Background
.glass-main { .glass-main {
background-color: #fafafa; // Solid fallback for Edge and other browsers
background-image: linear-gradient(180deg,
rgba(250, 250, 250, 0.9) 0%,
rgba(245, 245, 245, 0.9) 100%);
background: linear-gradient(180deg, background: linear-gradient(180deg,
rgba(250, 250, 250, 0.9) 0%, rgba(250, 250, 250, 0.9) 0%,
rgba(245, 245, 245, 0.9) 100%); rgba(245, 245, 245, 0.9) 100%);

6
layouts/member.vue
View File

@ -1,5 +1,5 @@
<template> <template>
<v-app> <v-app style="background-color: #fafafa;">
<v-navigation-drawer <v-navigation-drawer
v-model="drawer" v-model="drawer"
:rail="miniVariant" :rail="miniVariant"
@ -510,6 +510,10 @@ watch(width, (newWidth) => {
// Glass Main Background // Glass Main Background
.glass-main { .glass-main {
background-color: #fafafa; // Solid fallback for Edge and other browsers
background-image: linear-gradient(180deg,
rgba(250, 250, 250, 0.9) 0%,
rgba(245, 245, 245, 0.9) 100%);
background: linear-gradient(180deg, background: linear-gradient(180deg,
rgba(250, 250, 250, 0.9) 0%, rgba(250, 250, 250, 0.9) 0%,
rgba(245, 245, 245, 0.9) 100%); rgba(245, 245, 245, 0.9) 100%);