Skip to content

Commit 1a285df

Browse files
JawnnypooJawnnypoo
committed
app links
1 parent f54b981 commit 1a285df

File tree

6 files changed

+144
-5
lines changed

6 files changed

+144
-5
lines changed

‎index.html‎

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -4,6 +4,9 @@
44
<meta charset="UTF-8" />
55
<link rel="icon" type="image/svg+xml" href="/favicon.ico" />
66
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
7+
<link rel="preconnect" href="https://fonts.googleapis.com">
8+
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
9+
<link href="https://fonts.googleapis.com/css2?family=Space+Mono:wght@400;700&display=swap" rel="stylesheet">
710
<title>Askarasu</title>
811
</head>
912
<body>

‎public/app_store.svg‎

Lines changed: 46 additions & 0 deletions
Loading

‎public/play_store.png‎

4.59 KB
Loading

‎src/App.css‎

Lines changed: 61 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -17,6 +17,51 @@
1717
height: 200px;
1818
}
1919

20+
.home-content {
21+
display: flex;
22+
flex-direction: column;
23+
align-items: center;
24+
gap: 2rem;
25+
}
26+
27+
.app-name {
28+
font-family: 'Space Mono', monospace;
29+
font-weight: 700;
30+
font-size: 2.5rem;
31+
margin: 0;
32+
}
33+
34+
.app-subtitle {
35+
font-family: 'Space Mono', monospace;
36+
font-weight: 400;
37+
font-size: 1.125rem;
38+
margin: -1rem 0 0 0;
39+
opacity: 0.7;
40+
}
41+
42+
.store-badges {
43+
display: flex;
44+
gap: 1rem;
45+
align-items: center;
46+
}
47+
48+
.store-badge {
49+
width: auto;
50+
transition: opacity 0.2s ease;
51+
}
52+
53+
.store-badge:hover {
54+
opacity: 0.8;
55+
}
56+
57+
.play-store-badge {
58+
height: 60px;
59+
}
60+
61+
.app-store-badge {
62+
height: 40px;
63+
}
64+
2065
.page-container {
2166
flex: 1;
2267
display: flex;
@@ -43,11 +88,17 @@
4388

4489
.footer {
4590
display: flex;
46-
justify-content: center;
47-
gap: 2rem;
91+
flex-direction: column;
92+
align-items: center;
93+
gap: 0.75rem;
4894
padding: 1.5rem;
4995
}
5096

97+
.footer-links {
98+
display: flex;
99+
gap: 2rem;
100+
}
101+
51102
.footer a {
52103
color: rgba(255, 255, 255, 0.6);
53104
text-decoration: none;
@@ -58,11 +109,19 @@
58109
color: rgba(255, 255, 255, 0.87);
59110
}
60111

112+
.footer-copyright {
113+
color: rgba(255, 255, 255, 0.4);
114+
font-size: 0.75rem;
115+
}
116+
61117
@media (prefers-color-scheme: light) {
62118
.footer a {
63119
color: rgba(0, 0, 0, 0.5);
64120
}
65121
.footer a:hover {
66122
color: rgba(0, 0, 0, 0.8);
67123
}
124+
.footer-copyright {
125+
color: rgba(0, 0, 0, 0.4);
126+
}
68127
}

‎src/App.tsx‎

Lines changed: 5 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -14,8 +14,11 @@ function App() {
1414
<Route path="/terms" element={<Terms />} />
1515
</Routes>
1616
<footer className="footer">
17-
<Link to="/privacy">Privacy Policy</Link>
18-
<Link to="/terms">Terms</Link>
17+
<div className="footer-links">
18+
<Link to="/privacy">Privacy</Link>
19+
<Link to="/terms">Terms</Link>
20+
</div>
21+
<div className="footer-copyright">© 2025 Commit 451</div>
1922
</footer>
2023
</div>
2124
</BrowserRouter>

‎src/pages/Home.tsx‎

Lines changed: 29 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,35 @@ import logo from '../assets/logo.png'
33
function Home() {
44
return (
55
<main className="main-content">
6-
<img src={logo} className="logo" alt="Logo" />
6+
<div className="home-content">
7+
<img src={logo} className="logo" alt="Logo" />
8+
<h1 className="app-name">Askarasu</h1>
9+
<p className="app-subtitle">Will you answer the caw?</p>
10+
<div className="store-badges">
11+
<a
12+
href="https://play.google.com/store/apps/details?id=com.example.app"
13+
target="_blank"
14+
rel="noopener noreferrer"
15+
>
16+
<img
17+
src="https://play.google.com/intl/en_us/badges/static/images/badges/en_badge_web_generic.png"
18+
alt="Get it on Google Play"
19+
className="store-badge play-store-badge"
20+
/>
21+
</a>
22+
<a
23+
href="https://apps.apple.com/app/example/id123456789"
24+
target="_blank"
25+
rel="noopener noreferrer"
26+
>
27+
<img
28+
src="https://developer.apple.com/assets/elements/badges/download-on-the-app-store.svg"
29+
alt="Download on the App Store"
30+
className="store-badge app-store-badge"
31+
/>
32+
</a>
33+
</div>
34+
</div>
735
</main>
836
)
937
}

0 commit comments

Comments
 (0)