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

Update new component panel styles to only use border when focused via keyboard, but background colour when hovering

This commit is contained in:
Andrew Kingston 2022-07-27 13:03:16 +01:00
parent 8e59ffa056
commit bdb37e1641
1 changed files with 4 additions and 4 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

8
packages/builder/src/pages/builder/app/[application]/design/[screenId]/components/[componentId]/new/_components/NewComponentPanel.svelte
View File

@ -237,23 +237,23 @@
margin-top: var(--spacing-xs);
}
.component {
background-color: var(--spectrum-global-color-gray-200);
background: var(--spectrum-global-color-gray-200);
border-radius: 4px;
display: flex;
align-items: center;
border: 1px solid var(--spectrum-global-color-gray-200);
transition: border-color 130ms ease-out;
transition: background 130ms ease-out, border-color 130ms ease-out;
flex-direction: row;
justify-content: flex-start;
padding: var(--spacing-s) var(--spacing-l);
gap: var(--spacing-m);
overflow: hidden;
}
.component.selected,
.component:hover {
.component.selected {
border-color: var(--spectrum-global-color-blue-400);
}
.component:hover {
background: var(--spectrum-global-color-gray-300);
cursor: pointer;
}
.component :global(.spectrum-Body) {