Skip to content

Commit f2117f6

Browse files
TheButlahTheButlah
committed
switch to tailwind
1 parent 2da5e80 commit f2117f6

1 file changed

Lines changed: 32 additions & 96 deletions

File tree

‎index.html‎

Lines changed: 32 additions & 96 deletions
Original file line numberDiff line numberDiff line change
@@ -4,102 +4,38 @@
44
<meta charset="UTF-8">
55
<meta name="viewport" content="width=device-width, initial-scale=1.0">
66
<title>BasisVR</title>
7-
<style>
8-
body {
9-
font-family: Arial, sans-serif;
10-
background-color: #0d1b2a; /* Deep navy blue */
11-
color: #ffffff; /* White for main text */
12-
margin: 0;
13-
padding: 0;
14-
}
15-
16-
header {
17-
background-color: #1e293b; /* Slightly lighter navy */
18-
color: #ff4f81; /* Vibrant red-pink */
19-
padding: 20px;
20-
text-align: center;
21-
}
22-
23-
h1 {
24-
margin: 0;
25-
font-size: 2.5em;
26-
}
27-
28-
main {
29-
display: flex;
30-
justify-content: center;
31-
margin-top: 20px;
32-
}
33-
34-
.link-container {
35-
width: 80%;
36-
max-width: 600px;
37-
background-color: #1e293b; /* Same lighter navy for uniformity */
38-
border-radius: 8px;
39-
box-shadow: 0 4px 6px rgba(0, 0, 0, 0.7);
40-
padding: 20px;
41-
}
42-
43-
.link-container h2 {
44-
margin-top: 0;
45-
font-size: 1.5em;
46-
color: #4ce0d2; /* Teal for secondary highlights */
47-
}
48-
49-
.links {
50-
list-style: none;
51-
padding: 0;
52-
}
53-
54-
.links li {
55-
margin-bottom: 10px;
56-
}
57-
58-
.links a {
59-
text-decoration: none;
60-
color: #ff4f81; /* Red-pink as main link color */
61-
font-weight: bold;
62-
font-size: 1.2em;
63-
transition: color 0.3s ease, text-shadow 0.3s ease;
64-
}
65-
66-
.links a:hover {
67-
color: #9f7aea; /* Soft purple on hover */
68-
text-shadow: 0 0 10px #9f7aea; /* Glow effect */
69-
}
70-
71-
footer {
72-
text-align: center;
73-
padding: 10px;
74-
background-color: #1e293b;
75-
color: #4ce0d2; /* Teal accent for footer */
76-
margin-top: 20px;
77-
}
78-
79-
footer a {
80-
color: #ff4f81;
81-
text-decoration: none;
82-
}
83-
84-
footer a:hover {
85-
color: #9f7aea; /* Matches link hover color */
86-
}
87-
</style>
7+
<script src="https://cdn.tailwindcss.com/3.4.16"></script>
888
</head>
89-
<body>
90-
<header>
91-
<h1>BasisVR Link Directory</h1>
92-
</header>
93-
94-
<main>
95-
<div class="link-container">
96-
<h2>Useful Links</h2>
97-
<ul class="links">
98-
<li><a href="https://github.com/BasisVR/Basis" target="_blank">GitHub Repository</a></li>
99-
<li><a href="https://bsky.app/profile/basisvr.org" target="_blank">Bluesky Profile</a></li>
100-
<li><a href="https://x.com/BasisVR" target="_blank">Twitter Profile</a></li>
101-
</ul>
102-
</div>
103-
</main>
9+
<body class="bg-gray-100 dark:bg-gray-900 min-h-screen">
10+
<div class="container mx-auto px-4 py-8">
11+
<header class="text-left mb-12">
12+
<h1 class="text-center text-4xl font-bold text-gray-800 dark:text-gray-100 mb-6">BasisVR</h1>
13+
<div class="max-w-2xl mx-auto">
14+
<p class="text-gray-600 dark:text-gray-300 leading-relaxed mb-8">
15+
<strong>Basis lets you set up your own Social VR and Networked VR games with ease.</strong><br>
16+
We are a MIT-Licensed Open-Source project with a focus on
17+
open development and full access to any optional
18+
modification desired or required. Our goal is to help
19+
equip VR Creators, so we can accelerate the growth of
20+
VR.
21+
</p>
22+
</div>
23+
</header>
24+
25+
<section class="max-w-lg mx-auto">
26+
<h2 class="text-2xl font-semibold text-gray-700 dark:text-gray-200 mb-4">Project Links</h2>
27+
<div class="space-y-4">
28+
<a href="https://github.com/BasisVR/basis" class="block bg-white dark:bg-gray-800 p-4 rounded-lg shadow-md hover:shadow-lg transition-shadow duration-200">
29+
<span class="text-blue-600 dark:text-blue-400 hover:text-blue-800 dark:hover:text-blue-300">💻 Github Repository</span>
30+
</a>
31+
<a href="https://bsky.app/profile/basisvr.org" class="block bg-white dark:bg-gray-800 p-4 rounded-lg shadow-md hover:shadow-lg transition-shadow duration-200">
32+
<span class="text-blue-600 dark:text-blue-400 hover:text-blue-800 dark:hover:text-blue-300">🦋 Bluesky</span>
33+
</a>
34+
<a href="https://x.com/BasisVR" class="block bg-white dark:bg-gray-800 p-4 rounded-lg shadow-md hover:shadow-lg transition-shadow duration-200">
35+
<span class="text-blue-600 dark:text-blue-400 hover:text-blue-800 dark:hover:text-blue-300">𝕏 Twitter</span>
36+
</a>
37+
</div>
38+
</section>
39+
</div>
10440
</body>
10541
</html>

0 commit comments

Comments
 (0)