CodeMirror/budibase
1
0
Fork 0
mirror of synced 2024-10-06 13:04:36 +13:00
Code Issues Projects Releases Wiki Activity

Make new datasource page and new screen page consistent with each other

Browse source
This commit is contained in:
Andrew Kingston 2023-07-11 14:14:00 +01:00
parent 179e9d5d8b
commit d92589156c
2 changed files with 12 additions and 18 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

22
packages/builder/src/pages/builder/app/[application]/data/new.svelte
View file

@ -7,7 +7,7 @@
} from "stores/backend" } from "stores/backend"
import { hasData } from "stores/selectors" import { hasData } from "stores/selectors"
import { notifications, Body } from "@budibase/bbui" import { notifications, Body, Icon, AbsTooltip } from "@budibase/bbui"
import { params, goto } from "@roxi/routify" import { params, goto } from "@roxi/routify"
import CreateExternalDatasourceModal from "./_components/CreateExternalDatasourceModal/index.svelte" import CreateExternalDatasourceModal from "./_components/CreateExternalDatasourceModal/index.svelte"
import CreateInternalTableModal from "./_components/CreateInternalTableModal.svelte" import CreateInternalTableModal from "./_components/CreateInternalTableModal.svelte"
@ -15,7 +15,6 @@
import IntegrationIcon from "components/backend/DatasourceNavigator/IntegrationIcon.svelte" import IntegrationIcon from "components/backend/DatasourceNavigator/IntegrationIcon.svelte"
import CreationPage from "components/common/CreationPage.svelte" import CreationPage from "components/common/CreationPage.svelte"
import ICONS from "components/backend/DatasourceNavigator/icons/index.js" import ICONS from "components/backend/DatasourceNavigator/icons/index.js"
import FontAwesomeIcon from "components/common/FontAwesomeIcon.svelte"
let internalTableModal let internalTableModal
let externalDatasourceModal let externalDatasourceModal
@ -54,13 +53,9 @@
> >
<div class="subHeading"> <div class="subHeading">
<Body>Get started with our Budibase DB</Body> <Body>Get started with our Budibase DB</Body>
<div <AbsTooltip text="Budibase DB is built with CouchDB">
role="tooltip" <Icon name="Info" size="S" />
title="Budibase DB is built with CouchDB" </AbsTooltip>
class="tooltip"
>
<FontAwesomeIcon name="fa-solid fa-circle-info" />
</div>
</div> </div>
<div class="options"> <div class="options">
@ -116,13 +111,12 @@
display: flex; display: flex;
align-items: center; align-items: center;
margin-top: 12px; margin-top: 12px;
margin-bottom: 24px; margin-bottom: 36px;
gap: 8px;
} }
.subHeading :global(p) {
.tooltip { color: var(--spectrum-global-color-gray-600) !important;
margin-left: 6px;
} }
.options { .options {
width: 100%; width: 100%;
display: grid; display: grid;

8
packages/builder/src/pages/builder/app/[application]/design/new.svelte
View file

@ -19,7 +19,7 @@
heading={hasScreens ? "Create new screen" : "Create your first screen"} heading={hasScreens ? "Create new screen" : "Create your first screen"}
> >
<div class="subHeading"> <div class="subHeading">
<Body size="L">Start from scratch or create screens from your data</Body> <Body>Start from scratch or create screens from your data</Body>
</div> </div>
<div class="cards"> <div class="cards">
@ -56,18 +56,18 @@
.subHeading :global(p) { .subHeading :global(p) {
text-align: center; text-align: center;
margin-top: 12px; margin-top: 12px;
margin-bottom: 24px; margin-bottom: 36px;
color: var(--grey-6); color: var(--spectrum-global-color-gray-600);
} }
.cards { .cards {
display: flex; display: flex;
flex-wrap: wrap; flex-wrap: wrap;
justify-content: center; justify-content: center;
gap: 24px;
} }
.card { .card {
margin: 12px;
max-width: 235px; max-width: 235px;
transition: filter 150ms; transition: filter 150ms;
} }