diff --git a/login.html b/login.html new file mode 100644 index 0000000..18c8686 --- /dev/null +++ b/login.html @@ -0,0 +1,25 @@ +CRM

Black Cipher

Your Agency's Growth Starts Here

Manage leads, track conversions, and grow your web development business with our CRM.

0
leads tracked
0%
conversion lift
0
active users

“This CRM transformed how we manage our sales pipeline. We've seen a 40% increase in lead conversion.”

Marcus Johnson, Sales Lead at Black Cipher

Welcome back

Sign in to your account to continue

By signing in, you agree to our and

\ No newline at end of file diff --git a/src/app/globals.css b/src/app/globals.css index bc54320..d4670b1 100644 --- a/src/app/globals.css +++ b/src/app/globals.css @@ -1,4 +1,5 @@ @import url('https://fonts.googleapis.com/css2?family=Bangers&display=swap'); +@import url('https://fonts.googleapis.com/css2?family=Raleway:wght@800&display=swap'); @tailwind base; @tailwind components; @@ -29,15 +30,16 @@ --border: 214.3 31.8% 91.4%; --input: 214.3 31.8% 91.4%; --ring: 221.2 83.2% 53.3%; - --sidebar: 222.2 84% 4.9%; - --sidebar-foreground: 210 40% 98%; - --sidebar-primary: 217.2 91.2% 59.8%; + --sidebar: 216 12% 92%; + --sidebar-foreground: 0 0% 20%; + --sidebar-primary: 0 91.2% 59.8%; --sidebar-primary-foreground: 0 0% 100%; - --sidebar-accent: 217.2 32.6% 17.5%; - --sidebar-accent-foreground: 210 40% 98%; - --sidebar-border: 217.2 32.6% 17.5%; - --sidebar-ring: 224.3 76.3% 48%; + --sidebar-accent: 218 16% 87%; + --sidebar-accent-foreground: 0 0% 20%; + --sidebar-border: 220 11% 84%; + --sidebar-ring: 0 76.3% 48%; --radius: 0.5rem; + --theme-primary: hsl(var(--primary)); } .dark { @@ -574,6 +576,62 @@ --sidebar-ring: 351 85% 52%; } +.bc-logo { + font-family: 'Raleway', sans-serif; + font-weight: 800; + font-size: 18px; + letter-spacing: 0.12em; + text-transform: uppercase; + color: hsl(var(--sidebar-foreground)); + padding: 8px 16px; + position: relative; + display: inline-block; +} + +.bc-logo .accent { + color: var(--theme-primary, #3b91f7); +} + +.bc-logo::before { + content: ''; + position: absolute; + top: 0; + left: 0; + border-top: 1.5px solid var(--theme-primary, #3b91f7); + border-left: 1.5px solid var(--theme-primary, #3b91f7); + width: 0; + height: 0; + animation: drawTL 3s ease-in-out infinite; +} + +.bc-logo::after { + content: ''; + position: absolute; + bottom: 0; + right: 0; + border-bottom: 1.5px solid var(--theme-primary, #3b91f7); + border-right: 1.5px solid var(--theme-primary, #3b91f7); + width: 0; + height: 0; + animation: drawBR 3s ease-in-out infinite; +} + +@keyframes drawTL { + 0%, 5% { width: 0; height: 0; } + 30% { width: 100%; height: 0; } + 55% { width: 100%; height: 100%; } + 85% { width: 100%; height: 100%; } + 100% { width: 0; height: 0; } +} + +@keyframes drawBR { + 0%, 5% { width: 0; height: 0; } + 30% { width: 100%; height: 0; } + 55% { width: 100%; height: 100%; } + 85% { width: 100%; height: 100%; } + 100% { width: 0; height: 0; } +} + @layer base { * { @apply border-border; diff --git a/src/app/login/page.tsx b/src/app/login/page.tsx index 18ccddf..aa082e1 100644 --- a/src/app/login/page.tsx +++ b/src/app/login/page.tsx @@ -2,7 +2,6 @@ import { useState, useEffect, useRef } from "react" import { useSearchParams } from "next/navigation" -import { COMPANY_NAME } from "@/lib/constants" import { Eye, EyeOff, Loader2 } from "lucide-react" const waves = [ @@ -29,11 +28,11 @@ export default function LoginPage() { const testimonials = [ { text: "This CRM transformed how we manage our sales pipeline. We've seen a 40% increase in lead conversion.", - author: "Marcus Johnson, Sales Lead at Coast IT", + author: "Marcus Johnson, Sales Lead at Black Cipher", }, { text: "When you're not sure, flip a coin, because when the coin is in the air, you realize which option you're actually hoping for.", - author: "Dillen van der Merwe, Madman of Coast IT", + author: "Dillen van der Merwe, Madman of Black Cipher", }, ] @@ -231,16 +230,11 @@ export default function LoginPage() { return (
-
- {COMPANY_NAME} -
-
+
+ Black Cipher +

Your Agency's{" "} Growth{" "} diff --git a/src/components/layout/app-shell.tsx b/src/components/layout/app-shell.tsx index 8459dce..8fff597 100644 --- a/src/components/layout/app-shell.tsx +++ b/src/components/layout/app-shell.tsx @@ -5,7 +5,6 @@ import { usePathname } from "next/navigation" import { motion, AnimatePresence } from "framer-motion" import { Sidebar } from "./sidebar" import { Topbar } from "./topbar" -import { SystemMonitor } from "./system-monitor" interface AppShellProps { children: React.ReactNode @@ -80,7 +79,6 @@ export function AppShell({ children }: AppShellProps) {

- - {COMPANY_NAME} - - {!collapsed && ( - - {COMPANY_NAME} - - )} - + {collapsed ? ( +
BC
+ ) : ( +
BlackCipher
+ )} {!collapsed && (