diff --git a/web/src/pages/users/shared/modals/KeyProvisioningModal/KeyProvisioningModal.tsx b/web/src/pages/users/shared/modals/KeyProvisioningModal/KeyProvisioningModal.tsx index 10ec4fa6d..7571dafbf 100644 --- a/web/src/pages/users/shared/modals/KeyProvisioningModal/KeyProvisioningModal.tsx +++ b/web/src/pages/users/shared/modals/KeyProvisioningModal/KeyProvisioningModal.tsx @@ -13,7 +13,10 @@ import SvgIconCancel from '../../../../../shared/components/svg/IconCancel'; import IconHamburgerClose from '../../../../../shared/components/svg/IconHamburgerClose'; import { deviceBreakpoints } from '../../../../../shared/constants'; import { Button } from '../../../../../shared/defguard-ui/components/Layout/Button/Button'; -import { ButtonStyleVariant } from '../../../../../shared/defguard-ui/components/Layout/Button/types'; +import { + ButtonSize, + ButtonStyleVariant, +} from '../../../../../shared/defguard-ui/components/Layout/Button/types'; import { LoaderSpinner } from '../../../../../shared/defguard-ui/components/Layout/LoaderSpinner/LoaderSpinner'; import { MessageBox } from '../../../../../shared/defguard-ui/components/Layout/MessageBox/MessageBox'; import { MessageBoxType } from '../../../../../shared/defguard-ui/components/Layout/MessageBox/types'; @@ -175,8 +178,17 @@ export const KeyProvisioningModal = () => { {isLoading || !workers || (workers && !workers.length) ? (
- +

{LL.modals.provisionKeys.noData.workers()}

+
+
) : ( .no-data { + & > p { width: 100%; text-align: center; + color: var(--text-body-tertiary); + } + + & > .controls { + width: 100%; + display: flex; + flex-flow: nowrap; + align-items: center; + justify-content: center; + box-sizing: border-box; + padding: 0 20px; + + .btn { + @include media-breakpoint-down(md) { + width: 100%; + } + @include media-breakpoint-up(lg) { + min-width: 240px; + } + } } } }