Skip to content

Commit 15a0063

Browse files
raphm4044raphm4044
committed
www: better website
1 parent a176816 commit 15a0063

3 files changed

Lines changed: 110 additions & 2 deletions

File tree

‎www/index.html‎

Lines changed: 20 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -3,9 +3,27 @@
33
<head>
44
<meta charset="UTF-8">
55
<title>Raph's Craft</title>
6+
7+
<link rel="stylesheet" type="text/css" href="styles/index.css">
8+
<link href='https://fonts.googleapis.com/css?family=Noto Sans' rel='stylesheet'>
69
</head>
710
<body>
8-
<h1>raph's craft</h1>
9-
<a href="docs/index.html">docs</a>
11+
<header>
12+
<img height="64" src="resources/logo.svg"/>
13+
<p>A work-in-progress sandbox game.</p>
14+
<div class="intro-box-buttons">
15+
<a href="docs/user-guide/getting-the-game.html">Get now!</a>
16+
<a href="docs/index.html">Documentation</a>
17+
</div>
18+
</header>
19+
20+
<section>
21+
<h1>What is it?</h1>
22+
<p>soon</p>
23+
</section>
24+
25+
<footer>
26+
<p>Raph's Craft. Copyright (C) 2025 Raphaël M.</p>
27+
</footer>
1028
</body>
1129
</html>

‎www/resources/logo.svg‎

Lines changed: 18 additions & 0 deletions
Loading

‎www/styles/index.css‎

Lines changed: 72 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,72 @@
1+
html {
2+
--background-layer0: hsl(0, 0%, 95%);
3+
--background-layer1: hsl(0, 0%, 90%);
4+
--background-layer2: hsl(0, 0%, 85%);
5+
6+
--border-layer0: hsl(0, 0%, 85%);
7+
--border-layer1: hsl(0, 0%, 80%);
8+
--border-layer2: hsl(0, 0%, 75%);
9+
10+
--foreground: hsl(0, 0%, 5%);
11+
12+
@media (prefers-color-scheme: dark) {
13+
--background-layer0: hsl(0, 0%, 5%);
14+
--background-layer1: hsl(0, 0%, 10%);
15+
--background-layer2: hsl(0, 0%, 15%);
16+
17+
--border-layer0: hsl(0, 0%, 15%);
18+
--border-layer1: hsl(0, 0%, 20%);
19+
--border-layer2: hsl(0, 0%, 25%);
20+
--foreground: hsl(0, 0%, 95%);
21+
}
22+
}
23+
24+
body {
25+
font-family: 'Noto Sans';
26+
27+
background: var(--background-layer0);
28+
color: var(--foreground);
29+
30+
margin: 0;
31+
padding: 0;
32+
}
33+
34+
header {
35+
display: flex;
36+
justify-content: center;
37+
align-items: center;
38+
flex-direction: column;
39+
40+
height: 16em;
41+
width: 100%;
42+
background: var(--background-layer1);
43+
}
44+
45+
header .intro-box-buttons {
46+
display: flex;
47+
gap: 1em;
48+
}
49+
50+
header .intro-box-buttons a {
51+
background: var(--background-layer2);
52+
border: 1px solid var(--border-layer2);
53+
border-radius: 0.5em;
54+
padding: 8px 10px;
55+
text-decoration: none;
56+
color: var(--foreground);
57+
}
58+
59+
60+
header .intro-box-buttons a:hover {
61+
cursor: pointer;
62+
}
63+
64+
footer {
65+
width: 100%;
66+
background: var(--background-layer1);
67+
68+
display: flex;
69+
justify-content: center;
70+
align-items: center;
71+
flex-direction: column;
72+
}

0 commit comments

Comments
 (0)