tatht commited on
Commit
16a4e1e
·
verified ·
1 Parent(s): eaa6afe

hãy thiết kế cho tôi bố cục trang chuyên nghiệp hơn

Browse files
Files changed (2) hide show
  1. README.md +8 -5
  2. index.html +95 -19
README.md CHANGED
@@ -1,10 +1,13 @@
1
  ---
2
- title: Proweaver Flow
3
- emoji: 🔥
4
- colorFrom: red
5
- colorTo: green
6
  sdk: static
7
  pinned: false
 
 
8
  ---
9
 
10
- Check out the configuration reference at https://huggingface.co/docs/hub/spaces-config-reference
 
 
1
  ---
2
+ title: ProWeaver Flow
3
+ colorFrom: yellow
4
+ colorTo: pink
5
+ emoji: 🐳
6
  sdk: static
7
  pinned: false
8
+ tags:
9
+ - deepsite-v3
10
  ---
11
 
12
+ # Welcome to your new DeepSite project!
13
+ This project was created with [DeepSite](https://huggingface.co/deepsite).
index.html CHANGED
@@ -1,19 +1,95 @@
1
- <!doctype html>
2
- <html>
3
- <head>
4
- <meta charset="utf-8" />
5
- <meta name="viewport" content="width=device-width" />
6
- <title>My static Space</title>
7
- <link rel="stylesheet" href="style.css" />
8
- </head>
9
- <body>
10
- <div class="card">
11
- <h1>Welcome to your static Space!</h1>
12
- <p>You can modify this app directly by editing <i>index.html</i> in the Files and versions tab.</p>
13
- <p>
14
- Also don't forget to check the
15
- <a href="https://huggingface.co/docs/hub/spaces" target="_blank">Spaces documentation</a>.
16
- </p>
17
- </div>
18
- </body>
19
- </html>
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
+ <!DOCTYPE html>
2
+ <html lang="en" class="scroll-smooth">
3
+ <head>
4
+ <meta charset="UTF-8">
5
+ <meta name="viewport" content="width=device-width, initial-scale=1.0">
6
+ <title>ProWeaver - Professional Digital Solutions</title>
7
+ <link rel="icon" type="image/x-icon" href="data:image/svg+xml,<svg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 100 100%22><text y=%22.9em%22 font-size=%2290%22>✨</text></svg>">
8
+ <link rel="stylesheet" href="style.css">
9
+ <script src="https://cdn.tailwindcss.com"></script>
10
+ <script src="https://cdn.jsdelivr.net/npm/feather-icons/dist/feather.min.js"></script>
11
+ <script src="https://unpkg.com/feather-icons"></script>
12
+ </head>
13
+ <body class="bg-white dark:bg-gray-900 text-gray-900 dark:text-white transition-colors duration-300">
14
+
15
+ <!-- Navigation -->
16
+ <nav class="fixed top-0 w-full z-50 bg-white/80 dark:bg-gray-900/80 backdrop-blur-md border-b border-gray-200/50 dark:border-gray-700/50 transition-all duration-300">
17
+ <div class="container mx-auto px-6 py-4">
18
+ <div class="flex items-center justify-between">
19
+ <div class="flex items-center space-x-2">
20
+ <span class="text-2xl font-bold bg-gradient-to-r from-blue-600 to-violet-600 bg-clip-text text-transparent">ProWeaver</span>
21
+ <span class="text-xs bg-blue-100 dark:bg-blue-900 text-blue-800 dark:text-blue-200 px-2 py-1 rounded-full">Flow</span>
22
+ </div>
23
+
24
+ <div class="hidden md:flex items-center space-x-8">
25
+ <a href="#home" class="nav-link hover:text-blue-600 transition-colors duration-200 font-medium">Home</a>
26
+ <a href="#features" class="nav-link hover:text-blue-600 transition-colors duration-200 font-medium">Features</a>
27
+ <a href="#about" class="nav-link hover:text-blue-600 transition-colors duration-200 font-medium">About</a>
28
+ <a href="#testimonials" class="nav-link hover:text-blue-600 transition-colors duration-200 font-medium">Testimonials</a>
29
+ <a href="#contact" class="nav-link hover:text-blue-600 transition-colors duration-200 font-medium">Contact</a>
30
+ </div>
31
+
32
+ <div class="flex items-center space-x-4">
33
+ <button id="theme-toggle" class="p-2 rounded-full hover:bg-gray-100 dark:hover:bg-gray-800 transition-colors duration-200">
34
+ <i data-feather="moon" class="w-5 h-5 dark:hidden"></i>
35
+ <i data-feather="sun" class="w-5 h-5 hidden dark:block"></i>
36
+ </button>
37
+
38
+ <button id="mobile-menu-btn" class="md:hidden p-2 rounded-lg hover:bg-gray-100 dark:hover:bg-gray-800 transition-colors duration-200">
39
+ <i data-feather="menu" class="w-6 h-6"></i>
40
+ </button>
41
+ </div>
42
+ </div>
43
+
44
+ <!-- Mobile Menu -->
45
+ <div id="mobile-menu" class="hidden md:hidden mt-4 pb-4 border-t border-gray-200 dark:border-gray-700">
46
+ <div class="flex flex-col space-y-3 pt-4">
47
+ <a href="#home" class="mobile-nav-link py-2 px-3 rounded-lg hover:bg-gray-100 dark:hover:bg-gray-800 transition-colors duration-200 font-medium">Home</a>
48
+ <a href="#features" class="mobile-nav-link py-2 px-3 rounded-lg hover:bg-gray-100 dark:hover:bg-gray-800 transition-colors duration-200 font-medium">Features</a>
49
+ <a href="#about" class="mobile-nav-link py-2 px-3 rounded-lg hover:bg-gray-100 dark:hover:bg-gray-800 transition-colors duration-200 font-medium">About</a>
50
+ <a href="#testimonials" class="mobile-nav-link py-2 px-3 rounded-lg hover:bg-gray-100 dark:hover:bg-gray-800 transition-colors duration-200 font-medium">Testimonials</a>
51
+ <a href="#contact" class="mobile-nav-link py-2 px-3 rounded-lg hover:bg-gray-100 dark:hover:bg-gray-800 transition-colors duration-200 font-medium">Contact</a>
52
+ </div>
53
+ </div>
54
+ </div>
55
+ </nav>
56
+
57
+ <!-- Hero Section -->
58
+ <section id="home" class="min-h-screen flex items-center justify-center pt-20 px-6">
59
+ <div class="container mx-auto">
60
+ <div class="text-center max-w-4xl mx-auto">
61
+ <h1 class="text-5xl md:text-7xl font-bold mb-6 leading-tight">
62
+ <span class="bg-gradient-to-r from-blue-600 to-violet-600 bg-clip-text text-transparent">
63
+ Crafting Digital
64
+ </span>
65
+ <br />
66
+ <span class="text-gray-800 dark:text-white">Excellence</span>
67
+ </h1>
68
+
69
+ <p class="text-xl md:text-2xl text-gray-600 dark:text-gray-300 mb-8 leading-relaxed">
70
+ Transform your vision into stunning digital experiences with our professional design and development solutions.
71
+ </p>
72
+
73
+ <div class="flex flex-col sm:flex-row gap-4 justify-center items-center">
74
+ <a href="#contact" class="btn-primary px-8 py-4 rounded-full text-white font-semibold text-lg shadow-lg hover:shadow-xl transform hover:scale-105 transition-all duration-300 bg-gradient-to-r from-blue-600 to-violet-600">
75
+ Get Started
76
+ <i data-feather="arrow-right" class="w-5 h-5 inline ml-2"></i>
77
+ </a>
78
+ <a href="#features" class="px-8 py-4 rounded-full font-semibold text-lg border-2 border-gray-300 dark:border-gray-600 hover:border-blue-500 dark:hover:border-blue-500 hover:text-blue-600 dark:hover:text-blue-400 transition-all duration-300 flex items-center">
79
+ <i data-feather="play" class="w-5 h-5 mr-2"></i>
80
+ See Features
81
+ </a>
82
+ </div>
83
+
84
+ <div class="mt-16 grid grid-cols-3 gap-8 max-w-2xl mx-auto">
85
+ <div class="text-center">
86
+ <div class="text-3xl font-bold bg-gradient-to-r from-blue-600 to-violet-600 bg-clip-text text-transparent">500+</div>
87
+ <div class="text-sm text-gray-600 dark:text-gray-400 mt-1">Projects</div>
88
+ </div>
89
+ <div class="text-center">
90
+ <div class="text-3xl font-bold bg-gradient-to-r from-blue-600 to-violet-600 bg-clip-text text-transparent">98%</div>
91
+ <div class="text-sm text-gray-600 dark:text-gray-400 mt-1">Satisfaction</div>
92
+ </div>
93
+ <script src="https://huggingface.co/deepsite/deepsite-badge.js"></script>
94
+ </body>
95
+ </html>