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

View File

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