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

some more wip

This commit is contained in:
Gerard Burns 2024-04-04 09:31:39 +01:00
parent aa8795bc83
commit 6c823f5c60
2 changed files with 42 additions and 9 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

45
packages/builder/src/components/design/settings/controls/FieldContext/Chart.svelte
View File

@ -10,6 +10,7 @@
export let supportLevelText = "" export let supportLevelText = ""
export let columnIcon export let columnIcon
export let columnType
export let columnName export let columnName
export let errors = [] export let errors = []
@ -26,8 +27,14 @@
</div> </div>
<div class="contextTooltipContent"> <div class="contextTooltipContent">
<div class="contextTooltipHeader"> <div class="contextTooltipHeader">
<Icon name={columnIcon} /> <span class="columnName">
<span>{columnName}</span> {columnName}
</span><span> is a </span>
<div class="link">
<Icon name={columnIcon} />
<span>{columnType}</span>
</div>
<span>column.</span>
</div> </div>
{#if errors.length > 0} {#if errors.length > 0}
@ -68,12 +75,13 @@
} }
.contextTooltipHeader { .contextTooltipHeader {
row-gap: 4px;
background-color: var(--background-alt); background-color: var(--background-alt);
color: var(--ink); color: var(--ink);
display: flex; display: flex;
flex-wrap: wrap;
align-items: center; align-items: center;
height: var(--spectrum-alias-item-height-m); padding: 4px 4px;
padding: 0px var(--spectrum-alias-item-padding-m);
border-width: var(--spectrum-actionbutton-border-size); border-width: var(--spectrum-actionbutton-border-size);
border-radius: var(--spectrum-alias-border-radius-regular); border-radius: var(--spectrum-alias-border-radius-regular);
border: 1px solid border: 1px solid
@ -84,15 +92,38 @@
} }
.contextTooltipContent { .contextTooltipContent {
padding: 0px 12px; color: var(--ink);
margin: 0px 12px;
color: black; color: black;
} }
.contextTooltipHeader :global(svg) { .contextTooltipContent > p {
}
.columnName {
padding: 3px 6px;
border-radius: 5px;
background-color: var(--grey-3);
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
margin-right: 5px; margin-right: 5px;
} }
.contextTooltipHeader :global(span) { .link {
display: inline-flex;
padding: 3px 6px;
border-radius: 5px;
background-color: var(--spectrum-global-color-blue-500);
color: white;
margin: 0 8px;
}
.link :global(svg) {
margin-right: 3px;
}
.link :global(span) {
white-space: nowrap; white-space: nowrap;
overflow: hidden; overflow: hidden;
text-overflow: ellipsis; text-overflow: ellipsis;

6
packages/builder/src/components/design/settings/controls/MultiFieldSelect.svelte
View File

@ -204,7 +204,8 @@
supportLevelIconTooltip={currentOptionSupport.iconTooltip} supportLevelIconTooltip={currentOptionSupport.iconTooltip}
supportLevelText={currentOptionSupport.text} supportLevelText={currentOptionSupport.text}
columnIcon={getOptionIcon(currentOption)} columnIcon={getOptionIcon(currentOption)}
columnName={getOptionIconTooltip(currentOption)} columnName={currentOption}
columnType={getOptionIconTooltip(currentOption)}
errors={fieldSupport[currentOption]?.errors} errors={fieldSupport[currentOption]?.errors}
warnings={fieldSupport[currentOption]?.warnings} warnings={fieldSupport[currentOption]?.warnings}
/> />
@ -215,7 +216,8 @@
supportLevelIconTooltip={previousOptionSupport.iconTooltip} supportLevelIconTooltip={previousOptionSupport.iconTooltip}
supportLevelText={previousOptionSupport.text} supportLevelText={previousOptionSupport.text}
columnIcon={getOptionIcon(previousOption)} columnIcon={getOptionIcon(previousOption)}
columnName={getOptionIconTooltip(previousOption)} columnName={previousOption}
columnType={getOptionIconTooltip(previousOption)}
errors={fieldSupport[previousOption]?.errors} errors={fieldSupport[previousOption]?.errors}
warnings={fieldSupport[previousOption]?.warnings} warnings={fieldSupport[previousOption]?.warnings}
/> />