UI - МЕЖПРОЕКТНАЯ КОММУНИКАЦИЯ: auth screens, project actions и полировка внешних контуров
This commit is contained in:
DCCONSTRUCTIONS
@@ -157,7 +157,7 @@ export const AuthRoot = observer(function AuthRoot(props: TAuthRoot) {
|
||||
|
||||
function AuthContainer({ children }: { children: React.ReactNode }) {
|
||||
return (
|
||||
<div className="mt-6 flex w-full flex-grow flex-col items-center justify-center py-8">
|
||||
<div className="mt-8 flex w-full flex-grow flex-col items-center justify-center py-8">
|
||||
<div className="nodedc-auth-shell relative flex w-full max-w-[28rem] flex-col gap-6">{children}</div>
|
||||
</div>
|
||||
);
|
||||
|
||||
@@ -15,7 +15,7 @@ type AuthBaseProps = {
|
||||
|
||||
export function AuthBase({ authType }: AuthBaseProps) {
|
||||
return (
|
||||
<div className="relative z-10 flex h-screen w-screen flex-col items-center overflow-hidden overflow-y-auto bg-canvas px-8 pt-8 pb-10">
|
||||
<div className="relative z-10 flex h-screen w-screen flex-col items-center overflow-hidden overflow-y-auto bg-canvas px-8 pt-10 pb-12">
|
||||
<AuthHeader type={authType} />
|
||||
<AuthRoot authMode={authType} />
|
||||
</div>
|
||||
|
||||
@@ -73,7 +73,11 @@ export function AuthHeaderBase(props: TAuthHeaderBase) {
|
||||
<PageHead title={pageTitle + " - NODE.DC"} />
|
||||
<div className="sticky top-0 flex w-full flex-shrink-0 items-center justify-between gap-6 px-2 py-1">
|
||||
<Link href="/">
|
||||
<PlaneLockup height={40} width={190} className="text-primary transition-opacity hover:opacity-90" />
|
||||
<PlaneLockup
|
||||
height={54}
|
||||
width={258}
|
||||
className="nodedc-auth-logo-lockup text-primary transition-opacity hover:opacity-90"
|
||||
/>
|
||||
</Link>
|
||||
{additionalAction}
|
||||
</div>
|
||||
|
||||
@@ -17,7 +17,7 @@ import { ACCEPTED_COVER_IMAGE_MIME_TYPES_FOR_REACT_DROPZONE, MAX_FILE_SIZE } fro
|
||||
import { useOutsideClickDetector } from "@plane/hooks";
|
||||
import { useTranslation } from "@plane/i18n";
|
||||
import { Tabs } from "@plane/propel/tabs";
|
||||
import { Button, getButtonStyling } from "@plane/propel/button";
|
||||
import { Button } from "@plane/propel/button";
|
||||
import { TOAST_TYPE, setToast } from "@plane/propel/toast";
|
||||
import { EFileAssetType } from "@plane/types";
|
||||
import { Input, Loader } from "@plane/ui";
|
||||
@@ -204,7 +204,9 @@ export const ImagePickerPopover = observer(function ImagePickerPopover(props: Pr
|
||||
return (
|
||||
<Popover className="relative z-19" ref={ref} tabIndex={tabIndex} onKeyDown={handleKeyDown}>
|
||||
<Popover.Button
|
||||
className={cn(getButtonStyling("secondary", "sm"), buttonClassName)}
|
||||
className={cn(
|
||||
buttonClassName || "inline-flex min-h-10 items-center justify-center rounded-[1.25rem] px-4 py-2"
|
||||
)}
|
||||
onClick={handleOnClick}
|
||||
disabled={disabled}
|
||||
>
|
||||
|
||||
@@ -17,39 +17,46 @@ export function InstanceNotReady() {
|
||||
return (
|
||||
<DefaultLayout>
|
||||
<div className="relative z-10 flex h-screen w-screen overflow-hidden">
|
||||
{/* Background decorations */}
|
||||
<img
|
||||
src={GradientBgLogo}
|
||||
className="pointer-events-none absolute -top-24 -left-32 h-56 w-96 opacity-15"
|
||||
alt=""
|
||||
aria-hidden="true"
|
||||
/>
|
||||
<img
|
||||
src={GradientBgLogo}
|
||||
className="pointer-events-none absolute -right-20 -bottom-16 h-56 w-96 opacity-15"
|
||||
alt=""
|
||||
aria-hidden="true"
|
||||
/>
|
||||
{/* Main content */}
|
||||
<div className="flex h-full w-full flex-col items-center px-8 pt-6 pb-10">
|
||||
<div className="sticky top-0 flex w-full shrink-0 items-center justify-between gap-6">
|
||||
<PlaneLockup height={20} width={95} className="text-primary" />
|
||||
<PlaneLockup height={40} width={190} className="nodedc-auth-logo-lockup text-primary" />
|
||||
</div>
|
||||
<div className="flex h-full w-full flex-col items-center justify-center gap-7">
|
||||
<div className="flex flex-col items-center gap-11">
|
||||
<div className="nodedc-error-shell flex max-w-3xl flex-col items-center gap-11 text-center">
|
||||
<img
|
||||
src={GradientBgLogo}
|
||||
className="pointer-events-none absolute -top-24 -left-32 h-56 w-96 opacity-12"
|
||||
alt=""
|
||||
aria-hidden="true"
|
||||
/>
|
||||
<img
|
||||
src={GradientBgLogo}
|
||||
className="pointer-events-none absolute -right-20 -bottom-16 h-56 w-96 opacity-12"
|
||||
alt=""
|
||||
aria-hidden="true"
|
||||
/>
|
||||
<img src={GradientLogo} className="h-24 w-40 object-contain" alt="NODE.DC Logo" />
|
||||
<div className="flex max-w-124 flex-col items-center gap-3">
|
||||
<h1 className="text-h2-semibold text-primary">Welcome to NODE.DC</h1>
|
||||
<h1 className="text-h2-semibold text-primary">NODE.DC готов к запуску</h1>
|
||||
<p className="text-center text-body-md-regular text-secondary">
|
||||
Set up your instance and create your first workspace to begin managing projects and work.
|
||||
Завершите настройку инстанса и создайте первое рабочее пространство, чтобы начать работу с
|
||||
проектами и рабочими элементами.
|
||||
</p>
|
||||
</div>
|
||||
<a href={GOD_MODE_URL} className="w-80">
|
||||
<Button variant="primary" className="nodedc-error-primary w-full" size="xl">
|
||||
Перейти к настройке
|
||||
</Button>
|
||||
</a>
|
||||
<a
|
||||
href="https://nodedc.dctouch.ru/"
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
className="nodedc-error-link text-13 font-medium"
|
||||
>
|
||||
Служба поддержки
|
||||
</a>
|
||||
</div>
|
||||
<a href={GOD_MODE_URL} className="w-72">
|
||||
<Button variant="primary" className="w-full" size="xl">
|
||||
Get started
|
||||
</Button>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -84,7 +84,7 @@ function ProjectCreateHeader(props: Props) {
|
||||
}}
|
||||
control={control}
|
||||
value={value ?? null}
|
||||
buttonClassName="nodedc-overlay-button"
|
||||
buttonClassName="nodedc-overlay-button min-w-[10.5rem]"
|
||||
tabIndex={getIndex("cover_image")}
|
||||
/>
|
||||
)}
|
||||
|
||||
@@ -255,7 +255,7 @@ export function ProjectDetailsForm(props: IProjectDetailsForm) {
|
||||
control={control}
|
||||
onChange={onChange}
|
||||
value={value ?? null}
|
||||
buttonClassName="nodedc-overlay-button"
|
||||
buttonClassName="nodedc-overlay-button min-w-[10.5rem]"
|
||||
disabled={!isAdmin}
|
||||
projectId={project.id}
|
||||
/>
|
||||
@@ -436,7 +436,7 @@ export function ProjectDetailsForm(props: IProjectDetailsForm) {
|
||||
type="submit"
|
||||
loading={isLoading}
|
||||
disabled={!isAdmin}
|
||||
className="nodedc-settings-save-button min-w-[11.5rem]"
|
||||
className="nodedc-settings-save-button min-w-[11.5rem] !text-[#0b1117] hover:!text-[#0b1117]"
|
||||
>
|
||||
{isLoading ? t("updating") : t("common.update_project")}
|
||||
</Button>
|
||||
|
||||
@@ -57,7 +57,7 @@ export const ProjectFeatureUpdate = observer(function ProjectFeatureUpdate(props
|
||||
<Link
|
||||
href={`/${workspaceSlug}/projects/${projectId}/issues`}
|
||||
onClick={onClose}
|
||||
className="nodedc-modal-primary-button inline-flex min-w-[10.5rem] items-center justify-center"
|
||||
className="nodedc-modal-primary-button inline-flex min-w-[10.5rem] items-center justify-center !text-[#0b1117] hover:!text-[#0b1117]"
|
||||
tabIndex={2}
|
||||
>
|
||||
{t("open_project")}
|
||||
|
||||
Reference in New Issue
Block a user