import { h } from "preact";

export function ProductDetail() {
  return (
    <div className="box-product-detail bg-[#F4F4F4]">
      <div className="container">
        <div className="breadcrumb p-[12px_0]">
          <ol
            itemscope
            itemtype="http://schema.org/BreadcrumbList"
            className="ul flex flex-wrap items-center"
          >
            <li
              itemprop="itemListElement"
              itemscope
              itemtype="http://schema.org/ListItem"
              className="flex items-center pr-[12px]"
            >
              <a
                href="/"
                itemprop="item"
                className="nopad-l flex items-center text-[#637381]"
              >
                <span itemprop="name">
                  <span style="font-size: 0; display: none;">Trang chủ</span>
                  <i className="icon_2025 home mr-[5px] mb-[5px]" />
                </span>
              </a>{" "}
              <i className="icon_2025 angle-right ml-[12px]" />
              <meta itemprop="position" content="1" />
            </li>
            <li
              itemprop="itemListElement"
              itemscope
              itemtype="http://schema.org/ListItem"
              className="flex items-center pr-[12px]"
            >
              <a
                href="/man-hinh.html"
                itemprop="item"
                className="nopad-l flex items-center"
              >
                <span itemprop="name">Màn hình máy tính</span>
                <i className="icon_2025 angle-right text-[#637381] ml-[12px]" />
              </a>
              <meta itemprop="position" content="2" />
            </li>
            <li
              itemprop="itemListElement"
              itemscope
              itemtype="http://schema.org/ListItem"
              className="flex items-center pr-[12px]"
            >
              <a
                href="/aivision.html"
                itemprop="item"
                className="nopad-l flex items-center"
              >
                <span itemprop="name">AIVISION</span>
              </a>
              <meta itemprop="position" content="3" />
            </li>
          </ol>
        </div>
      </div>
    </div>
  );
}