%PDF- %PDF-
Mini Shell

Mini Shell

Direktori : /home/opti/public_html/ncf/static/js/
Upload File :
Create Path :
Current File : /home/opti/public_html/ncf/static/js/41.00c3431b.chunk.js.map

{"version":3,"sources":["app/layout/components/SliderBar/SliderBar.js","app/main/about-us/components/banner/styles.js","app/main/about-us/components/banner/FirstBanner.js","app/main/about-us/styles.js","app/main/about-us/Milestones.js"],"names":["SliderBar","userId","localStorage","getItem","useState","cart","setCart","useEffect","fetch","SERVER_URL","then","res","json","status","data","console","log","noOfItems","length","className","href","src","alt","Slider","styled","div","FirstBanner","props","images","setImages","imageData","page","Event","SwiperCore","use","Navigation","Milestones","id","navigation"],"mappings":"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","file":"static/js/41.00c3431b.chunk.js","sourcesContent":["import React, { useState, useEffect } from 'react';\r\nimport {SERVER_URL, CLIENT_URL} from '../../../config/server';\r\nimport \"swiper/swiper.min.css\";\r\nimport \"swiper/components/pagination/pagination.min.css\"\r\nimport \"./sliderbar.css\"\r\n\r\nfunction SliderBar(){\r\n\r\n    const userId = localStorage.getItem('loggedInUser');\r\n    const [cart, setCart] = useState([])\r\n\r\n    useEffect(() => {\r\n          const fetchcart =() =>{\r\n            fetch(`${SERVER_URL}/cart/all/${userId}`)\r\n            .then(res => res.json())\r\n            .then(json => {\r\n              if(json.status === 200){\r\n                  setCart(json.data);\r\n              }else{\r\n                  console.log(json);\r\n              }\r\n          });\r\n            \r\n          \r\n        }\r\n\r\n        fetchcart()\r\n      }, []);\r\n\r\n\r\n      const noOfItems = cart.length;\r\n\r\n    return(\r\n            <div className=\"sliderbardiv sm:mb-20\">\r\n                <div className=\"flex sliderbar shadow-sm -mt-9 field-bottom\">\r\n                <a href=\"/shop\" className=\"no-underline bg-white sliderbar-link text-black flex flex-col items-center justify-center md:py-0 py-8 w-48 broder-0 border-r border-solid\">\r\n                    <span className=\"mb-2\">\r\n                        <img src=\"/assets/images/icons/shop.svg\" alt=\"\" />\r\n                    </span>\r\n                    <span>Shop</span>\r\n                </a>\r\n                <a href=\"/cart\" className=\"no-underline bg-white sliderbar-link text-black flex flex-col items-center justify-center md:py-0 py-8 w-48 broder-0 border-r border-solid\">\r\n                    <span className=\"mb-2\">\r\n                        <img src=\"/assets/images/icons/shopping-cart.svg\" alt=\"\" />\r\n                    </span>\r\n                    <span>Cart <span className=\"cartNumber\"> {noOfItems}</span></span>\r\n                </a>\r\n                <a href=\"/donate\" className=\"no-underline bg-white sliderbar-link text-black flex flex-col items-center justify-center md:py-0 py-8 w-48\">\r\n                    <span className=\"mb-2\">\r\n                        <img src=\"/assets/images/icons/donation.svg\" alt=\"\" />\r\n                    </span>\r\n                    <span>Donate</span>\r\n                </a>\r\n            </div>\r\n            </div>\r\n    )\r\n}\r\nexport default SliderBar;\r\n","import styled from \"styled-components\"\r\n\r\nconst Slider = styled.div`\r\n  position: relative;\r\n  height: 700px;\r\n\tborder: 1px solid #eee\r\n\r\n  background: #eee;\r\n  font-family: 'Roboto', Helvetica Neue, Helvetica, Arial, sans-serif;\r\n  font-size: 14px;\r\n  color: rgb(39, 38, 38);\r\n  margin: 0;\r\n  padding: 0;\r\n\r\n\t.swiper-container {\r\n\t\twidth: 100%;\r\n\t\theight: 100%;\r\n\t}\r\n\r\n\t.swiper-slide {\r\n\t\tfont-size: 18px;\r\n\t\tbackground: transparent;\r\n\r\n\t\t/* Center slide text vertically */\r\n\t\tdisplay: -webkit-box;\r\n\t\tdisplay: -ms-flexbox;\r\n\t\tdisplay: -webkit-flex;\r\n\t\tdisplay: flex;\r\n\t\t-webkit-box-pack: center;\r\n\t\t-ms-flex-pack: center;\r\n\t\t-webkit-justify-content: center;\r\n\t\tjustify-content: center;\r\n\t\t-webkit-box-align: center;\r\n\t\t-ms-flex-align: center;\r\n\t\t-webkit-align-items: center;\r\n\t\talign-items: center;\r\n\t}\r\n\r\n\t.swiper-slide img {\r\n\t\tdisplay: block;\r\n\t\twidth: 100%;\r\n\t\theight: 100%;\r\n\t\tobject-fit: cover;\r\n\t}\r\n\r\n\t.swiper-slide .slider-wrapper {\r\n\t\tdisplay: block;\r\n\t\tposition: relative;\r\n\t\twidth: 100%;\r\n\t\theight: 100%;\r\n\t\tobject-fit: cover;\r\n\t}\r\n\r\n\t.slider-text {\r\n\t\tposition: absolute;\r\n\t\theight: 100%;\r\n\t\twidth: 100%;\r\n\t}\r\n\r\n\t.field-bottom {\r\n\t\ttransform: translate(10%, 306px);\r\n\t}\r\n\r\n\t@media screen and (max-width: 640px) {\r\n\t\t.field-bottom {\r\n\t\t\ttransform: translate(0%, 0%);\r\n\t\t}\r\n\t}\r\n`\r\n\r\nexport default Slider","import React, { useState, useEffect } from 'react';\r\nimport {SERVER_URL} from '../../../../config/server';\r\nimport { Swiper, SwiperSlide } from \"swiper/react\";\r\nimport SliderContainer from \"./styles\"\r\nimport styled from 'styled-components';\r\nimport \"../../../style.css\"\r\nimport '../../about.css'\r\n\r\nfunction FirstBanner(props) {\r\n\r\n  const [images, setImages] = useState('');\r\n\r\n  useEffect(() => {\r\n    const fetchImages =() =>{\r\n      fetch(`${SERVER_URL}/image/page-banners`)\r\n      .then(res => res.json())\r\n      .then(json => {\r\n        if(json.status === 200){\r\n          const imageData = json.data;\r\n          setImages(imageData);\r\n        }else{\r\n            console.log(\"Oops couldn't fetch data\");\r\n        }\r\n    });\r\n      \r\n    }\r\n\r\n    fetchImages();\r\n  }, []);\r\n\r\n  \r\n  const page = props.page;\r\n \r\n\r\n  return (\r\n    <SliderContainer className=\"mt-6 z-index-3\">\r\n                <SwiperSlide>\r\n                    <div className=\"slider-wrapper\">\r\n                        <div className=\"slider-text border border-solid\">\r\n                            <div className=\"max-w-7xl mx-auto pb-16 pt-48 md:px-16 px-8\">\r\n                            <div className=\"grid md:grid-cols-2 grid-cols-1 gap-x-8 gap-y-8\">\r\n                            <div className=\"content banner-txt\">\r\n                            <h1 className='text-4xl font-bold text-white mb-4'>\r\n                              What have you done for the Environment Lately?\r\n                            </h1>\r\n                            <p className='font-light text-white mb-6'>\r\n                              What you give goes a long way\r\n                            </p>\r\n\r\n                            <a href=\"/donate\">\r\n                            <button className='bg-green hover:bg-green-800 text-white font-bold py-2 px-8 rounded'>\r\n                              Donate\r\n                            </button>\r\n                            </a>\r\n                                </div> \r\n                            </div>\r\n                            </div>\r\n                        </div>\r\n                        <img src={`https://admin.ncfnigeria.org/images/banners/${images[page]}`} alt=\"\" />\r\n                    </div>\r\n                </SwiperSlide>\r\n            \r\n        </SliderContainer>\r\n  );\r\n}\r\n\r\n\r\nexport default FirstBanner;\r\n","import styled from 'styled-components';\r\n\r\nconst Event = styled.div`\r\n  background-image: url(assets/images/nature/forest-about.png);\r\n  height: 360px;\r\n`;\r\n\r\nconst Slider = styled.div`\r\n  .swiper-container {\r\n    width: 100%;\r\n    height: 100%;\r\n  }\r\n\r\n  .swiper-slide {\r\n    text-align: justify;\r\n    background: transparent;\r\n\r\n    /* Center slide text vertically */\r\n    display: -webkit-box;\r\n    display: -ms-flexbox;\r\n    display: -webkit-flex;\r\n    display: flex;\r\n    -webkit-box-pack: center;\r\n    -ms-flex-pack: center;\r\n    -webkit-justify-content: center;\r\n    justify-content: center;\r\n    -webkit-box-align: center;\r\n    -ms-flex-align: center;\r\n    -webkit-align-items: center;\r\n    align-items: center;\r\n  }\r\n\r\n  .swiper-slide img {\r\n    display: block;\r\n    object-fit: cover;\r\n  }\r\n`;\r\n\r\nexport { Event, Slider };\r\n","import React from 'react';\r\nimport { BsTriangleFill } from 'react-icons/bs';\r\nimport { SocialTabs } from '@nfc';\r\nimport { Slider } from './styles';\r\nimport { Swiper, SwiperSlide } from 'swiper/react';\r\nimport \"./about.css\"\r\n\r\nimport 'swiper/swiper.min.css';\r\nimport 'swiper/components/navigation/navigation.min.css';\r\nimport SliderBar from \"../../layout/components/SliderBar/SliderBar\"\r\nimport FirstBanner from './components/banner/FirstBanner';\r\n\r\n// import Swiper core and required modules\r\nimport SwiperCore, { Navigation } from 'swiper/core';\r\n\r\n// install Swiper modules\r\nSwiperCore.use([Navigation]);\r\n\r\nfunction Milestones() {\r\n  const page=\"milestone\";\r\n\r\n  return (\r\n    <div>\r\n      <FirstBanner page={page}/>\r\n      <div className='milestones'>\r\n      <div  id=\"overlay\" className=\"\">\r\n      <SliderBar/>\r\n        <img className=\"papertear1 -top-25\" src='/assets/images/bg/white-bg.png' alt='' />\r\n        <div className='max-w-7xl mx-auto md:px-16 px-8'>\r\n          <div className='text-center mb-8'>\r\n            <h1 className='font-bold text-2xl text-white mb-4'>\r\n              OUR MILESTONES\r\n            </h1>\r\n            <hr className='bg-green w-48 mx-auto h-2 border-0' />\r\n          </div>\r\n\r\n          <Slider>\r\n            <Swiper navigation={true} className='mySwiper'>\r\n              <SwiperSlide>\r\n                <div className='height-100vh'>\r\n                  <div className='flex flex-col md:grid grid-cols-9 w-100full mx-auto p-2 text-blue-50'>\r\n                  <div className='flex flex-row-reverse md:contents'>\r\n                      <div className='col-start-1 col-end-3 p-4 rounded-xl my-4 ml-auto shadow-md'>\r\n                        <p className='leading-tight text-justify text-3xl font-bold text-white text-mbl-1em'>\r\n                          1980\r\n                        </p>\r\n                      </div>\r\n                      <div className='col-start-3 col-end-5 md:mx-auto relative mr-10'>\r\n                        <div className='h-full w-6 flex items-center justify-center'>\r\n                          <div className='h-full w-1 bg-green-800 pointer-events-none'></div>\r\n                        </div>\r\n                        <div className='w-12 h-12 flex justify-center items-center absolute top-1/3 -right-3 -mt-3 rounded-full bg-white border-4 border-green-800 shadow'>\r\n                          <img src='/assets/images/icons/drop.svg' alt='' />\r\n                        </div>\r\n                      </div>\r\n                      <div className='bg-white milestone col-start-5 col-end-10 p-4 my-4 mr-auto shadow-md relative'>\r\n                        <BsTriangleFill className='absolute text-white top-1 -left-3 transform -rotate-90' />\r\n                        <p className='leading-tight text-green text-justify text-mbl  txt-justify'>\r\n                          NCF Was Established\r\n                        </p>\r\n                      </div>\r\n                    </div>\r\n\r\n                    <div className='flex flex-row-reverse md:contents'>\r\n                      <div className='col-start-1 col-end-3 p-4 rounded-xl my-4 ml-auto shadow-md'>\r\n                        <p className='leading-tight text-justify text-3xl font-bold text-green text-mbl-1em'>\r\n                          1984\r\n                        </p>\r\n                      </div>\r\n                      <div className='col-start-3 col-end-5 md:mx-auto relative mr-10'>\r\n                        <div className='h-full w-6 flex items-center justify-center'>\r\n                          <div className='h-full w-1 bg-green-800 pointer-events-none'></div>\r\n                        </div>\r\n                        <div className='w-12 h-12 flex justify-center items-center absolute top-1/3 -right-3 -mt-3 rounded-full bg-white border-4 border-green-800 shadow'>\r\n                          <img src='/assets/images/icons/drop.svg' alt='' />\r\n                        </div>\r\n                      </div>\r\n                      <div className='bg-green milestone col-start-5 col-end-10 p-4 my-4 mr-auto shadow-md relative'>\r\n                        <BsTriangleFill className='absolute text-green top-1 -left-3 transform -rotate-90' />\r\n                        <p className='leading-tight text-justify text-mbl  txt-justify'>\r\n                          Assisted in developing National Conservation Strategy\r\n                        </p>\r\n                      </div>\r\n                    </div>\r\n\r\n                    <div className='flex flex-row-reverse md:contents'>\r\n                      <div className='col-start-1 col-end-3 p-4 rounded-xl my-4 ml-auto shadow-md'>\r\n                        <p className='leading-tight text-justify text-3xl font-bold text-white text-mbl-1em'>\r\n                          1985\r\n                        </p>\r\n                      </div>\r\n                      <div className='col-start-3 col-end-5 md:mx-auto relative mr-10'>\r\n                        <div className='h-full w-6 flex items-center justify-center'>\r\n                          <div className='h-full w-1 bg-green-800 pointer-events-none'></div>\r\n                        </div>\r\n                        <div className='w-12 h-12 flex justify-center items-center absolute top-1/3 -right-3 -mt-3 rounded-full bg-white border-4 border-green-800 shadow'>\r\n                          <img src='/assets/images/icons/drop.svg' alt='' />\r\n                        </div>\r\n                      </div>\r\n                      <div className='milestone bg-white col-start-5 col-end-10 p-4 my-4 mr-auto shadow-md relative'>\r\n                        <BsTriangleFill className='absolute text-white top-1 -left-3 transform -rotate-90' />\r\n                        <p className='leading-tight text-justify text-green text-mbl  txt-justify'>\r\n                          Supported the enactment of The Endangered Species\r\n                          Decree.(now an Act of Parliament). \r\n                        </p>\r\n                      </div>\r\n                    </div>\r\n                  </div>\r\n                </div>\r\n              </SwiperSlide>\r\n\r\n              <SwiperSlide>\r\n                <div className=''>\r\n                  <div className='flex flex-col md:grid grid-cols-9 mx-auto p-2 text-blue-50'>\r\n                    <div className='flex flex-row-reverse md:contents'>\r\n                      <div className='col-start-1 col-end-3 p-4 rounded-xl my-4 ml-auto shadow-md'>\r\n                        <p className='leading-tight text-justify text-3xl font-bold text-green text-mbl  txt-justify-1em'>\r\n                        1987\r\n                        </p>\r\n                      </div>\r\n                      <div className='col-start-3 col-end-5 md:mx-auto relative mr-10'>\r\n                        <div className='h-full w-6 flex items-center justify-center'>\r\n                          <div className='h-full w-1 bg-green-800 pointer-events-none'></div>\r\n                        </div>\r\n                        <div className='w-12 h-12 flex justify-center items-center absolute top-1/3 -right-3 -mt-3 rounded-full bg-white border-4 border-green-800 shadow'>\r\n                          <img src='/assets/images/icons/drop.svg' alt='' />\r\n                        </div>\r\n                      </div>\r\n                      <div className='bg-white milestone col-start-5 col-end-10 p-4 my-4 mr-auto shadow-md relative'>\r\n                        <BsTriangleFill className='absolute text-white top-1 -left-3 transform -rotate-90' />\r\n                        <p className='leading-tight text-justify text-green text-mbl'>\r\n                        Drafting of National Conservation Strategy. \r\n                        </p>\r\n                      </div>\r\n                    </div>\r\n\r\n                    <div className='flex flex-row-reverse md:contents'>\r\n                      <div className='col-start-1 col-end-3 p-4 rounded-xl my-4 ml-auto shadow-md'>\r\n                        <p className='leading-tight text-justify text-3xl font-bold text-white text-mbl  txt-justify-1em'>\r\n                        1990\r\n                        </p>\r\n                      </div>\r\n                      <div className='col-start-3 col-end-5 md:mx-auto relative mr-10'>\r\n                        <div className='h-full w-6 flex items-center justify-center'>\r\n                          <div className='h-full w-1 bg-green-800 pointer-events-none'></div>\r\n                        </div>\r\n                        <div className='w-12 h-12 flex justify-center items-center absolute top-1/3 -right-3 -mt-3 rounded-full bg-white border-4 border-green-800 shadow'>\r\n                          <img src='/assets/images/icons/drop.svg' alt='' />\r\n                        </div>\r\n                      </div>\r\n                      <div className='bg-green milestone col-start-5 col-end-10 p-4 my-4 mr-auto shadow-md relative'>\r\n                        <BsTriangleFill className='absolute text-green top-1 -left-3 transform -rotate-90' />\r\n                        <p className='leading-tight text-justify text-mbl'>\r\n                        Established the Lekki Conservation Centre\r\n                        </p>\r\n                      </div>\r\n                    </div>\r\n\r\n                    <div className='flex flex-row-reverse md:contents'>\r\n                      <div className='col-start-1 col-end-3 p-4 rounded-xl my-4 ml-auto shadow-md'>\r\n                        <p className='leading-tight text-justify text-3xl font-bold text-green text-mbl-1em'>\r\n                          1992\r\n                        </p>\r\n                      </div>\r\n                      <div className='col-start-3 col-end-5 md:mx-auto relative mr-10'>\r\n                        <div className='h-full w-6 flex items-center justify-center'>\r\n                          <div className='h-full w-1 bg-green-800 pointer-events-none'></div>\r\n                        </div>\r\n                        <div className='w-12 h-12 flex justify-center items-center absolute top-1/3 -right-3 -mt-3 rounded-full bg-white border-4 border-green-800 shadow'>\r\n                          <img src='/assets/images/icons/drop.svg' alt='' />\r\n                        </div>\r\n                      </div>\r\n                      <div className='bg-white milestone col-start-5 col-end-10 p-4 my-4 mr-auto shadow-md relative'>\r\n                        <BsTriangleFill className='absolute text-white top-1 -left-3 transform -rotate-90' />\r\n                        <p className='leading-tight text-justify text-green text-mbl  txt-justify'>\r\n                        Established the Hadejia-Nguru wetlands conservation project\r\n                        </p>\r\n                      </div>\r\n                    </div>\r\n                  </div>\r\n                </div>\r\n              </SwiperSlide>\r\n\r\n              <SwiperSlide>\r\n                <div className=''>\r\n                  <div className='flex flex-col md:grid grid-cols-9 mx-auto p-2 text-blue-50'>\r\n                    <div className='flex flex-row-reverse md:contents'>\r\n                      <div className='col-start-1 col-end-3 p-4 rounded-xl my-4 ml-auto shadow-md'>\r\n                        <p className='leading-tight text-justify text-3xl font-bold text-white text-mbl  txt-justify-1em'>\r\n                        1997\r\n                        </p>\r\n                      </div>\r\n                      <div className='col-start-3 col-end-5 md:mx-auto relative mr-10'>\r\n                        <div className='h-full w-6 flex items-center justify-center'>\r\n                          <div className='h-full w-1 bg-green-800 pointer-events-none'></div>\r\n                        </div>\r\n                        <div className='w-12 h-12 flex justify-center items-center absolute top-1/3 -right-3 -mt-3 rounded-full bg-white border-4 border-green-800 shadow'>\r\n                          <img src='/assets/images/icons/drop.svg' alt='' />\r\n                        </div>\r\n                      </div>\r\n                      <div className='bg-white milestone col-start-5 col-end-10 p-4 my-4 mr-auto shadow-md relative'>\r\n                        <BsTriangleFill className='absolute text-white top-1 -left-3 transform -rotate-90' />\r\n                        <p className='leading-tight text-justify text-green text-mbl'>\r\n                        Assisted to develop Nigeria’s Vision 2020 on the environment. \r\n                        </p>\r\n                      </div>\r\n                    </div>\r\n\r\n                    <div className='flex flex-row-reverse md:contents'>\r\n                      <div className='col-start-1 col-end-3 p-4 rounded-xl my-4 ml-auto shadow-md'>\r\n                        <p className='leading-tight text-justify text-3xl font-bold text-green text-mbl  txt-justify-1em'>\r\n                        1999\r\n                        </p>\r\n                      </div>\r\n                      <div className='col-start-3 col-end-5 md:mx-auto relative mr-10'>\r\n                        <div className='h-full w-6 flex items-center justify-center'>\r\n                          <div className='h-full w-1 bg-green-800 pointer-events-none'></div>\r\n                        </div>\r\n                        <div className='w-12 h-12 flex justify-center items-center absolute top-1/3 -right-3 -mt-3 rounded-full bg-white border-4 border-green-800 shadow'>\r\n                          <img src='/assets/images/icons/drop.svg' alt='' />\r\n                        </div>\r\n                      </div>\r\n                      <div className='bg-green milestone col-start-5 col-end-10 p-4 my-4 mr-auto shadow-md relative'>\r\n                        <BsTriangleFill className='absolute text-green top-1 -left-3 transform -rotate-90' />\r\n                        <p className='leading-tight text-justify text-mbl'>\r\n                        Review of the National Parks Decree\r\n                        </p>\r\n                      </div>\r\n                    </div>\r\n\r\n                    <div className='flex flex-row-reverse md:contents'>\r\n                      <div className='col-start-1 col-end-3 p-4 rounded-xl my-4 ml-auto shadow-md'>\r\n                        <p className='leading-tight text-justify text-3xl font-bold text-white text-mbl-1em'>\r\n                          1999\r\n                        </p>\r\n                      </div>\r\n                      <div className='col-start-3 col-end-5 md:mx-auto relative mr-10'>\r\n                        <div className='h-full w-6 flex items-center justify-center'>\r\n                          <div className='h-full w-1 bg-green-800 pointer-events-none'></div>\r\n                        </div>\r\n                        <div className='w-12 h-12 flex justify-center items-center absolute top-1/3 -right-3 -mt-3 rounded-full bg-white border-4 border-green-800 shadow'>\r\n                          <img src='/assets/images/icons/drop.svg' alt='' />\r\n                        </div>\r\n                      </div>\r\n                      <div className='bg-white milestone col-start-5 col-end-10 p-4 my-4 mr-auto shadow-md relative'>\r\n                        <BsTriangleFill className='absolute text-white top-1 -left-3 transform -rotate-90' />\r\n                        <p className='leading-tight text-justify text-green text-mbl  txt-justify'>\r\n                        Review of the National Forestry Law\r\n                        </p>\r\n                      </div>\r\n                    </div>\r\n                  </div>\r\n                </div>\r\n              </SwiperSlide>\r\n\r\n\r\n              <SwiperSlide>\r\n                <div className=''>\r\n                  <div className='flex flex-col md:grid grid-cols-9 mx-auto p-2 text-blue-50'>\r\n                    <div className='flex flex-row-reverse md:contents'>\r\n                      <div className='col-start-1 col-end-3 p-4 rounded-xl my-4 ml-auto shadow-md'>\r\n                        <p className='leading-tight text-justify text-3xl font-bold text-green text-mbl  txt-justify-1em'>\r\n                        2000\r\n                        </p>\r\n                      </div>\r\n                      <div className='col-start-3 col-end-5 md:mx-auto relative mr-10'>\r\n                        <div className='h-full w-6 flex items-center justify-center'>\r\n                          <div className='h-full w-1 bg-green-800 pointer-events-none'></div>\r\n                        </div>\r\n                        <div className='w-12 h-12 flex justify-center items-center absolute top-1/3 -right-3 -mt-3 rounded-full bg-white border-4 border-green-800 shadow'>\r\n                          <img src='/assets/images/icons/drop.svg' alt='' />\r\n                        </div>\r\n                      </div>\r\n                      <div className='bg-white milestone col-start-5 col-end-10 p-4 my-4 mr-auto shadow-md relative'>\r\n                        <BsTriangleFill className='absolute text-white top-1 -left-3 transform -rotate-90' />\r\n                        <p className='leading-tight text-justify text-green text-mbl'>\r\n                        Collaborated with the Federal Department of Forestry on the drafting of Nigeria’s National Forestry Law\r\n                        </p>\r\n                      </div>\r\n                    </div>\r\n\r\n                    <div className='flex flex-row-reverse md:contents'>\r\n                      <div className='col-start-1 col-end-3 p-4 rounded-xl my-4 ml-auto shadow-md'>\r\n                        <p className='leading-tight text-justify text-3xl font-bold text-white text-mbl  txt-justify-1em'>\r\n                        2002\r\n                        </p>\r\n                      </div>\r\n                      <div className='col-start-3 col-end-5 md:mx-auto relative mr-10'>\r\n                        <div className='h-full w-6 flex items-center justify-center'>\r\n                          <div className='h-full w-1 bg-green-800 pointer-events-none'></div>\r\n                        </div>\r\n                        <div className='w-12 h-12 flex justify-center items-center absolute top-1/3 -right-3 -mt-3 rounded-full bg-white border-4 border-green-800 shadow'>\r\n                          <img src='/assets/images/icons/drop.svg' alt='' />\r\n                        </div>\r\n                      </div>\r\n                      <div className='bg-green milestone col-start-5 col-end-10 p-4 my-4 mr-auto shadow-md relative'>\r\n                        <BsTriangleFill className='absolute text-green top-1 -left-3 transform -rotate-90' />\r\n                        <p className='leading-tight text-justify text-mbl'>\r\n                        Established the Niger-Delta Conservation and Sustainable Development (NDCSD) Project. \r\n                        </p>\r\n                      </div>\r\n                    </div>\r\n\r\n                    <div className='flex flex-row-reverse md:contents'>\r\n                      <div className='col-start-1 col-end-3 p-4 rounded-xl my-4 ml-auto shadow-md'>\r\n                        <p className='leading-tight text-justify text-3xl font-bold text-green text-mbl-1em'>\r\n                          2005\r\n                        </p>\r\n                      </div>\r\n                      <div className='col-start-3 col-end-5 md:mx-auto relative mr-10'>\r\n                        <div className='h-full w-6 flex items-center justify-center'>\r\n                          <div className='h-full w-1 bg-green-800 pointer-events-none'></div>\r\n                        </div>\r\n                        <div className='w-12 h-12 flex justify-center items-center absolute top-1/3 -right-3 -mt-3 rounded-full bg-white border-4 border-green-800 shadow'>\r\n                          <img src='/assets/images/icons/drop.svg' alt='' />\r\n                        </div>\r\n                      </div>\r\n                      <div className='bg-white milestone col-start-5 col-end-10 p-4 my-4 mr-auto shadow-md relative'>\r\n                        <BsTriangleFill className='absolute text-white top-1 -left-3 transform -rotate-90' />\r\n                        <p className='leading-tight text-justify text-green text-mbl  txt-justify'>\r\n                        – Embarked on participatory Forest Management Project in Mambilla & Donga sites in Taraba State.\r\n                        </p>\r\n                      </div>\r\n                    </div>\r\n                  </div>\r\n                </div>\r\n              </SwiperSlide>\r\n\r\n\r\n              <SwiperSlide>\r\n                <div className=''>\r\n                  <div className='flex flex-col md:grid grid-cols-9 mx-auto p-2 text-blue-50'>\r\n                    <div className='flex flex-row-reverse md:contents'>\r\n                      <div className='col-start-1 col-end-3 p-4 rounded-xl my-4 ml-auto shadow-md'>\r\n                        <p className='leading-tight text-justify text-3xl font-bold text-white text-mbl  txt-justify-1em'>\r\n                        2006\r\n                        </p>\r\n                      </div>\r\n                      <div className='col-start-3 col-end-5 md:mx-auto relative mr-10'>\r\n                        <div className='h-full w-6 flex items-center justify-center'>\r\n                          <div className='h-full w-1 bg-green-800 pointer-events-none'></div>\r\n                        </div>\r\n                        <div className='w-12 h-12 flex justify-center items-center absolute top-1/3 -right-3 -mt-3 rounded-full bg-white border-4 border-green-800 shadow'>\r\n                          <img src='/assets/images/icons/drop.svg' alt='' />\r\n                        </div>\r\n                      </div>\r\n                      <div className='bg-white milestone col-start-5 col-end-10 p-4 my-4 mr-auto shadow-md relative'>\r\n                        <BsTriangleFill className='absolute text-white top-1 -left-3 transform -rotate-90' />\r\n                        <p className='leading-tight text-justify text-green text-mbl'>\r\n                        Commenced the Wing over wetlands project in Gombe & Jigawa  \r\n                        </p>\r\n                      </div>\r\n                    </div>\r\n\r\n                    <div className='flex flex-row-reverse md:contents'>\r\n                      <div className='col-start-1 col-end-3 p-4 rounded-xl my-4 ml-auto shadow-md'>\r\n                        <p className='leading-tight text-justify text-3xl font-bold text-green text-mbl  txt-justify-1em'>\r\n                        2008\r\n                        </p>\r\n                      </div>\r\n                      <div className='col-start-3 col-end-5 md:mx-auto relative mr-10'>\r\n                        <div className='h-full w-6 flex items-center justify-center'>\r\n                          <div className='h-full w-1 bg-green-800 pointer-events-none'></div>\r\n                        </div>\r\n                        <div className='w-12 h-12 flex justify-center items-center absolute top-1/3 -right-3 -mt-3 rounded-full bg-white border-4 border-green-800 shadow'>\r\n                          <img src='/assets/images/icons/drop.svg' alt='' />\r\n                        </div>\r\n                      </div>\r\n                      <div className='bg-green milestone col-start-5 col-end-10 p-4 my-4 mr-auto shadow-md relative'>\r\n                        <BsTriangleFill className='absolute text-green top-1 -left-3 transform -rotate-90' />\r\n                        <p className='leading-tight text-justify text-mbl'>\r\n                        Established the Biodiversity Action Plan Project in Edo State.\r\n                        </p>\r\n                      </div>\r\n                    </div>\r\n\r\n                    <div className='flex flex-row-reverse md:contents'>\r\n                      <div className='col-start-1 col-end-3 p-4 rounded-xl my-4 ml-auto shadow-md'>\r\n                        <p className='leading-tight text-justify text-3xl font-bold text-green text-mbl-1em'>\r\n                          2012\r\n                        </p>\r\n                      </div>\r\n                      <div className='col-start-3 col-end-5 md:mx-auto relative mr-10'>\r\n                        <div className='h-full w-6 flex items-center justify-center'>\r\n                          <div className='h-full w-1 bg-green-800 pointer-events-none'></div>\r\n                        </div>\r\n                        <div className='w-12 h-12 flex justify-center items-center absolute top-1/3 -right-3 -mt-3 rounded-full bg-white border-4 border-green-800 shadow'>\r\n                          <img src='/assets/images/icons/drop.svg' alt='' />\r\n                        </div>\r\n                      </div>\r\n                      <div className='bg-white milestone col-start-5 col-end-10 p-4 my-4 mr-auto shadow-md relative'>\r\n                        <BsTriangleFill className='absolute text-white top-1 -left-3 transform -rotate-90' />\r\n                        <p className='leading-tight text-justify text-green text-mbl  txt-justify'>\r\n                        Let the review of the National Biodiversity Strategic Action Plan. \r\n                        </p>\r\n                      </div>\r\n                    </div>\r\n                  </div>\r\n                </div>\r\n              </SwiperSlide>\r\n\r\n\r\n              <SwiperSlide>\r\n                <div className=''>\r\n                  <div className='flex flex-col md:grid grid-cols-9 mx-auto p-2 text-blue-50'>\r\n                    <div className='flex flex-row-reverse md:contents'>\r\n                      <div className='col-start-1 col-end-3 p-4 rounded-xl my-4 ml-auto shadow-md'>\r\n                        <p className='leading-tight text-justify text-3xl font-bold text-white text-mbl  txt-justify-1em'>\r\n                        2017\r\n                        </p>\r\n                      </div>\r\n                      <div className='col-start-3 col-end-5 md:mx-auto relative mr-10'>\r\n                        <div className='h-full w-6 flex items-center justify-center'>\r\n                          <div className='h-full w-1 bg-green-800 pointer-events-none'></div>\r\n                        </div>\r\n                        <div className='w-12 h-12 flex justify-center items-center absolute top-1/3 -right-3 -mt-3 rounded-full bg-white border-4 border-green-800 shadow'>\r\n                          <img src='/assets/images/icons/drop.svg' alt='' />\r\n                        </div>\r\n                      </div>\r\n                      <div className='bg-white milestone col-start-5 col-end-10 p-4 my-4 mr-auto shadow-md relative'>\r\n                        <BsTriangleFill className='absolute text-white top-1 -left-3 transform -rotate-90' />\r\n                        <p className='leading-tight text-justify text-green text-mbl'>\r\n                        Organised the first National Summit on the Green Recovery Nigeria (GRN) Initiative \r\n                        </p>\r\n                      </div>\r\n                    </div>\r\n\r\n                    <div className='flex flex-row-reverse md:contents'>\r\n                      <div className='col-start-1 col-end-3 p-4 rounded-xl my-4 ml-auto shadow-md'>\r\n                        <p className='leading-tight text-justify text-3xl font-bold text-green text-mbl  txt-justify-1em'>\r\n                        2018\r\n                        </p>\r\n                      </div>\r\n                      <div className='col-start-3 col-end-5 md:mx-auto relative mr-10'>\r\n                        <div className='h-full w-6 flex items-center justify-center'>\r\n                          <div className='h-full w-1 bg-green-800 pointer-events-none'></div>\r\n                        </div>\r\n                        <div className='w-12 h-12 flex justify-center items-center absolute top-1/3 -right-3 -mt-3 rounded-full bg-white border-4 border-green-800 shadow'>\r\n                          <img src='/assets/images/icons/drop.svg' alt='' />\r\n                        </div>\r\n                      </div>\r\n                      <div className='bg-green milestone col-start-5 col-end-10 p-4 my-4 mr-auto shadow-md relative'>\r\n                        <BsTriangleFill className='absolute text-green top-1 -left-3 transform -rotate-90' />\r\n                        <p className='leading-tight text-justify text-mbl'>\r\n                        Commenced the implementation of Biodiversity Monitory Action Plan in Niger-Delta. \r\n                        </p>\r\n                      </div>\r\n                    </div>\r\n\r\n                    <div className='flex flex-row-reverse md:contents'>\r\n                      <div className='col-start-1 col-end-3 p-4 rounded-xl my-4 ml-auto shadow-md'>\r\n                        <p className='leading-tight text-justify text-3xl font-bold text-white text-mbl-1em'>\r\n                          2020\r\n                        </p>\r\n                      </div>\r\n                      <div className='col-start-3 col-end-5 md:mx-auto relative mr-10'>\r\n                        <div className='h-full w-6 flex items-center justify-center'>\r\n                          <div className='h-full w-1 bg-green-800 pointer-events-none'></div>\r\n                        </div>\r\n                        <div className='w-12 h-12 flex justify-center items-center absolute top-1/3 -right-3 -mt-3 rounded-full bg-white border-4 border-green-800 shadow'>\r\n                          <img src='/assets/images/icons/drop.svg' alt='' />\r\n                        </div>\r\n                      </div>\r\n                      <div className='bg-white milestone col-start-5 col-end-10 p-4 my-4 mr-auto shadow-md relative'>\r\n                        <BsTriangleFill className='absolute text-white top-1 -left-3 transform -rotate-90' />\r\n                        <p className='leading-tight text-justify text-green text-mbl  txt-justify'>\r\n                        Enlisted Finima Nature Park as a Ramsar sites \r\n                        </p>\r\n                      </div>\r\n                    </div>\r\n                  </div>\r\n                </div>\r\n              </SwiperSlide>\r\n            </Swiper>\r\n          </Slider>\r\n        </div>\r\n        <img className=\"papertear2\" src='/assets/images/bg/white-bg.png' alt='' />\r\n      </div>\r\n      </div>\r\n\r\n    </div>\r\n  );\r\n}\r\n\r\nexport default Milestones;\r\n"],"sourceRoot":""}

Zerion Mini Shell 1.0