import Image from "next/image";
import Link from "next/link";
import pin from "@/app/assets/pin.png";
import styles from "./FriendLinks.module.scss";

const links = [
  {
    title: "中国科学院",
    href: "https://www.cas.cn/",
  },
  {
    title: "国家发改委",
    href: "https://www.ndrc.gov.cn/",
  },
  {
    title: "国家科技部",
    href: "http://www.most.gov.cn/",
  },
  {
    title: "安徽省发改委",
    href: "http://fzggw.ah.gov.cn/",
  },
  {
    title: "安徽省科技厅",
    href: "http://kjt.ah.gov.cn/",
  },
  {
    title: "中科院重庆研究院",
    href: "http://www.cigit.cas.cn/",
  },
  {
    title: "中科院成都文献情报中心",
    href: "http://www.clas.ac.cn/",
  },
  {
    title: "中国技术交易所",
    href: "http://us.ctex.cn/",
  },
  {
    title: "合肥市高新区",
    href: "http://gxq.hefei.gov.cn/",
  },
  {
    title: "合肥市发改委",
    href: "http://hfdrc.hefei.gov.cn/",
  },
  {
    title: "汇桔网",
    href: "https://www.wtoip.com/",
  },
];
const FriendLinks = () => {
  return (
    <div className={"h-[360px] bg-white"}>
      <div
        className={`title-bar text-black flex items-center px-2 font-bold ${styles.titleBar} relative`}
      >
        <Image width={30} height={30} src={pin} alt={"trumpet icon"} />
        <span className={"ml-2 text-[14px]"}>友情链接</span>
      </div>
      <ul className={"p-4"}>
        {links.map((link) => (
          <li key={link.href} className={"flex"}>
            <Link
              target={"_blank"}
              href={link.href}
              className={"flex items-center text-xs hover:underline h-7"}
            >
              • {link.title}
            </Link>
          </li>
        ))}
      </ul>
    </div>
  );
};

export default FriendLinks;