consent.software/catalog
2
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix(consentsoftware-cookieconsent): Fix visual inconsistencies in the consent software modal overlay and shadow.

Browse Source
This commit is contained in:
Philipp Kunz 2025-01-20 20:59:36 +01:00
parent ed51ea2049
commit d15f8ecf39
3 changed files with 10 additions and 6 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
changelog.md
View File

@ -1,5 +1,11 @@
# Changelog # Changelog
## 2025-01-20 - 1.5.3 - fix(consentsoftware-cookieconsent)
Fix visual inconsistencies in the consent software modal overlay and shadow.
- Updated the shadow color in the modal box to use a consistent color.
- Restored backdrop blur effect in the page overlay when visible.
## 2025-01-20 - 1.5.2 - fix(core) ## 2025-01-20 - 1.5.2 - fix(core)
No changes detected No changes detected

2
ts_web/00_commitinfo_data.ts
View File

@ -3,6 +3,6 @@
*/ */
export const commitinfo = { export const commitinfo = {
name: '@consent.software/catalog', name: '@consent.software/catalog',
version: '1.5.2', version: '1.5.3',
description: 'A library of web components designed to integrate robust consent management capabilities into web applications, ensuring compliance with privacy regulations.' description: 'A library of web components designed to integrate robust consent management capabilities into web applications, ensuring compliance with privacy regulations.'
} }

8
ts_web/elements/consentsoftware-cookieconsent.ts
View File

@ -80,14 +80,13 @@ export class ConsentsoftwareCookieconsent extends LitElement {
.pageOverlay.shake { .pageOverlay.shake {
background: rgba(0, 0, 0, 0.5) !important; background: rgba(0, 0, 0, 0.5) !important;
backdrop-filter: blur(20px) !important;
} }
.modalBox { .modalBox {
display: block; display: block;
color: var(--text-color); color: var(--text-color);
background: var(--background-color); background: var(--background-color);
box-shadow: 0px 0px 15px rgba(0, 0, 0, 0.6); box-shadow: 0px 0px 8px rgba(255, 255, 255, 0.6);
position: realtive; position: realtive;
border: 1px dotted rgba(255, 255, 255, 0.1); border: 1px dotted rgba(255, 255, 255, 0.1);
border-top: 1px solid var(--accent-color); border-top: 1px solid var(--accent-color);
@ -104,7 +103,6 @@ export class ConsentsoftwareCookieconsent extends LitElement {
.modalBox.shake { .modalBox.shake {
animation: shake 150ms 2 linear; animation: shake 150ms 2 linear;
box-shadow: 0px 0px 8px rgba(255, 255, 255, 0.6);
} }
@keyframes shake { @keyframes shake {
@ -286,8 +284,8 @@ export class ConsentsoftwareCookieconsent extends LitElement {
await this.updated(); await this.updated();
const pageOverlay: HTMLDivElement = this.shadowRoot?.querySelector('.pageOverlay'); const pageOverlay: HTMLDivElement = this.shadowRoot?.querySelector('.pageOverlay');
if (pageOverlay) { if (pageOverlay) {
pageOverlay.style.background = 'rgba(255,255,255, 0.1)'; pageOverlay.style.background = 'rgba(0,0,0, 0.5)';
pageOverlay.style.backdropFilter = 'blur(0px)'; pageOverlay.style.backdropFilter = 'blur(20px)';
} }
const modalBox: HTMLDivElement = this.shadowRoot?.querySelector('.modalBox'); const modalBox: HTMLDivElement = this.shadowRoot?.querySelector('.modalBox');
if (modalBox) { if (modalBox) {