liljudd-website/app/util/wrapping_objects.tsx

import styles from "./wrapping_objects.module.css"

export function NavBar(){
    return(
        <nav className={styles.navMenu}>
            <img className={styles.logo}  src={"https://static.moonleay.net/img/lilJuddWeb/logos/logox256.png"} alt={"The Bots Logo"}/>
            <a href={"/"} target={"_self"}>li'l Judd</a>
            <ul>
                <li>
                    <a href={"/features"} target={"_self"}>Features</a>
                </li>
                <li>
                    <a href={"/how-do-i"} target={"_self"}>How do I...?</a>
                </li>
                <li>
                    <a href={"/stack"} target={"_self"}>The Stack</a>
                </li>
                <li>
                    <a href={"/about"} target={"_self"}>About</a>
                </li>
                <li>
                    <a href={"https://discord.com/api/oauth2/authorize?client_id=1024410658973941862&permissions=8&scope=bot"}
                       target={"_blank"}>Invite to your Discord Server</a>
                </li>
            </ul>
        </nav>
    )
}

export function Footer() {
    return (
        <>
            <footer className={styles.footer}>
                <div className={styles.footerIcon}>
                    <img className={styles.footerImage} src={"https://static.moonleay.net/img/lilJuddWeb/lilJudd.png"}
                         alt={"A cute Image of lil Judd <3"}/>
                    <p>li'l Judd</p>
                </div>
                <div className={styles.footerTable}>
                    <table className={styles.table}>
                        <thead>
                        <tr>
                            <th>
                                <p className={styles.fong}>Navigation</p>
                            </th>
                            <th>
                                <p>The Software</p>
                            </th>
                            <th>
                                <p>More</p>
                            </th>
                            <th>
                                <p>Legal</p>
                            </th>
                        </tr>
                        </thead>
                        <tbody>
                        <tr>
                            <td>
                                <a href={"/"} target={"_self"}>Home</a>
                            </td>
                            <td>
                                <a href={"https://git.moonleay.net/DiscordBots/lilJudd"} target={"_blank"}>The Bot Code</a>
                            </td>
                            <td>
                                <a href={"https://moonleay.net/"} target={"_self"}>My homepage</a>
                            </td>
                            <td>
                                <a href={"/imprint"} target={"_self"}>Imprint</a>
                            </td>
                        </tr>
                        <tr>
                            <td>
                                <a href={"/features"} target={"_self"}>Features</a>
                            </td>
                            <td>
                                <a href={"https://git.moonleay.net/Websites/liljudd-website"} target={"_blank"}>The Website Code</a>
                            </td>
                            <td>
                                <a href={"https://moonleay.net/blog/"} target={"_blank"}>My blog</a>
                            </td>
                            <td>
                                <a href={"/privacy-policy"} target={"_self"}>Privacy Policy</a>
                            </td>
                        </tr>
                        <tr>
                            <td>
                                <a href={"/how-do-i"} target={"_self"}>How do I...?</a>
                            </td>
                            <td>
                                <a href={"/acknowledgements"} target={"_self"}>Acknowledgements</a>
                            </td>
                            <td>
                                <a href={"/contact"} target={"_self"}>Contact me</a>
                            </td>
                            <td>
                                <a href={"/terms-of-service"} target={"_self"}>Terms of Service</a>
                            </td>
                        </tr>
                        <tr>
                            <td>
                                <a href={"/stack"} target={"_self"}>The Stack</a>
                            </td>
                            <td>

                            </td>
                            <td>
                                <a href={"https://up.moonleay.net/"} target={"_blank"}>Uptime Status</a>
                            </td>
                            <td>
                                <a href={"https://git.moonleay.net/DiscordBots/lilJudd/src/branch/master/LICENSE"} target={"_blank"}>The license</a>
                            </td>
                        </tr>
                        <tr>
                            <td>
                                <a href={"/about"} target={"_self"}>About</a>
                            </td>
                        </tr>
                        </tbody>
                    </table>
                </div>
                <div className={styles.footerNotice}>
                    <Notice/>
                </div>
            </footer>
        </>
    )
}

export function Notice() {
    return (
        <div>
            <p>This website is NOT affiliated with Nintendo or any other party. All product names, logos, and brands are property of their respective owners.</p>
            <p>li'l Judd &copy; 2023 <a href={"https://moonleay.net/"} target={"_blank"}>moonleay</a></p>
        </div>
    )
}