import React from "react";
import useToggle from "../../Hooks/useToggle";
import BackToTop from "../BackToTop";
import FooterHomeOne from "../HomeOne/FooterHomeOne";
import Drawer from "../Mobile/Drawer";
import Blogs from "./Blogs";
import BlogSideBar from "./BlogSideBar";
import HeaderNews from "./HeaderNews";
import HeroNews from "./HeroNews";
import StickyHeaderNav from "../StickyHeader/StickyHeaderNav";

function Blog() {
  const [drawer, drawerAction] = useToggle(false);
  return (
    <>
      <Drawer drawer={drawer} action={drawerAction.toggle} />
      {/* <StickyHeaderNav action={drawerAction.toggle} /> */}
      <HeaderNews action={drawerAction.toggle} />
      <HeroNews
        title="Blogs"
        breadcrumb={[
          { link: "/", title: "Home" },
          { link: "/blog", title: "Blogs" },
        ]}
      />
      <section className="blogpage-section">
        <div className="container">
          <div className="row">
            <div className="col-12">
              <Blogs />
            </div>
          </div>
        </div>
      </section>
      <FooterHomeOne />
      <BackToTop />
    </>
  );
}

export default Blog;