This is an automated email from the ASF dual-hosted git repository.
zehnder pushed a commit to branch dev
in repository https://gitbox.apache.org/repos/asf/streampipes.git
The following commit(s) were added to refs/heads/dev by this push:
new 2b25de5a45 feat: Improve layout of adapter overview, minor style fixes
(#3781)
2b25de5a45 is described below
commit 2b25de5a4518ea22a2ec44310db33abd2d421159
Author: Dominik Riemer <[email protected]>
AuthorDate: Mon Sep 15 06:34:22 2025 -0500
feat: Improve layout of adapter overview, minor style fixes (#3781)
* feat: Improve layout of adapter overview, minor style fixes
* fix: Additional design issues after material upgrade
* Fix inner panel layout
* Fix padding in nav tab
---
ui/deployment/i18n/de.json | 2 +-
.../asset-browser-filter.component.html | 2 +-
.../basic-inner-panel.component.scss | 9 ++--
.../basic-nav-tabs/basic-nav-tabs.component.html | 1 +
.../panel-dialog/panel-dialog.component.html | 2 +-
.../standard-dialog/standard-dialog.component.html | 2 +-
.../asset-details-basics.component.html | 24 +++++-----
.../asset-details-links.component.html | 7 ++-
.../edit-asset-link-dialog.component.html | 7 +--
.../edit-asset-link-dialog.component.scss | 9 +---
.../manage-asset-links-dialog.component.html | 6 +--
.../manage-asset-links-dialog.component.ts | 1 +
.../configuration-group.component.html | 2 +-
.../adapter-description.component.html | 51 ++++++++++++++--------
.../adapter-description.component.scss | 28 +++++++-----
.../adapter-description.component.ts | 3 ++
.../data-marketplace.component.html | 1 +
.../data-marketplace.component.scss | 2 +-
.../static-property.component.html | 7 +--
.../static-property.component.scss | 4 --
...tic-runtime-resolvable-any-input.component.html | 2 +-
.../charts/density/density-renderer.service.ts | 6 ++-
.../charts/scatter/scatter-renderer.service.ts | 6 ++-
ui/src/scss/sp/_variables.scss | 2 +
24 files changed, 103 insertions(+), 83 deletions(-)
diff --git a/ui/deployment/i18n/de.json b/ui/deployment/i18n/de.json
index 8c6208c308..40a7b24452 100644
--- a/ui/deployment/i18n/de.json
+++ b/ui/deployment/i18n/de.json
@@ -307,7 +307,7 @@
"Histogram": "Histogramm",
"Pie": "Kreisdiagramm",
"Value Distribution Heatmap": "Wertverteilung-Heatmap",
- "2D Density Contour": "2D-Dichterverteilung",
+ "2D Density Contour": "2D-Dichteverteilung",
"No Warning Range defined": "Kein Warnbereich definiert",
"Current Warning Range: ": "Aktueller Warnbereich: ",
"to": "zu",
diff --git
a/ui/projects/streampipes/shared-ui/src/lib/components/asset-browser/asset-browser-toolbar/asset-browser-filter/asset-browser-filter.component.html
b/ui/projects/streampipes/shared-ui/src/lib/components/asset-browser/asset-browser-toolbar/asset-browser-filter/asset-browser-filter.component.html
index 4dd81d029d..fbe541a7b7 100644
---
a/ui/projects/streampipes/shared-ui/src/lib/components/asset-browser/asset-browser-toolbar/asset-browser-filter/asset-browser-filter.component.html
+++
b/ui/projects/streampipes/shared-ui/src/lib/components/asset-browser/asset-browser-toolbar/asset-browser-filter/asset-browser-filter.component.html
@@ -35,7 +35,7 @@
>
</sp-asset-browser-filter-labels>
<mat-divider></mat-divider>
- <div fxLayout="row" fxLayoutAlign="end center">
+ <div fxLayout="row" fxLayoutAlign="end center" fxLayoutGap="10px">
<button mat-flat-button class="mat-basic" (click)="resetFilters()">
{{ 'Reset filters' | translate }}
</button>
diff --git
a/ui/projects/streampipes/shared-ui/src/lib/components/basic-inner-panel/basic-inner-panel.component.scss
b/ui/projects/streampipes/shared-ui/src/lib/components/basic-inner-panel/basic-inner-panel.component.scss
index c885998d7d..17dec7eb5b 100644
---
a/ui/projects/streampipes/shared-ui/src/lib/components/basic-inner-panel/basic-inner-panel.component.scss
+++
b/ui/projects/streampipes/shared-ui/src/lib/components/basic-inner-panel/basic-inner-panel.component.scss
@@ -19,22 +19,21 @@
.panel-outer {
margin-top: 15px;
margin-bottom: 15px;
- border: 1px solid var(--color-bg-3);
}
.general-panel {
- border: 0px solid var(--color-bg-3);
+ border: 1px solid var(--color-bg-2);
}
.general-panel-header {
margin-top: -1px;
background: var(--color-bg-2);
- border-top: 1px solid var(--color-bg-3);
- border-bottom: 1px solid var(--color-bg-3);
- padding-left: 5px;
height: 40px;
min-height: 40px;
max-height: 40px;
+ border-top-left-radius: 12px;
+ border-top-right-radius: 12px;
+ padding: 10px 12px;
}
.content-box-title {
diff --git
a/ui/projects/streampipes/shared-ui/src/lib/components/basic-nav-tabs/basic-nav-tabs.component.html
b/ui/projects/streampipes/shared-ui/src/lib/components/basic-nav-tabs/basic-nav-tabs.component.html
index 90fb47f37e..cfd55f4941 100644
---
a/ui/projects/streampipes/shared-ui/src/lib/components/basic-nav-tabs/basic-nav-tabs.component.html
+++
b/ui/projects/streampipes/shared-ui/src/lib/components/basic-nav-tabs/basic-nav-tabs.component.html
@@ -23,6 +23,7 @@
fxLayout="row"
fxLayoutAlign="start center"
style="border-right: 2px solid var(--color-bg-2)"
+ class="pl-5 pr-5"
*ngIf="showBackLink"
>
<button
diff --git
a/ui/projects/streampipes/shared-ui/src/lib/dialog/panel-dialog/panel-dialog.component.html
b/ui/projects/streampipes/shared-ui/src/lib/dialog/panel-dialog/panel-dialog.component.html
index 3b11d8a114..2580070668 100644
---
a/ui/projects/streampipes/shared-ui/src/lib/dialog/panel-dialog/panel-dialog.component.html
+++
b/ui/projects/streampipes/shared-ui/src/lib/dialog/panel-dialog/panel-dialog.component.html
@@ -19,7 +19,7 @@
<div class="dialog-panel">
<div class="dialog-panel-header">
<span class="dialog-title">{{ dialogTitle }}</span>
- <button mat-icon-button (click)="close()">
+ <button mat-icon-button (click)="close()" class="mr-10">
<i class="material-icons" style="font-size: 25px; color: white"
>clear</i
>
diff --git
a/ui/projects/streampipes/shared-ui/src/lib/dialog/standard-dialog/standard-dialog.component.html
b/ui/projects/streampipes/shared-ui/src/lib/dialog/standard-dialog/standard-dialog.component.html
index d1cfdb9a00..36e5eb335c 100644
---
a/ui/projects/streampipes/shared-ui/src/lib/dialog/standard-dialog/standard-dialog.component.html
+++
b/ui/projects/streampipes/shared-ui/src/lib/dialog/standard-dialog/standard-dialog.component.html
@@ -19,7 +19,7 @@
<div class="standard-dialog-panel">
<div class="standard-dialog-panel-header">
<span class="dialog-title">{{ dialogTitle }}</span>
- <button mat-icon-button (click)="close()">
+ <button mat-icon-button (click)="close()" class="mr-5">
<i class="material-icons" style="font-size: 25px; color: white"
>clear</i
>
diff --git
a/ui/src/app/assets/components/asset-details/edit-asset/asset-details-panel/asset-details-basics/asset-details-basics.component.html
b/ui/src/app/assets/components/asset-details/edit-asset/asset-details-panel/asset-details-basics/asset-details-basics.component.html
index 0cc81d4e70..009d20c3d4 100644
---
a/ui/src/app/assets/components/asset-details/edit-asset/asset-details-panel/asset-details-basics/asset-details-basics.component.html
+++
b/ui/src/app/assets/components/asset-details/edit-asset/asset-details-panel/asset-details-basics/asset-details-basics.component.html
@@ -82,17 +82,19 @@
label="Asset Type"
description="The ISA95 type of this asset"
>
- <mat-button-toggle-group
- [disabled]="!editMode"
- [(ngModel)]="asset.assetType.isa95AssetType"
- aria-label="Asset Type"
- >
- <mat-button-toggle
- *ngFor="let isaType of isa95Types"
- [value]="isaType.type"
- >{{ isaType.label }}
- </mat-button-toggle>
- </mat-button-toggle-group>
+ <mat-form-field class="w-100">
+ <mat-select
+ [disabled]="!editMode"
+ [(ngModel)]="asset.assetType.isa95AssetType"
+ aria-label="Asset Type"
+ >
+ <mat-option
+ *ngFor="let isaType of isa95Types"
+ [value]="isaType.type"
+ >{{ isaType.label }}
+ </mat-option>
+ </mat-select>
+ </mat-form-field>
</sp-basic-field-description>
<sp-basic-field-description
fxFlex="100"
diff --git
a/ui/src/app/assets/components/asset-details/edit-asset/asset-details-panel/asset-details-links/asset-details-links.component.html
b/ui/src/app/assets/components/asset-details/edit-asset/asset-details-panel/asset-details-links/asset-details-links.component.html
index ba62040df2..491fa21b02 100644
---
a/ui/src/app/assets/components/asset-details/edit-asset/asset-details-panel/asset-details-links/asset-details-links.component.html
+++
b/ui/src/app/assets/components/asset-details/edit-asset/asset-details-panel/asset-details-links/asset-details-links.component.html
@@ -22,7 +22,12 @@
></sp-basic-header-title-component>
<div class="p-10" fxLayout="column">
- <div fxLayoutAlign="end center" fxLayout="row" fxFlex="100">
+ <div
+ fxLayoutAlign="end center"
+ fxLayout="row"
+ fxFlex="100"
+ fxLayoutGap="10px"
+ >
<button
[disabled]="!assetLinksLoaded"
mat-flat-button
diff --git
a/ui/src/app/assets/dialog/edit-asset-link/edit-asset-link-dialog.component.html
b/ui/src/app/assets/dialog/edit-asset-link/edit-asset-link-dialog.component.html
index a46b5d32e7..e62fb59003 100644
---
a/ui/src/app/assets/dialog/edit-asset-link/edit-asset-link-dialog.component.html
+++
b/ui/src/app/assets/dialog/edit-asset-link/edit-asset-link-dialog.component.html
@@ -17,12 +17,9 @@
-->
<div class="sp-dialog-container">
- <div class="sp-dialog-content p-15">
+ <div class="sp-dialog-content p-15 mt-10">
<div fxFlex="100" fxLayout="column" *ngIf="clonedAssetLink">
- <div
- fxLayout="column"
- class="link-configuration link-type-selection"
- >
+ <div fxLayout="column" class="link-configuration">
<mat-form-field color="accent">
<mat-label>Link Type</mat-label>
<mat-select
diff --git
a/ui/src/app/assets/dialog/edit-asset-link/edit-asset-link-dialog.component.scss
b/ui/src/app/assets/dialog/edit-asset-link/edit-asset-link-dialog.component.scss
index 3c1175aa70..dea25dfb80 100644
---
a/ui/src/app/assets/dialog/edit-asset-link/edit-asset-link-dialog.component.scss
+++
b/ui/src/app/assets/dialog/edit-asset-link/edit-asset-link-dialog.component.scss
@@ -15,14 +15,7 @@
* limitations under the License.
*
*/
-
-.link-type-selection {
-}
-
-.link-configuration {
- padding: 10px;
+s .link-configuration {
width: 100%;
margin: 5px;
- background: var(--color-bg-1);
- border: 1px solid var(--color-bg-3);
}
diff --git
a/ui/src/app/assets/dialog/manage-asset-links/manage-asset-links-dialog.component.html
b/ui/src/app/assets/dialog/manage-asset-links/manage-asset-links-dialog.component.html
index d7cd679471..0bb63f260c 100644
---
a/ui/src/app/assets/dialog/manage-asset-links/manage-asset-links-dialog.component.html
+++
b/ui/src/app/assets/dialog/manage-asset-links/manage-asset-links-dialog.component.html
@@ -93,9 +93,9 @@
class="small-button"
(click)="
selectAll(
- dataViews,
+ charts,
elementIdFunction,
- nameFunction,
+ widgetNameFunction,
'chart'
)
"
@@ -107,7 +107,7 @@
mat-button
mat-flat-button
class="mat-basic small-button"
- (click)="deselectAll(dataViews, elementIdFunction)"
+ (click)="deselectAll(charts, elementIdFunction)"
style="margin-right: 10px; margin-left: 5px"
>
<span>Deselect All</span>
diff --git
a/ui/src/app/assets/dialog/manage-asset-links/manage-asset-links-dialog.component.ts
b/ui/src/app/assets/dialog/manage-asset-links/manage-asset-links-dialog.component.ts
index 9f02f74be8..48d8afa94f 100644
---
a/ui/src/app/assets/dialog/manage-asset-links/manage-asset-links-dialog.component.ts
+++
b/ui/src/app/assets/dialog/manage-asset-links/manage-asset-links-dialog.component.ts
@@ -55,6 +55,7 @@ export class SpManageAssetLinksDialogComponent
nameFunction = el => el.name;
filenameFunction = el => el.filename;
measureNameFunction = el => el.measureName;
+ widgetNameFunction = el => el.baseAppearanceConfig.widgetTitle;
constructor(
private dialogRef: DialogRef<SpManageAssetLinksDialogComponent>,
diff --git
a/ui/src/app/connect/components/configuration-group/configuration-group.component.html
b/ui/src/app/connect/components/configuration-group/configuration-group.component.html
index 282912a4ea..781d4d3a72 100644
---
a/ui/src/app/connect/components/configuration-group/configuration-group.component.html
+++
b/ui/src/app/connect/components/configuration-group/configuration-group.component.html
@@ -16,7 +16,7 @@
~
-->
-<div style="padding: 15px">
+<div>
<form
[formGroup]="configurationGroup"
(keydown.enter)="$event.preventDefault()"
diff --git
a/ui/src/app/connect/components/data-marketplace/adapter-description/adapter-description.component.html
b/ui/src/app/connect/components/data-marketplace/adapter-description/adapter-description.component.html
index 70aa4d23b8..5a38642a5d 100644
---
a/ui/src/app/connect/components/data-marketplace/adapter-description/adapter-description.component.html
+++
b/ui/src/app/connect/components/data-marketplace/adapter-description/adapter-description.component.html
@@ -19,7 +19,7 @@
<div class="adapter-description-box" fxFlex="100" fxLayout="column">
<div fxLayout="column">
<div
- class="type mt-10"
+ class="type"
fxLayout="row"
fxLayoutAlign="start start"
fxFlex="100"
@@ -27,23 +27,40 @@
<div class="adapter-icon large-icon">
<img *ngIf="iconUrl" [src]="iconUrl" class="icon" />
</div>
- <div class="ml-5" fxFlex fxLayoutAlign="end start">
- <button
- mat-icon-button
- color="accent"
- (click)="openDocumentation($event)"
- matTooltip="Show documentation"
+ <div
+ class="p-5 ml-10 h-100"
+ fxFlex
+ fxLayoutAlign="start start"
+ fxLayout="column"
+ >
+ <div fxLayout="column" fxLayoutAlign="end start">
+ <span class="adapter-name">{{ adapter.name }}</span>
+ </div>
+ <div
+ fxFlex="100"
+ fxLayout="row wrap"
+ fxLayoutGap="10px"
+ fxLayoutAlign="end end"
>
- <mat-icon>menu_book</mat-icon>
- </button>
- </div>
- </div>
- </div>
- <div fxFlex fxLayout="row" class="ml-10" fxLayoutGap="20px">
- <div fxFlex fxLayout="column">
- <h3>{{ adapter.name }}</h3>
- <div class="description" fxLayoutAlign="start start">
- <p [innerHTML]="adapter.description"></p>
+ <button
+ fxFlex
+ mat-flat-button
+ (click)="createEmitter.emit(adapter.appId)"
+ matTooltip="Create adapter"
+ >
+ <span>Create</span>
+ <mat-icon>add</mat-icon>
+ </button>
+ <button
+ mat-flat-button
+ class="mat-basic"
+ (click)="openDocumentation($event)"
+ matTooltip="Show documentation"
+ >
+ <span>Docs</span>
+ <mat-icon>menu_book</mat-icon>
+ </button>
+ </div>
</div>
</div>
</div>
diff --git
a/ui/src/app/connect/components/data-marketplace/adapter-description/adapter-description.component.scss
b/ui/src/app/connect/components/data-marketplace/adapter-description/adapter-description.component.scss
index f45beda7bc..ed17e3110c 100644
---
a/ui/src/app/connect/components/data-marketplace/adapter-description/adapter-description.component.scss
+++
b/ui/src/app/connect/components/data-marketplace/adapter-description/adapter-description.component.scss
@@ -18,17 +18,20 @@
.adapter-description-box {
height: 100%;
- min-height: 260px;
- border: 1px solid gray;
- border-bottom: 5px solid gray;
- background: var(--color-bg-dialog);
- padding: 10px;
+ border: 1px solid var(--color-bg-2);
+ background: var(--color-bg-0);
cursor: pointer;
+ border-radius: 5px;
}
.adapter-description-box:hover {
- border-bottom: 5px solid var(--color-primary);
- border-color: var(--color-primary);
+ border-color: var(--color-bg-3);
+ background: var(--color-bg-1);
+}
+
+.adapter-name {
+ font-size: var(--mat-sys-body-large-size);
+ margin-top: 10px;
}
.edit {
@@ -38,30 +41,31 @@
.delete {
cursor: pointer;
}
+
.type p {
padding: 4px;
margin: 0;
}
+
.iconImg {
max-height: 50px;
max-width: 80%;
}
+
.real-time {
cursor: pointer;
color: #ffeb3b;
}
.adapter-icon {
- margin-left: 10px;
- box-shadow:
- rgba(0, 0, 0, 0.05) 0px 6px 24px 0px,
- rgba(0, 0, 0, 0.08) 0px 0px 0px 1px;
+ background: var(--color-bg-0);
+ border-right: 1px solid var(--color-bg-2);
text-align: center;
display: inline-block;
}
.icon {
- max-width: 60px;
+ max-width: 70px;
}
.large-icon {
diff --git
a/ui/src/app/connect/components/data-marketplace/adapter-description/adapter-description.component.ts
b/ui/src/app/connect/components/data-marketplace/adapter-description/adapter-description.component.ts
index 71c5eb35db..2022d76e07 100644
---
a/ui/src/app/connect/components/data-marketplace/adapter-description/adapter-description.component.ts
+++
b/ui/src/app/connect/components/data-marketplace/adapter-description/adapter-description.component.ts
@@ -35,6 +35,9 @@ export class AdapterDescriptionComponent implements OnInit {
@Input()
adapter: AdapterDescription;
+ @Output()
+ createEmitter = new EventEmitter<string>();
+
isRunningAdapter = false;
adapterLabel: string;
iconUrl: SafeUrl;
diff --git
a/ui/src/app/connect/components/data-marketplace/data-marketplace.component.html
b/ui/src/app/connect/components/data-marketplace/data-marketplace.component.html
index 70df090903..838c9afbb6 100644
---
a/ui/src/app/connect/components/data-marketplace/data-marketplace.component.html
+++
b/ui/src/app/connect/components/data-marketplace/data-marketplace.component.html
@@ -78,6 +78,7 @@
}}"
class="adapter-description"
fxFlex="33"
+ (createEmitter)="selectAdapter($event)"
(click)="selectAdapter(adapterDescription.appId)"
*ngFor="
let adapterDescription of adapterDescriptions
diff --git
a/ui/src/app/connect/components/data-marketplace/data-marketplace.component.scss
b/ui/src/app/connect/components/data-marketplace/data-marketplace.component.scss
index d6488fb4f8..6c69ecf698 100644
---
a/ui/src/app/connect/components/data-marketplace/data-marketplace.component.scss
+++
b/ui/src/app/connect/components/data-marketplace/data-marketplace.component.scss
@@ -21,7 +21,7 @@
}
.adapter-description {
- padding: 15px;
+ padding: 10px;
}
.data-marketplace-container {
padding-bottom: 10px;
diff --git
a/ui/src/app/core-ui/static-properties/static-property.component.html
b/ui/src/app/core-ui/static-properties/static-property.component.html
index fe6c2bfc68..94079dcd13 100644
--- a/ui/src/app/core-ui/static-properties/static-property.component.html
+++ b/ui/src/app/core-ui/static-properties/static-property.component.html
@@ -17,12 +17,7 @@
-->
<div fxFlex="100" fxLayout="column" class="small-form-field-density">
- <div
- fxFlex="100"
- fxLayout="column"
- class="static-property-panel"
- [ngClass]="showBorder ? 'static-property-panel-border' : ''"
- >
+ <div fxFlex="100" fxLayout="column" class="static-property-panel">
<div
fxFlex="100"
fxLayout="column"
diff --git
a/ui/src/app/core-ui/static-properties/static-property.component.scss
b/ui/src/app/core-ui/static-properties/static-property.component.scss
index c28720991a..48f97326b3 100644
--- a/ui/src/app/core-ui/static-properties/static-property.component.scss
+++ b/ui/src/app/core-ui/static-properties/static-property.component.scss
@@ -26,10 +26,6 @@
margin-top: 10px;
}
-.static-property-panel-border {
- border-left: 5px solid gray;
-}
-
.description {
font-size: 10px;
}
diff --git
a/ui/src/app/core-ui/static-properties/static-runtime-resolvable-any-input/static-runtime-resolvable-any-input.component.html
b/ui/src/app/core-ui/static-properties/static-runtime-resolvable-any-input/static-runtime-resolvable-any-input.component.html
index 644e056204..e0593ebf09 100644
---
a/ui/src/app/core-ui/static-properties/static-runtime-resolvable-any-input/static-runtime-resolvable-any-input.component.html
+++
b/ui/src/app/core-ui/static-properties/static-runtime-resolvable-any-input/static-runtime-resolvable-any-input.component.html
@@ -17,7 +17,7 @@
-->
<div id="formWrapper" fxFlex="100" fxLayout="column">
- <div fxLayout="row" class="mb-10">
+ <div fxLayout="row" class="mb-10" fxLayoutGap="10px">
<button
mat-button
mat-flat-button
diff --git
a/ui/src/app/data-explorer-shared/components/charts/density/density-renderer.service.ts
b/ui/src/app/data-explorer-shared/components/charts/density/density-renderer.service.ts
index b7621c78eb..e61809c1a5 100644
---
a/ui/src/app/data-explorer-shared/components/charts/density/density-renderer.service.ts
+++
b/ui/src/app/data-explorer-shared/components/charts/density/density-renderer.service.ts
@@ -70,8 +70,9 @@ export class SpDensityRendererService extends
SpBaseEchartsRenderer<CorrelationC
`${xField.fullDbName}${xField.measurementUnitResourceId ?
` (${xField.measurementUnitResourceId.split('#').pop()})` : ''}`,
nameLocation: 'center',
nameTextStyle: {
- fontSize: 20,
+ fontSize: 14,
},
+ nameGap: 40,
},
yAxis: {
scale: true,
@@ -82,8 +83,9 @@ export class SpDensityRendererService extends
SpBaseEchartsRenderer<CorrelationC
`${yField.fullDbName}${yField.measurementUnitResourceId ?
` (${yField.measurementUnitResourceId.split('#').pop()})` : ''}`,
nameLocation: 'center',
nameTextStyle: {
- fontSize: 20,
+ fontSize: 14,
},
+ nameGap: 40,
},
dataset: dataset.rawDataset,
visualMap: {
diff --git
a/ui/src/app/data-explorer-shared/components/charts/scatter/scatter-renderer.service.ts
b/ui/src/app/data-explorer-shared/components/charts/scatter/scatter-renderer.service.ts
index 08222544fe..c25272d75d 100644
---
a/ui/src/app/data-explorer-shared/components/charts/scatter/scatter-renderer.service.ts
+++
b/ui/src/app/data-explorer-shared/components/charts/scatter/scatter-renderer.service.ts
@@ -71,8 +71,9 @@ export class SpScatterRendererService extends
SpBaseEchartsRenderer<CorrelationC
`${xField.fullDbName}${xField.measurementUnitResourceId ?
` (${xField.measurementUnitResourceId.split('#').pop()})` : ''}`,
nameLocation: 'center',
nameTextStyle: {
- fontSize: 20,
+ fontSize: 14,
},
+ nameGap: 40,
},
yAxis: {
type: 'value',
@@ -83,8 +84,9 @@ export class SpScatterRendererService extends
SpBaseEchartsRenderer<CorrelationC
`${yField.fullDbName}${yField.measurementUnitResourceId ?
` (${yField.measurementUnitResourceId.split('#').pop()})` : ''}`,
nameLocation: 'center',
nameTextStyle: {
- fontSize: 20,
+ fontSize: 14,
},
+ nameGap: 40,
},
series,
});
diff --git a/ui/src/scss/sp/_variables.scss b/ui/src/scss/sp/_variables.scss
index e02b6309b1..663001ef74 100644
--- a/ui/src/scss/sp/_variables.scss
+++ b/ui/src/scss/sp/_variables.scss
@@ -78,6 +78,8 @@ $sp-color-error: #b71c1c;
--mdc-switch-selected-icon-size: 12px;
--mat-menu-container-color: var(--color-bg-0);
+ --mat-select-panel-background-color: var(--color-bg-0);
+ --mat-sidenav-container-shape: 0;
}
.dark-mode {
