"use client";

import FooterContent from "./content";

const Content = FooterContent;

export default function Footer() {
  return (
    <footer
      className={`
        row-start-3
        flex
        flex-wrap
        items-center
        justify-center
        overflow-x-auto
      `}
      style={{
        position: "fixed",
        left: "0",
        bottom: "0",
        width: "100%",
        height: "24px",
        textAlign: "center",
        backgroundColor: "var(--background)",
      }}
    >
      <Content
        name="ホーム"
        icon="material-symbols:home"
        link="/"
        target=""
      />
      <Content
        name="このサイトについて"
        icon="material-symbols:info"
        link="/about/"
        target=""
      />
    </footer>
  );
}