Skip to content

Commit

Permalink
fix(ffe-modals): darkmode
Browse files Browse the repository at this point in the history
  • Loading branch information
Peter Hellstrand committed Jun 26, 2024
1 parent 1cfbd72 commit 632e7e6
Show file tree
Hide file tree
Showing 2 changed files with 19 additions and 13 deletions.
11 changes: 3 additions & 8 deletions packages/ffe-modals/less/modal.less
Original file line number Diff line number Diff line change
Expand Up @@ -16,13 +16,8 @@
}

.ffe-modal::backdrop {
background-color: var(--ffe-v-modal-backdrop-color);
backdrop-filter: blur(4px);
background-color: rgba(0, 0, 0, 0.6);
.native & {
@media (prefers-color-scheme: dark) {
background-color: rgba(255, 255, 255, 0.1);
}
}
}

.ffe-modal__body {
Expand All @@ -35,8 +30,8 @@

.ffe-modal__close {
--background-color: var(--ffe-v-modal-bg-color);
--border-color: var(--ffe-v-modal-close-button-color);
--text-color: var(--ffe-v-modal-close-button-color);
--border-color: var(--ffe-v-modal-close-button-border-color);
--text-color: var(--ffe-v-modal-close-button-cross-color);
--outline-color: transparent;

aspect-ratio: 1;
Expand Down
21 changes: 16 additions & 5 deletions packages/ffe-modals/less/theme.less
Original file line number Diff line number Diff line change
@@ -1,15 +1,26 @@
:root,
:host {
--ffe-v-modal-backdrop-color: var(--ffe-farge-svart);
--ffe-v-modal-backdrop-color: rgba(
2,
10,
10,
0.5
); // --ffe-farge-svart med opacity 50%
--ffe-v-modal-bg-color: var(--ffe-farge-hvit);
--ffe-v-modal-close-button-color: var(--ffe-farge-vann);
--ffe-v-modal-close-button-cross-color: var(--ffe-farge-vann);
--ffe-v-modal-close-button-border-color: var(--ffe-farge-vann);
--ffe-v-modal-border-radius: 24px;

@media (prefers-color-scheme: dark) {
.native {
--ffe-v-modal-backdrop-color: rgba(
103,
103,
103,
0.5
); // --ffe-farge-moerkgraa med opacity 50%;
--ffe-v-modal-bg-color: var(--ffe-farge-svart);
--ffe-v-modal-backdrop-color: var(--ffe-farge-hvit);
--ffe-v-modal-close-button-color: var(--ffe-farge-vann-70);
--ffe-v-modal-close-button-cross-color: var(--ffe-farge-vann-30);
--ffe-v-modal-close-button-border-color: var(--ffe-farge-vann-70);
}
}
}

0 comments on commit 632e7e6

Please sign in to comment.