MirrorSave
/
budibase
mirror of https://github.com/Budibase/budibase.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

Update background colour and styles of grid lines to work with user specified background colours

This commit is contained in:
Andrew Kingston 2024-08-05 18:50:19 +01:00
parent 22cda514b4
commit e91607acb1
No known key found for this signature in database
1 changed files with 9 additions and 6 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

15
packages/client/src/components/app/container/GridContainer.svelte
View File

@ -33,6 +33,7 @@
<div <div
class="grid" class="grid"
class:mobile class:mobile
class:builder={$builderStore.inBuilder}
bind:clientWidth={width} bind:clientWidth={width}
bind:clientHeight={height} bind:clientHeight={height}
use:styleable={{ use:styleable={{
@ -69,6 +70,9 @@
height: 400px; height: 400px;
gap: 0; gap: 0;
} }
.grid.builder {
background: var(--spectrum-alias-background-color-secondary);
}
.grid, .grid,
.underlay { .underlay {
display: grid; display: grid;
@ -81,16 +85,15 @@
left: 0; left: 0;
width: 100%; width: 100%;
height: 100%; height: 100%;
/* grid-gap: 2px;*/ border: 1px solid var(--spectrum-global-color-gray-900);
/* background-color: var(--spectrum-global-color-gray-200);*/ opacity: 0.07;
border: 1px solid var(--spectrum-global-color-gray-200); pointer-events: none;
} }
.underlay { .underlay {
z-index: -1; z-index: 0;
} }
.placeholder { .placeholder {
/* background-color: var(--spectrum-global-color-gray-100);*/ border: 1px solid var(--spectrum-global-color-gray-900);
border: 1px solid var(--spectrum-global-color-gray-200);
} }
/* Ensure all top level children have grid styles applied */ /* Ensure all top level children have grid styles applied */