Hugging Face's logo

Spaces:
ddann1234
/
undefined
Running

App Files Community
ddann1234 commited on
Commit
095de57
·
verified ·
1 Parent(s): 09cac85

make it bigger and much more noticable, add animation in like it is drawing

Browse files
Files changed (1) hide show
  1. index.html +25 -20
index.html CHANGED
@@ -24,13 +24,14 @@
24
  .logo-container {
25
  position: relative;
26
  }
27
-
28
  svg {
29
- width: 900px;
30
- height: 500px;
 
 
 
31
  }
32
-
33
- /* Main brain circuit paths - THICK STROKES, NO FILL */
34
  .main-path {
35
  fill: none;
36
  stroke: #ffffff;
@@ -59,46 +60,50 @@
59
  stroke-linejoin: round;
60
  opacity: 0;
61
  }
62
-
63
  /* Main brain animation - RED to BLUE progression */
64
  @keyframes drawMainPath {
65
  0% {
66
  stroke-dashoffset: var(--path-length);
67
  stroke: #ed1c24;
68
  opacity: 1;
69
- filter: drop-shadow(0 0 80px #ed1c24)
70
- drop-shadow(0 0 160px #ed1c24);
 
71
  }
72
  25% {
73
  stroke: #c41e3a;
74
- filter: drop-shadow(0 0 70px #c41e3a)
75
- drop-shadow(0 0 140px #c41e3a);
 
76
  }
77
  50% {
78
  stroke: #8b1538;
79
- filter: drop-shadow(0 0 60px #8b1538)
80
- drop-shadow(0 0 120px #8b1538);
 
81
  }
82
  75% {
83
  stroke: #4a0c4f;
84
- filter: drop-shadow(0 0 50px #4a0c4f)
85
- drop-shadow(0 0 100px #4a0c4f);
 
86
  }
87
  90% {
88
  stroke: #010066;
89
- filter: drop-shadow(0 0 45px #010066)
90
- drop-shadow(0 0 90px #010066);
 
91
  }
92
  100% {
93
  stroke-dashoffset: 0;
94
  stroke: #ffffff;
95
  opacity: 1;
96
- filter: drop-shadow(0 0 50px #ffffff)
97
- drop-shadow(0 0 100px rgba(255, 255, 255, 0.7));
 
98
  }
99
  }
100
-
101
- /* AI Core animation - BLUE dominant */
102
  @keyframes drawCorePath {
103
  0% {
104
  stroke-dashoffset: var(--path-length);
 
24
  .logo-container {
25
  position: relative;
26
  }
 
27
  svg {
28
+ width: 1400px;
29
+ height: 800px;
30
+ transform: scale(1.4);
31
+ filter: drop-shadow(0 0 60px rgba(237, 28, 36, 0.6))
32
+ drop-shadow(0 0 120px rgba(1, 0, 102, 0.4));
33
  }
34
+ /* Main brain circuit paths - THICK STROKES, NO FILL */
 
35
  .main-path {
36
  fill: none;
37
  stroke: #ffffff;
 
60
  stroke-linejoin: round;
61
  opacity: 0;
62
  }
 
63
  /* Main brain animation - RED to BLUE progression */
64
  @keyframes drawMainPath {
65
  0% {
66
  stroke-dashoffset: var(--path-length);
67
  stroke: #ed1c24;
68
  opacity: 1;
69
+ filter: drop-shadow(0 0 120px #ed1c24)
70
+ drop-shadow(0 0 240px #ed1c24)
71
+ drop-shadow(0 0 360px rgba(237, 28, 36, 0.8));
72
  }
73
  25% {
74
  stroke: #c41e3a;
75
+ filter: drop-shadow(0 0 110px #c41e3a)
76
+ drop-shadow(0 0 220px #c41e3a)
77
+ drop-shadow(0 0 330px rgba(196, 30, 58, 0.7));
78
  }
79
  50% {
80
  stroke: #8b1538;
81
+ filter: drop-shadow(0 0 100px #8b1538)
82
+ drop-shadow(0 0 200px #8b1538)
83
+ drop-shadow(0 0 300px rgba(139, 21, 56, 0.6));
84
  }
85
  75% {
86
  stroke: #4a0c4f;
87
+ filter: drop-shadow(0 0 90px #4a0c4f)
88
+ drop-shadow(0 0 180px #4a0c4f)
89
+ drop-shadow(0 0 270px rgba(74, 12, 79, 0.5));
90
  }
91
  90% {
92
  stroke: #010066;
93
+ filter: drop-shadow(0 0 85px #010066)
94
+ drop-shadow(0 0 170px #010066)
95
+ drop-shadow(0 0 255px rgba(1, 0, 102, 0.4));
96
  }
97
  100% {
98
  stroke-dashoffset: 0;
99
  stroke: #ffffff;
100
  opacity: 1;
101
+ filter: drop-shadow(0 0 90px #ffffff)
102
+ drop-shadow(0 0 180px rgba(255, 255, 255, 0.8))
103
+ drop-shadow(0 0 270px rgba(255, 255, 255, 0.6));
104
  }
105
  }
106
+ /* AI Core animation - BLUE dominant */
 
107
  @keyframes drawCorePath {
108
  0% {
109
  stroke-dashoffset: var(--path-length);