diff --git a/index.html b/index.html index 9196cf3d..b4588b0e 100644 --- a/index.html +++ b/index.html @@ -4,24 +4,24 @@ - Cinny - - + Clovr Labs + + - - + + @@ -29,8 +29,8 @@ - - + + diff --git a/public/res/clovrlabs-logo-black.webp b/public/res/clovrlabs-logo-black.webp new file mode 100644 index 00000000..3e6338c3 Binary files /dev/null and b/public/res/clovrlabs-logo-black.webp differ diff --git a/src/app/features/settings/about/About.tsx b/src/app/features/settings/about/About.tsx index 5a80e060..4acbfdf9 100644 --- a/src/app/features/settings/about/About.tsx +++ b/src/app/features/settings/about/About.tsx @@ -4,7 +4,7 @@ import { Page, PageContent, PageHeader } from '../../../components/page'; import { SequenceCard } from '../../../components/sequence-card'; import { SequenceCardStyle } from '../styles.css'; import { SettingTile } from '../../../components/setting-tile'; -import CinnySVG from '../../../../../public/res/svg/cinny.svg'; +import ClovrLabsLogo from '../../../../../public/res/clovrlabs-logo-black.webp'; import cons from '../../../../client/state/cons'; import { clearCacheAndReload } from '../../../../client/initMatrix'; import { useMatrixClient } from '../../../hooks/useMatrixClient'; @@ -39,23 +39,23 @@ export function About({ requestClose }: AboutProps) { Cinny logo - Cinny + Clovr Labs v{cons.version} - Yet another matrix client. + Secure matrix client for teams. diff --git a/src/app/pages/auth/AuthLayout.tsx b/src/app/pages/auth/AuthLayout.tsx index 3943f42d..49437610 100644 --- a/src/app/pages/auth/AuthLayout.tsx +++ b/src/app/pages/auth/AuthLayout.tsx @@ -20,7 +20,7 @@ import { } from '../../hooks/useClientConfig'; import { AsyncStatus, useAsyncCallback } from '../../hooks/useAsyncCallback'; import { LOGIN_PATH, REGISTER_PATH, RESET_PASSWORD_PATH } from '../paths'; -import CinnySVG from '../../../../public/res/svg/cinny.svg'; +import ClovrLabsLogo from '../../../../public/res/clovrlabs-logo-black.webp'; import { ServerPicker } from './ServerPicker'; import { AutoDiscoveryAction, autoDiscovery } from '../../cs-api'; import { SpecVersionsLoader } from '../../components/SpecVersionsLoader'; @@ -134,8 +134,8 @@ export function AuthLayout() {
- Cinny Logo - Cinny + Clovr Labs Logo + Clovr Labs
diff --git a/src/app/pages/auth/styles.css.ts b/src/app/pages/auth/styles.css.ts index 5834ad84..ac2370e8 100644 --- a/src/app/pages/auth/styles.css.ts +++ b/src/app/pages/auth/styles.css.ts @@ -26,10 +26,9 @@ export const AuthCard = style({ export const AuthLogo = style([ DefaultReset, { - width: toRem(26), - height: toRem(26), + width: '105px', + height: 'auto', - borderRadius: '50%', }, ]); diff --git a/src/app/pages/client/WelcomePage.tsx b/src/app/pages/client/WelcomePage.tsx index 645753ff..b1ff619e 100644 --- a/src/app/pages/client/WelcomePage.tsx +++ b/src/app/pages/client/WelcomePage.tsx @@ -1,7 +1,7 @@ import React from 'react'; import { Box, Button, Icon, Icons, Text, config, toRem } from 'folds'; import { Page, PageHero, PageHeroSection } from '../../components/page'; -import CinnySVG from '../../../../public/res/svg/cinny.svg'; +import ClovrLabsLogo from '../../../../public/res/clovrlabs-logo-black.webp'; export function WelcomePage() { return ( @@ -14,17 +14,17 @@ export function WelcomePage() { > } - title="Welcome to Cinny" + icon={Clovr Labs Logo} + title="Welcome to Clovr Labs" subTitle={ - Yet another matrix client.{' '} + Reach out channel for .{' '} - v4.8.1 + Learn More } @@ -33,25 +33,25 @@ export function WelcomePage() { diff --git a/src/colors.css.ts b/src/colors.css.ts index 268cbf78..ea01c302 100644 --- a/src/colors.css.ts +++ b/src/colors.css.ts @@ -3,53 +3,53 @@ import { color } from 'folds'; export const silverTheme = createTheme(color, { Background: { - Container: '#DEDEDE', - ContainerHover: '#D3D3D3', - ContainerActive: '#C7C7C7', - ContainerLine: '#BBBBBB', + Container: '#FFFFFF', + ContainerHover: '#F8F8F8', + ContainerActive: '#F0F0F0', + ContainerLine: '#DCDCDC', OnContainer: '#000000', }, Surface: { - Container: '#EAEAEA', - ContainerHover: '#DEDEDE', - ContainerActive: '#D3D3D3', - ContainerLine: '#C7C7C7', + Container: '#FFFFFF', + ContainerHover: '#F8F8F8', + ContainerActive: '#F0F0F0', + ContainerLine: '#DCDCDC', OnContainer: '#000000', }, SurfaceVariant: { - Container: '#DEDEDE', - ContainerHover: '#D3D3D3', - ContainerActive: '#C7C7C7', - ContainerLine: '#BBBBBB', + Container: '#F8F8F8', + ContainerHover: '#F0F0F0', + ContainerActive: '#E8E8E8', + ContainerLine: '#DCDCDC', OnContainer: '#000000', }, Primary: { - Main: '#1245A8', - MainHover: '#103E97', - MainActive: '#0F3B8F', - MainLine: '#0E3786', + Main: '#000000', + MainHover: '#303030', + MainActive: '#5A5A5A', + MainLine: '#000000', OnMain: '#FFFFFF', - Container: '#C4D0E9', - ContainerHover: '#B8C7E5', - ContainerActive: '#ACBEE1', - ContainerLine: '#A0B5DC', - OnContainer: '#0D3076', + Container: '#F0F0F0', + ContainerHover: '#E8E8E8', + ContainerActive: '#DCDCDC', + ContainerLine: '#C0C0C0', + OnContainer: '#000000', }, Secondary: { - Main: '#000000', - MainHover: '#171717', - MainActive: '#232323', - MainLine: '#2F2F2F', - OnMain: '#EAEAEA', - Container: '#C7C7C7', - ContainerHover: '#BBBBBB', - ContainerActive: '#AFAFAF', - ContainerLine: '#A4A4A4', - OnContainer: '#0C0C0C', + Main: '#5A5A5A', + MainHover: '#303030', + MainActive: '#000000', + MainLine: '#5A5A5A', + OnMain: '#FFFFFF', + Container: '#DCDCDC', + ContainerHover: '#C0C0C0', + ContainerActive: '#A8A8A8', + ContainerLine: '#909090', + OnContainer: '#000000', }, Success: { diff --git a/src/index.scss b/src/index.scss index 14bf4749..4d1d3c5d 100644 --- a/src/index.scss +++ b/src/index.scss @@ -1,5 +1,7 @@ @use './app/partials/screen'; +@import url('https://fonts.googleapis.com/css2?family=Questrial&display=swap'); + @font-face { font-family: Twemoji; src: url('../public/font/Twemoji.Mozilla.v15.1.0.woff2'), @@ -11,18 +13,18 @@ /* background color | --bg-[background type]: value */ --bg-surface: #ffffff; --bg-surface-transparent: #ffffff00; - --bg-surface-low: #f6f6f6; - --bg-surface-low-transparent: #f6f6f600; - --bg-surface-extra-low: #f6f6f6; - --bg-surface-extra-low-transparent: #f6f6f600; + --bg-surface-low: #ffffff; + --bg-surface-low-transparent: #ffffff00; + --bg-surface-extra-low: #f8f8f8; + --bg-surface-extra-low-transparent: #f8f8f800; --bg-surface-hover: rgba(0, 0, 0, 3%); --bg-surface-active: rgba(0, 0, 0, 5%); - --bg-surface-border: rgba(0, 0, 0, 6%); + --bg-surface-border: rgba(220, 220, 220, 100%); - --bg-primary: rgb(18, 69, 168); - --bg-primary-hover: rgba(18, 69, 168, 80%); - --bg-primary-active: rgba(18, 69, 168, 70%); - --bg-primary-border: rgba(18, 69, 168, 38%); + --bg-primary: rgb(0, 0, 0); + --bg-primary-hover: rgba(0, 0, 0, 80%); + --bg-primary-active: rgba(0, 0, 0, 70%); + --bg-primary-border: rgba(0, 0, 0, 20%); --bg-positive: rgb(1, 115, 67); --bg-positive-hover: rgba(1, 115, 67, 8%); @@ -193,8 +195,8 @@ --fluid-slide-up: cubic-bezier(0.13, 0.56, 0.25, 0.99); --font-emoji: 'Twemoji_DISABLED'; - --font-primary: 'InterVariable', var(--font-emoji), sans-serif; - --font-secondary: 'InterVariable', var(--font-emoji), sans-serif; + --font-primary: 'Questrial', var(--font-emoji), sans-serif; + --font-secondary: 'Questrial', var(--font-emoji), sans-serif; } .silver-theme {