Spaces:
Running
Running
Upload folder using huggingface_hub
Browse files- index.html +32 -18
index.html
CHANGED
|
@@ -6,33 +6,47 @@
|
|
| 6 |
<title>RaxCore Technologies</title>
|
| 7 |
<style>
|
| 8 |
* { margin: 0; padding: 0; box-sizing: border-box; }
|
| 9 |
-
body { font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif; background:
|
| 10 |
-
.hero { background: linear-gradient(135deg, #
|
| 11 |
-
.hero h1 { font-size: 3.5rem; margin-bottom: 20px; background: linear-gradient(45deg, #
|
| 12 |
-
.tagline { font-size: 1.3rem; margin-bottom: 30px;
|
| 13 |
.badges { display: flex; justify-content: center; gap: 15px; flex-wrap: wrap; }
|
| 14 |
-
.badge { background: rgba(
|
| 15 |
section { padding: 60px 20px; max-width: 1200px; margin: 0 auto; }
|
| 16 |
-
h2 { font-size: 2.5rem; text-align: center; margin-bottom: 40px; color:
|
| 17 |
-
.models { background: rgba(
|
| 18 |
.model-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); gap: 30px; }
|
| 19 |
-
.model-card { background:
|
| 20 |
-
.model-card:hover { transform: translateY(-5px); }
|
| 21 |
-
.model-card h3 { font-size: 1.8rem; margin-bottom: 10px; color: #
|
| 22 |
-
.
|
|
|
|
| 23 |
.btn:hover { transform: scale(1.05); }
|
| 24 |
-
.features { background: rgba(
|
| 25 |
.feature-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)); gap: 30px; }
|
| 26 |
-
.feature { background:
|
| 27 |
-
.feature
|
|
|
|
|
|
|
| 28 |
.contact { text-align: center; }
|
| 29 |
.contact-grid { display: flex; justify-content: center; gap: 20px; flex-wrap: wrap; }
|
| 30 |
-
.contact-btn { background: rgba(
|
| 31 |
-
.contact-btn:hover { background:
|
| 32 |
-
footer { background: #
|
| 33 |
.social { margin-top: 20px; display: flex; justify-content: center; gap: 20px; }
|
| 34 |
.social a { color: #4ecdc4; text-decoration: none; transition: color 0.3s ease; }
|
| 35 |
-
.social a:hover { color: #
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
| 36 |
</style>
|
| 37 |
</head>
|
| 38 |
<body>
|
|
|
|
| 6 |
<title>RaxCore Technologies</title>
|
| 7 |
<style>
|
| 8 |
* { margin: 0; padding: 0; box-sizing: border-box; }
|
| 9 |
+
body { font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif; background: #0a0a0a; color: #ffffff; }
|
| 10 |
+
.hero { background: linear-gradient(135deg, #000000 0%, #1a1a2e 50%, #16213e 100%); color: white; padding: 80px 20px; text-align: center; }
|
| 11 |
+
.hero h1 { font-size: 3.5rem; margin-bottom: 20px; background: linear-gradient(45deg, #00d4ff, #ff6b6b, #4ecdc4); -webkit-background-clip: text; -webkit-text-fill-color: transparent; }
|
| 12 |
+
.tagline { font-size: 1.3rem; margin-bottom: 30px; color: #e0e0e0; }
|
| 13 |
.badges { display: flex; justify-content: center; gap: 15px; flex-wrap: wrap; }
|
| 14 |
+
.badge { background: rgba(0, 212, 255, 0.2); color: #00d4ff; padding: 8px 16px; border-radius: 25px; border: 1px solid #00d4ff; }
|
| 15 |
section { padding: 60px 20px; max-width: 1200px; margin: 0 auto; }
|
| 16 |
+
h2 { font-size: 2.5rem; text-align: center; margin-bottom: 40px; color: #ffffff; }
|
| 17 |
+
.models { background: rgba(26, 26, 46, 0.8); border-radius: 20px; margin: 40px 20px; border: 1px solid #333; }
|
| 18 |
.model-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); gap: 30px; }
|
| 19 |
+
.model-card { background: #1a1a2e; padding: 30px; border-radius: 15px; text-align: center; border: 1px solid #333; transition: all 0.3s ease; }
|
| 20 |
+
.model-card:hover { transform: translateY(-5px); border-color: #00d4ff; box-shadow: 0 10px 30px rgba(0, 212, 255, 0.3); }
|
| 21 |
+
.model-card h3 { font-size: 1.8rem; margin-bottom: 10px; color: #00d4ff; }
|
| 22 |
+
.model-card p { color: #b0b0b0; }
|
| 23 |
+
.btn { display: inline-block; background: linear-gradient(45deg, #00d4ff, #4ecdc4); color: #000; padding: 12px 24px; text-decoration: none; border-radius: 25px; margin-top: 15px; font-weight: 600; transition: transform 0.3s ease; }
|
| 24 |
.btn:hover { transform: scale(1.05); }
|
| 25 |
+
.features { background: rgba(26, 26, 46, 0.8); border-radius: 20px; margin: 40px 20px; border: 1px solid #333; }
|
| 26 |
.feature-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)); gap: 30px; }
|
| 27 |
+
.feature { background: #1a1a2e; padding: 25px; border-radius: 15px; text-align: center; border: 1px solid #333; transition: all 0.3s ease; }
|
| 28 |
+
.feature:hover { border-color: #ff6b6b; }
|
| 29 |
+
.feature h3 { font-size: 1.3rem; margin-bottom: 10px; color: #ff6b6b; }
|
| 30 |
+
.feature p { color: #b0b0b0; }
|
| 31 |
.contact { text-align: center; }
|
| 32 |
.contact-grid { display: flex; justify-content: center; gap: 20px; flex-wrap: wrap; }
|
| 33 |
+
.contact-btn { background: rgba(0, 212, 255, 0.2); color: #00d4ff; padding: 15px 30px; text-decoration: none; border-radius: 30px; border: 1px solid #00d4ff; transition: all 0.3s ease; }
|
| 34 |
+
.contact-btn:hover { background: #00d4ff; color: #000; transform: translateY(-2px); }
|
| 35 |
+
footer { background: #000; color: #b0b0b0; padding: 40px 20px; text-align: center; border-top: 1px solid #333; }
|
| 36 |
.social { margin-top: 20px; display: flex; justify-content: center; gap: 20px; }
|
| 37 |
.social a { color: #4ecdc4; text-decoration: none; transition: color 0.3s ease; }
|
| 38 |
+
.social a:hover { color: #00d4ff; }
|
| 39 |
+
@media (prefers-color-scheme: light) {
|
| 40 |
+
body { background: #f5f5f5; color: #333; }
|
| 41 |
+
.hero { background: linear-gradient(135deg, #667eea 0%, #764ba2 100%); }
|
| 42 |
+
.hero h1 { background: linear-gradient(45deg, #ff6b6b, #4ecdc4, #45b7d1); -webkit-background-clip: text; -webkit-text-fill-color: transparent; }
|
| 43 |
+
.tagline { color: rgba(255, 255, 255, 0.9); }
|
| 44 |
+
.models, .features { background: rgba(255, 255, 255, 0.9); }
|
| 45 |
+
.model-card, .feature { background: white; color: #333; }
|
| 46 |
+
.model-card h3 { color: #1a1a2e; }
|
| 47 |
+
.feature h3 { color: #1a1a2e; }
|
| 48 |
+
footer { background: #1a1a2e; color: white; }
|
| 49 |
+
}
|
| 50 |
</style>
|
| 51 |
</head>
|
| 52 |
<body>
|