%PDF-
%PDF-
Mini Shell
Mini Shell
{"version":3,"sources":["app/layout/components/SliderBar/SliderBar.js","app/main/shop/components/ShopSideMenu.js","app/main/shop/components/slider/styles.js","app/main/shop/components/slider/Slider.js","app/main/shop/shop/index.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","Search","Input","ShopSideMenu","placeholder","size","onSearch","value","window","location","CLIENT_URL","Slider","styled","div","SwiperCore","use","Pagination","ShopDetails","name","defaultValue","precision","emptyIcon","fontSize"],"mappings":"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","file":"static/js/47.28d658c6.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 React from 'react'\r\nimport {SERVER_URL, CLIENT_URL} from '../../../config/server';\r\nimport { Input } from 'antd';\r\nconst { Search } = Input;\r\n\r\nfunction ShopSideMenu() {\r\n\r\n const onSearch = (value) => {\r\n console.log(value)\r\n // window.location.href = `${CLIENT_URL}blog/search?q=${value}`;\r\n window.location.href = `${CLIENT_URL}shop/search?q=${value}`;\r\n };\r\n\r\n\r\n return (\r\n <nav>\r\n <div className=\"\">\r\n\r\n <div className=\"p-3 mb-3 rounded\">\r\n <span className=\"pr-1 text-md text-black font-bold flex-1\">Search</span>\r\n <div className=\"pl-4 py-5\">\r\n <Search placeholder=\"Type Here\" className=\"rounded\" size=\"large\" onSearch={onSearch}/>\r\n </div>\r\n </div>\r\n\r\n\r\n <button className=\"w-full text-left flex px-4 py-2 items-center outline-none focus:outline-none\">\r\n <span className=\"pr-1 text-sm text-gray-500 font-bold uppercase flex-1\">CATEGORIES</span>\r\n \r\n </button>\r\n <div className=\"pl-4\">\r\n <a className=\"block text-sm font-medium text-gray-600 my-0 px-4 py-2\" href=\"/\">BNR</a>\r\n <a className=\"block text-sm font-medium text-gray-600 my-0 px-4 py-2\" href=\"/\">Books & Publications</a>\r\n <a className=\"block text-sm font-medium text-gray-600 my-0 px-4 py-2\" href=\"/\">Clothing</a>\r\n <a className=\"block text-sm font-medium text-gray-600 my-0 px-4 py-2\" href=\"/\">FNP</a>\r\n <a className=\"block text-sm font-medium text-gray-600 my-0 px-4 py-2\" href=\"/\">Gadgets</a>\r\n <a className=\"block text-sm font-medium text-gray-600 my-0 px-4 py-2\" href=\"/\">Gift Items</a>\r\n <a className=\"block text-sm font-medium text-gray-600 my-0 px-4 py-2\" href=\"/\">Kids</a>\r\n <a className=\"block text-sm font-medium text-gray-600 my-0 px-4 py-2\" href=\"/\">LCC</a>\r\n <a className=\"block text-sm font-medium text-gray-600 my-0 px-4 py-2\" href=\"/\">Souvenirs</a>\r\n </div>\r\n </div>\r\n \r\n </nav>\r\n )\r\n}\r\n\r\nexport default ShopSideMenu\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%, 320px);\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","\r\nimport React from \"react\";\r\nimport { Swiper, SwiperSlide } from \"swiper/react\";\r\nimport SliderContainer from \"./styles\"\r\nimport SliderBar from \"../../../../layout/components/SliderBar/SliderBar\"\r\nimport '../../../style.css'\r\nimport \"swiper/swiper.min.css\";\r\nimport \"swiper/components/pagination/pagination.min.css\"\r\n\r\nimport SwiperCore, { Pagination } from 'swiper/core';\r\n\r\nSwiperCore.use([Pagination]);\r\n\r\nfunction Slider() {\r\n return (\r\n <SliderContainer className=\"mt-6\">\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\">What have you done for the Environment Lately?</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=\"/assets/images/banner/aboutus.png\" alt=\"\" />\r\n </div>\r\n </SwiperSlide>\r\n </SliderContainer>\r\n )\r\n}\r\n\r\nexport default Slider\r\n","import React from 'react';\r\nimport ShopSlider from './../components/slider/Slider';\r\nimport { Rating } from '@material-ui/lab';\r\nimport { HiOutlineChevronLeft, HiOutlineShoppingCart } from 'react-icons/hi';\r\nimport { MdStarBorder } from 'react-icons/md';\r\nimport ShopSideMenu from '../components/ShopSideMenu';\r\n\r\nfunction ShopDetails() {\r\n return (\r\n <div>\r\n <ShopSlider />\r\n <div className='w-full md:px-8 px-4 py-8 bg-gray-100'>\r\n <div className='grid md:grid-cols-12 grid-cols-1 md:gap-x-0'>\r\n <div className='md:col-span-2 col-span-12'>\r\n <p className='text-base flex text-gray-600'>\r\n <HiOutlineChevronLeft className='mr-2' />\r\n <span>Back</span>\r\n </p>\r\n </div>\r\n <div className='md:col-span-10 col-span-12'></div>\r\n </div>\r\n </div>\r\n\r\n <div className='w-full md:px-0'>\r\n <div className='grid md:grid-cols-12 md:gap-x-0 gap-y-2'>\r\n <aside className='md:col-span-2 col-span-12 min-h-screen py-4 border-0 border-r border-solid border-gray-200'>\r\n <ShopSideMenu />\r\n </aside>\r\n <div className='md:col-span-10 col-span-12 p-4'>\r\n <div className='grid md:grid-cols-1 grid-cols-1 md:gap-x-8 gap-y-8'>\r\n <div className='max-w-md w-full lg:max-w-full lg:flex shadow-md'>\r\n <div className=''>\r\n <img src='/assets/images/products/binocular.png' alt='' />\r\n\r\n <div className='grid grid-cols-2 gap-2'>\r\n <div className='flex justify-center items-center'>\r\n <img\r\n className='w-32'\r\n src='/assets/images/products/binocular.png'\r\n alt=''\r\n />\r\n </div>\r\n <div className='flex justify-center items-center'>\r\n <img\r\n className='w-32'\r\n src='/assets/images/products/binocular.png'\r\n alt=''\r\n />\r\n </div>\r\n </div>\r\n </div>\r\n <div className='bg-white rounded-b lg:rounded-b-none lg:rounded-r p-4 flex flex-col leading-normal'>\r\n <div className='mb-4'>\r\n <div className='text-gray-900 font-bold text-xl mb-2'>\r\n Birding Binocular\r\n </div>\r\n <div className='text-gray-600 text-sm mb-2'>\r\n Olympus 8×42 pro Binocular with Extra-low dispersion (ED)\r\n glass.\r\n </div>\r\n <Rating\r\n name='customized-empty'\r\n className='mb-2'\r\n defaultValue={2}\r\n precision={0.5}\r\n size='smalls'\r\n emptyIcon={<MdStarBorder fontSize='inherit' />}\r\n />\r\n\r\n <p className='text-gray-800 font-bold text-sm mb-2'>\r\n ₦ 131,250 Inc. VAT\r\n </p>\r\n <p className='text-gray-400 text-sm line-through mb-4'>\r\n ₦ 157,500\r\n </p>\r\n <p className='text-gray-800 italic text-sm mb-4'>\r\n 2 in stock\r\n </p>\r\n </div>\r\n\r\n <button className='bg-green flex items-center justify-center hover:bg-green-800 text-white font-bold py-2 px-6'>\r\n <HiOutlineShoppingCart size='24' className='mr-2' />\r\n <span className='flex'>Add to Cart</span>\r\n </button>\r\n </div>\r\n </div>\r\n\r\n <div className='flex items-center'>\r\n <div className='inline-flex'>\r\n <button className='bg-green hover:bg-green-800 text-white font-bold py-2 px-4 rounded-l'>\r\n Description\r\n </button>\r\n <button className='bg-gray-100 hover:bg-gray-200 text-gray-800 font-bold py-2 px-4 rounded-r'>\r\n Reviews\r\n </button>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n );\r\n}\r\n\r\nexport default ShopDetails;\r\n"],"sourceRoot":""}
Zerion Mini Shell 1.0