├── public ├── favicon.ico ├── logo192.png ├── logo512.png ├── robots.txt ├── manifest.json └── index.html ├── src ├── components │ ├── Body │ │ ├── Body.module.css │ │ └── Body.jsx │ ├── Footer │ │ ├── Footer.module.css │ │ └── Footer.jsx │ ├── header │ │ ├── Header.module.css │ │ └── Header.jsx │ ├── Layout │ │ └── Layout.jsx │ ├── Builder │ │ ├── Totalprice │ │ │ ├── Totalprice.module.css │ │ │ └── Totalprice.jsx │ │ ├── Builder.module.css │ │ ├── Items │ │ │ ├── Items.jsx │ │ │ └── item │ │ │ │ ├── Item.module.css │ │ │ │ └── Item.jsx │ │ └── Builder.jsx │ ├── IceCream │ │ ├── Scoop │ │ │ ├── Scoop.jsx │ │ │ └── Scoop.module.css │ │ ├── IceCream.jsx │ │ └── IceCream.module.css │ └── Modal │ │ ├── Modal.jsx │ │ └── Modal.module.css ├── assets │ └── images │ │ ├── cherry.png │ │ ├── react.svg │ │ └── logo.svg ├── container │ └── IceCreamBuilder │ │ ├── IceCreamBuilder.module.css │ │ └── IceCreamBuilder.jsx ├── setupTests.js ├── App.test.js ├── index.css ├── reportWebVitals.js ├── App.jsx ├── index.js └── App.css ├── README.md ├── .gitignore └── package.json /public/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/masud-pervez/Ice-Cream/HEAD/public/favicon.ico -------------------------------------------------------------------------------- /public/logo192.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/masud-pervez/Ice-Cream/HEAD/public/logo192.png -------------------------------------------------------------------------------- /public/logo512.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/masud-pervez/Ice-Cream/HEAD/public/logo512.png -------------------------------------------------------------------------------- /public/robots.txt: -------------------------------------------------------------------------------- 1 | # https://www.robotstxt.org/robotstxt.html 2 | User-agent: * 3 | Disallow: 4 | -------------------------------------------------------------------------------- /src/components/Body/Body.module.css: -------------------------------------------------------------------------------- 1 | .mainBody { 2 | margin: 0; 3 | width: 100%; 4 | height: 100%; 5 | } 6 | -------------------------------------------------------------------------------- /src/assets/images/cherry.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/masud-pervez/Ice-Cream/HEAD/src/assets/images/cherry.png -------------------------------------------------------------------------------- /src/components/Footer/Footer.module.css: -------------------------------------------------------------------------------- 1 | .container { 2 | border-bottom: 0px !important; 3 | padding-top: 0px; 4 | color: #616163; 5 | } 6 | 7 | -------------------------------------------------------------------------------- /src/components/header/Header.module.css: -------------------------------------------------------------------------------- 1 | /* header */ 2 | .logo { 3 | width: 60px; 4 | } 5 | 6 | .reactLogo { 7 | height: 60px; 8 | vertical-align: middle; 9 | } -------------------------------------------------------------------------------- /src/container/IceCreamBuilder/IceCreamBuilder.module.css: -------------------------------------------------------------------------------- 1 | @media only screen and (max-width: 767.99px) { 2 | .container { 3 | flex-direction: column; 4 | } 5 | } -------------------------------------------------------------------------------- /src/components/Layout/Layout.jsx: -------------------------------------------------------------------------------- 1 | import React from 'react' 2 | 3 | const Layout = ({ children }) => { 4 | return
{children}
; 5 | } 6 | 7 | export default Layout -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | In the project directory, you can run: 2 | 3 | ### `npm start` 4 | 5 | Runs the app in the development mode.\ 6 | Open [http://localhost:3000](http://localhost:3000) to view it in your browser. 7 | -------------------------------------------------------------------------------- /src/components/Builder/Totalprice/Totalprice.module.css: -------------------------------------------------------------------------------- 1 | .total { 2 | border-top: 1px solid #5250507e; 3 | padding: 10px; 4 | display: flex; 5 | justify-content: space-between; 6 | align-items: center; 7 | font-weight: bold; 8 | width: 100%; 9 | } -------------------------------------------------------------------------------- /src/setupTests.js: -------------------------------------------------------------------------------- 1 | // jest-dom adds custom jest matchers for asserting on DOM nodes. 2 | // allows you to do things like: 3 | // expect(element).toHaveTextContent(/react/i) 4 | // learn more: https://github.com/testing-library/jest-dom 5 | import '@testing-library/jest-dom'; 6 | -------------------------------------------------------------------------------- /src/App.test.js: -------------------------------------------------------------------------------- 1 | import { render, screen } from '@testing-library/react'; 2 | import App from './App'; 3 | 4 | test('renders learn react link', () => { 5 | render(); 6 | const linkElement = screen.getByText(/learn react/i); 7 | expect(linkElement).toBeInTheDocument(); 8 | }); 9 | -------------------------------------------------------------------------------- /src/components/IceCream/Scoop/Scoop.jsx: -------------------------------------------------------------------------------- 1 | import React from 'react' 2 | import classes from "./Scoop.module.css" 3 | 4 | 5 | const Scoop = ({ scoop }) => { 6 | return ( 7 |
8 | ) 9 | } 10 | 11 | export default Scoop; -------------------------------------------------------------------------------- /src/components/Body/Body.jsx: -------------------------------------------------------------------------------- 1 | import React from 'react' 2 | import classes from "./Body.module.css" 3 | import IceCreamBuilder from '../../container/IceCreamBuilder/IceCreamBuilder' 4 | 5 | const Body = () => { 6 | return ( 7 |
8 | 9 |
10 | ) 11 | } 12 | 13 | export default Body -------------------------------------------------------------------------------- /src/components/Modal/Modal.jsx: -------------------------------------------------------------------------------- 1 | import React from 'react' 2 | import classes from "./Modal.module.css" 3 | 4 | const Modal = ({ children }) => { 5 | return ( 6 |
7 |
8 |
9 | {children} 10 |
11 |
12 | ) 13 | } 14 | 15 | export default Modal -------------------------------------------------------------------------------- /src/components/Builder/Totalprice/Totalprice.jsx: -------------------------------------------------------------------------------- 1 | import React from "react"; 2 | import classes from "./Totalprice.module.css" 3 | 4 | const Totalprice = ({price = 0}) => { 5 | return ( 6 |
7 |
Total Price
8 |
{price.toFixed(2)} TK
9 |
10 | ); 11 | }; 12 | 13 | export default Totalprice; 14 | -------------------------------------------------------------------------------- /.gitignore: -------------------------------------------------------------------------------- 1 | # See https://help.github.com/articles/ignoring-files/ for more about ignoring files. 2 | 3 | # dependencies 4 | /node_modules 5 | /.pnp 6 | .pnp.js 7 | 8 | # testing 9 | /coverage 10 | 11 | # production 12 | /build 13 | 14 | # misc 15 | .DS_Store 16 | .env.local 17 | .env.development.local 18 | .env.test.local 19 | .env.production.local 20 | 21 | npm-debug.log* 22 | yarn-debug.log* 23 | yarn-error.log* 24 | -------------------------------------------------------------------------------- /src/index.css: -------------------------------------------------------------------------------- 1 | body { 2 | margin: 0; 3 | font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen', 4 | 'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue', 5 | sans-serif; 6 | -webkit-font-smoothing: antialiased; 7 | -moz-osx-font-smoothing: grayscale; 8 | } 9 | 10 | code { 11 | font-family: source-code-pro, Menlo, Monaco, Consolas, 'Courier New', 12 | monospace; 13 | } 14 | -------------------------------------------------------------------------------- /src/reportWebVitals.js: -------------------------------------------------------------------------------- 1 | const reportWebVitals = onPerfEntry => { 2 | if (onPerfEntry && onPerfEntry instanceof Function) { 3 | import('web-vitals').then(({ getCLS, getFID, getFCP, getLCP, getTTFB }) => { 4 | getCLS(onPerfEntry); 5 | getFID(onPerfEntry); 6 | getFCP(onPerfEntry); 7 | getLCP(onPerfEntry); 8 | getTTFB(onPerfEntry); 9 | }); 10 | } 11 | }; 12 | 13 | export default reportWebVitals; 14 | -------------------------------------------------------------------------------- /src/components/Builder/Builder.module.css: -------------------------------------------------------------------------------- 1 | /* builder */ 2 | .builder { 3 | padding: 20px; 4 | background: #fff; 5 | border: 1px solid #dddfe2; 6 | border-radius: 3px; 7 | } 8 | 9 | .order { 10 | background-color: #28a745; 11 | color: #fff; 12 | border-color: #28a745; 13 | border: 1px solid transparent; 14 | display: block; 15 | margin: 30px auto 0; 16 | width: 100%; 17 | padding: 10px 0; 18 | font-weight: bold; 19 | } -------------------------------------------------------------------------------- /src/App.jsx: -------------------------------------------------------------------------------- 1 | import "bootstrap/dist/css/bootstrap.min.css"; 2 | import "./App.css" 3 | import Layout from "./components/Layout/Layout"; 4 | import Header from "./components/header/Header" 5 | import Body from "./components/Body/Body" 6 | import Footer from "./components/Footer/Footer" 7 | 8 | 9 | function App() { 10 | return( 11 | 12 |
13 | 14 |