diff --git a/packages/frontend/index.html b/packages/frontend/index.html index 799bd444..6978bbaf 100644 --- a/packages/frontend/index.html +++ b/packages/frontend/index.html @@ -1,19 +1,21 @@ - + - + - - - - - Snowball + Laconic + + +
diff --git a/packages/frontend/public/android-chrome-192x192.png b/packages/frontend/public/android-chrome-192x192.png deleted file mode 100644 index eed80a70..00000000 Binary files a/packages/frontend/public/android-chrome-192x192.png and /dev/null differ diff --git a/packages/frontend/public/android-chrome-512x512.png b/packages/frontend/public/android-chrome-512x512.png deleted file mode 100644 index 72537543..00000000 Binary files a/packages/frontend/public/android-chrome-512x512.png and /dev/null differ diff --git a/packages/frontend/public/apple-touch-icon.png b/packages/frontend/public/apple-touch-icon.png deleted file mode 100644 index ac30fad2..00000000 Binary files a/packages/frontend/public/apple-touch-icon.png and /dev/null differ diff --git a/packages/frontend/public/favicon-16x16.png b/packages/frontend/public/favicon-16x16.png deleted file mode 100644 index 5e9d7cf8..00000000 Binary files a/packages/frontend/public/favicon-16x16.png and /dev/null differ diff --git a/packages/frontend/public/favicon-32x32.png b/packages/frontend/public/favicon-32x32.png deleted file mode 100644 index 33a57714..00000000 Binary files a/packages/frontend/public/favicon-32x32.png and /dev/null differ diff --git a/packages/frontend/public/favicon.ico b/packages/frontend/public/favicon.ico index 154390ed..ebae81e9 100644 Binary files a/packages/frontend/public/favicon.ico and b/packages/frontend/public/favicon.ico differ diff --git a/packages/frontend/public/laconic-logo.svg b/packages/frontend/public/laconic-logo.svg new file mode 100644 index 00000000..526d9b28 --- /dev/null +++ b/packages/frontend/public/laconic-logo.svg @@ -0,0 +1,4 @@ + + + + diff --git a/packages/frontend/public/logo.svg b/packages/frontend/public/logo.svg index 3781af8a..2efbd79f 100644 --- a/packages/frontend/public/logo.svg +++ b/packages/frontend/public/logo.svg @@ -1 +1,10 @@ - + + + + + + + + + + diff --git a/packages/frontend/public/mstile-144x144.png b/packages/frontend/public/mstile-144x144.png deleted file mode 100644 index a71f14e2..00000000 Binary files a/packages/frontend/public/mstile-144x144.png and /dev/null differ diff --git a/packages/frontend/public/mstile-150x150.png b/packages/frontend/public/mstile-150x150.png deleted file mode 100644 index 44adb555..00000000 Binary files a/packages/frontend/public/mstile-150x150.png and /dev/null differ diff --git a/packages/frontend/public/mstile-310x150.png b/packages/frontend/public/mstile-310x150.png deleted file mode 100644 index 771feff6..00000000 Binary files a/packages/frontend/public/mstile-310x150.png and /dev/null differ diff --git a/packages/frontend/public/mstile-310x310.png b/packages/frontend/public/mstile-310x310.png deleted file mode 100644 index deab4f4e..00000000 Binary files a/packages/frontend/public/mstile-310x310.png and /dev/null differ diff --git a/packages/frontend/public/mstile-70x70.png b/packages/frontend/public/mstile-70x70.png deleted file mode 100644 index e9681f32..00000000 Binary files a/packages/frontend/public/mstile-70x70.png and /dev/null differ diff --git a/packages/frontend/public/site.webmanifest b/packages/frontend/public/site.webmanifest index 930233c3..582f3473 100644 --- a/packages/frontend/public/site.webmanifest +++ b/packages/frontend/public/site.webmanifest @@ -1,5 +1,5 @@ { - "name": "Snowball Tools Dashboard", + "name": "Laconic Tools Dashboard", "short_name": "snowball tools", "icons": [ { diff --git a/packages/frontend/src/components/Logo.tsx b/packages/frontend/src/components/Logo.tsx index 6b6d8131..f4957f14 100644 --- a/packages/frontend/src/components/Logo.tsx +++ b/packages/frontend/src/components/Logo.tsx @@ -1,5 +1,4 @@ import { Link } from 'react-router-dom'; -import { Heading } from './shared/Heading'; interface LogoProps { orgSlug?: string; @@ -9,14 +8,7 @@ export const Logo = ({ orgSlug }: LogoProps) => { return (
- Snowball Logo - - Snowball - + Snowball Logo
); diff --git a/packages/frontend/src/components/SearchBar.tsx b/packages/frontend/src/components/SearchBar.tsx index af369271..23bed3fb 100644 --- a/packages/frontend/src/components/SearchBar.tsx +++ b/packages/frontend/src/components/SearchBar.tsx @@ -10,7 +10,7 @@ const SearchBar: React.ForwardRefRenderFunction< return (
} + leftIcon={} onChange={onChange} value={value} type="search" diff --git a/packages/frontend/src/components/Stepper.tsx b/packages/frontend/src/components/Stepper.tsx index 0c866202..31e7e717 100644 --- a/packages/frontend/src/components/Stepper.tsx +++ b/packages/frontend/src/components/Stepper.tsx @@ -24,8 +24,8 @@ const Stepper = ({ activeStep, stepperValues }: StepperProps) => {
{stepperValue.label} diff --git a/packages/frontend/src/components/projects/ProjectCard/ProjectCard.theme.ts b/packages/frontend/src/components/projects/ProjectCard/ProjectCard.theme.ts index 117a2cde..db96fc91 100644 --- a/packages/frontend/src/components/projects/ProjectCard/ProjectCard.theme.ts +++ b/packages/frontend/src/components/projects/ProjectCard/ProjectCard.theme.ts @@ -4,7 +4,9 @@ export const projectCardTheme = tv({ slots: { wrapper: [ 'bg-surface-card', + 'dark:bg-overlay2', 'shadow-card', + 'dark:shadow-background', 'rounded-2xl', 'flex', 'flex-col', @@ -17,10 +19,16 @@ export const projectCardTheme = tv({ 'text-sm', 'font-medium', 'text-elements-high-em', + 'dark:text-foreground', 'tracking-[-0.006em]', 'truncate', ], - description: ['text-xs', 'text-elements-low-em', 'truncate'], + description: [ + 'text-xs', + 'text-elements-low-em', + 'dark:text-foreground-secondary', + 'truncate', + ], icons: ['flex', 'items-center', 'gap-1'], lowerContent: [ 'transition-colors', @@ -32,6 +40,7 @@ export const projectCardTheme = tv({ 'gap-2', 'rounded-b-2xl', 'group-hover:bg-surface-card-hovered', + 'dark:group-hover:bg-overlay3', ], latestDeployment: ['flex', 'items-center', 'gap-2'], deploymentStatusContainer: [ @@ -42,10 +51,15 @@ export const projectCardTheme = tv({ 'justify-center', ], deploymentStatus: ['w-1', 'h-1', 'rounded-full'], - deploymentName: ['text-xs', 'text-elements-low-em'], + deploymentName: [ + 'text-xs', + 'text-elements-low-em', + 'dark:text-foreground-secondary', + ], deploymentText: [ 'text-xs', 'text-elements-low-em', + 'dark:text-foreground-secondary', 'font-mono', 'flex', 'items-center', @@ -53,9 +67,11 @@ export const projectCardTheme = tv({ ], wavyBorder: [ 'bg-surface-card', + 'dark:bg-background', 'transition-colors', 'duration-150', 'group-hover:bg-surface-card-hovered', + 'dark:group-hover:bg-overlay2', ], }, variants: { @@ -67,7 +83,7 @@ export const projectCardTheme = tv({ deploymentStatus: ['bg-orange-400'], }, failure: { - deploymentStatus: ['bg-rose-500'], + deploymentStatus: ['bg-error'], }, pending: { deploymentStatus: ['bg-gray-500'], diff --git a/packages/frontend/src/components/projects/ProjectCard/ProjectCard.tsx b/packages/frontend/src/components/projects/ProjectCard/ProjectCard.tsx index e1987d2c..c7798279 100644 --- a/packages/frontend/src/components/projects/ProjectCard/ProjectCard.tsx +++ b/packages/frontend/src/components/projects/ProjectCard/ProjectCard.tsx @@ -88,7 +88,7 @@ export const ProjectCard = ({
{/* Icons */}
- {hasError && } + {hasError && } - - + + Project settings Delete project diff --git a/packages/frontend/src/components/projects/ProjectSearchBar/ProjectSearchBar.tsx b/packages/frontend/src/components/projects/ProjectSearchBar/ProjectSearchBar.tsx index df3b09b2..465b833d 100644 --- a/packages/frontend/src/components/projects/ProjectSearchBar/ProjectSearchBar.tsx +++ b/packages/frontend/src/components/projects/ProjectSearchBar/ProjectSearchBar.tsx @@ -59,12 +59,12 @@ export const ProjectSearchBar = ({ onChange }: ProjectSearchBarProps) => { }, [fetchProjects, debouncedInputValue]); return ( -
+
diff --git a/packages/frontend/src/components/projects/ProjectSearchBar/ProjectSearchBarEmpty.tsx b/packages/frontend/src/components/projects/ProjectSearchBar/ProjectSearchBarEmpty.tsx index 74c4d033..b901cec0 100644 --- a/packages/frontend/src/components/projects/ProjectSearchBar/ProjectSearchBarEmpty.tsx +++ b/packages/frontend/src/components/projects/ProjectSearchBar/ProjectSearchBarEmpty.tsx @@ -13,10 +13,10 @@ export const ProjectSearchBarEmpty = ({ {...props} className={cn('flex items-center px-2 py-2 gap-3', className)} > -
+
-

+

No projects matching this name

diff --git a/packages/frontend/src/components/projects/create/ConnectAccount.tsx b/packages/frontend/src/components/projects/create/ConnectAccount.tsx index d9435d7b..8738e775 100644 --- a/packages/frontend/src/components/projects/create/ConnectAccount.tsx +++ b/packages/frontend/src/components/projects/create/ConnectAccount.tsx @@ -6,7 +6,6 @@ import { Button } from '../../shared/Button'; import { GitIcon, EllipsesIcon, - SnowballIcon, GithubIcon, GitTeaIcon, } from '../../shared/CustomIcon'; @@ -15,6 +14,7 @@ import { IconWithFrame } from '../../shared/IconWithFrame'; import { Heading } from '../../shared/Heading'; import { MockConnectGitCard } from './MockConnectGitCard'; import { VITE_GITHUB_CLIENT_ID } from 'utils/constants'; +import { LaconicIcon } from 'components/shared/CustomIcon/LaconicIcon'; const SCOPES = 'repo user'; const GITHUB_OAUTH_URL = `https://github.com/login/oauth/authorize?client_id=${VITE_GITHUB_CLIENT_ID}&scope=${encodeURIComponent(SCOPES)}`; @@ -46,20 +46,24 @@ const ConnectAccount: React.FC = ({ // TODO: Use correct height return ( -
+
{/** Icons */}
- } /> + } hasHighlight={false} /> - } /> + } + hasHighlight={false} + />
{/** Text */}
- + Connect to your Git account -

+

Once connected, you can import a repository from your account or start with one of our templates.

@@ -70,14 +74,14 @@ const ConnectAccount: React.FC = ({ url={GITHUB_OAUTH_URL} onCode={handleCode} onClose={() => {}} - title="Snowball" + title="Laconic" width={1000} height={1000} > @@ -85,7 +89,7 @@ const ConnectAccount: React.FC = ({ diff --git a/packages/frontend/src/components/projects/create/MockConnectGitCard.tsx b/packages/frontend/src/components/projects/create/MockConnectGitCard.tsx index abc49ab6..02478060 100644 --- a/packages/frontend/src/components/projects/create/MockConnectGitCard.tsx +++ b/packages/frontend/src/components/projects/create/MockConnectGitCard.tsx @@ -94,7 +94,7 @@ export const MockConnectGitCard = () => { }, [segmentedControlsValue]); return ( -
+
{/* Content */} { {renderContent} {/* Shade */} -
+
); }; @@ -121,18 +121,18 @@ const MockProjectCard = ({ visibility?: string; }) => { return ( -
+
{/* Icon container */} -
+
{/* Content */}
-

+

{full_name}

-

+

{updated_at && relativeTimeISO(updated_at)}

@@ -149,13 +149,13 @@ const MockProjectCard = ({ const MockTemplateCard = ({ icon, name }: { icon: string; name: string }) => { return ( -
+
{/* Icon */} -
+
{/* Name */} -

+

{name}

diff --git a/packages/frontend/src/components/projects/project/overview/Activity/Activity.tsx b/packages/frontend/src/components/projects/project/overview/Activity/Activity.tsx index 82d5e016..a8188270 100644 --- a/packages/frontend/src/components/projects/project/overview/Activity/Activity.tsx +++ b/packages/frontend/src/components/projects/project/overview/Activity/Activity.tsx @@ -16,7 +16,7 @@ export const Activity = ({
Activity
diff --git a/packages/frontend/src/components/projects/project/overview/Activity/AuctionCard.tsx b/packages/frontend/src/components/projects/project/overview/Activity/AuctionCard.tsx index b5e9ab39..9dd11859 100644 --- a/packages/frontend/src/components/projects/project/overview/Activity/AuctionCard.tsx +++ b/packages/frontend/src/components/projects/project/overview/Activity/AuctionCard.tsx @@ -18,7 +18,6 @@ import { Button, Heading, Tag } from 'components/shared'; const WAIT_DURATION = 5000; const DIALOG_STYLE = { - backgroundColor: 'rgba(0,0,0, .9)', padding: '2em', borderRadius: '0.5em', marginLeft: '0.5em', @@ -86,27 +85,27 @@ export const AuctionCard = ({ project }: { project: Project }) => { return ( <> -
+
Auction details
- + Auction Id - + {project.auctionId}
- + Auction Status
{renderAuctionStatus()}
@@ -116,17 +115,20 @@ export const AuctionCard = ({ project }: { project: Project }) => { <> {deployers?.length > 0 ? (
- + Deployer LRNs {deployers.map((deployer, index) => ( -

+

{'\u2022'} {deployer.deployerLrn}

))}
- + Deployer Funds Status
@@ -141,7 +143,7 @@ export const AuctionCard = ({ project }: { project: Project }) => {
) : (
- + No winning deployers
@@ -155,15 +157,24 @@ export const AuctionCard = ({ project }: { project: Project }) => { onClose={handleCloseDialog} fullWidth maxWidth="md" + PaperProps={{ + className: 'dark:bg-overlay2', + }} > - Auction Details + + Auction Details + {auctionDetails && ( - 
{JSON.stringify(auctionDetails, null, 2)}
+ 
+              {JSON.stringify(auctionDetails, null, 2)}
+
)} - + diff --git a/packages/frontend/src/components/projects/project/overview/OverviewInfo.tsx b/packages/frontend/src/components/projects/project/overview/OverviewInfo.tsx index f926072e..6b565e21 100644 --- a/packages/frontend/src/components/projects/project/overview/OverviewInfo.tsx +++ b/packages/frontend/src/components/projects/project/overview/OverviewInfo.tsx @@ -18,7 +18,7 @@ export const OverviewInfo = ({ return (
-
+
{styledIcon} {label}
diff --git a/packages/frontend/src/components/projects/project/settings/AddMemberDialog.tsx b/packages/frontend/src/components/projects/project/settings/AddMemberDialog.tsx index e5599e57..718e2585 100644 --- a/packages/frontend/src/components/projects/project/settings/AddMemberDialog.tsx +++ b/packages/frontend/src/components/projects/project/settings/AddMemberDialog.tsx @@ -93,11 +93,11 @@ const AddMemberDialog = ({ /> - - diff --git a/packages/frontend/src/components/projects/project/settings/DisplayEnvironmentVariables.tsx b/packages/frontend/src/components/projects/project/settings/DisplayEnvironmentVariables.tsx index 1b3deb4d..7fb24409 100644 --- a/packages/frontend/src/components/projects/project/settings/DisplayEnvironmentVariables.tsx +++ b/packages/frontend/src/components/projects/project/settings/DisplayEnvironmentVariables.tsx @@ -24,7 +24,7 @@ const DisplayEnvironmentVariables = ({ return ( <>
setOpenCollapse((cur) => !cur)} > {openCollapse ? : } @@ -33,7 +33,7 @@ const DisplayEnvironmentVariables = ({
{variables.length === 0 ? ( -
+
No environment variables added yet. Once you add them, they'll show up here.
diff --git a/packages/frontend/src/components/projects/project/settings/MemberCard.tsx b/packages/frontend/src/components/projects/project/settings/MemberCard.tsx index bf6e598f..12c714b0 100644 --- a/packages/frontend/src/components/projects/project/settings/MemberCard.tsx +++ b/packages/frontend/src/components/projects/project/settings/MemberCard.tsx @@ -80,7 +80,7 @@ const MemberCard = ({ return (
{member.name && ( diff --git a/packages/frontend/src/components/projects/project/settings/SetupDomain.tsx b/packages/frontend/src/components/projects/project/settings/SetupDomain.tsx index 099a0c54..03c9b331 100644 --- a/packages/frontend/src/components/projects/project/settings/SetupDomain.tsx +++ b/packages/frontend/src/components/projects/project/settings/SetupDomain.tsx @@ -102,8 +102,8 @@ const SetupDomain = () => { )}
-
diff --git a/packages/frontend/src/components/shared/Avatar/Avatar.theme.ts b/packages/frontend/src/components/shared/Avatar/Avatar.theme.ts index a72a1bc7..e859c846 100644 --- a/packages/frontend/src/components/shared/Avatar/Avatar.theme.ts +++ b/packages/frontend/src/components/shared/Avatar/Avatar.theme.ts @@ -30,7 +30,12 @@ export const avatarTheme = tv( fallback: ['text-elements-warning', 'bg-base-bg-emphasized-warning'], }, blue: { - fallback: ['text-elements-info', 'bg-base-bg-emphasized-info'], + fallback: [ + 'text-elements-info', + 'bg-base-bg-emphasized-info', + 'dark:text-foreground', + 'dark:bg-primary', + ], }, }, size: { diff --git a/packages/frontend/src/components/shared/Button/Button.theme.ts b/packages/frontend/src/components/shared/Button/Button.theme.ts index eedb9b24..27ef01eb 100644 --- a/packages/frontend/src/components/shared/Button/Button.theme.ts +++ b/packages/frontend/src/components/shared/Button/Button.theme.ts @@ -16,6 +16,7 @@ export const buttonTheme = tv( 'disabled:cursor-not-allowed', 'transition-colors', 'duration-150', + 'font-mono', ], variants: { size: { @@ -28,7 +29,7 @@ export const buttonTheme = tv( true: 'w-full', }, shape: { - default: 'rounded-lg', + default: 'rounded', rounded: 'rounded-full', }, iconOnly: { @@ -39,21 +40,21 @@ export const buttonTheme = tv( 'text-elements-on-primary', 'border', 'border-transparent', - 'bg-controls-primary', + 'bg-primary', 'shadow-button', - 'hover:bg-controls-primary-hovered', - 'focus-visible:bg-controls-primary-hovered', + 'hover:bg-primary-hovered', + 'focus-visible:bg-primary-hovered', 'disabled:text-elements-on-disabled', 'disabled:bg-controls-disabled', 'disabled:border-transparent', 'disabled:shadow-none', ], secondary: [ - 'text-elements-on-secondary', + 'text-primary', 'border', 'border-transparent', - 'bg-controls-secondary', - 'hover:bg-controls-secondary-hovered', + 'bg-secondary', + 'hover:bg-overlay2', 'focus-visible:bg-controls-secondary-hovered', 'disabled:text-elements-on-disabled', 'disabled:bg-controls-disabled', @@ -77,10 +78,12 @@ export const buttonTheme = tv( ], ghost: [ 'text-elements-on-tertiary', + 'dark:text-foreground-secondary', 'border', 'border-transparent', 'bg-transparent', 'hover:bg-controls-tertiary-hovered', + 'dark:hover:bg-overlay2', 'hover:border-border-interactive-hovered', 'focus-visible:bg-controls-tertiary-hovered', 'focus-visible:border-border-interactive-hovered', @@ -93,7 +96,7 @@ export const buttonTheme = tv( 'text-elements-on-danger', 'border', 'border-transparent', - 'bg-border-danger', + 'bg-error', 'hover:bg-controls-danger-hovered', 'focus-visible:bg-controls-danger-hovered', 'disabled:text-elements-on-disabled', diff --git a/packages/frontend/src/components/shared/Calendar/Calendar.css b/packages/frontend/src/components/shared/Calendar/Calendar.css index 49bf10d3..c8f73226 100644 --- a/packages/frontend/src/components/shared/Calendar/Calendar.css +++ b/packages/frontend/src/components/shared/Calendar/Calendar.css @@ -40,11 +40,11 @@ abbr[title] { } .react-calendar__tile { - @apply h-12 w-12 text-elements-high-em; + @apply h-12 w-12 text-elements-high-em dark:text-foreground; } .react-calendar__tile:hover { - @apply bg-base-bg-emphasized rounded-lg; + @apply bg-base-bg-emphasized dark:bg-overlay3 rounded-lg; } .react-calendar__tile:focus-visible { @@ -52,7 +52,7 @@ abbr[title] { } .react-calendar__tile--now { - @apply bg-base-bg-emphasized text-elements-high-em rounded-lg; + @apply bg-base-bg-emphasized dark:bg-overlay3 text-elements-high-em rounded-lg; } .react-calendar__tile--now:hover { @@ -77,7 +77,7 @@ abbr[title] { /* Range -- START */ .react-calendar__tile--range { - @apply bg-controls-secondary text-elements-on-secondary rounded-none; + @apply bg-controls-secondary dark:bg-overlay3 text-elements-on-secondary rounded-none; } .react-calendar__tile--range:hover { @@ -89,7 +89,7 @@ abbr[title] { } .react-calendar__tile--rangeStart { - @apply bg-controls-primary text-elements-on-primary rounded-lg; + @apply bg-controls-primary dark:bg-primary text-elements-on-primary rounded-lg; } .react-calendar__tile--rangeStart:hover { @@ -101,7 +101,7 @@ abbr[title] { } .react-calendar__tile--rangeEnd { - @apply bg-controls-primary text-elements-on-primary rounded-lg; + @apply bg-controls-primary dark:bg-primary text-elements-on-primary rounded-lg; } .react-calendar__tile--rangeEnd:hover { diff --git a/packages/frontend/src/components/shared/Calendar/Calendar.theme.ts b/packages/frontend/src/components/shared/Calendar/Calendar.theme.ts index 88feb6e5..e9b5b262 100644 --- a/packages/frontend/src/components/shared/Calendar/Calendar.theme.ts +++ b/packages/frontend/src/components/shared/Calendar/Calendar.theme.ts @@ -5,7 +5,9 @@ export const calendarTheme = tv({ wrapper: [ 'max-w-[352px]', 'bg-surface-floating', + 'dark:bg-overlay2', 'shadow-dropdown', + 'dark:shadow-background', 'rounded-xl', ], calendar: ['flex', 'flex-col', 'py-2', 'px-2', 'gap-2'], @@ -28,9 +30,12 @@ export const calendarTheme = tv({ 'border', 'border-border-interactive', 'text-elements-high-em', + 'dark:text-foreground', 'shadow-field', 'bg-white', + 'dark:bg-overlay3', 'hover:bg-base-bg-alternate', + 'dark:hover:bg-foreground-secondary', 'focus-visible:bg-base-bg-alternate', ], footer: [ diff --git a/packages/frontend/src/components/shared/Calendar/Calendar.tsx b/packages/frontend/src/components/shared/Calendar/Calendar.tsx index 4ccb8655..43406464 100644 --- a/packages/frontend/src/components/shared/Calendar/Calendar.tsx +++ b/packages/frontend/src/components/shared/Calendar/Calendar.tsx @@ -280,6 +280,7 @@ export const Calendar = ({ showNavigation={false} selectRange={selectRange} onChange={handleChange} + // tileClassName="dark:text-foreground-secondary dark:hover:bg-overlay3" onClickMonth={(date) => handleChangeNavigation('month', date)} onClickYear={(date) => handleChangeNavigation('year', date)} /> @@ -297,19 +298,20 @@ export const Calendar = ({ ) : ( <> {value && ( - )}
-
diff --git a/packages/frontend/src/components/shared/Checkbox/Checkbox.theme.ts b/packages/frontend/src/components/shared/Checkbox/Checkbox.theme.ts index e39b66f3..4304e1eb 100644 --- a/packages/frontend/src/components/shared/Checkbox/Checkbox.theme.ts +++ b/packages/frontend/src/components/shared/Checkbox/Checkbox.theme.ts @@ -11,7 +11,9 @@ export const getCheckboxVariant = tv({ 'focus-visible:text-controls-disabled', 'group-focus-visible:text-controls-disabled', 'data-[state=checked]:text-elements-on-primary', + 'dark:data-[state=checked]:text-foreground', 'data-[state=checked]:group-focus-visible:text-elements-on-primary', + 'dark:data-[state=checked]:group-focus-visible:text-foreground', 'data-[state=indeterminate]:text-elements-on-primary', 'data-[state=checked]:data-[disabled]:text-elements-on-disabled-active', ], @@ -23,6 +25,7 @@ export const getCheckboxVariant = tv({ 'border', 'border-border-interactive/10', 'bg-controls-tertiary', + 'dark:bg-background', 'rounded-md', 'transition-all', 'duration-150', @@ -30,9 +33,13 @@ export const getCheckboxVariant = tv({ 'shadow-button', 'group-hover:border-border-interactive/[0.14]', 'group-hover:bg-controls-tertiary', + 'dark:group-hover:bg-overlay', 'data-[state=checked]:bg-controls-primary', + 'dark:data-[state=checked]:bg-primary', 'data-[state=checked]:hover:bg-controls-primary-hovered', + 'dark:data-[state=checked]:hover:bg-primary-hovered', 'data-[state=checked]:focus-visible:bg-controls-primary-hovered', + 'dark:data-[state=checked]:focus-visible:bg-primary-hovered', 'data-[disabled]:bg-controls-disabled', 'data-[disabled]:shadow-none', 'data-[disabled]:hover:border-border-interactive/10', @@ -43,12 +50,17 @@ export const getCheckboxVariant = tv({ 'text-sm', 'tracking-[-0.006em]', 'text-elements-high-em', + 'dark:text-foreground', 'flex', 'flex-col', 'gap-1', 'px-1', ], - description: ['text-xs', 'text-elements-low-em'], + description: [ + 'text-xs', + 'text-elements-low-em', + 'dark:text-foreground-secondary', + ], }, variants: { disabled: { diff --git a/packages/frontend/src/components/shared/CustomIcon/GitIcon.tsx b/packages/frontend/src/components/shared/CustomIcon/GitIcon.tsx index e048198f..5419f6bf 100644 --- a/packages/frontend/src/components/shared/CustomIcon/GitIcon.tsx +++ b/packages/frontend/src/components/shared/CustomIcon/GitIcon.tsx @@ -11,7 +11,7 @@ export const GitIcon: React.FC = (props) => { > ); diff --git a/packages/frontend/src/components/shared/CustomIcon/GithubIcon.tsx b/packages/frontend/src/components/shared/CustomIcon/GithubIcon.tsx index 01db4b9f..f6a3c227 100644 --- a/packages/frontend/src/components/shared/CustomIcon/GithubIcon.tsx +++ b/packages/frontend/src/components/shared/CustomIcon/GithubIcon.tsx @@ -13,7 +13,7 @@ export const GithubIcon: React.FC = (props) => { fillRule="evenodd" clipRule="evenodd" d="M9.9702 0.206024C4.45694 0.206024 0 4.69582 0 10.2503C0 14.6903 2.85571 18.4487 6.81735 19.7789C7.31265 19.8789 7.49408 19.5628 7.49408 19.2968C7.49408 19.064 7.47776 18.2658 7.47776 17.4342C4.70429 18.033 4.12674 16.2368 4.12674 16.2368C3.68102 15.0728 3.02061 14.7736 3.02061 14.7736C2.11286 14.1583 3.08673 14.1583 3.08673 14.1583C4.09367 14.2248 4.62204 15.1893 4.62204 15.1893C5.51327 16.7191 6.94939 16.2868 7.52714 16.0207C7.60959 15.3721 7.87388 14.9232 8.15449 14.6738C5.94245 14.4409 3.6151 13.5762 3.6151 9.71807C3.6151 8.62051 4.01102 7.72256 4.63837 7.02419C4.53939 6.7748 4.19265 5.74358 4.73755 4.36337C4.73755 4.36337 5.57939 4.09725 7.47755 5.39439C8.29022 5.17453 9.12832 5.06268 9.9702 5.06174C10.812 5.06174 11.6702 5.17827 12.4627 5.39439C14.361 4.09725 15.2029 4.36337 15.2029 4.36337C15.7478 5.74358 15.4008 6.7748 15.3018 7.02419C15.9457 7.72256 16.3253 8.62051 16.3253 9.71807C16.3253 13.5762 13.998 14.4242 11.7694 14.6738C12.1327 14.9897 12.4461 15.5883 12.4461 16.5362C12.4461 17.8832 12.4298 18.9642 12.4298 19.2966C12.4298 19.5628 12.6114 19.8789 13.1065 19.7791C17.0682 18.4485 19.9239 14.6903 19.9239 10.2503C19.9402 4.69582 15.4669 0.206024 9.9702 0.206024Z" - fill="#0B1D2E" + fill="#FBFBFB" /> ); diff --git a/packages/frontend/src/components/shared/CustomIcon/LaconicIcon.tsx b/packages/frontend/src/components/shared/CustomIcon/LaconicIcon.tsx new file mode 100644 index 00000000..c87b62f2 --- /dev/null +++ b/packages/frontend/src/components/shared/CustomIcon/LaconicIcon.tsx @@ -0,0 +1,21 @@ +import { CustomIcon, CustomIconProps } from './CustomIcon'; + +export const LaconicIcon: React.FC = (props) => { + return ( + + + + + ); +}; diff --git a/packages/frontend/src/components/shared/Heading/Heading.theme.ts b/packages/frontend/src/components/shared/Heading/Heading.theme.ts index 5ce5bb5c..f8b434f3 100644 --- a/packages/frontend/src/components/shared/Heading/Heading.theme.ts +++ b/packages/frontend/src/components/shared/Heading/Heading.theme.ts @@ -1,7 +1,12 @@ import { tv, type VariantProps } from 'tailwind-variants'; export const headingTheme = tv({ - base: ['text-elements-high-em', 'font-display', 'font-normal'], + base: [ + 'text-elements-high-em', + 'dark:text-foreground', + 'font-display', + 'font-normal', + ], }); export type HeadingVariants = VariantProps; diff --git a/packages/frontend/src/components/shared/IconWithFrame/IconWithFrame.tsx b/packages/frontend/src/components/shared/IconWithFrame/IconWithFrame.tsx index 8ede3c0d..f35e69f5 100644 --- a/packages/frontend/src/components/shared/IconWithFrame/IconWithFrame.tsx +++ b/packages/frontend/src/components/shared/IconWithFrame/IconWithFrame.tsx @@ -18,7 +18,7 @@ export const IconWithFrame = ({ 'relative justify-center items-center gap-2.5 inline-flex', 'w-16 h-16 rounded-2xl shadow-inner', 'border border-b-[3px] border-border-interactive border-opacity-10', - 'bg-controls-secondary', + 'bg-background', className, )} {...props} diff --git a/packages/frontend/src/components/shared/Input/Input.theme.ts b/packages/frontend/src/components/shared/Input/Input.theme.ts index 0144d578..60ec115f 100644 --- a/packages/frontend/src/components/shared/Input/Input.theme.ts +++ b/packages/frontend/src/components/shared/Input/Input.theme.ts @@ -14,22 +14,29 @@ export const inputTheme = tv( 'disabled:cursor-not-allowed', 'disabled:bg-controls-disabled', ], - label: ['text-sm', 'text-elements-high-em'], + label: [ + 'text-sm', + 'text-elements-high-em', + 'dark:text-foreground-secondary', + ], description: ['text-xs', 'text-elements-low-em'], input: [ 'focus-ring', + 'dark:focus:ring-0', 'block', 'w-full', 'h-full', 'shadow-sm', 'border', 'rounded-lg', + 'dark:bg-overlay2', + 'dark:text-foreground', 'text-elements-mid-em', 'border-border-interactive', 'disabled:shadow-none', 'disabled:border-none', ], - icon: ['text-elements-low-em'], + icon: ['text-elements-low-em dark:text-foreground-secondary'], iconContainer: [ 'absolute', 'inset-y-0', @@ -39,7 +46,13 @@ export const inputTheme = tv( 'cursor-pointer', ], helperIcon: [], - helperText: ['flex', 'gap-2', 'items-center', 'text-elements-danger'], + helperText: [ + 'flex', + 'gap-2', + 'items-center', + 'text-elements-danger', + 'dark:text-primary', + ], }, variants: { state: { @@ -54,7 +67,7 @@ export const inputTheme = tv( 'shadow-none', 'focus:outline-border-danger', ], - helperText: 'text-elements-danger', + helperText: 'text-error', }, }, size: { diff --git a/packages/frontend/src/components/shared/Modal/Modal.theme.ts b/packages/frontend/src/components/shared/Modal/Modal.theme.ts index 4552ff70..144c2098 100644 --- a/packages/frontend/src/components/shared/Modal/Modal.theme.ts +++ b/packages/frontend/src/components/shared/Modal/Modal.theme.ts @@ -31,6 +31,7 @@ export const modalTheme = tv({ 'sm:px-6', 'sm:py-5', 'bg-base-bg-alternate', + 'dark:bg-overlay2', ], headerTitle: [ 'text-base', @@ -39,7 +40,11 @@ export const modalTheme = tv({ 'sm:tracking-normal', 'text-elements-high-em', ], - headerDescription: ['text-sm', 'text-elements-low-em'], + headerDescription: [ + 'text-sm', + 'text-elements-low-em', + 'dark:text-foreground-secondary', + ], footer: ['flex', 'gap-3', 'px-4', 'pb-4', 'pt-7', 'sm:pb-6', 'sm:px-6'], content: [ 'h-fit', @@ -53,8 +58,11 @@ export const modalTheme = tv({ 'sm:max-w-[562px]', 'rounded-2xl', 'bg-base-bg', + 'dark:bg-overlay', 'shadow-card', + 'dark:shadow-background', 'text-elements-high-em', + 'dark:text-foreground-secondary', ], body: ['flex-1', 'px-4', 'pt-4', 'sm:pt-6', 'sm:px-6'], }, diff --git a/packages/frontend/src/components/shared/Radio/Radio.theme.ts b/packages/frontend/src/components/shared/Radio/Radio.theme.ts index 84d8fd01..864ad37a 100644 --- a/packages/frontend/src/components/shared/Radio/Radio.theme.ts +++ b/packages/frontend/src/components/shared/Radio/Radio.theme.ts @@ -4,7 +4,12 @@ export const radioTheme = tv({ slots: { root: ['flex', 'gap-3'], wrapper: ['flex', 'items-center', 'gap-2', 'group'], - label: ['text-sm', 'tracking-[-0.006em]', 'text-elements-high-em'], + label: [ + 'text-sm', + 'tracking-[-0.006em]', + 'text-elements-high-em', + 'dark:text-foreground', + ], radio: [ 'w-5', 'h-5', @@ -17,6 +22,7 @@ export const radioTheme = tv({ 'focus-ring', // Checked 'data-[state=checked]:bg-controls-primary', + 'data-[state=checked]:bg-controls-primary', 'data-[state=checked]:group-hover:bg-controls-primary-hovered', ], indicator: [ @@ -36,6 +42,7 @@ export const radioTheme = tv({ 'after:group-focus-visible:bg-controls-disabled', // Checked 'after:data-[state=checked]:bg-elements-on-primary', + 'dark:after:data-[state=checked]:bg-primary-hovered', 'after:data-[state=checked]:group-hover:bg-elements-on-primary', 'after:data-[state=checked]:group-focus-visible:bg-elements-on-primary', ], diff --git a/packages/frontend/src/components/shared/SegmentedControls/SegmentedControls.theme.ts b/packages/frontend/src/components/shared/SegmentedControls/SegmentedControls.theme.ts index ed54a072..8d153c9a 100644 --- a/packages/frontend/src/components/shared/SegmentedControls/SegmentedControls.theme.ts +++ b/packages/frontend/src/components/shared/SegmentedControls/SegmentedControls.theme.ts @@ -9,6 +9,7 @@ export const segmentedControlsTheme = tv({ 'flex', 'items-center', 'bg-base-bg-emphasized', + 'dark:bg-background', 'gap-0.5', 'rounded-lg', ], @@ -18,6 +19,7 @@ export const segmentedControlsTheme = tv({ 'justify-center', 'gap-2', 'text-elements-mid-em', + 'dark:text-foreground', 'bg-transparent', 'border', 'border-transparent', @@ -26,6 +28,7 @@ export const segmentedControlsTheme = tv({ 'rounded-lg', 'focus-ring', 'hover:bg-controls-tertiary-hovered', + 'dark:hover:bg-overlay2', 'focus-visible:z-20', 'focus-visible:bg-controls-tertiary-hovered', 'disabled:text-controls-disabled', @@ -33,6 +36,7 @@ export const segmentedControlsTheme = tv({ 'disabled:cursor-not-allowed', 'disabled:border-transparent', 'data-[active=true]:bg-controls-tertiary', + 'dark:data-[active=true]:bg-overlay2', 'data-[active=true]:text-elements-high-em', 'data-[active=true]:border-border-interactive/10', 'data-[active=true]:shadow-field', diff --git a/packages/frontend/src/components/shared/Select/Select.theme.ts b/packages/frontend/src/components/shared/Select/Select.theme.ts index 56b54f24..e04742ef 100644 --- a/packages/frontend/src/components/shared/Select/Select.theme.ts +++ b/packages/frontend/src/components/shared/Select/Select.theme.ts @@ -3,8 +3,16 @@ import { VariantProps, tv } from 'tailwind-variants'; export const selectTheme = tv({ slots: { container: ['flex', 'flex-col', 'relative', 'gap-2', 'w-full'], - label: ['text-sm', 'text-elements-high-em'], - description: ['text-xs', 'text-elements-low-em'], + label: [ + 'text-sm', + 'text-elements-high-em', + 'dark:text-foreground-secondary', + ], + description: [ + 'text-xs', + 'text-elements-low-em', + 'dark:text-foreground-secondary', + ], inputWrapper: [ 'relative', 'flex', @@ -14,6 +22,7 @@ export const selectTheme = tv({ 'w-full', 'rounded-lg', 'bg-transparent', + 'dark:bg-overlay2', 'text-elements-mid-em', 'shadow-sm', 'border', @@ -22,7 +31,7 @@ export const selectTheme = tv({ 'disabled:shadow-none', 'disabled:border-none', ], - input: ['outline-none'], + input: ['outline-none', 'dark:bg-overlay2', 'dark:text-foreground'], iconContainer: [ 'absolute', 'inset-y-0', @@ -32,9 +41,15 @@ export const selectTheme = tv({ 'z-10', 'cursor-pointer', ], - icon: ['text-elements-mid-em'], + icon: ['text-elements-mid-em', 'dark:text-foreground-secondary'], helperIcon: [], - helperText: ['flex', 'gap-2', 'items-center', 'text-elements-low-em'], + helperText: [ + 'flex', + 'gap-2', + 'items-center', + 'text-elements-low-em', + 'dark:text-foreground-secondary', + ], popover: [ 'z-20', 'absolute', @@ -44,12 +59,14 @@ export const selectTheme = tv({ 'gap-0.5', 'min-w-full', 'bg-surface-floating', + 'dark:bg-overlay2', 'shadow-dropdown', 'w-auto', 'max-h-60', 'overflow-auto', 'border', 'border-gray-200', + 'dark:border-overlay', 'rounded-xl', ], }, @@ -79,7 +96,7 @@ export const selectTheme = tv({ 'shadow-none', 'focus:outline-border-danger', ], - helperText: ['text-elements-danger'], + helperText: ['text-error'], }, }, size: { diff --git a/packages/frontend/src/components/shared/Select/SelectItem/SelectItem.theme.ts b/packages/frontend/src/components/shared/Select/SelectItem/SelectItem.theme.ts index 75ac68df..8238eef8 100644 --- a/packages/frontend/src/components/shared/Select/SelectItem/SelectItem.theme.ts +++ b/packages/frontend/src/components/shared/Select/SelectItem/SelectItem.theme.ts @@ -12,11 +12,12 @@ export const selectItemTheme = tv({ 'group', 'data-[disabled]:cursor-not-allowed', ], - icon: ['h-4.5', 'w-4.5', 'text-elements-high-em'], + icon: ['h-4.5', 'w-4.5', 'text-elements-high-em', 'dark:text-foreground'], content: ['flex', 'flex-1', 'whitespace-nowrap'], label: [ 'text-sm', 'text-elements-high-em', + 'dark:text-foreground', 'tracking-[-0.006em]', 'data-[disabled]:text-elements-disabled', ], @@ -47,7 +48,11 @@ export const selectItemTheme = tv({ }, active: { true: { - wrapper: ['bg-base-bg-emphasized', 'data-[disabled]:bg-transparent'], + wrapper: [ + 'bg-base-bg-emphasized', + 'dark:bg-overlay3', + 'data-[disabled]:bg-transparent', + ], }, }, }, diff --git a/packages/frontend/src/components/shared/Sidebar/Sidebar.tsx b/packages/frontend/src/components/shared/Sidebar/Sidebar.tsx index 15e88d16..b5d88ca4 100644 --- a/packages/frontend/src/components/shared/Sidebar/Sidebar.tsx +++ b/packages/frontend/src/components/shared/Sidebar/Sidebar.tsx @@ -87,15 +87,15 @@ export const Sidebar = ({ mobileOpen }: SidebarProps) => { value="" className="hidden lg:flex" > - - Log Out + + LOG OUT } value=""> - Documentation + DOCUMENTATION } value=""> - Support + SUPPORT diff --git a/packages/frontend/src/components/shared/Switch/Switch.theme.ts b/packages/frontend/src/components/shared/Switch/Switch.theme.ts index 87fbd092..49bb7cbc 100644 --- a/packages/frontend/src/components/shared/Switch/Switch.theme.ts +++ b/packages/frontend/src/components/shared/Switch/Switch.theme.ts @@ -45,6 +45,7 @@ export const switchTheme = tv({ true: { switch: [ 'bg-controls-primary', + 'dark:bg-primary', 'hover:bg-controls-primary-hovered', 'focus-visible:bg-controls-primary-hovered', ], diff --git a/packages/frontend/src/components/shared/Table/Table.theme.ts b/packages/frontend/src/components/shared/Table/Table.theme.ts index 1cbefd80..2b97ad8f 100644 --- a/packages/frontend/src/components/shared/Table/Table.theme.ts +++ b/packages/frontend/src/components/shared/Table/Table.theme.ts @@ -8,6 +8,7 @@ export const tableTheme = tv({ 'border-b', 'border-sky-950/opacity-5', 'text-sky-950', + 'dark:text-foreground-secondary', 'text-sm', 'font-medium', 'leading-tight', @@ -17,6 +18,7 @@ export const tableTheme = tv({ columnHeaderCell: [ 'p-4', 'text-sky-950', + 'dark:text-foreground-secondary', 'text-sm', 'font-medium', 'uppercase', @@ -26,6 +28,7 @@ export const tableTheme = tv({ rowHeaderCell: [ 'p-4', 'text-slate-600', + 'dark:text-foreground', 'text-sm', 'font-normal', 'leading-tight', @@ -36,6 +39,7 @@ export const tableTheme = tv({ 'whitespace-nowrap', 'text-sm', 'text-slate-600', + 'dark:text-foreground', 'font-normal', 'text-left', ], diff --git a/packages/frontend/src/components/shared/Tabs/Tabs.theme.ts b/packages/frontend/src/components/shared/Tabs/Tabs.theme.ts index 31b12cef..e5852019 100644 --- a/packages/frontend/src/components/shared/Tabs/Tabs.theme.ts +++ b/packages/frontend/src/components/shared/Tabs/Tabs.theme.ts @@ -11,14 +11,17 @@ export const tabsTheme = tv({ 'cursor-default', 'select-none', 'text-elements-low-em', + 'dark:text-foreground', 'border-b-2', 'border-transparent', 'hover:border-border-interactive/10', 'hover:text-elements-mid-em', + 'dark:hover:text-foreground-secondary', 'focus-within:border-border-interactive/10', 'data-[state=active]:font-medium', 'data-[state=active]:text-elements-high-em', 'data-[state=active]:border-elements-high-em', + 'data-[state=active]:border-primary', // Vertical 'data-[orientation=vertical]:px-3', 'data-[orientation=vertical]:py-3', @@ -27,6 +30,7 @@ export const tabsTheme = tv({ 'data-[orientation=vertical]:rounded-xl', 'data-[orientation=vertical]:border-transparent', 'data-[orientation=vertical]:hover:bg-base-bg-emphasized', + 'data-[orientation=vertical]:dark:hover:bg-overlay2', 'data-[orientation=vertical]:hover:text-elements-mid-em', 'data-[orientation=vertical]:hover:border-transparent', 'data-[orientation=vertical]:focus-visible:border-transparent', @@ -34,13 +38,17 @@ export const tabsTheme = tv({ 'data-[orientation=vertical]:focus-visible:text-elements-mid-em', 'data-[orientation=vertical]:data-[state=active]:font-normal', 'data-[orientation=vertical]:data-[state=active]:bg-base-bg-emphasized', + 'data-[orientation=vertical]:data-[state=active]:dark:bg-overlay', 'data-[orientation=vertical]:data-[state=active]:border-transparent', 'data-[orientation=vertical]:data-[state=active]:hover:text-elements-high-em', 'data-[orientation=vertical]:data-[state=active]:focus-visible:text-elements-high-em', // TODO: demo additions 'data-[orientation=vertical]:data-[state=active]:bg-snowball-200', + 'data-[orientation=vertical]:data-[state=active]:dark:bg-overlay', 'data-[orientation=vertical]:data-[state=active]:hover:bg-snowball-200', + 'data-[orientation=vertical]:data-[state=active]:dark:hover:bg-overlay2', 'data-[orientation=vertical]:data-[state=active]:text-snowball-800', + 'data-[orientation=vertical]:data-[state=active]:dark:text-foreground', 'data-[orientation=vertical]:data-[state=active]:hover:text-snowball-800', 'data-[orientation=vertical]:data-[state=active]:shadow-[0px_1px_0px_0px_rgba(8,47,86,0.06)_inset]', ], diff --git a/packages/frontend/src/components/shared/Tooltip/Tooltip.theme.ts b/packages/frontend/src/components/shared/Tooltip/Tooltip.theme.ts index c4c1c5e0..38a8d17a 100644 --- a/packages/frontend/src/components/shared/Tooltip/Tooltip.theme.ts +++ b/packages/frontend/src/components/shared/Tooltip/Tooltip.theme.ts @@ -6,8 +6,10 @@ export const tooltipTheme = tv({ 'z-tooltip', 'rounded-md', 'bg-surface-high-contrast', + 'dark:bg-overlay3', 'p-2', 'text-elements-on-high-contrast', + 'dark:text-foreground-secondary', ], arrow: ['fill-surface-high-contrast'], }, diff --git a/packages/frontend/src/index.css b/packages/frontend/src/index.css index a7775b42..1c87f2bc 100644 --- a/packages/frontend/src/index.css +++ b/packages/frontend/src/index.css @@ -144,6 +144,7 @@ @layer utilities { .focus-ring { @apply focus-visible:ring-[3px] focus-visible:ring-snowball-200 focus-visible:ring-offset-1 focus-visible:ring-offset-snowball-500 focus-visible:outline-none; + @apply focus-visible:ring-[3px] dark:focus-visible:ring-primary focus-visible:ring-offset-1 dark:focus-visible:ring-offset-primary focus-visible:outline-none; } @keyframes dialog-overlay-show { diff --git a/packages/frontend/src/layouts/ProjectSearch.tsx b/packages/frontend/src/layouts/ProjectSearch.tsx index a9360c17..5bb5daa0 100644 --- a/packages/frontend/src/layouts/ProjectSearch.tsx +++ b/packages/frontend/src/layouts/ProjectSearch.tsx @@ -32,7 +32,7 @@ const ProjectSearch = () => { return (
{/* Header */} -
+
{
{/* Content */} -
+
diff --git a/packages/frontend/src/logo.svg b/packages/frontend/src/logo.svg deleted file mode 100644 index 3781af8a..00000000 --- a/packages/frontend/src/logo.svg +++ /dev/null @@ -1 +0,0 @@ - diff --git a/packages/frontend/src/pages/AuthPage.tsx b/packages/frontend/src/pages/AuthPage.tsx index b72c0af6..39b3ed89 100644 --- a/packages/frontend/src/pages/AuthPage.tsx +++ b/packages/frontend/src/pages/AuthPage.tsx @@ -1,9 +1,8 @@ -import { CloudyFlow } from 'components/CloudyFlow'; import { Login } from './auth/Login'; const AuthPage = () => { return ( - +
{ alt="snowball logo" className="h-10 rounded-xl" /> -
- Snowball -
-
+
- +
); }; diff --git a/packages/frontend/src/pages/auth/Done.tsx b/packages/frontend/src/pages/auth/Done.tsx index f29f89a2..a60b91fe 100644 --- a/packages/frontend/src/pages/auth/Done.tsx +++ b/packages/frontend/src/pages/auth/Done.tsx @@ -10,16 +10,16 @@ type Props = { }; export const Done = ({ continueTo }: Props) => { return ( -
+
-
+
-
+
You're in!
-
+
It's time to get your project rolling 😎
@@ -33,7 +33,7 @@ export const Done = ({ continueTo }: Props) => { href={continueTo} variant={'primary'} > - Enter Snowball + Enter Laconic
diff --git a/packages/frontend/src/pages/auth/Login.tsx b/packages/frontend/src/pages/auth/Login.tsx index a1acc1c5..2c4682aa 100644 --- a/packages/frontend/src/pages/auth/Login.tsx +++ b/packages/frontend/src/pages/auth/Login.tsx @@ -4,8 +4,8 @@ export const Login = () => { return (
-
- Sign in to Snowball +
+ Sign in to Laconic
diff --git a/packages/frontend/src/pages/org-slug/index.tsx b/packages/frontend/src/pages/org-slug/index.tsx index e12cbd27..3331f6cd 100644 --- a/packages/frontend/src/pages/org-slug/index.tsx +++ b/packages/frontend/src/pages/org-slug/index.tsx @@ -6,11 +6,12 @@ import { Heading, Badge, Button } from 'components/shared'; import { PlusIcon } from 'components/shared/CustomIcon'; import { useGQLClient } from 'context/GQLClientContext'; import { Project } from 'gql-client'; +import { project as mockProject } from 'pages/index'; const Projects = () => { const client = useGQLClient(); const { orgSlug } = useParams(); - const [projects, setProjects] = useState([]); + const [projects, setProjects] = useState([mockProject]); const fetchProjects = useCallback(async () => { const { projectsInOrganization } = await client.getProjectsInOrganization( @@ -30,7 +31,7 @@ const Projects = () => {
- + Projects @@ -39,7 +40,7 @@ const Projects = () => {
- +
{/* List of projects */} diff --git a/packages/frontend/src/pages/org-slug/layout.tsx b/packages/frontend/src/pages/org-slug/layout.tsx index b1bf2226..fce893c6 100644 --- a/packages/frontend/src/pages/org-slug/layout.tsx +++ b/packages/frontend/src/pages/org-slug/layout.tsx @@ -39,7 +39,7 @@ export const DashboardLayout = ({
@@ -112,7 +112,7 @@ export const DashboardLayout = ({ }} transition={{ ease: 'easeInOut', duration: 0.3 }} > -
+
diff --git a/packages/frontend/src/pages/org-slug/projects/Id.tsx b/packages/frontend/src/pages/org-slug/projects/Id.tsx index 468453b5..9abce252 100644 --- a/packages/frontend/src/pages/org-slug/projects/Id.tsx +++ b/packages/frontend/src/pages/org-slug/projects/Id.tsx @@ -78,7 +78,7 @@ const Id = () => { leftIcon={} onClick={() => navigate(-1)} /> - + {project?.name}
@@ -88,17 +88,24 @@ const Id = () => { {...buttonSize} className="h-11 transition-colors" variant="tertiary" + shape="default" > - Open repo + OPEN REPO - {(project.deployments.length > 0) && - - - } + )}
diff --git a/packages/frontend/src/pages/org-slug/projects/create/layout.tsx b/packages/frontend/src/pages/org-slug/projects/create/layout.tsx index abdfa8c5..32c13b78 100644 --- a/packages/frontend/src/pages/org-slug/projects/create/layout.tsx +++ b/packages/frontend/src/pages/org-slug/projects/create/layout.tsx @@ -20,7 +20,10 @@ export const CreateProjectLayout = ({ const closeBtnLink = `/${orgSlug}`; const heading = ( - + Create new project ); @@ -30,17 +33,20 @@ export const CreateProjectLayout = ({ {/* Desktop */}