Skip to content

Commit dff1261

Browse files
batazorbatazor
committed
ui: update
# Conflicts: # boundaries/ui/pnpm-lock.yaml
1 parent 6d94808 commit dff1261

File tree

12 files changed

+930
-779
lines changed

12 files changed

+930
-779
lines changed

‎boundaries/proxy/pnpm-lock.yaml‎

Lines changed: 173 additions & 173 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎boundaries/ui/package.json‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -104,7 +104,7 @@
104104
"next-sitemap": "^4.2.3",
105105
"patch-package": "^8.0.1",
106106
"postcss": "^8.5.6",
107-
"prettier": "^3.7.3",
107+
"prettier": "^3.7.4",
108108
"sharp": "^0.34.5",
109109
"tailwindcss": "^4.1.17",
110110
"ts-node": "^10.9.2",

‎boundaries/ui/pnpm-lock.yaml‎

Lines changed: 652 additions & 540 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎boundaries/ui/src/app/globals.css‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -85,7 +85,7 @@ body,
8585
}
8686

8787
.btn {
88-
@apply inline-flex items-center justify-center px-6 py-3 rounded-xl font-semibold text-white bg-gradient-to-r from-indigo-600 to-purple-600 hover:from-indigo-700 hover:to-purple-700 shadow-lg hover:shadow-xl transform hover:-translate-y-0.5 transition-all duration-200 focus:outline-none focus:ring-2 focus:ring-indigo-500 focus:ring-offset-2 whitespace-nowrap;
88+
@apply inline-flex items-center justify-center px-6 py-3 rounded-xl font-semibold text-white bg-purple-700 dark:bg-indigo-500 hover:bg-purple-800 dark:hover:bg-indigo-600 shadow-md hover:shadow-lg transform hover:-translate-y-0.5 transition-all duration-200 focus:outline-none focus:ring-2 focus:ring-purple-500 focus:ring-offset-2 whitespace-nowrap;
8989
}
9090

9191
.btn-secondary {

‎boundaries/ui/src/components/Header/Header.tsx‎

Lines changed: 5 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -7,8 +7,7 @@ import IconButton from '@mui/material/IconButton'
77
import Typography from '@mui/material/Typography'
88
import Link from 'next/link'
99
import { TransitionLink } from '@/components/Navigation'
10-
// @ts-ignore
11-
import { ToggleDarkMode } from '@shortlink-org/ui-kit'
10+
import { ThemeToggle } from '@/components/ThemeToggle'
1211
import MenuIcon from '@mui/icons-material/Menu'
1312
import Notification from './notification'
1413
import Profile from './profile'
@@ -28,7 +27,7 @@ export default function Header({ hasSession, setOpen }: HeaderProps) {
2827
}, [])
2928

