This repository has no description
1// src/components/Home/Home.jsx
2
3import React from 'react';
4import SearchBar from '../SearchBar/SearchBar'; // Import SearchBar
5import './Home.css'; // Create corresponding CSS
6import CircularLogo from '../UserProfile/CircularLogo';
7import { Helmet } from 'react-helmet';
8
9const Home = () => {
10
11 return (
12 <>
13 <Helmet>
14 {/* Default meta tags */}
15 <title>cred.blue</title>
16 <meta name="description" content="Generate a Bluesky score. Understand your AT Proto data footprint. Vibe check strangers and new accounts." />
17
18 {/* OpenGraph Meta Tags */}
19 <meta property="og:title" content="cred.blue" />
20 <meta property="og:description" content="Generate a Bluesky score. Understand your AT Proto data footprint. Vibe check strangers and new accounts." />
21 <meta property="og:image" content="https://cred.blue/cred-blue-banner.jpg" />
22 <meta property="og:url" content="https://cred.blue" />
23 <meta property="og:type" content="website" />
24
25 {/* Twitter Card Meta Tags */}
26 <meta name="twitter:card" content="summary_large_image" />
27 <meta name="twitter:title" content="cred.blue" />
28 <meta name="twitter:description" content="Generate a Bluesky score. Understand your AT Proto footprint. Vibe check strangers and new accounts." />
29 <meta name="twitter:image" content="https://cred.blue/cred-blue-banner.jpg" />
30 </Helmet>
31
32 <main className="home-page">
33 <div className="home-content">
34 <CircularLogo
35 size={205}
36 />
37 <div className="home-context-text">
38 <h1>Welcome</h1>
39 <p>
40 Generate a Bluesky score. Understand your AT Proto data footprint. Vibe check strangers and new accounts.
41 </p>
42 <p className="disclaimer">
43 <strong>Note:</strong> cred.blue is in beta, so things will change.
44 </p>
45 </div>
46 <SearchBar />
47 </div>
48 </main>
49 </>
50 );
51};
52
53export default Home;