Hugging Face's logo

Spaces:
ghostai1
/
GhostPack
Running

App Files Community
1
ghostai1 commited on
Commit
ba33565
·
verified ·
1 Parent(s): e2e9365

Update style.css

Browse files
Files changed (1) hide show
  1. style.css +74 -22
style.css CHANGED
@@ -1,49 +1,101 @@
1
- /* Custom styles for GhostPack */
2
  body {
3
- background-color: #121212;
4
- color: #ffffff;
5
- font-family: 'Arial', sans-serif;
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
6
  }
7
 
8
  .hero-section {
9
- background: linear-gradient(rgba(0,0,0,0.7), rgba(0,0,0,0.7)), url('https://huggingface.co/spaces/ghostai1/GhostPack/resolve/main/hero-bg.jpg');
10
  background-size: cover;
11
  background-position: center;
12
  height: 100vh;
13
  display: flex;
14
  align-items: center;
15
  justify-content: center;
 
16
  }
17
 
18
- .navbar {
19
- background-color: #1c2526 !important;
20
  }
21
 
22
- .navbar-brand, .nav-link {
23
- color: #00d4ff !important;
 
 
 
24
  }
25
 
26
- .card {
27
- transition: transform 0.3s;
 
28
  }
29
 
30
- .card:hover {
31
- transform: translateY(-5px);
 
 
 
 
32
  }
33
 
34
- .btn-primary {
35
- background-color: #00d4ff;
36
- border-color: #00d4ff;
 
37
  }
38
 
39
- .btn-primary:hover {
40
- background-color: #00b0cc;
41
- border-color: #00b0cc;
 
 
 
 
 
 
42
  }
43
 
44
  pre {
45
- background-color: #1c2526;
46
  padding: 15px;
47
- border-radius: 5px;
48
- color: #00d4ff;
 
 
 
 
 
 
 
 
 
 
 
 
 
 
49
  }
 
1
+ /* 👻 GhostPack Custom Styles 😈 */
2
  body {
3
+ background-color: #0a0a0a;
4
+ color: #e0e0e0;
5
+ font-family: 'Roboto', sans-serif;
6
+ overflow-x: hidden;
7
+ }
8
+
9
+ .navbar {
10
+ background: linear-gradient(90deg, #1c2526, #2e3b3e) !important;
11
+ box-shadow: 0 2px 5px rgba(0, 0, 0, 0.5);
12
+ }
13
+
14
+ .navbar-brand {
15
+ font-weight: bold;
16
+ font-size: 1.8rem;
17
+ color: #00ffcc !important;
18
+ text-shadow: 0 0 10px #00ffcc;
19
+ }
20
+
21
+ .nav-link {
22
+ color: #00ffcc !important;
23
+ transition: color 0.3s;
24
+ }
25
+
26
+ .nav-link:hover {
27
+ color: #00cc99 !important;
28
  }
29
 
30
  .hero-section {
31
+ background: linear-gradient(rgba(0,0,0,0.8), rgba(0,0,0,0.8)), url('https://huggingface.co/spaces/ghostai1/GhostPack/resolve/main/hero-bg.jpg');
32
  background-size: cover;
33
  background-position: center;
34
  height: 100vh;
35
  display: flex;
36
  align-items: center;
37
  justify-content: center;
38
+ text-shadow: 0 0 15px rgba(0, 255, 204, 0.5);
39
  }
40
 
41
+ .bg-dark {
42
+ background: linear-gradient(180deg, #1c2526, #121212) !important;
43
  }
44
 
45
+ .bg-ghost {
46
+ background: #2e3b3e !important;
47
+ border: 1px solid #00ffcc;
48
+ box-shadow: 0 0 15px rgba(0, 255, 204, 0.3);
49
+ transition: transform 0.3s, box-shadow 0.3s;
50
  }
51
 
52
+ .bg-ghost:hover {
53
+ transform: translateY(-5px);
54
+ box-shadow: 0 0 25px rgba(0, 255, 204, 0.5);
55
  }
56
 
57
+ .btn-ghost {
58
+ background: linear-gradient(45deg, #00ffcc, #00cc99);
59
+ border: none;
60
+ color: #0a0a0a;
61
+ font-weight: bold;
62
+ transition: transform 0.3s, box-shadow 0.3s;
63
  }
64
 
65
+ .btn-ghost:hover {
66
+ transform: scale(1.05);
67
+ box-shadow: 0 0 15px #00ffcc;
68
+ color: #0a0a0a;
69
  }
70
 
71
+ .btn-outline-ghost {
72
+ border-color: #00ffcc;
73
+ color: #00ffcc;
74
+ transition: background 0.3s, color 0.3s;
75
+ }
76
+
77
+ .btn-outline-ghost:hover {
78
+ background: #00ffcc;
79
+ color: #0a0a0a;
80
  }
81
 
82
  pre {
83
+ background: #1c2526;
84
  padding: 15px;
85
+ border-radius: 8px;
86
+ color: #00ffcc;
87
+ box-shadow: inset 0 0 10px rgba(0, 0, 0, 0.5);
88
+ }
89
+
90
+ .ghost-animation {
91
+ animation: ghostFloat 3s ease-in-out infinite;
92
+ }
93
+
94
+ @keyframes ghostFloat {
95
+ 0%, 100% { transform: translateY(0); }
96
+ 50% { transform: translateY(-10px); }
97
+ }
98
+
99
+ .bg-ghost-black {
100
+ background: #0a0a0a !important;
101
  }