CodeMirror/budibase
1
0
Fork 0
mirror of synced 2024-10-02 18:16:29 +13:00
Code Issues Projects Releases Wiki Activity

Update device preview picker to be quiet

Browse source
This commit is contained in:
Andrew Kingston 2022-07-26 11:37:27 +01:00
parent 77f9b11e88
commit 1b34bc8e81
2 changed files with 11 additions and 1 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

7
packages/bbui/src/ActionButton/ActionButton.svelte
View file

@ -84,6 +84,7 @@
}
:global([dir="ltr"] .spectrum-ActionButton .spectrum-Icon) {
margin-left: 0;
transition: color ease-out 130ms;
}
.is-selected:not(.spectrum-ActionButton--emphasized) {
background: var(--spectrum-global-color-gray-300);
@ -92,4 +93,10 @@
padding: 0;
min-width: 0;
}
.spectrum-ActionButton--quiet {
padding: 0 8px;
}
.is-selected:not(.emphasized) .spectrum-Icon {
color: var(--spectrum-global-color-gray-900);
}
</style>

5
packages/builder/src/pages/builder/app/[application]/design/[screenId]/_components/DevicePreviewSelect.svelte
View file

@ -3,18 +3,21 @@
import { store } from "builderStore"
</script>
<ActionGroup compact>
<ActionGroup compact quiet>
<ActionButton
quiet
icon="DeviceDesktop"
selected={$store.previewDevice === "desktop"}
on:click={() => store.actions.preview.setDevice("desktop")}
/>
<ActionButton
quiet
icon="DeviceTablet"
selected={$store.previewDevice === "tablet"}
on:click={() => store.actions.preview.setDevice("tablet")}
/>
<ActionButton
quiet
icon="DevicePhone"
selected={$store.previewDevice === "mobile"}
on:click={() => store.actions.preview.setDevice("mobile")}