3029
return (
31-
<nav className="bg-gradient-to-r from-indigo-600 via-purple-600 to-indigo-700 dark:from-indigo-800 dark:via-purple-800 dark:to-indigo-900 text-white shadow-lg border-b border-indigo-500/20 dark:border-purple-500/30 backdrop-blur-sm z-50">
30+
<nav className="bg-gradient-to-r from-pink-600 via-purple-700 to-indigo-800 dark:from-indigo-800 dark:via-purple-800 dark:to-indigo-900 text-white shadow-lg border-b border-indigo-500/20 dark:border-purple-500/30 backdrop-blur-sm z-50">
3231
<div className="max-w-7xl mx-auto px-3 sm:px-4 lg:px-8">
3332
<div className="flex items-center justify-between h-14 sm:h-16">
3433
{/* Left: Menu + Brand */}
@@ -70,19 +69,15 @@ export default function Header({ hasSession, setOpen }: HeaderProps) {
7069
</div>
7170

7271
{/* Center: Spacer (or could add nav links) */}
73-
<div className="hidden md:flex items-center space-x-8">
74-
{/* Add navigation links here if needed */}
75-
</div>
72+
<div className="hidden md:flex items-center space-x-8">{/* Add navigation links here if needed */}</div>
7673

7774
{/* Right: Controls */}
7875
<div className="flex items-center gap-1.5 sm:gap-3">
7976
<div className="hidden sm:block relative">
80-
<ToggleDarkMode id="ToggleDarkMode" />
77+
<ThemeToggle />
8178
</div>
8279

83-
<div className="hidden sm:block">
84-
{secondMenu()}
85-
</div>
80+
<div className="hidden sm:block">{secondMenu()}</div>
8681

8782
<div className="hidden md:block">
8883
<SearchForm />

‎boundaries/ui/src/components/Header/notification.tsx‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -133,7 +133,7 @@ export default function Notification(): React.JSX.Element {
133133
</a>
134134
</div>
135135

136-
<a className="block py-3 font-semibold text-center text-white bg-gradient-to-r from-indigo-600 to-purple-600 hover:from-indigo-700 hover:to-purple-700 transition-all duration-200 cursor-pointer">
136+
<a className="block py-3 font-semibold text-center text-white bg-purple-700 dark:bg-indigo-500 hover:bg-purple-800 dark:hover:bg-indigo-600 transition-all duration-200 cursor-pointer">
137137
See all notifications
138138
</a>
139139
</div>

‎boundaries/ui/src/components/Landing/Ready.tsx‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -12,7 +12,7 @@ export default function Ready() {
1212
<div className="inline-flex rounded-md shadow">
1313
<a
1414
href="#"
15-
className="inline-flex items-center justify-center px-5 py-3 border border-transparent text-base font-medium rounded-md text-white bg-indigo-600 hover:bg-indigo-700"
15+
className="inline-flex items-center justify-center px-5 py-3 border border-transparent text-base font-medium rounded-md text-white bg-purple-700 dark:bg-indigo-500 hover:bg-purple-800 dark:hover:bg-indigo-600"
1616
>
1717
Get started
1818
</a>

‎boundaries/ui/src/components/Landing/feature.tsx‎

Lines changed: 56 additions & 21 deletions
Original file line numberDiff line numberDiff line change
@@ -6,33 +6,68 @@ export default function Feature() {
66
<>
77
{/* Main Features Section */}
88
<section className="container mx-auto px-4 sm:px-6 py-16 lg:py-24">
9-
<h2 className="text-4xl lg:text-5xl font-bold text-center bg-gradient-to-r from-indigo-600 to-purple-600 dark:from-indigo-400 dark:to-purple-400 bg-clip-text text-transparent pb-4 mb-16">
10-
Features
11-
</h2>
9+
<div className="text-center mb-20">
10+
<span className="inline-block px-4 py-2 mb-4 text-sm font-semibold text-purple-700 dark:text-purple-400 bg-purple-100 dark:bg-purple-900/30 rounded-full">
11+
Features
12+
</span>
13+
<h2 className="text-4xl lg:text-6xl font-extrabold text-gray-900 dark:text-white mb-4">
14+
Powerful Link Management
15+
</h2>
16+
<p className="text-lg text-gray-600 dark:text-gray-400 max-w-2xl mx-auto">
17+
Everything you need to create, manage, and track your short links
18+
</p>
19+
</div>
1220

1321
{/* Feature 1 - URL Shortener */}
14-
<div className="flex items-center flex-wrap mb-16 lg:mb-24 group">
15-
<div className="w-full lg:w-1/2 lg:pr-12 mb-8 lg:mb-0">
16-
<div className="bg-gradient-to-br from-indigo-50 to-purple-50 dark:from-indigo-950 dark:to-purple-950 p-8 rounded-2xl shadow-lg hover:shadow-2xl transition-all duration-300 border border-indigo-100 dark:border-indigo-800">
17-
<div className="inline-block p-3 bg-indigo-600 dark:bg-indigo-500 rounded-xl mb-4 shadow-lg">
18-
<svg className="w-8 h-8 text-white" fill="none" stroke="currentColor" viewBox="0 0 24 24">
19-
<path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M13.828 10.172a4 4 0 00-5.656 0l-4 4a4 4 0 105.656 5.656l1.102-1.101m-.758-4.899a4 4 0 005.656 0l4-4a4 4 0 00-5.656-5.656l-1.1 1.1" />
20-
</svg>
22+
<div className="flex items-center flex-wrap mb-20 lg:mb-32 group">
23+
<div className="w-full lg:w-1/2 lg:pr-16 mb-12 lg:mb-0">
24+
<div className="relative p-8 lg:p-10 bg-white dark:bg-gray-800 rounded-3xl shadow-sm hover:shadow-md transition-all duration-500 border border-gray-200 dark:border-gray-700 overflow-hidden group-hover:-translate-y-1">
25+
<div className="absolute top-0 right-0 w-40 h-40 bg-gradient-to-br from-indigo-500/5 to-purple-500/5 rounded-full -mr-20 -mt-20 group-hover:scale-150 transition-transform duration-700" />
26+
<div className="relative">
27+
<div className="inline-flex items-center justify-center w-16 h-16 bg-gradient-to-br from-indigo-500 to-purple-600 rounded-2xl mb-6 shadow-sm group-hover:scale-105 group-hover:rotate-3 transition-all duration-500">
28+
<svg className="w-8 h-8 text-white" fill="none" stroke="currentColor" viewBox="0 0 24 24">
29+
<path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M13.828 10.172a4 4 0 00-5.656 0l-4 4a4 4 0 105.656 5.656l1.102-1.101m-.758-4.899a4 4 0 005.656 0l4-4a4 4 0 00-5.656-5.656l-1.1 1.1" />
30+
</svg>
31+
</div>
32+
<h4 className="text-3xl lg:text-4xl text-gray-900 dark:text-white font-bold mb-4">URL Shortener</h4>
33+
<p className="text-lg text-gray-600 dark:text-gray-400 leading-relaxed mb-6">
34+
Free custom URL Shortener with many features that gives you better quality for links shortening. We do not display ads during direct redirecting to the original url.
35+
</p>
36+
<div className="flex items-center text-indigo-600 dark:text-indigo-400 font-semibold group-hover:translate-x-2 transition-transform duration-300">
37+
<span>Learn more</span>
38+
<svg className="w-5 h-5 ml-2" fill="none" stroke="currentColor" viewBox="0 0 24 24">
39+
<path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M9 5l7 7-7 7" />
40+
</svg>
41+
</div>
2142
</div>
22-
<h4 className="text-3xl lg:text-4xl text-gray-900 dark:text-white font-bold mb-4">URL Shortener</h4>
23-
<p className="text-lg text-gray-700 dark:text-gray-300 leading-relaxed">
24-
Free custom URL Shortener with many features that gives you better quality for links shortening. We do not display ads during direct redirecting to the original url.
25-
</p>
2643
</div>
2744
</div>
2845
<div className="w-full lg:w-1/2 flex justify-center">
29-
<div className="relative group-hover:scale-105 transition-transform duration-300">
30-
<div className="absolute inset-0 bg-gradient-to-r from-indigo-400 to-purple-400 rounded-2xl blur-2xl opacity-30 group-hover:opacity-50 transition-opacity" />
31-
<img
32-
src="https://www.dropbox.com/s/mimcvn6zxtoruis/health.svg?raw=1"
33-
alt="Monitoring"
34-
className="relative rounded-2xl shadow-xl"
35-
/>
46+
<div className="relative group-hover:scale-102 transition-transform duration-500">
47+
<div className="absolute -inset-4 bg-gradient-to-r from-indigo-500 to-purple-600 rounded-3xl blur-3xl opacity-10 group-hover:opacity-20 transition-opacity duration-500" />
48+
<div className="relative bg-gradient-to-br from-indigo-50 to-purple-50 dark:from-indigo-950/30 dark:to-purple-950/30 rounded-3xl p-8 shadow-sm">
49+
<div className="grid grid-cols-2 gap-4">
50+
<div className="bg-white dark:bg-gray-800 rounded-2xl p-4 shadow-sm hover:shadow-md transition-shadow">
51+
<div className="w-8 h-8 bg-indigo-500 rounded-lg mb-2" />
52+
<div className="h-2 bg-gray-200 dark:bg-gray-700 rounded w-3/4 mb-2" />
53+
<div className="h-2 bg-gray-200 dark:bg-gray-700 rounded w-1/2" />
54+
</div>
55+
<div className="bg-white dark:bg-gray-800 rounded-2xl p-4 shadow-sm hover:shadow-md transition-shadow">
56+
<div className="w-8 h-8 bg-purple-500 rounded-lg mb-2" />
57+
<div className="h-2 bg-gray-200 dark:bg-gray-700 rounded w-3/4 mb-2" />
58+
<div className="h-2 bg-gray-200 dark:bg-gray-700 rounded w-1/2" />
59+
</div>
60+
<div className="bg-white dark:bg-gray-800 rounded-2xl p-4 shadow-sm hover:shadow-md transition-shadow col-span-2">
61+
<div className="flex items-center gap-2 mb-3">
62+
<div className="w-10 h-10 bg-gradient-to-br from-indigo-500 to-purple-600 rounded-full" />
63+
<div className="flex-1">
64+
<div className="h-3 bg-gray-200 dark:bg-gray-700 rounded w-2/3 mb-1" />
65+
<div className="h-2 bg-gray-200 dark:bg-gray-700 rounded w-1/3" />
66+
</div>
67+
</div>
68+
</div>
69+
</div>
70+
</div>
3671
</div>
3772
</div>
3873
</div>

‎boundaries/ui/src/components/Landing/header.tsx‎

Lines changed: 2 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -31,15 +31,14 @@ export default function Header() {
3131
<div className="mt-5 sm:mt-8 flex flex-col sm:flex-row gap-3 sm:gap-4 sm:justify-center lg:justify-start">
3232
<a
3333
href="#"
34-
className="group relative w-full sm:w-auto inline-flex items-center justify-center px-6 py-3.5 overflow-hidden font-semibold text-white bg-gradient-to-r from-indigo-600 to-purple-600 dark:from-indigo-500 dark:to-purple-500 rounded-xl shadow-lg hover:shadow-2xl transform hover:-translate-y-0.5 transition-all duration-200 sm:px-8 md:py-4 md:text-lg lg:px-10"
34+
className="group w-full sm:w-auto inline-flex items-center justify-center px-6 py-3.5 font-semibold text-white bg-purple-700 dark:bg-indigo-500 rounded-xl shadow-lg hover:shadow-xl hover:bg-purple-800 dark:hover:bg-indigo-600 transform hover:-translate-y-0.5 transition-all duration-200 sm:px-8 md:py-4 md:text-lg lg:px-10"
3535
>
36-
<span className="relative z-10 flex items-center gap-2">
36+
<span className="flex items-center gap-2">
3737
Get started
3838
<svg className="w-5 h-5 group-hover:translate-x-1 transition-transform" fill="none" stroke="currentColor" viewBox="0 0 24 24">
3939
<path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M13 7l5 5m0 0l-5 5m5-5H6" />
4040
</svg>
4141
</span>
42-
<div className="absolute inset-0 bg-gradient-to-r from-indigo-700 to-purple-700 dark:from-indigo-600 dark:to-purple-600 opacity-0 group-hover:opacity-100 transition-opacity rounded-xl" />
4342
</a>
4443
<a
4544
href="#"

‎boundaries/ui/src/components/Landing/subscribe.tsx‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
export default function Subscribe() {
22
return (
3-
<header className="bg-white dark:bg-gray-800 rounded border-t-4 border-indigo-500">
3+
<header className="bg-gray-50 dark:bg-gray-800 rounded border-t-4 border-indigo-500">
44
<div className="container px-6 py-16 mx-auto rounded">
55
<div className="items-center lg:flex">
66
<div className="w-full lg:w-1/2">
@@ -44,7 +44,7 @@ export default function Subscribe() {
4444

4545
<button
4646
type="button"
47-
className="w-full px-6 py-2.5 text-sm font-semibold tracking-wide text-white capitalize transition-all duration-200 transform bg-indigo-600 dark:bg-indigo-500 rounded-lg lg:w-auto lg:mx-4 hover:bg-indigo-700 dark:hover:bg-indigo-600 focus:outline-none focus:ring-2 focus:ring-indigo-500 focus:ring-offset-2 shadow-md hover:shadow-lg active:scale-95"
47+
className="w-full px-6 py-2.5 text-sm font-semibold tracking-wide text-white capitalize transition-all duration-200 transform bg-purple-700 dark:bg-indigo-500 rounded-lg lg:w-auto lg:mx-4 hover:bg-purple-800 dark:hover:bg-indigo-600 focus:outline-none focus:ring-2 focus:ring-purple-500 focus:ring-offset-2 shadow-md hover:shadow-lg active:scale-95"
4848
>
4949
Subscribe
5050
</button>

0 commit comments

Comments
 (0)