diff --git a/webapp/packages/core-administration/src/AdministrationScreen/ConfigurationWizard/WizardStepper.tsx b/webapp/packages/core-administration/src/AdministrationScreen/ConfigurationWizard/WizardStepper.tsx index afd8e8e363..da8c69e2ca 100644 --- a/webapp/packages/core-administration/src/AdministrationScreen/ConfigurationWizard/WizardStepper.tsx +++ b/webapp/packages/core-administration/src/AdministrationScreen/ConfigurationWizard/WizardStepper.tsx @@ -21,7 +21,7 @@ const styles = composes( wizard-stepper { composes: theme-background-surface theme-text-on-surface theme-border-color-background from global; } - actions, wizard-step { + actions { composes: theme-border-color-background from global; } `, @@ -38,7 +38,7 @@ const styles = composes( flex-shrink: 0; } - actions, wizard-step { + actions { border-right: solid 1px; } @@ -48,13 +48,13 @@ const styles = composes( } } - actions, wizard-text, wizard-step { + actions, wizard-text { display: flex; align-items: center; height: 28px; } - wizard-text, wizard-step { + wizard-text { padding: 0 16px; } ` @@ -83,7 +83,6 @@ export const WizardStepper = observer(function WizardStepper() { {translate(service.currentStepIndex === service.steps.length - 1 ? 'ui_stepper_finish' : 'ui_stepper_next')} - {service.stepsToFinish.length > 1 && {service.finishedSteps.length} / {service.stepsToFinish.length}} {translate(service.currentStep?.configurationWizardOptions?.description || '')} ); diff --git a/webapp/packages/plugin-administration/src/ConfigurationWizard/Welcome/WelcomePage.tsx b/webapp/packages/plugin-administration/src/ConfigurationWizard/Welcome/WelcomePage.tsx index 3a46e893a5..1062d56acc 100644 --- a/webapp/packages/plugin-administration/src/ConfigurationWizard/Welcome/WelcomePage.tsx +++ b/webapp/packages/plugin-administration/src/ConfigurationWizard/Welcome/WelcomePage.tsx @@ -6,57 +6,39 @@ * you may not use this file except in compliance with the License. */ -import styled, { use, css } from 'reshadow'; +import styled, { css } from 'reshadow'; +import { BASE_CONTAINERS_STYLES, ColoredContainer, Container, Group, GroupItem } from '@cloudbeaver/core-blocks'; import { Translate } from '@cloudbeaver/core-localization'; -import { useStyles, composes } from '@cloudbeaver/core-theming'; +import { useStyles } from '@cloudbeaver/core-theming'; -const styles = composes( - css` - layout-grid-cell { - composes: theme-background-surface theme-text-on-surface from global; - } +const styles = css` + p { + line-height: 2; + white-space: pre-wrap; + } - layout-grid-cell { - composes: theme-border-color-background from global; - } - `, - css` - layout-grid { - width: 100%; - flex: 1; - } - - layout-grid-inner { - min-height: 100%; - } - - layout-grid-cell { - position: relative; - border: solid 1px; - padding: 16px 24px - } - - p { - line-height: 2; - } - - note { - composes: theme-typography--body2 from global; - } - ` -); + note { + composes: theme-typography--body2 from global; + } +`; export const WelcomePage: React.FC = function WelcomePage() { - return styled(useStyles(styles))( - - - -

-

- -
-
-
+ return styled(useStyles(styles, BASE_CONTAINERS_STYLES))( + + + + + +

+
+ +

+ +
+
+
+
+
); };