hamidazer commited on
Commit
bc7725e
·
verified ·
1 Parent(s): 62841d2

من میخوام یک وبسایت فروشگاهی راه اندازی کنم و میخوام صفحه ی اصلی این وبسایت و مواردی که نیاز داره رو به صورت استاتیک طراحی کنی. دقت کن تمام مواردی که یک وبسایت حرفه ای نیاز داره رو در این صفحه پیاده سازی کن

Browse files
Files changed (2) hide show
  1. README.md +8 -5
  2. index.html +88 -19
README.md CHANGED
@@ -1,10 +1,13 @@
1
  ---
2
- title: Shopvista
3
- emoji: 🐨
4
- colorFrom: indigo
5
- colorTo: red
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: ShopVista 🛒
3
+ colorFrom: blue
4
+ colorTo: yellow
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,88 @@
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="fa" dir="rtl">
3
+ <head>
4
+ <meta charset="UTF-8">
5
+ <meta name="viewport" content="width=device-width, initial-scale=1.0">
6
+ <title>ShopVista - فروشگاه آنلاین حرفه‌ای</title>
7
+ <link rel="icon" type="image/x-icon" href="data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100'><text y='.9em' font-size='90'>🛒</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
+ <script>
13
+ tailwind.config = {
14
+ theme: {
15
+ extend: {
16
+ colors: {
17
+ primary: {
18
+ 50: '#eef2ff',
19
+ 100: '#e0e7ff',
20
+ 200: '#c7d2fe',
21
+ 300: '#a5b4fc',
22
+ 400: '#818cf8',
23
+ 500: '#6366f1',
24
+ 600: '#4f46e5',
25
+ 700: '#4338ca',
26
+ 800: '#3730a3',
27
+ 900: '#312e81',
28
+ },
29
+ secondary: {
30
+ 50: '#faf5ff',
31
+ 100: '#f3e8ff',
32
+ 200: '#e9d5ff',
33
+ 300: '#d8b4fe',
34
+ 400: '#c084fc',
35
+ 500: '#a855f7',
36
+ 600: '#9333ea',
37
+ 700: '#7e22ce',
38
+ 800: '#6b21a8',
39
+ 900: '#581c87',
40
+ }
41
+ },
42
+ fontFamily: {
43
+ 'sans': ['Inter', 'system-ui', 'sans-serif'],
44
+ }
45
+ }
46
+ }
47
+ }
48
+ </script>
49
+ <link href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800&display=swap" rel="stylesheet">
50
+ </head>
51
+ <body class="bg-gray-50 dark:bg-gray-900 transition-colors duration-300">
52
+
53
+ <!-- Custom Components -->
54
+ <script src="components/navbar.js"></script>
55
+ <script src="components/footer.js"></script>
56
+ <script src="components/product-card.js"></script>
57
+ <script src="components/cart-sidebar.js"></script>
58
+
59
+ <!-- Navbar -->
60
+ <shop-navbar></shop-navbar>
61
+
62
+ <!-- Main Content -->
63
+ <main class="pt-20">
64
+
65
+ <!-- Hero Slider -->
66
+ <section class="relative overflow-hidden bg-gradient-to-br from-primary-600 to-secondary-600">
67
+ <div class="container mx-auto px-4 py-16">
68
+ <div class="grid md:grid-cols-2 gap-8 items-center">
69
+ <div class="text-white space-y-6 animate-fade-in">
70
+ <h1 class="text-4xl md:text-6xl font-bold leading-tight">
71
+ تخفیفات ویژه <span class="text-yellow-300">تابستانی</span>
72
+ </h1>
73
+ <p class="text-xl opacity-90">تا 70% تخفیف محصولات منتخب - فرصت محدود!</p>
74
+ <div class="flex flex-wrap gap-4">
75
+ <a href="#deals" class="bg-yellow-400 text-gray-900 px-8 py-3 rounded-full font-semibold hover:bg-yellow-300 transform hover:scale-105 transition-all duration-300 shadow-lg">
76
+ مشاهده پیشنهادات
77
+ </a>
78
+ <a href="#products" class="border-2 border-white text-white px-8 py-3 rounded-full font-semibold hover:bg-white hover:text-primary-600 transition-all duration-300">
79
+ فروشگاه
80
+ </a>
81
+ </div>
82
+ </div>
83
+ <div class="relative animate-float">
84
+ <div class="absolute inset-0 bg-primary-400 rounded-full blur-3xl opacity-30"></div>
85
+ <img src="http://static.photos/technology/640x360/42" alt="محصولات فناوری" class="relative z
86
+ <script src="https://huggingface.co/deepsite/deepsite-badge.js"></script>
87
+ </body>
88
+ </html>