feat: onboarding pages darkmode (#867)

This commit is contained in:
Ahmed Bouhuolia
2025-12-03 16:04:46 +02:00
committed by GitHub
parent 71b1206f8a
commit 32d74b0413
15 changed files with 386 additions and 289 deletions

View File

@@ -1,6 +1,9 @@
// @ts-nocheck
import React from 'react';
import { Button, Intent } from '@blueprintjs/core';
import { x } from '@xstyled/emotion';
import { css } from '@emotion/css';
import { useIsDarkMode } from '@/hooks/useDarkMode';
import WorkflowIcon from './WorkflowIcon';
import { FormattedMessage as T } from '@/components';
@@ -8,13 +11,12 @@ import { FormattedMessage as T } from '@/components';
import withOrganizationActions from '@/containers/Organization/withOrganizationActions';
import { compose } from '@/utils';
import '@/style/pages/Setup/Congrats.scss';
/**
* Setup congrats page.
*/
function SetupCongratsPage({ setOrganizationSetupCompleted }) {
const [isReloading, setIsReloading] = React.useState(false);
const isDarkMode = useIsDarkMode();
const handleBtnClick = () => {
setIsReloading(true);
@@ -22,30 +24,55 @@ function SetupCongratsPage({ setOrganizationSetupCompleted }) {
};
return (
<div class="setup-congrats">
<div class="setup-congrats__workflow-pic">
<x.div
w={'500px'}
mx="auto"
textAlign="center"
pt={'80px'}
>
<x.div>
<WorkflowIcon width="280" height="330" />
</div>
</x.div>
<div class="setup-congrats__text">
<h1>
<T id={'setup.congrats.title'} />
</h1>
<p class="paragraph">
<T id={'setup.congrats.description'} />
</p>
<Button
intent={Intent.PRIMARY}
type="submit"
loading={isReloading}
onClick={handleBtnClick}
<x.div mt={30}>
<x.h2
color={isDarkMode ? 'rgba(255, 255, 255, 0.85)' : '#2d2b43'}
mb={'12px'}
>
<T id={'setup.congrats.go_to_dashboard'} />
</Button>
</div>
</div>
<T id={'setup.congrats.title'} />
</x.h2>
<x.p
fontSize={'16px'}
opacity={0.85}
mb={'14px'}
color={isDarkMode ? 'rgba(255, 255, 255, 0.7)' : undefined}
>
<T id={'setup.congrats.description'} />
</x.p>
<x.div
className={css`
.bp4-button {
height: 38px;
padding-left: 25px;
padding-right: 25px;
font-size: 15px;
margin-top: 12px;
}
`}
>
<Button
intent={Intent.PRIMARY}
type="submit"
loading={isReloading}
onClick={handleBtnClick}
>
<T id={'setup.congrats.go_to_dashboard'} />
</Button>
</x.div>
</x.div>
</x.div>
);
}