From 1ca87608686bc5252f73fc2f3f8267c844ffbdee Mon Sep 17 00:00:00 2001 From: James Ritchie Date: Sat, 11 Feb 2023 10:19:03 +0000 Subject: [PATCH] Improved wording and styling --- .../$organizationSlug/__org/workflows.new.tsx | 6 +-- apps/webapp/app/routes/__public/templates.tsx | 54 ++++++++++--------- 2 files changed, 31 insertions(+), 29 deletions(-) diff --git a/apps/webapp/app/routes/__app/orgs/$organizationSlug/__org/workflows.new.tsx b/apps/webapp/app/routes/__app/orgs/$organizationSlug/__org/workflows.new.tsx index 50be7faa0..e32c8fec9 100644 --- a/apps/webapp/app/routes/__app/orgs/$organizationSlug/__org/workflows.new.tsx +++ b/apps/webapp/app/routes/__app/orgs/$organizationSlug/__org/workflows.new.tsx @@ -296,19 +296,19 @@ export function StepNumber({ drawLine, active = false, }: { - stepNumber: string; + stepNumber?: string; drawLine?: boolean; active?: boolean; }) { return (
{active ? ( - + {stepNumber} ) : ( - {stepNumber} + ✓ )} diff --git a/apps/webapp/app/routes/__public/templates.tsx b/apps/webapp/app/routes/__public/templates.tsx index 76044cc94..5b83410d6 100644 --- a/apps/webapp/app/routes/__public/templates.tsx +++ b/apps/webapp/app/routes/__public/templates.tsx @@ -2,9 +2,12 @@ import { CloudIcon, CubeIcon, CubeTransparentIcon, + EllipsisHorizontalCircleIcon, + EllipsisHorizontalIcon, HomeIcon, MinusCircleIcon, MinusIcon, + RocketLaunchIcon, XMarkIcon, } from "@heroicons/react/24/outline"; import classNames from "classnames"; @@ -68,37 +71,12 @@ function Step1() { ); } -function Step1Hosted({ showVisitedButtonState }: Step1Props) { - return ( - - ); -} - -function Step1HostedVisited() { - return ( -
- - - Hosting coming soon… - - We're working hard to bring a cloud hosted service. - -
- ); -} - function Step2() { return ( <>
- + I'll host the workflow myself Change answer @@ -200,6 +178,30 @@ function Step4() { ); } +function Step1Hosted({ showVisitedButtonState }: Step1Props) { + return ( + + ); +} + +function Step1HostedVisited() { + return ( +
+ + Cloud hosting coming soon… + + We're working hard to bring you a cloud hosted service. + +
+ ); +} + const buttonStyles = "relative flex flex-col items-center justify-start hover:bg-slate-700 px-4 shadow gap-4 rounded bg-slate-700/50 py-8 border border-slate-700 transition"; const labelStyles =