├── src ├── App.css ├── pages │ ├── Join │ │ └── join.css │ ├── Login │ │ ├── login.css │ │ └── Login.jsx │ ├── HealthyLiving │ │ ├── healthLiving.css │ │ ├── SingleArticle.jsx │ │ ├── Card.jsx │ │ ├── CardContainer.jsx │ │ └── HealthLiving.jsx │ ├── Workouts │ │ ├── CustomWorkout │ │ │ ├── Slider.css │ │ │ ├── CustomWorkout.css │ │ │ ├── Slide.jsx │ │ │ └── CustomWorkout.jsx │ │ ├── REDUX │ │ │ ├── workout.types.js │ │ │ ├── workout.action.js │ │ │ └── workout.reducer.js │ │ ├── Hovering.jsx │ │ ├── Paginate.css │ │ ├── Calender1.jsx │ │ ├── Calender.jsx │ │ ├── Paginate.jsx │ │ ├── WorkoutSingle.jsx │ │ ├── Workout.css │ │ ├── WorkoutVideos.jsx │ │ └── WorkSingleVideo.jsx │ ├── Program │ │ ├── Plans.css │ │ ├── Card.jsx │ │ ├── MealPlans.jsx │ │ ├── Plans.jsx │ │ ├── SlideCard.jsx │ │ ├── Pilot.jsx │ │ ├── PilotSingle.jsx │ │ ├── SinglePage.jsx │ │ ├── MealSingle.jsx │ │ └── Routines.jsx │ ├── membership │ │ └── Membership.jsx │ ├── Home │ │ └── UserAvatar.jsx │ ├── OrderSuccess │ │ └── OrderSuccess.jsx │ ├── AboutY │ │ ├── style.css │ │ └── AboutSlide.jsx │ ├── about │ │ ├── Careers.css │ │ ├── Careers.jsx │ │ ├── About.jsx │ │ └── about.css │ ├── Payment │ │ └── Payment.jsx │ ├── checkout │ │ └── Checkout.jsx │ └── Shop │ │ └── Shop.jsx ├── store │ ├── App │ │ ├── app.actions.js │ │ ├── app.actionTypes.js │ │ └── app.reducer.js │ ├── Auth │ │ ├── auth.actions.js │ │ ├── auth.actionTypes.js │ │ └── auth.reducer.js │ ├── Cart │ │ ├── CartType.js │ │ ├── CartAction.js │ │ └── reducer.js │ ├── shop │ │ ├── actiontype.js │ │ ├── action.js │ │ └── reducer.js │ ├── workout │ │ ├── work.types.js │ │ ├── work.action.js │ │ └── work.reducers.js │ └── store.js ├── assets │ ├── about.png │ ├── blog.png │ ├── logo.png │ ├── careers.png │ ├── our-team.png │ ├── routines.png │ ├── Tutorials.png │ ├── community.png │ ├── meal-plans.png │ ├── whats-new.png │ ├── custom-workouts.png │ ├── expert-articles.png │ ├── healthy-recipes.png │ ├── pilot-programs.png │ ├── wellness-videos.png │ ├── workout-videos.png │ ├── workout-programs.png │ └── _healthy_recipes-720.webp ├── components │ ├── Membership │ │ ├── memberShipJoin │ │ │ ├── MembershipJoin.jsx │ │ │ └── Card.jsx │ │ ├── Banner.jsx │ │ ├── Passes.jsx │ │ └── Features.jsx │ ├── Checkout │ │ ├── CartItem.jsx │ │ ├── BillingForm.jsx │ │ └── ReviewOrder.jsx │ ├── Admin │ │ └── AdminHome.jsx │ ├── cart │ │ └── EmptyCart.jsx │ └── Footer │ │ └── Footer.jsx ├── Routes │ ├── PrivateRoute.jsx │ └── AllRoutes.jsx ├── index.css ├── App.jsx ├── firebase.js ├── main.jsx └── context │ └── UserAuthContext.jsx ├── dist ├── assets │ ├── about.6c8c041a.png │ ├── logo.4adfbe3c.png │ ├── custom-workouts.bce24dfb.png │ ├── expert-articles.1bdcc77e.png │ └── pilot-programs.6c0e6503.png ├── index.html └── vite.svg ├── vite.config.js ├── .gitignore ├── index.html ├── package.json ├── public └── vite.svg └── README.md /src/App.css: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /src/pages/Join/join.css: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /src/pages/Login/login.css: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /src/store/App/app.actions.js: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /src/store/App/app.actionTypes.js: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /src/store/Auth/auth.actions.js: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /src/store/Auth/auth.actionTypes.js: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /src/pages/HealthyLiving/healthLiving.css: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /src/pages/Workouts/CustomWorkout/Slider.css: -------------------------------------------------------------------------------- 1 | .text :hover{ 2 | border: 1px solid white; 3 | 4 | } -------------------------------------------------------------------------------- /src/assets/about.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gaurav78528/sparta-fitness-club/HEAD/src/assets/about.png -------------------------------------------------------------------------------- /src/assets/blog.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gaurav78528/sparta-fitness-club/HEAD/src/assets/blog.png -------------------------------------------------------------------------------- /src/assets/logo.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gaurav78528/sparta-fitness-club/HEAD/src/assets/logo.png -------------------------------------------------------------------------------- /src/assets/careers.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gaurav78528/sparta-fitness-club/HEAD/src/assets/careers.png -------------------------------------------------------------------------------- /src/assets/our-team.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gaurav78528/sparta-fitness-club/HEAD/src/assets/our-team.png -------------------------------------------------------------------------------- /src/assets/routines.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gaurav78528/sparta-fitness-club/HEAD/src/assets/routines.png -------------------------------------------------------------------------------- /src/assets/Tutorials.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gaurav78528/sparta-fitness-club/HEAD/src/assets/Tutorials.png -------------------------------------------------------------------------------- /src/assets/community.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gaurav78528/sparta-fitness-club/HEAD/src/assets/community.png -------------------------------------------------------------------------------- /src/assets/meal-plans.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gaurav78528/sparta-fitness-club/HEAD/src/assets/meal-plans.png -------------------------------------------------------------------------------- /src/assets/whats-new.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gaurav78528/sparta-fitness-club/HEAD/src/assets/whats-new.png -------------------------------------------------------------------------------- /dist/assets/about.6c8c041a.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gaurav78528/sparta-fitness-club/HEAD/dist/assets/about.6c8c041a.png -------------------------------------------------------------------------------- /dist/assets/logo.4adfbe3c.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gaurav78528/sparta-fitness-club/HEAD/dist/assets/logo.4adfbe3c.png -------------------------------------------------------------------------------- /src/assets/custom-workouts.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gaurav78528/sparta-fitness-club/HEAD/src/assets/custom-workouts.png -------------------------------------------------------------------------------- /src/assets/expert-articles.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gaurav78528/sparta-fitness-club/HEAD/src/assets/expert-articles.png -------------------------------------------------------------------------------- /src/assets/healthy-recipes.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gaurav78528/sparta-fitness-club/HEAD/src/assets/healthy-recipes.png -------------------------------------------------------------------------------- /src/assets/pilot-programs.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gaurav78528/sparta-fitness-club/HEAD/src/assets/pilot-programs.png -------------------------------------------------------------------------------- /src/assets/wellness-videos.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gaurav78528/sparta-fitness-club/HEAD/src/assets/wellness-videos.png -------------------------------------------------------------------------------- /src/assets/workout-videos.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gaurav78528/sparta-fitness-club/HEAD/src/assets/workout-videos.png -------------------------------------------------------------------------------- /src/assets/workout-programs.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gaurav78528/sparta-fitness-club/HEAD/src/assets/workout-programs.png -------------------------------------------------------------------------------- /dist/assets/custom-workouts.bce24dfb.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gaurav78528/sparta-fitness-club/HEAD/dist/assets/custom-workouts.bce24dfb.png -------------------------------------------------------------------------------- /dist/assets/expert-articles.1bdcc77e.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gaurav78528/sparta-fitness-club/HEAD/dist/assets/expert-articles.1bdcc77e.png -------------------------------------------------------------------------------- /dist/assets/pilot-programs.6c0e6503.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gaurav78528/sparta-fitness-club/HEAD/dist/assets/pilot-programs.6c0e6503.png -------------------------------------------------------------------------------- /src/assets/_healthy_recipes-720.webp: -------------------------------------------------------------------------------- 1 | [InternetShortcut] 2 | URL=https://github.com/HimanshuSingh1407/just-books-7908-Fitness-center/blob/main/frontend/fitness-center/src/Components/homepage/HomePageAssets/_healthy_recipes-720.webp 3 | -------------------------------------------------------------------------------- /src/store/Cart/CartType.js: -------------------------------------------------------------------------------- 1 | // export const ADD_DATA ="get/gift/loading"; 2 | export const Cart_Update = "cartupdate"; 3 | export const cart_length = "cartlength"; 4 | export const cart_Delete = "delete"; 5 | export const EMPTY_CART = "empty"; 6 | -------------------------------------------------------------------------------- /src/store/App/app.reducer.js: -------------------------------------------------------------------------------- 1 | const init = { 2 | isLoading: false, 3 | isError: false, 4 | appData: [], 5 | }; 6 | 7 | export const reducer = (state = init, { type, payload }) => { 8 | switch (type) { 9 | default: 10 | return state; 11 | } 12 | }; 13 | -------------------------------------------------------------------------------- /vite.config.js: -------------------------------------------------------------------------------- 1 | import { defineConfig } from "vite"; 2 | import react from "@vitejs/plugin-react"; 3 | 4 | // https://vitejs.dev/config/ 5 | export default defineConfig({ 6 | plugins: [react()], 7 | build: { 8 | chunkSizeWarningLimit: 1600, 9 | }, 10 | }); 11 | -------------------------------------------------------------------------------- /src/store/Auth/auth.reducer.js: -------------------------------------------------------------------------------- 1 | const init = { 2 | isLoading: false, 3 | isError: false, 4 | isAuth: false, 5 | token: localStorage.getItem("token") || undefined, 6 | }; 7 | 8 | export const reducer = (state = init, { type, payload }) => { 9 | switch (type) { 10 | default: 11 | return state; 12 | } 13 | }; 14 | -------------------------------------------------------------------------------- /src/pages/Workouts/REDUX/workout.types.js: -------------------------------------------------------------------------------- 1 | 2 | export const FETCH_POST_REQUEST = 'FETCH_POST_REQUEST'; 3 | export const FETCH_POST_SUCCESS = 'FETCH_POST_SUCCESS'; 4 | export const FETCH_POST_FAILED = 'FETCH_POST_FAILED'; 5 | export const SEARCH_POSTS = 'SEARCH_POSTS'; 6 | export const SORT_POSTS_ASC = 'SORT_POSTS_ASC'; 7 | export const SORT_POSTS_DESC = 'SORT_POSTS_DESC'; -------------------------------------------------------------------------------- /src/store/shop/actiontype.js: -------------------------------------------------------------------------------- 1 | export const GET_GIFT_LOADING ="get/gift/loading"; 2 | export const GET_GIFT_SUCCESS ="get/gift/success"; 3 | export const GET_GIFT_FAILURE ="get/gift/failure"; 4 | 5 | export const GET_PASSES_LOADING ="get/passes/loading"; 6 | export const GET_PASSES_SUCCESS ="get/passes/success"; 7 | export const GET_PASSES_FAILURE ="get/passes/failure"; -------------------------------------------------------------------------------- /src/pages/Program/Plans.css: -------------------------------------------------------------------------------- 1 | .hov{ 2 | box-shadow: rgba(100, 100, 111, 0.2) 0px 7px 29px 0px; 3 | } 4 | .hov:hover{ 5 | box-shadow: #4296cb 0px 3px 8px; 6 | box-shadow: #4296cb 0px 1px 4px, #4296cb 0px 0px 0px 3px; 7 | box-shadow: rgba(3, 102, 214, 0.3) 0px 0px 0px 3px; 8 | box-shadow: #4296cb 6px 2px 16px 0px, #4296cb -6px -2px 16px 0px; 9 | 10 | } 11 | -------------------------------------------------------------------------------- /src/components/Membership/memberShipJoin/MembershipJoin.jsx: -------------------------------------------------------------------------------- 1 | import React from "react"; 2 | import { Box } from "@chakra-ui/react"; 3 | import Card from "./Card"; 4 | 5 | const MembershipJoin = () => { 6 | return ( 7 | 8 | 9 | 10 | 11 | 12 | ); 13 | }; 14 | 15 | export default MembershipJoin; 16 | -------------------------------------------------------------------------------- /src/Routes/PrivateRoute.jsx: -------------------------------------------------------------------------------- 1 | import React from "react"; 2 | import { Navigate } from "react-router-dom"; 3 | import { useUserAuth } from "../context/UserAuthContext"; 4 | 5 | const PrivateRoute = ({ children }) => { 6 | let { user } = useUserAuth(); 7 | 8 | if (!user) { 9 | return ; 10 | } 11 | return children; 12 | }; 13 | 14 | export default PrivateRoute; 15 | -------------------------------------------------------------------------------- /src/index.css: -------------------------------------------------------------------------------- 1 | * { 2 | margin: 0; 3 | padding: 0; 4 | box-sizing: border-box; 5 | } 6 | ::-webkit-scrollbar { 7 | width: 10px; 8 | } 9 | 10 | ::-webkit-scrollbar-track { 11 | box-shadow: inset 0 0 5px grey; 12 | border-radius: 10px; 13 | } 14 | 15 | ::-webkit-scrollbar-thumb { 16 | background: grey; 17 | border-radius: 10px; 18 | } 19 | 20 | ::-webkit-scrollbar-thumb:hover { 21 | background: rgb(92, 91, 91); 22 | } 23 | -------------------------------------------------------------------------------- /src/pages/Workouts/Hovering.jsx: -------------------------------------------------------------------------------- 1 | import React from 'react' 2 | import { Box } from '@chakra-ui/react'; 3 | import { 4 | MinusIcon 5 | } from "@chakra-ui/icons"; 6 | const Hovering = () => { 7 | return ( 8 |
9 | 10 | 11 | 12 |
13 | ) 14 | } 15 | 16 | export default Hovering; -------------------------------------------------------------------------------- /.gitignore: -------------------------------------------------------------------------------- 1 | # See https://help.github.com/articles/ignoring-files/ for more about ignoring files. 2 | 3 | # dependencies 4 | /node_modules 5 | package-lock.json 6 | /.pnp 7 | .pnp.js 8 | 9 | # testing 10 | /coverage 11 | 12 | # production 13 | /build 14 | 15 | # misc 16 | .DS_Store 17 | .env.local 18 | .env.development.local 19 | .env.test.local 20 | .env.production.local 21 | 22 | npm-debug.log* 23 | yarn-debug.log* 24 | yarn-error.log* 25 | .vercel 26 | -------------------------------------------------------------------------------- /src/store/Cart/CartAction.js: -------------------------------------------------------------------------------- 1 | import * as types from "./CartType"; 2 | export const getCart = (payload) => { 3 | return { type: types.Cart_Update, payload }; 4 | }; 5 | 6 | export const cart_length_fn = () => { 7 | return { type: types.cart_length }; 8 | }; 9 | 10 | export const deletecart = (id) => { 11 | return { type: types.cart_Delete, payload: id }; 12 | }; 13 | 14 | export const empty_cart = () => { 15 | return { type: types.EMPTY_CART }; 16 | }; 17 | -------------------------------------------------------------------------------- /src/App.jsx: -------------------------------------------------------------------------------- 1 | import { useSelector } from "react-redux"; 2 | import Navbar from "./components/Navbar/Navbar"; 3 | import AllRoutes from "./Routes/AllRoutes"; 4 | import Footer from "./components/Footer/Footer"; 5 | function App() { 6 | const { appData } = useSelector((store) => store.app); 7 | // console.log(appData); 8 | return ( 9 |
10 | 11 | 12 |
13 |
14 | ); 15 | } 16 | 17 | export default App; 18 | -------------------------------------------------------------------------------- /src/pages/HealthyLiving/SingleArticle.jsx: -------------------------------------------------------------------------------- 1 | import React, { useState } from "react"; 2 | 3 | const SingleArticle = () => { 4 | const { id } = useParams(); 5 | const [article, setArticle] = useState({}); 6 | 7 | useEffect(() => { 8 | getData(`https://sparta-fitness-database.vercel.app/articles/${cat}/${id}`).then( 9 | (res) => setArticle(res) 10 | //console.log(res) 11 | ); 12 | }, [id]); 13 | return
SingleArticle
; 14 | }; 15 | 16 | export default SingleArticle; 17 | -------------------------------------------------------------------------------- /src/store/workout/work.types.js: -------------------------------------------------------------------------------- 1 | export const GET_PRODUCT_LOADING = "product/loading" 2 | export const GET_PRODUCT_SUCCESS = "product/success" 3 | export const GET_PRODUCT_ERROR = "product/error" 4 | 5 | 6 | export const GET_MEAL_LOADING = "meal/loading" 7 | export const GET_MEAL_SUCCESS = "meal/success" 8 | export const GET_MEAL_ERROR = "meal/error" 9 | 10 | export const GET_PILOT_LOADING = "pilot/loading" 11 | export const GET_PILOT_SUCCESS = "pilot/success" 12 | export const GET_PILOT_ERROR = "pilot/error" 13 | -------------------------------------------------------------------------------- /src/pages/Workouts/CustomWorkout/CustomWorkout.css: -------------------------------------------------------------------------------- 1 | /* .Cwork{ 2 | width: 100%; 3 | height: 550px; 4 | margin: auto; 5 | background-image: url('https://cloudfront.fitnessblender.com/assets/img/fbplus/fingerprint.jpg'); 6 | background-repeat: no-repeat; 7 | background-size: cover; 8 | background-position: center center; 9 | font-family: "Maison Neue","Helvetica Neue",Helvetica,Arial,"Lucida Grande",sans-serif; 10 | color: #fff; 11 | font-weight: 400; 12 | padding-top: 170px; 13 | } */ -------------------------------------------------------------------------------- /src/components/Checkout/CartItem.jsx: -------------------------------------------------------------------------------- 1 | import { Flex, Heading } from "@chakra-ui/react"; 2 | import React from "react"; 3 | 4 | const CartItem = ({ desc, price }) => { 5 | return ( 6 | 13 | 14 | hello 15 | 16 | 17 | $3434 18 | 19 | 20 | ); 21 | }; 22 | 23 | export default CartItem; 24 | -------------------------------------------------------------------------------- /src/firebase.js: -------------------------------------------------------------------------------- 1 | import { initializeApp } from "firebase/app"; 2 | import {getAuth} from "firebase/auth" 3 | const firebaseConfig = { 4 | apiKey: "AIzaSyATOnsvfNsYy611vxUl-BFo7etmSivBUtU", 5 | authDomain: "sparta-fitness-club.firebaseapp.com", 6 | projectId: "sparta-fitness-club", 7 | storageBucket: "sparta-fitness-club.appspot.com", 8 | messagingSenderId: "875242413242", 9 | appId: "1:875242413242:web:3be6bd241fe7b1a0537683", 10 | measurementId: "G-VT2R8M7LBB", 11 | }; 12 | 13 | //Initialize Firebase 14 | 15 | const app = initializeApp(firebaseConfig); 16 | export const auth= getAuth(app) 17 | export default app 18 | 19 | -------------------------------------------------------------------------------- /src/pages/Workouts/Paginate.css: -------------------------------------------------------------------------------- 1 | .pagination{ 2 | 3 | color: black; 4 | font-size: 20px; 5 | margin: auto; 6 | margin-top: 20px; 7 | margin-bottom: 20px; 8 | display: flex; 9 | justify-content: space-between; 10 | list-style: none; 11 | text-align: center; 12 | 13 | } 14 | .pagination li{ 15 | height: 30px; 16 | width: 30px; 17 | padding: 5px; 18 | padding-bottom: 3px; 19 | text-align: center; 20 | } 21 | .pagination li:hover{ 22 | color: blue; 23 | font-size: 25px; 24 | font-weight: bold; 25 | 26 | 27 | } 28 | .pagination li :active{ 29 | color: rgb(156, 3, 161); 30 | } -------------------------------------------------------------------------------- /src/pages/Workouts/Calender1.jsx: -------------------------------------------------------------------------------- 1 | import React from "react"; 2 | import { useState } from "react"; 3 | import Calendar from "react-calendar"; 4 | import "react-calendar/dist/Calendar.css"; 5 | 6 | const Calender1 = () => { 7 | const [date, setDate] = useState(new Date()); 8 | return ( 9 |
10 |

Calendar

11 |
12 | 13 |
14 |

15 | Selected Date: {date.toDateString()} 16 |

17 |
18 | ); 19 | }; 20 | 21 | export default Calender1; 22 | -------------------------------------------------------------------------------- /src/pages/membership/Membership.jsx: -------------------------------------------------------------------------------- 1 | import { Stack } from "@chakra-ui/react"; 2 | import React, { useEffect } from "react"; 3 | import Banner from "../../components/Membership/Banner"; 4 | import Features from "../../components/Membership/Features"; 5 | import MembershipJoin from "../../components/Membership/memberShipJoin/MembershipJoin"; 6 | import Passes from "../../components/Membership/Passes"; 7 | 8 | const MemberShip = () => { 9 | useEffect(() => { 10 | document.title = "Membership"; 11 | }, []); 12 | 13 | return ( 14 | 15 | 16 | 17 | 18 | 19 | 20 | ); 21 | }; 22 | 23 | export default MemberShip; 24 | -------------------------------------------------------------------------------- /index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12 | Fitness Blender 13 | 14 | 15 | 16 |
17 | 18 | 19 | 20 | -------------------------------------------------------------------------------- /src/pages/Home/UserAvatar.jsx: -------------------------------------------------------------------------------- 1 | import { Avatar, Wrap, WrapItem } from "@chakra-ui/react"; 2 | import React from "react"; 3 | import { useUserAuth } from "../../context/UserAuthContext"; 4 | 5 | const UserAvatar = ({size}) => { 6 | const { user } = useUserAuth(); 7 | return ( 8 | 9 | 10 | {" "} 19 | 20 | 21 | ); 22 | }; 23 | 24 | export default UserAvatar; 25 | -------------------------------------------------------------------------------- /src/main.jsx: -------------------------------------------------------------------------------- 1 | import { ChakraProvider } from "@chakra-ui/react"; 2 | import React from "react"; 3 | import ReactDOM from "react-dom/client"; 4 | import { Provider as ReduxProvider } from "react-redux"; 5 | import { BrowserRouter } from "react-router-dom"; 6 | import App from "./App"; 7 | import { UserAuthContextProvider } from "./context/UserAuthContext"; 8 | import "./index.css"; 9 | import { store } from "./store/store"; 10 | 11 | ReactDOM.createRoot(document.getElementById("root")).render( 12 | 13 | 14 | 15 | 16 | 17 | 18 | 19 | 20 | 21 | ); 22 | -------------------------------------------------------------------------------- /dist/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12 | Fitness Blender 13 | 14 | 15 | 16 | 17 | 18 |
19 | 20 | 21 | 22 | -------------------------------------------------------------------------------- /src/pages/Workouts/Calender.jsx: -------------------------------------------------------------------------------- 1 | import { 2 | Popover, 3 | PopoverTrigger, 4 | PopoverContent, 5 | PopoverHeader, 6 | PopoverBody, 7 | PopoverFooter, 8 | PopoverArrow, 9 | PopoverCloseButton, 10 | PopoverAnchor, 11 | Button 12 | } from '@chakra-ui/react'; 13 | import React from 'react' 14 | import { CalendarIcon} from '@chakra-ui/icons' 15 | import { Icon } from '@chakra-ui/react' 16 | import Calender1 from './Calender1'; 17 | export const Calender = () => { 18 | return ( 19 |
20 | 21 | 22 | 23 | 24 | 25 | 26 | {/* Confirmation! */} 27 | 28 | 29 |
30 | ) 31 | } 32 | -------------------------------------------------------------------------------- /src/store/shop/action.js: -------------------------------------------------------------------------------- 1 | import axios from "axios"; 2 | import * as type from "./actionType"; 3 | 4 | export const getAllgift = () => (dispatch) => { 5 | dispatch({ type: type.GET_GIFT_LOADING }); 6 | return axios 7 | .get("https://sparta-fitness-database.vercel.app/gift") 8 | .then((res) => { 9 | // console.log(res.data); 10 | dispatch({ type: type.GET_GIFT_SUCCESS, payload: res.data }); 11 | }) 12 | 13 | .catch((err) => { 14 | dispatch({ type: type.GET_GIFT_FAILURE }); 15 | }); 16 | }; 17 | 18 | export const getAllpassess = () => (dispatch) => { 19 | dispatch({ type: type.GET_PASSES_LOADING }); 20 | return axios 21 | .get("https://sparta-fitness-database.vercel.app/passes") 22 | .then((res) => { 23 | // console.log(res.data); 24 | dispatch({ type: type.GET_PASSES_SUCCESS, payload: res.data }); 25 | }) 26 | 27 | .catch((err) => { 28 | dispatch({ type: type.GET_PASSES_FAILURE }); 29 | }); 30 | }; 31 | -------------------------------------------------------------------------------- /src/pages/OrderSuccess/OrderSuccess.jsx: -------------------------------------------------------------------------------- 1 | import { Box, Button, Heading, Text } from "@chakra-ui/react"; 2 | import { CheckCircleIcon } from "@chakra-ui/icons"; 3 | import { Link, useNavigate } from "react-router-dom"; 4 | import { BiChevronRight } from "react-icons/bi"; 5 | const OrderSuccess = () => { 6 | const navigate = useNavigate(); 7 | return ( 8 | 9 | 10 | 11 | Your Order Has Been Placed. 12 | 13 | 14 | Thank You for Shopping With Us 15 | 16 | 25 | 26 | ); 27 | }; 28 | 29 | export default OrderSuccess; 30 | -------------------------------------------------------------------------------- /src/pages/AboutY/style.css: -------------------------------------------------------------------------------- 1 | /* #app { height: 100% } 2 | html, 3 | body { 4 | position: relative; 5 | height: 100%; 6 | } 7 | 8 | body { 9 | background: #eee; 10 | font-family: Helvetica Neue, Helvetica, Arial, sans-serif; 11 | font-size: 14px; 12 | color: #000; 13 | margin: 0; 14 | padding: 0; 15 | } 16 | 17 | .swiper { 18 | width: 100%; 19 | height: 100%; 20 | } */ 21 | 22 | .swiper-slide { 23 | text-align: center; 24 | font-size: 18px; 25 | background: #fff; 26 | 27 | /* Center slide text vertically */ 28 | display: -webkit-box; 29 | display: -ms-flexbox; 30 | display: -webkit-flex; 31 | display: flex; 32 | -webkit-box-pack: center; 33 | -ms-flex-pack: center; 34 | -webkit-justify-content: center; 35 | justify-content: center; 36 | -webkit-box-align: center; 37 | -ms-flex-align: center; 38 | -webkit-align-items: center; 39 | align-items: center; 40 | } 41 | 42 | .swiper-slide img { 43 | display: block; 44 | width: 100%; 45 | height: 100%; 46 | object-fit: cover; 47 | } -------------------------------------------------------------------------------- /src/store/store.js: -------------------------------------------------------------------------------- 1 | import { 2 | legacy_createStore, 3 | combineReducers, 4 | compose, 5 | applyMiddleware, 6 | } from "redux"; 7 | 8 | import { reducer as appReducer } from "./App/app.reducer"; 9 | import { reducer as authReducer } from "./Auth/auth.reducer"; 10 | import {workoutReducer} from "../pages/Workouts/REDUX/workout.reducer" 11 | import thunk from "redux-thunk"; 12 | import { mealReducer, pilotReducer, productReducer } from "./workout/work.reducers"; 13 | import { reducer as giftReducer } from "./shop/reducer"; 14 | import {reducer as cartReducer} from "./Cart/reducer" 15 | const root_reducer = combineReducers({ 16 | app: appReducer, 17 | auth: authReducer, 18 | gift: giftReducer, 19 | // product: productReducer, 20 | prod: productReducer, 21 | workout:workoutReducer, 22 | Product:cartReducer, 23 | meal:mealReducer, 24 | pilot:pilotReducer, 25 | }); 26 | 27 | const composeEnhancers = window.REDUX_DEVTOOLS_EXTENSION_COMPOSE || compose; 28 | 29 | export const store = legacy_createStore( 30 | root_reducer, 31 | composeEnhancers(applyMiddleware(thunk)) 32 | ); 33 | -------------------------------------------------------------------------------- /src/pages/Workouts/Paginate.jsx: -------------------------------------------------------------------------------- 1 | import React from 'react'; 2 | import "./Paginate.css" 3 | const Paginate = ({ currentPage, setCurrentPage, totalPosts, postPerPage }) => { 4 | const totalPages = Math.ceil(totalPosts / postPerPage); 5 | 6 | let pages = []; 7 | 8 | for (let p = 1; p <= totalPages; p++) { 9 | pages.push(p); 10 | } 11 | 12 | return ( 13 | 34 | ); 35 | }; 36 | 37 | export default Paginate; 38 | -------------------------------------------------------------------------------- /src/store/shop/reducer.js: -------------------------------------------------------------------------------- 1 | import { 2 | GET_GIFT_FAILURE, 3 | GET_GIFT_LOADING, 4 | GET_GIFT_SUCCESS, 5 | GET_PASSES_FAILURE, 6 | GET_PASSES_LOADING, 7 | GET_PASSES_SUCCESS, 8 | } from "./actionType"; 9 | 10 | // reducer 11 | const initstate = { 12 | isloading: false, 13 | isError: false, 14 | gift: [], 15 | }; 16 | export const reducer = (state = initstate, { type, payload }) => { 17 | switch (type) { 18 | case GET_GIFT_LOADING: { 19 | return { ...state, isloading: true }; 20 | } 21 | case GET_GIFT_SUCCESS: { 22 | const newdata = [...state.gift, payload]; 23 | 24 | return { ...state, isloading: false, gift: newdata }; 25 | } 26 | 27 | case GET_GIFT_FAILURE: { 28 | return { ...state, isError: true }; 29 | } 30 | case GET_PASSES_LOADING: { 31 | return { ...state, isloading: true }; 32 | } 33 | case GET_PASSES_SUCCESS: { 34 | // console.log(payload); 35 | const newdata = [...state.gift, payload]; 36 | 37 | return { ...state, isloading: false, gift: newdata }; 38 | } 39 | 40 | case GET_PASSES_FAILURE: { 41 | return { ...state, isError: true }; 42 | } 43 | default: 44 | return state; 45 | } 46 | }; 47 | -------------------------------------------------------------------------------- /src/pages/Workouts/REDUX/workout.action.js: -------------------------------------------------------------------------------- 1 | 2 | import * as actions from "./workout.types"; 3 | import axios from 'axios'; 4 | 5 | export const fetchPosts = () => async (dispatch) => { 6 | dispatch({ type: actions.FETCH_POST_REQUEST }); 7 | 8 | try { 9 | let response = await axios.get(`https://sparta-fitness-database.vercel.app/workoutVideos`); 10 | dispatch({type: actions.FETCH_POST_SUCCESS,payload:response}) 11 | } catch (error) { 12 | dispatch({ type: actions.FETCH_POST_FAILED, payload: error.message }); 13 | console.log(error.message); 14 | } 15 | }; 16 | export const sortPostsAsc = () => (dispatch, getState) => { 17 | const { workout } = getState(); 18 | dispatch({ type: actions.SORT_POSTS_ASC, payload: workout.posts }); 19 | }; 20 | 21 | export const sortPostsDesc = () => (dispatch, getState) => { 22 | const { workout } = getState(); 23 | dispatch({ type: actions.SORT_POSTS_DESC, payload: workout.posts }); 24 | }; 25 | 26 | export const searchPosts = (query) => (dispatch, getState) => { 27 | console.log(query); 28 | const { workout } = getState(); 29 | const searchResults = workout.searchResults.filter((post) => 30 | post.name.toLowerCase().includes(query.toLowerCase()) 31 | ); 32 | dispatch({ type: actions.SEARCH_POSTS, payload: searchResults }); 33 | }; 34 | -------------------------------------------------------------------------------- /src/store/workout/work.action.js: -------------------------------------------------------------------------------- 1 | import axios from "axios"; 2 | import * as type from "./work.types" 3 | 4 | export const getProduct = () =>(dispatch) => { 5 | dispatch({type: type.GET_PRODUCT_LOADING}); 6 | return axios.get("https://fitness-handler.vercel.app/Products ") 7 | .then((res) => { 8 | dispatch({type: type.GET_PRODUCT_SUCCESS, payload: res.data}) 9 | }) 10 | .catch((err) => { 11 | dispatch({type: type.GET_PRODUCT_ERROR}); 12 | }) 13 | } 14 | 15 | export const getMeal = () =>(dispatch) => { 16 | dispatch({type: type.GET_MEAL_LOADING}) 17 | return axios.get("https://fitness-handler.vercel.app/Meal") 18 | .then((res) => { 19 | dispatch({type: type.GET_MEAL_SUCCESS, payload: res.data}) 20 | 21 | }) 22 | .catch((err) => { 23 | dispatch({type: type.GET_MEAL_ERROR}); 24 | 25 | }) 26 | 27 | } 28 | 29 | export const getPilot = () =>(dispatch) => { 30 | dispatch({type: type.GET_PILOT_LOADING}) 31 | return axios.get("https://fitness-handler.vercel.app/Pilot") 32 | .then((res) => { 33 | dispatch({type: type.GET_PILOT_SUCCESS, payload: res.data}) 34 | 35 | }) 36 | .catch((err) => { 37 | dispatch({type: type.GET_PILOT_ERROR}); 38 | 39 | }) 40 | 41 | } -------------------------------------------------------------------------------- /package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "react-redux-setup", 3 | "private": true, 4 | "version": "0.0.0", 5 | "type": "module", 6 | "scripts": { 7 | "start": "vite --host", 8 | "build": "vite build", 9 | "preview": "vite preview" 10 | }, 11 | "dependencies": { 12 | "@chakra-ui/icons": "^2.0.11", 13 | "@chakra-ui/react": "^2.3.6", 14 | "@emotion/react": "^11.10.4", 15 | "@emotion/styled": "^11.10.4", 16 | "@fortawesome/fontawesome-svg-core": "^6.2.1", 17 | "@fortawesome/free-regular-svg-icons": "^6.2.1", 18 | "@fortawesome/free-solid-svg-icons": "^6.2.1", 19 | "@fortawesome/react-fontawesome": "^0.2.0", 20 | "axios": "^1.1.3", 21 | "firebase": "^9.15.0", 22 | "framer-motion": "^7.9.1", 23 | "json-server": "^0.17.1", 24 | "react": "^18.2.0", 25 | "react-calendar": "^4.0.0", 26 | "react-dom": "^18.2.0", 27 | "react-icons": "^4.6.0", 28 | "react-paginate": "^8.1.4", 29 | "react-redux": "^8.0.4", 30 | "react-router-dom": "^6.4.2", 31 | "react-slick": "^0.29.0", 32 | "redux": "^4.2.0", 33 | "redux-logger": "^3.0.6", 34 | "redux-thunk": "^2.4.1", 35 | "swiper": "^8.4.5" 36 | }, 37 | "devDependencies": { 38 | "@types/react": "^18.0.17", 39 | "@types/react-dom": "^18.0.6", 40 | "@vitejs/plugin-react": "^2.1.0", 41 | "vite": "^3.1.0" 42 | } 43 | } 44 | -------------------------------------------------------------------------------- /src/pages/Program/Card.jsx: -------------------------------------------------------------------------------- 1 | import { Flex } from '@chakra-ui/layout' 2 | import { Box, Button, Image, Text } from '@chakra-ui/react' 3 | import React from 'react' 4 | import { MdOutlineShoppingBag } from 'react-icons/md' 5 | import { Link } from 'react-router-dom' 6 | import "./Plans.css" 7 | 8 | const Card = ({src, week, min, des, price,key,handleAdd }) => { 9 | return ( 10 | 11 | 12 | fitness 13 | 14 | 15 | {week} - {min} 16 | 17 | 18 | 19 | {des} 20 | 21 | 22 | 23 | As Low As 24 | $ {price} 25 | 26 | 27 | 28 | {/* */} 29 | 30 | 31 | 32 | 33 | ) 34 | } 35 | 36 | export default Card -------------------------------------------------------------------------------- /src/pages/Workouts/REDUX/workout.reducer.js: -------------------------------------------------------------------------------- 1 | 2 | 3 | import * as actions from './workout.types' 4 | 5 | const initialState = { 6 | posts: [], 7 | searchResults: [], 8 | page: 1, 9 | }; 10 | 11 | export const workoutReducer = (state = initialState, action) => { 12 | switch (action.type) { 13 | case actions.FETCH_POST_REQUEST: 14 | return { 15 | ...state, 16 | loading: true, 17 | }; 18 | case actions.FETCH_POST_SUCCESS: 19 | return { 20 | ...state, 21 | loading: false, 22 | posts: action.payload.data, 23 | searchResults: action.payload.data, 24 | }; 25 | case actions.FETCH_POST_FAILED: 26 | return { 27 | ...state, 28 | loading: false, 29 | error: action.payload, 30 | }; 31 | case actions.SORT_POSTS_ASC: 32 | const sortAsc = action.payload.sort((a, b) => (a.time < b.time ? 1 : a.time > b.time ? -1 : 0)); 33 | return { 34 | ...state, 35 | posts: sortAsc, 36 | }; 37 | case actions.SORT_POSTS_DESC: 38 | const sortDesc = action.payload.sort((a, b) => (a.time < b.time ? -1 : a.time > b.time ? 1 : 0)); 39 | return { 40 | ...state, 41 | posts: sortDesc, 42 | }; 43 | 44 | case actions.SEARCH_POSTS: 45 | return { 46 | ...state, 47 | posts: action.payload, 48 | page: 1 49 | }; 50 | default: 51 | return state; 52 | } 53 | }; 54 | -------------------------------------------------------------------------------- /src/pages/HealthyLiving/Card.jsx: -------------------------------------------------------------------------------- 1 | import { Box, Flex, GridItem, Image, Text } from "@chakra-ui/react"; 2 | import React from "react"; 3 | 4 | const Card = ({ image, category, description, time, label }) => { 5 | // console.log(item); 6 | return ( 7 | 8 | {/* */} 9 | 10 | {`${category} 11 | 20 | {label} 21 | 22 | 23 | 30 | 36 | {description} 37 | 38 | 39 | Read Time • {time} Min 40 | 41 | 42 | {/* */} 43 | 44 | ); 45 | }; 46 | 47 | export default Card; 48 | -------------------------------------------------------------------------------- /src/store/Cart/reducer.js: -------------------------------------------------------------------------------- 1 | import * as types from "./CartType"; 2 | const initstate = { 3 | product: [], 4 | TotalPrice: 0, 5 | TotalQuantity: 0, 6 | // emptyCart:[] 7 | }; 8 | const reducer = (state = initstate, action) => { 9 | const { type, payload } = action; 10 | switch (type) { 11 | case types.Cart_Update: 12 | // console.log(state,"state"); 13 | let newProduct = [...state.product, payload]; 14 | // console.log(state); 15 | const totalPrice = newProduct.reduce((prev, next) => { 16 | return Number(prev) + Number(next.price); 17 | }, 0); 18 | // console.log(totalPrice); 19 | 20 | return { 21 | ...state, 22 | product: newProduct, 23 | TotalPrice: totalPrice, 24 | TotalQuantity: newProduct.length, 25 | }; 26 | 27 | case types.cart_Delete: 28 | let filterdata = state.product.filter((el) => el.id !== payload); 29 | const Afterdelete = filterdata.reduce((prev, next) => { 30 | return Number(prev) + Number(next.price); 31 | }, 0); 32 | return { ...state, product: filterdata, TotalPrice: Afterdelete }; 33 | 34 | //return [...state.product,payload] 35 | // case types.cart_length: 36 | // c= 37 | // console.log(length); 38 | // return {TotalQuantity:length} 39 | case "EMPTY_CART": { 40 | return []; 41 | } 42 | default: 43 | return state; 44 | } 45 | }; 46 | export { reducer }; 47 | -------------------------------------------------------------------------------- /dist/vite.svg: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /public/vite.svg: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /src/components/Admin/AdminHome.jsx: -------------------------------------------------------------------------------- 1 | import { Box, Button, Center, Heading, Input } from '@chakra-ui/react' 2 | import React from 'react' 3 | 4 | const AdminHome = () => { 5 | return ( 6 |
7 | 8 |
9 | 10 | Add Products 11 | 12 |
13 | 14 |
15 | 16 | 17 | 24 | 36 | 37 | 38 |
39 | 40 | 41 | 42 | 43 | 44 | 45 |
46 | ) 47 | } 48 | 49 | export default AdminHome -------------------------------------------------------------------------------- /src/context/UserAuthContext.jsx: -------------------------------------------------------------------------------- 1 | import { createContext, useContext, useEffect, useState } from "react"; 2 | import { 3 | createUserWithEmailAndPassword, 4 | signInWithEmailAndPassword, 5 | signOut, 6 | onAuthStateChanged, 7 | GoogleAuthProvider, 8 | signInWithPopup, 9 | FacebookAuthProvider, 10 | } from "firebase/auth"; 11 | import { auth } from "../firebase"; 12 | const userAuthContext = createContext(); 13 | export function UserAuthContextProvider({ children }) { 14 | const [user, setUser] = useState(""); 15 | 16 | function signUp(email, password) { 17 | // console.log(username); 18 | return createUserWithEmailAndPassword(auth, email, password); 19 | } 20 | 21 | function logIn(email, password) { 22 | return signInWithEmailAndPassword(auth, email, password); 23 | } 24 | 25 | function signInWithGoogle() { 26 | const googleAuthProvider = new GoogleAuthProvider(); 27 | return signInWithPopup(auth, googleAuthProvider); 28 | } 29 | function signInWithFacebook() { 30 | const facebookAuthProvider = new FacebookAuthProvider(); 31 | return signInWithPopup(auth, facebookAuthProvider); 32 | } 33 | function logOut() { 34 | return signOut(auth); 35 | } 36 | useEffect(() => { 37 | const unsubscribe = onAuthStateChanged(auth, (currentUser) => { 38 | setUser(currentUser); 39 | }); 40 | 41 | return () => { 42 | unsubscribe(); 43 | }; 44 | }, []); 45 | return ( 46 | 56 | {children} 57 | 58 | ); 59 | } 60 | 61 | export function useUserAuth() { 62 | return useContext(userAuthContext); 63 | } 64 | -------------------------------------------------------------------------------- /src/pages/about/Careers.css: -------------------------------------------------------------------------------- 1 | * { 2 | padding: 0%; 3 | margin: 0%; 4 | } 5 | 6 | .careersBackDiv { 7 | /* border: 1px solid red; */ 8 | width: 100%; 9 | height: 400px; 10 | background-image: url('https://cloudfront.fitnessblender.com/assets/img/careers/careers-hero.jpg'); 11 | background-size: 100% 100%; 12 | background-repeat: no-repeat; 13 | 14 | } 15 | 16 | .careerTextDiv { 17 | /* border: 1px solid red; */ 18 | /* display: flex; */ 19 | /* flex-wrap: wrap; */ 20 | width: 80vw; 21 | margin: auto; 22 | gap: 20px; 23 | } 24 | 25 | 26 | 27 | .arrowDiv { 28 | /* border: 1px solid black; */ 29 | width: 40vw; 30 | 31 | } 32 | 33 | .career4Div { 34 | width: 250px; 35 | display: flex; 36 | gap: 30px; 37 | 38 | 39 | } 40 | 41 | .contentImg { 42 | width: 30vw; 43 | margin: auto; 44 | } 45 | 46 | @media all and (min-width:700px) and (max-width:5000px) { 47 | .careerh1Text { 48 | /* border: 2px solid blue; */ 49 | width: 200px; 50 | position: absolute; 51 | top: 25vh; 52 | left: 250px; 53 | } 54 | .h1color{ 55 | color: wheat; 56 | } 57 | } 58 | 59 | 60 | @media all and (min-width:0px) and (max-width:700px) { 61 | .contentImgDiv { 62 | /* border: 1px solid red; */ 63 | width: 300px; 64 | height: 300px; 65 | } 66 | 67 | .contentImg { 68 | width: 300px; 69 | height: 300px; 70 | margin: auto; 71 | } 72 | 73 | .careerh1Text { 74 | /* border: 1px solid blue; */ 75 | width: 100%; 76 | background-color: rgb(25, 22, 22); 77 | 78 | 79 | } 80 | .h1color{ 81 | width: 175px; 82 | margin-top: 30px; 83 | margin: auto; 84 | text-align: center; 85 | 86 | 87 | } 88 | } -------------------------------------------------------------------------------- /src/components/cart/EmptyCart.jsx: -------------------------------------------------------------------------------- 1 | import { Box, Button, Grid, GridItem, Heading, Text } from "@chakra-ui/react"; 2 | import React from "react"; 3 | import { Link } from "react-router-dom"; 4 | 5 | const buttons = [ 6 | { 7 | id: 1, 8 | text: "PROGRAMS", 9 | link: "/programs", 10 | }, 11 | { 12 | id: 2, 13 | text: "MEAL PLANS", 14 | link: "/meal-plan", 15 | }, 16 | { 17 | id: 3, 18 | text: "FB PLUS", 19 | link: "/", 20 | }, 21 | { 22 | id: 4, 23 | text: "GIFT CARDS", 24 | link: "/", 25 | }, 26 | ]; 27 | 28 | const EmptyCart = () => { 29 | return ( 30 | 36 | 43 | 48 | Your Shopping Bag is Empty 49 | 50 | 51 | Explore the site for programs, gifts, or FB Plus subscriptions 52 | 53 | 58 | {buttons.map(({ id, text, link }) => ( 59 | 60 | 61 | 70 | 71 | 72 | ))} 73 | 74 | 75 | 76 | ); 77 | }; 78 | 79 | export default EmptyCart; 80 | -------------------------------------------------------------------------------- /src/components/Membership/Banner.jsx: -------------------------------------------------------------------------------- 1 | import React from "react"; 2 | import { Box, Button, Center, Image, Text } from "@chakra-ui/react"; 3 | 4 | const Banner = () => { 5 | return ( 6 | 13 |
20 |
21 | 26 | A Membership 27 | 28 | 32 | for Everyone 33 | 34 | 38 | We believe reliable fitness, nutrition, and wellness content should 39 | be accessible to everyone, regardless of income. That’s why full 40 | access to premium content and features starts as low as $6.67 per 41 | month, and part of the proceeds go toward providing hundreds of our 42 | workouts, articles, and recipes absolutely free. 43 | 44 |
45 |
46 |
52 |
53 | memberships 57 |
58 |
59 | 60 | ); 61 | }; 62 | 63 | export default Banner; 64 | -------------------------------------------------------------------------------- /src/pages/HealthyLiving/CardContainer.jsx: -------------------------------------------------------------------------------- 1 | import { 2 | Box, 3 | Flex, 4 | Grid, 5 | GridItem, 6 | Heading, 7 | Image, 8 | Text, 9 | } from "@chakra-ui/react"; 10 | import React from "react"; 11 | import { Link } from "react-router-dom"; 12 | import Card from "./Card"; 13 | // { category, description, image, label, time } 14 | // const Card = ({ category, description, image, label, time, data }) => { 15 | // const { category, description, image, label, time } = item; 16 | // { fitness, health, nutrition, wellness } 17 | const CardContainer = ({ data }) => { 18 | console.log(data); 19 | // const { fitness, health, nutrition, wellness } = data[0]; 20 | // console.log(data); 21 | return ( 22 | 23 | 29 | 30 | {data[0].category} 31 | 32 | 33 | 34 | {`View All 35 | ${data[0].category} 36 | Articles`} 37 | 38 | 39 | 40 | 51 | {data.map((item, id) => ( 52 | 53 | ))} 54 | {/* {fitness.map((item, id) => ( 55 | 56 | ))} 57 | {health.map((item, id) => ( 58 | 59 | ))} 60 | {wellness.map((item, id) => ( 61 | 62 | ))} */} 63 | 64 | {/* 65 | {fitness.map((item, id) => ( 66 | 67 | ))} 68 | {fitness.map((item, id) => ( 69 | 70 | ))} */} 71 | 72 | 73 | ); 74 | }; 75 | 76 | export default CardContainer; 77 | -------------------------------------------------------------------------------- /src/components/Membership/Passes.jsx: -------------------------------------------------------------------------------- 1 | import React from 'react' 2 | import { Box, Button, Center, Image, Text } from "@chakra-ui/react"; 3 | const Passes = () => { 4 | return ( 5 | 12 |
19 |
20 | 25 | Feel Great. 26 | 27 | 31 | Body and Mind. 32 | 33 | 37 | Choose from hundreds of workouts, healthy recipes, relaxing 38 | meditations, and expert articles, for a whole body and mind approach 39 | to feeling great. 40 | 41 | 55 |
56 |
57 |
63 |
64 | membership-passes 65 |
66 |
67 | 68 | ) 69 | } 70 | 71 | export default Passes -------------------------------------------------------------------------------- /src/components/Checkout/BillingForm.jsx: -------------------------------------------------------------------------------- 1 | import React from "react"; 2 | import { FormControl, FormLabel, Input, Select } from "@chakra-ui/react"; 3 | 4 | const BillingForm = () => { 5 | return ( 6 | 7 | Postal Code 8 | 13 | State / Province / Region 14 | 55 | 56 | First name 57 | 58 | 59 | Country 60 | 75 | 76 | ); 77 | }; 78 | 79 | export default BillingForm; 80 | -------------------------------------------------------------------------------- /src/store/workout/work.reducers.js: -------------------------------------------------------------------------------- 1 | import { 2 | GET_PRODUCT_LOADING, 3 | GET_PRODUCT_SUCCESS, 4 | GET_PRODUCT_ERROR, 5 | GET_MEAL_ERROR, 6 | GET_MEAL_LOADING, 7 | GET_MEAL_SUCCESS, 8 | GET_PILOT_ERROR, 9 | GET_PILOT_LOADING, 10 | GET_PILOT_SUCCESS, 11 | } from "./work.types"; 12 | 13 | const init = { 14 | loading: false, 15 | error: false, 16 | product: [], 17 | }; 18 | 19 | const initial = { 20 | loading: false, 21 | error: false, 22 | meal: [], 23 | }; 24 | 25 | const initialpilot = { 26 | loading: false, 27 | error: false, 28 | pilot: [], 29 | }; 30 | 31 | export const productReducer = (state = init, { type, payload }) => { 32 | switch (type) { 33 | case GET_PRODUCT_ERROR: { 34 | return { 35 | ...state, 36 | loading: false, 37 | error: true, 38 | }; 39 | } 40 | case GET_PRODUCT_LOADING: { 41 | return { 42 | ...state, 43 | loading: true, 44 | error: false, 45 | }; 46 | } 47 | 48 | case GET_PRODUCT_SUCCESS: { 49 | const newdata = [...state.product, payload]; 50 | return { 51 | ...state, 52 | loading: false, 53 | product: newdata, 54 | }; 55 | } 56 | 57 | default: { 58 | return state; 59 | } 60 | } 61 | }; 62 | 63 | export const mealReducer = (state = initial, { type, payload }) => { 64 | switch (type) { 65 | case GET_MEAL_ERROR: { 66 | return { 67 | ...state, 68 | loading: false, 69 | error: true, 70 | }; 71 | } 72 | 73 | case GET_MEAL_LOADING: { 74 | return { 75 | ...state, 76 | loading: true, 77 | error: false, 78 | }; 79 | } 80 | 81 | case GET_MEAL_SUCCESS: { 82 | const newdata = [...state.meal, payload]; 83 | return { 84 | ...state, 85 | loading: false, 86 | meal: newdata, 87 | }; 88 | } 89 | default: { 90 | return state; 91 | } 92 | } 93 | }; 94 | 95 | export const pilotReducer = (state = initialpilot, { type, payload }) => { 96 | switch (type) { 97 | case GET_PILOT_ERROR: { 98 | return { 99 | ...state, 100 | loading: false, 101 | error: true, 102 | }; 103 | } 104 | 105 | case GET_PILOT_LOADING: { 106 | return { 107 | ...state, 108 | loading: true, 109 | error: false, 110 | }; 111 | } 112 | 113 | case GET_PILOT_SUCCESS: { 114 | const newdata = [...state.pilot, payload]; 115 | return { 116 | ...state, 117 | loading: false, 118 | pilot: newdata, 119 | }; 120 | } 121 | default: { 122 | return state; 123 | } 124 | } 125 | }; 126 | -------------------------------------------------------------------------------- /src/components/Checkout/ReviewOrder.jsx: -------------------------------------------------------------------------------- 1 | import { Flex, Heading, Text } from "@chakra-ui/react"; 2 | import React from "react"; 3 | import { Link } from "react-router-dom"; 4 | import { BiChevronLeft } from "react-icons/bi"; 5 | import { useSelector } from "react-redux"; 6 | import CartItem from "./CartItem"; 7 | const ReviewOrder = () => { 8 | const Productarray = useSelector((store) => store.Product); 9 | console.log(Productarray); 10 | return ( 11 | 18 | 25 | 26 | Review Order 27 | 28 | 29 | 30 | 31 | Edit Cart 32 | 33 | 34 | 35 | 42 | 43 | ITEM 44 | 45 | 46 | PRICE 47 | 48 | 49 | {/* **************************CART ITEM****************************** */} 50 | 51 | {Productarray.product.map((cartItem) => { 52 | const {desc,price}= cartItem 53 | return ( 54 | 61 | 62 | {desc} 63 | 64 | 65 | ${" "}{price} 66 | 67 | 68 | ); 69 | })} 70 | 71 | 78 | 79 | Order Total: {" "} 80 | 81 | 82 | 83 | ${Productarray.TotalPrice} 84 | 85 | 86 | 87 | ); 88 | }; 89 | 90 | export default ReviewOrder; 91 | -------------------------------------------------------------------------------- /src/components/Membership/memberShipJoin/Card.jsx: -------------------------------------------------------------------------------- 1 | import React from "react"; 2 | import { Box, Button, Grid, GridItem, Text } from "@chakra-ui/react"; 3 | import { Link } from "react-router-dom"; 4 | 5 | let memberShipTypes = [ 6 | { 7 | title: "FB Plus", 8 | titleFontSize: "38.5px", 9 | descFontSize: "16.5px", 10 | desc: "Get exclusive content and access to programs and challenges, with advanced features to help you reach and maintain your goals.", 11 | more: "Learn More About FB Plus", 12 | linkColor: "rgb(66,162,216)", 13 | 14 | color: "rgb(78,82,98)", 15 | bgColor: "rgb(237,248,252)", 16 | btnText: "JOIN WITH PLUS", 17 | link: "#", 18 | }, 19 | { 20 | title: "JOIN FOR FREE", 21 | titleFontSize: "38.5px", 22 | descFontSize: "16.5px", 23 | 24 | desc: "Enjoy hundreds of workout videos, articles, and recipes, with new content every week. No strings attached, no credit card required.", 25 | color: "rgb(78,82,98)", 26 | bgColor: "rgb(240,244,246)", 27 | btnText: "JOIN FOR FREE", 28 | link: "/join", 29 | }, 30 | ]; 31 | const Card = () => { 32 | return ( 33 | 42 | {memberShipTypes.map((item) => ( 43 | 51 | 52 | 53 | {item.title} 54 | 55 | 56 | {item.desc} 57 | 58 | 59 | 60 | 76 | 77 | 78 | 83 | {item.more} 84 | 85 | 86 | 87 | ))} 88 | 89 | ); 90 | }; 91 | 92 | export default Card; 93 | -------------------------------------------------------------------------------- /src/pages/Payment/Payment.jsx: -------------------------------------------------------------------------------- 1 | import React from "react"; 2 | import { Box, Button, Flex, Heading } from "@chakra-ui/react"; 3 | import { BiChevronLeft } from "react-icons/bi"; 4 | import { Link, useNavigate } from "react-router-dom"; 5 | import ReviewOrder from "../../components/Checkout/ReviewOrder"; 6 | import { useDispatch, useSelector } from "react-redux"; 7 | import { empty_cart } from "../../store/Cart/CartAction"; 8 | 9 | const Payment = () => { 10 | const Productarray = useSelector((store) => store.Product); 11 | const navigate = useNavigate(); 12 | const dispatch = useDispatch(); 13 | const handlePlaceOrder = () => { 14 | navigate("/success"); 15 | }; 16 | return ( 17 | <> 18 | 23 | 24 | Checkout 25 | 26 | 27 | 28 | 29 | {/*************************** Billing section ******************************** */} 30 | 35 | 43 | 44 | Payment Information 45 | 46 | 47 | 53 | 58 | {/* ***************************** BILLING FORM******************************* */} 59 | 60 | 71 | 74 | 87 | 88 | 89 | 90 | 91 | 92 | 93 | ); 94 | }; 95 | 96 | export default Payment; 97 | -------------------------------------------------------------------------------- /src/Routes/AllRoutes.jsx: -------------------------------------------------------------------------------- 1 | import React from "react"; 2 | import { Route, Routes } from "react-router-dom"; 3 | import Home from "../pages/Home/Home"; 4 | import Join from "../pages/Join/Join"; 5 | import Login from "../pages/Login/Login"; 6 | import SinglePage from "../pages/Program/SinglePage"; 7 | import Plans from "../pages/Program/Plans"; 8 | import Shop from "../pages/Shop/Shop"; 9 | import PrivateRoute from "./PrivateRoute"; 10 | import Workout from "../pages/Workouts/Workout"; 11 | import Careers from "../pages/about/Careers"; 12 | import MealPlans from "../pages/Program/MealPlans"; 13 | import MealSingle from "../pages/Program/MealSingle"; 14 | import Pilot from "../pages/Program/Pilot"; 15 | import PilotSingle from "../pages/Program/PilotSingle"; 16 | import Routines from "../pages/Program/Routines"; 17 | import Cart from "../pages/Cart/Cart"; 18 | import HealthLiving from "../pages/HealthyLiving/HealthLiving"; 19 | import WorkoutVideos from "../pages/Workouts/WorkoutVideos"; 20 | import CustomWorkout from "../pages/Workouts/CustomWorkout/CustomWorkout"; 21 | import WorkoutSingle from "../pages/Workouts/WorkoutSingle"; 22 | import WorkSingleVideo from "../pages/Workouts/WorkSingleVideo"; 23 | import MemberShip from "../pages/membership/Membership"; 24 | import Checkout from "../pages/checkout/Checkout"; 25 | import Payment from "../pages/Payment/Payment"; 26 | import OrderSuccess from "../pages/OrderSuccess/OrderSuccess"; 27 | import About from "../pages/AboutY/AboutY"; 28 | const AllRoutes = () => { 29 | return ( 30 | 31 | }> 32 | }> 33 | }> 34 | }> 35 | }> 36 | }> 37 | }> 38 | }> 39 | }> 40 | }> 41 | }> 42 | }> 43 | }> 44 | }> 45 | }> 46 | }> 47 | }> 48 | 52 | 53 | 54 | } 55 | > 56 | }> 57 | }> 58 | }> 59 | }> 60 | }> 61 | }> 62 | }> 63 | 64 | ); 65 | }; 66 | 67 | export default AllRoutes; 68 | -------------------------------------------------------------------------------- /src/pages/checkout/Checkout.jsx: -------------------------------------------------------------------------------- 1 | import React from "react"; 2 | import { 3 | Box, 4 | Button, 5 | Flex, 6 | FormControl, 7 | FormLabel, 8 | Heading, 9 | Input, 10 | Select, 11 | Text, 12 | VStack, 13 | } from "@chakra-ui/react"; 14 | import { BiChevronLeft } from "react-icons/bi"; 15 | import { Link, Navigate, useNavigate } from "react-router-dom"; 16 | import ReviewOrder from "../../components/Checkout/ReviewOrder"; 17 | import BillingForm from "../../components/Checkout/BillingForm"; 18 | import { useSelector } from "react-redux"; 19 | const Checkout = () => { 20 | const navigate = useNavigate(); 21 | 22 | return ( 23 | <> 24 | 29 | 30 | Checkout 31 | 32 | 33 | 34 | 35 | {/*************************** Billing section ******************************** */} 36 | 41 | 49 | 50 | Billing Information 51 | 52 | 53 | 59 | 64 | {/* ***************************** BILLING FORM******************************* */} 65 | 66 | 67 | 78 | 81 | 94 | 95 | 96 | 97 | 98 | 99 | 100 | ); 101 | }; 102 | 103 | export default Checkout; 104 | -------------------------------------------------------------------------------- /src/pages/HealthyLiving/HealthLiving.jsx: -------------------------------------------------------------------------------- 1 | import { 2 | Stack, 3 | Flex, 4 | Text, 5 | VStack, 6 | useBreakpointValue, 7 | Box, 8 | } from "@chakra-ui/react"; 9 | import { useEffect, useState } from "react"; 10 | import { useDispatch, useSelector } from "react-redux"; 11 | import axios from "axios"; 12 | import CardContainer from "./CardContainer"; 13 | 14 | const getData = async () => { 15 | let res = await fetch(`https://sparta-fitness-database.vercel.app/articles`); 16 | let data = await res.json(); 17 | return data; 18 | }; 19 | export default function HealthLiving() { 20 | const [data, setData] = useState([]); 21 | const [loading, setLoading] = useState(false); 22 | const [error, setError] = useState(null); 23 | console.log(data); 24 | // const healthLivingData = useSelector((store) => store.healthLiving.data); 25 | // const dispatch = useDispatch(); 26 | 27 | const getActualData = () => { 28 | getData().then((res) => setData(res)); 29 | }; 30 | 31 | useEffect(() => { 32 | getActualData(); 33 | }, []); 34 | 35 | // if (loading) { 36 | // return

loading....

; 37 | // } 38 | return ( 39 | <> 40 | 51 | 58 | 65 | 66 | 67 | HEALTHY LIVING 68 | 69 | 77 | Live Well, Feel Great and Look Great. 78 | 79 | 88 | A huge selection of health and fitness content, healthy recipes 89 | and transformation stories to help you get fit and stay fit! 90 | 91 | 92 | 93 | 94 | 95 | 96 | 101 | {data.map((item, id) => { 102 | // console.log(item); 103 | return ; 104 | })} 105 | 106 | 107 | 108 | ); 109 | } 110 | -------------------------------------------------------------------------------- /src/pages/Workouts/WorkoutSingle.jsx: -------------------------------------------------------------------------------- 1 | import React from 'react' 2 | import { 3 | Box, 4 | Grid, 5 | Stack, 6 | Text, 7 | Image, 8 | Heading, 9 | GridItem, 10 | } from '@chakra-ui/react'; 11 | import {ViewIcon,CheckCircleIcon,ChatIcon,StarIcon,TriangleUpIcon} from '@chakra-ui/icons' 12 | import { useEffect, useState } from 'react'; 13 | 14 | import { useParams } from 'react-router-dom'; 15 | const getView = (url) => { 16 | return fetch(url) 17 | .then((res) => res.json()); 18 | } 19 | const WorkoutSingle = () => { 20 | const {id} = useParams() 21 | const [view, setView] = useState({}); 22 | useEffect(() => { 23 | getView(`https://sparta-fitness-database.vercel.app/workoutVideos/${id}`).then((res) => 24 | setView(res) 25 | 26 | ) 27 | },[id]) 28 | return ( 29 |
30 | 37 | {'workvideo 44 | 45 | 46 | 51 | {view.name} 52 | 53 | 58 | {view.des} 59 | 60 | 65 | {view.time} 66 | 67 | 74 | 76 | 81 | 82 | Training Type : Cardiovascular, Pilates 83 | Equipment : Mat 84 | Burn Estimate : 149-236 Calories 85 | 86 | 87 | 88 | 91 | Community 96 | 216 97 | 102 98 | 32 99 | 100 | 101 | 102 | 103 | 104 | 105 | 106 |
107 | ) 108 | } 109 | 110 | export default WorkoutSingle; -------------------------------------------------------------------------------- /src/pages/Program/MealPlans.jsx: -------------------------------------------------------------------------------- 1 | import React, { useEffect, useState } from "react"; 2 | import Card from "./Card"; 3 | import { useSelector, useDispatch } from "react-redux"; 4 | import { getMeal} from "../../store/workout/work.action"; 5 | import { 6 | Grid, 7 | GridItem, 8 | Heading, 9 | Box, 10 | Flex, 11 | Button, 12 | Collapse, 13 | useDisclosure, 14 | InputGroup, 15 | Input, 16 | InputRightElement, 17 | Accordion, 18 | AccordionItem, 19 | AccordionButton, 20 | AccordionPanel, 21 | Text, 22 | IconButton, 23 | Hide, 24 | } from "@chakra-ui/react"; 25 | import axios from "axios"; 26 | import { BiSearchAlt2 } from "react-icons/bi"; 27 | import { 28 | AddIcon, 29 | MinusIcon, 30 | SearchIcon, 31 | TriangleDownIcon, 32 | } from "@chakra-ui/icons"; 33 | import { Link } from "react-router-dom"; 34 | // hello 35 | const MealPlans = () => { 36 | 37 | 38 | const meals = useSelector((store) => store.meal); 39 | 40 | 41 | const dispatch = useDispatch(); 42 | const { isOpen, onToggle } = useDisclosure(); 43 | 44 | 45 | useEffect(() => { 46 | dispatch(getMeal()) 47 | },[]) 48 | 49 | 50 | return ( 51 |
52 | 53 | 59 | Meal Plans 60 | 61 | 62 | 63 | 64 | 65 | 66 | 70 | 71 | 72 | 80 |

Hello Its Me!

81 | 82 | 83 | 84 | 85 | 86 | 87 | 88 | {({ isExpanded }) => ( 89 | <> 90 |

91 | 92 | 93 | 94 | 95 | Search 96 | 97 | 98 | 99 |

100 | 101 | 102 | 106 | } 109 | /> 110 | 111 | 112 | 113 | )} 114 | 115 | 116 | 117 | 118 | 119 | 120 | 132 | {meals.meal[0] && meals.meal[0].map((pro) => ( 133 | 134 | 135 | 144 | 145 | 146 | ))} 147 | 148 | 149 |
150 | ) 151 | } 152 | 153 | export default MealPlans -------------------------------------------------------------------------------- /src/pages/Program/Plans.jsx: -------------------------------------------------------------------------------- 1 | import React, { useEffect, useState } from "react"; 2 | import Card from "./Card"; 3 | import { useSelector, useDispatch } from "react-redux"; 4 | import { getProduct } from "../../store/workout/work.action"; 5 | import { 6 | Grid, 7 | GridItem, 8 | Heading, 9 | Box, 10 | Flex, 11 | Button, 12 | Collapse, 13 | useDisclosure, 14 | InputGroup, 15 | Input, 16 | InputRightElement, 17 | Accordion, 18 | AccordionItem, 19 | AccordionButton, 20 | AccordionPanel, 21 | Text, 22 | IconButton, 23 | Hide, 24 | } from "@chakra-ui/react"; 25 | import axios from "axios"; 26 | import { BiSearchAlt2 } from "react-icons/bi"; 27 | import { 28 | AddIcon, 29 | MinusIcon, 30 | SearchIcon, 31 | TriangleDownIcon, 32 | } from "@chakra-ui/icons"; 33 | import { Link } from "react-router-dom"; 34 | 35 | const Plans = () => { 36 | 37 | 38 | const products = useSelector((store) => store.prod); 39 | const dispatch = useDispatch(); 40 | const { isOpen, onToggle } = useDisclosure(); 41 | 42 | 43 | 44 | useEffect(() => { 45 | dispatch(getProduct()) 46 | },[]) 47 | return ( 48 |
49 | 50 | 56 | Workout Programs 57 | 58 | 59 | 60 | 61 | 62 | 63 | 67 | 68 | 69 | 77 |

Hello Its Me!

78 | 79 | 80 | 81 | 82 | 83 | 84 | 85 | {({ isExpanded }) => ( 86 | <> 87 |

88 | 89 | 90 | 91 | 92 | Search 93 | 94 | 95 | 96 |

97 | 98 | 99 | 103 | } 106 | /> 107 | 108 | 109 | 110 | )} 111 | 112 | 113 | 114 | 115 | 116 | 117 | 129 | {products.product[0] && products.product[0].map((pro) => ( 130 | 131 | 132 | 141 | 142 | 143 | ))} 144 | 145 | 146 |
147 | ); 148 | }; 149 | 150 | export default Plans; 151 | -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | ## SPARTA FITNESS CLUB 2 | 3 | Sparta Fitness Club is an digital fitness content publisher. The company offers free and paid at-home exercise videos through their website. Sparta Fitness Club offers individual workouts and workout plans. 4 | 5 | ### DESCRIPTION 6 | 7 | This is a Collabrative Project build within 5 days. Created a functional website for fitness enthusiast where the user can check different workout plans for the workout. User can also see healty meals plans and can buy it if the user has to buy. User can also search for any of the workout that he or she wnat to do and can also do sorting based on the the duration of the workout in the ascending or descending order. 8 | 9 | ### FUNCTIONALITIES 10 | 11 | * Dropdown Navigation Bar 12 | * Search Functionality. 13 | * Sorting. 14 | * Pagination. 15 | * Add to Cart Functionality 16 | 17 | ### TECH STACK 18 | 19 | * HTML 20 | * CSS 21 | * JavaScript 22 | * React Js 23 | * CHAKRA UI 24 | * Redux 25 | * npm packages 26 | 27 | 28 | ### SCREENSHOTS 29 | 30 | ![Screenshot (262)](https://user-images.githubusercontent.com/107467642/209663492-e5ae8343-7c41-430c-8b46-3d746f284ef6.png) 31 | 32 | ![Screenshot (263)](https://user-images.githubusercontent.com/107467642/209663540-63fad292-1678-4323-886f-80d10881e6f6.png) 33 | 34 | ![Screenshot (264)](https://user-images.githubusercontent.com/107467642/209663552-85268000-6413-438f-8766-ec70f0d0e8ec.png) 35 | 36 | ![Screenshot (265)](https://user-images.githubusercontent.com/107467642/209663607-bb8a58fb-8d2a-43b8-aa02-57679df4b259.png) 37 | 38 | ![Screenshot (266)](https://user-images.githubusercontent.com/107467642/209663724-53a10674-5027-4a12-a5e8-7b8f0fa79521.png) 39 | 40 | ![Screenshot (267)](https://user-images.githubusercontent.com/107467642/209663738-4e978aa4-ad86-4e49-a64b-f9d9f976ec0e.png) 41 | 42 | ![Screenshot (268)](https://user-images.githubusercontent.com/107467642/209663746-c77721d6-a9d0-4848-86c2-3128271de569.png) 43 | 44 | ![Screenshot (269)](https://user-images.githubusercontent.com/107467642/209663754-1aabf064-093f-4bb4-83af-0a71831849e7.png) 45 | 46 | ![Screenshot (270)](https://user-images.githubusercontent.com/107467642/209663775-da363e27-ecca-4e96-b796-82815e104dff.png) 47 | 48 | ![Screenshot (271)](https://user-images.githubusercontent.com/107467642/209663792-0aca8214-3576-431f-84ef-01f469addaa6.png) 49 | 50 | ![Screenshot (273)](https://user-images.githubusercontent.com/107467642/209663841-ee0b2d2d-f371-4d27-8204-7089063f8133.png) 51 | 52 | ![Screenshot (274)](https://user-images.githubusercontent.com/107467642/209663864-d11f7c02-41aa-4485-9b44-b88ed0d07f57.png) 53 | 54 | ![Screenshot (275)](https://user-images.githubusercontent.com/107467642/209663880-d76f0109-eff8-4f7a-8474-5502c25a6ede.png) 55 | 56 | ![Screenshot (276)](https://user-images.githubusercontent.com/107467642/209663893-a88168ff-78e0-4e94-92f0-b574f1e37b1c.png) 57 | 58 | ![Screenshot (277)](https://user-images.githubusercontent.com/107467642/209663916-135f8951-687b-4762-b272-7ae3a6f1492c.png) 59 | 60 | ![Screenshot (278)](https://user-images.githubusercontent.com/107467642/209663933-891a0c1c-1b9e-48a3-b713-dfcac6b4c5ce.png) 61 | 62 | ![Screenshot (279)](https://user-images.githubusercontent.com/107467642/209663945-ed0682f0-dfd6-4f27-b246-ee41d2380f2e.png) 63 | 64 | 65 | ### RESPONSIVENESS 66 | 67 | ![Screenshot (280)](https://user-images.githubusercontent.com/107467642/209664534-67894c79-2869-495a-91b1-828ef9d39efb.png) 68 | 69 | ![Screenshot (281)](https://user-images.githubusercontent.com/107467642/209664567-56b4063d-9f60-4730-a8a5-05a75ef010bf.png) 70 | 71 | ![Screenshot (282)](https://user-images.githubusercontent.com/107467642/209664602-1a2b32bb-1d6b-4775-a8d2-2a4468bd78b5.png) 72 | 73 | ![Screenshot (283)](https://user-images.githubusercontent.com/107467642/209664637-1e116b1e-b841-4ec8-bba2-57c20066d9d1.png) 74 | 75 | ![Screenshot (284)](https://user-images.githubusercontent.com/107467642/209664655-4c0c9686-3b15-4602-aa4b-59ffaaa20a0c.png) 76 | 77 | ![Screenshot (285)](https://user-images.githubusercontent.com/107467642/209664676-1480a1ce-a5a3-4917-b3ac-10affa485ccd.png) 78 | 79 | ![Screenshot (286)](https://user-images.githubusercontent.com/107467642/209664693-f552c1e3-3ebc-480c-844c-e58aab2b1fae.png) 80 | 81 | ![Screenshot (288)](https://user-images.githubusercontent.com/107467642/209664712-c7d7e649-22cf-4486-9ef1-8d6341a83837.png) 82 | 83 | ![Screenshot (287)](https://user-images.githubusercontent.com/107467642/209664725-e1d0bb2e-6a72-48ef-91d8-1ced3d202f50.png) 84 | 85 | ![Screenshot (289)](https://user-images.githubusercontent.com/107467642/209664739-5e512f0d-dbb5-4756-a024-69ee70f6568b.png) 86 | 87 | ![Screenshot (290)](https://user-images.githubusercontent.com/107467642/209664758-2c221caf-4e5c-46d3-8f77-ceb488ac7508.png) 88 | 89 | ### Deployed site 90 | 91 | [Deployed Link of website](https://gray-system-3325.vercel.app/) 92 | -------------------------------------------------------------------------------- /src/pages/Workouts/CustomWorkout/Slide.jsx: -------------------------------------------------------------------------------- 1 | import React from 'react'; 2 | import { 3 | Box, 4 | IconButton, 5 | useBreakpointValue, 6 | Stack, 7 | Heading, 8 | Text, 9 | Container, 10 | Button, 11 | } from '@chakra-ui/react'; 12 | import "./Slider.css" 13 | import { BiLeftArrowAlt, BiRightArrowAlt } from 'react-icons/bi'; 14 | 15 | import Slider from 'react-slick'; 16 | const settings = { 17 | dots: true, 18 | arrows: false, 19 | fade: true, 20 | infinite: true, 21 | autoplay: true, 22 | speed: 500, 23 | autoplaySpeed: 5000, 24 | slidesToShow: 1, 25 | slidesToScroll: 1, 26 | }; 27 | 28 | export default function Slide() { 29 | 30 | const [slider, setSlider] = React.useState(null); 31 | 32 | 33 | const top = useBreakpointValue({ base: '90%', md: '50%' }); 34 | const side = useBreakpointValue({ base: '30%', md: '40px' }); 35 | 36 | 37 | const cards = [ 38 | { 39 | title: 'Custom Workouts', 40 | text: 41 | "FB Plus", 42 | image: 43 | 'https://cloudfront.fitnessblender.com/assets/img/fbplus/fingerprint.jpg', 44 | }, 45 | { 46 | title: 'Custom Workouts', 47 | text: 48 | "FB Plus", 49 | image: 50 | 'https://d18zdz9g6n5za7.cloudfront.net/workouts_programs/masthead-workouts.jpg', 51 | }, 52 | { 53 | title: 'Custom Workouts', 54 | text: 55 | "FB Plus", 56 | image: 57 | 'https://d18zdz9g6n5za7.cloudfront.net/wellness-videos/67-guided-practice-to-embrace-vulnerability-96cb.jpg', 58 | }, 59 | { 60 | title: 'Custom Workouts', 61 | text: 62 | "FB Plus", 63 | image: 64 | 'https://d18zdz9g6n5za7.cloudfront.net/wellness-videos/64-guided-meditation-for-grief-9028.jpg', 65 | }, 66 | 67 | ]; 68 | 69 | return ( 70 | 75 | {/* CSS files for react-slick */} 76 | 82 | 87 | {/* Left Icon */} 88 | slider?.slickPrev()}> 97 | 98 | 99 | {/* Right Icon */} 100 | slider?.slickNext()}> 109 | 110 | 111 | {/* Slider */} 112 | setSlider(slider)}> 113 | {cards.map((card, index) => ( 114 | 122 | {/* This is the block you need to change, to customize the caption */} 123 | 124 | 132 | 133 | {card.title} 134 | 135 | 136 | {card.text} 137 | 138 | Join All Access Now 139 | 140 | 141 | 142 | ))} 143 | 144 | 145 | ); 146 | } -------------------------------------------------------------------------------- /src/pages/AboutY/AboutSlide.jsx: -------------------------------------------------------------------------------- 1 | import React from 'react'; 2 | import { 3 | Box, 4 | IconButton, 5 | useBreakpointValue, 6 | Stack, 7 | Heading, 8 | Text, 9 | Container, 10 | Button, 11 | } from '@chakra-ui/react'; 12 | // Here we have used react-icons package for the icons 13 | import { BiLeftArrowAlt, BiRightArrowAlt } from 'react-icons/bi'; 14 | // And react-slick as our Carousel Lib 15 | import Slider from 'react-slick'; 16 | 17 | // Settings for the slider 18 | const settings = { 19 | dots: true, 20 | arrows: false, 21 | fade: true, 22 | infinite: true, 23 | autoplay: true, 24 | speed: 500, 25 | autoplaySpeed: 5000, 26 | slidesToShow: 1, 27 | slidesToScroll: 1, 28 | }; 29 | 30 | export default function AboutSlide() { 31 | // As we have used custom buttons, we need a reference variable to 32 | // change the state 33 | const [slider, setSlider] = React.useState(null); 34 | 35 | // These are the breakpoints which changes the position of the 36 | // buttons as the screen size changes 37 | const top = useBreakpointValue({ base: '90%', md: '50%' }); 38 | const side = useBreakpointValue({ base: '30%', md: '40px' }); 39 | 40 | // This list contains all the data for carousels 41 | // This can be static or loaded from a server 42 | const cards = [ 43 | { 44 | title: 'ABOUT FITNESS BLENDER', 45 | text: 46 | "Our goal is to make health and fitness attainable, affordable and approachable.", 47 | image: 48 | 'https://d18zdz9g6n5za7.cloudfront.net/about/masthead-xs@2X.jpg', 49 | }, 50 | { 51 | title: '', 52 | text: 53 | "Come Join the FB Family.", 54 | image: 55 | 'https://cloudfront.fitnessblender.com/assets/img/careers/careers-hero-xs@2X.jpg', 56 | }, 57 | { 58 | title: '', 59 | text: 60 | "Come Join the FB Family. ", 61 | image: 62 | 'https://d18zdz9g6n5za7.cloudfront.net/about/video.jpg', 63 | }, 64 | ]; 65 | 66 | return ( 67 | 73 | {/* CSS files for react-slick */} 74 | 80 | 85 | {/* Left Icon */} 86 | slider?.slickPrev()}> 95 | 96 | 97 | {/* Right Icon */} 98 | slider?.slickNext()}> 107 | 108 | 109 | {/* Slider */} 110 | setSlider(slider)}> 111 | {cards.map((card, index) => ( 112 | 120 | {/* This is the block you need to change, to customize the caption */} 121 | 122 | 130 | 131 | 132 | 133 | {card.title} 134 | 135 | 136 | {card.text} 137 | 138 | 139 | 140 | 141 | ))} 142 | 143 | 144 | ); 145 | } -------------------------------------------------------------------------------- /src/pages/Program/SlideCard.jsx: -------------------------------------------------------------------------------- 1 | import React from 'react'; 2 | import { 3 | Box, 4 | IconButton, 5 | useBreakpointValue, 6 | Stack, 7 | Heading, 8 | Text, 9 | Container, 10 | Button, 11 | } from '@chakra-ui/react'; 12 | // Here we have used react-icons package for the icons 13 | import { BiLeftArrowAlt, BiRightArrowAlt } from 'react-icons/bi'; 14 | // And react-slick as our Carousel Lib 15 | import Slider from 'react-slick'; 16 | 17 | // Settings for the slider 18 | const settings = { 19 | dots: true, 20 | arrows: false, 21 | fade: true, 22 | infinite: true, 23 | autoplay: true, 24 | speed: 500, 25 | autoplaySpeed: 5000, 26 | slidesToShow: 1, 27 | slidesToScroll: 1, 28 | }; 29 | 30 | export default function SlideCard() { 31 | // As we have used custom buttons, we need a reference variable to 32 | // change the state 33 | const [slider, setSlider] = React.useState(null); 34 | 35 | // These are the breakpoints which changes the position of the 36 | // buttons as the screen size changes 37 | const top = useBreakpointValue({ base: '90%', md: '50%' }); 38 | const side = useBreakpointValue({ base: '30%', md: '40px' }); 39 | 40 | // This list contains all the data for carousels 41 | // This can be static or loaded from a server 42 | const cards = [ 43 | { 44 | title: 'Routines FB Plus', 45 | text: 46 | "Routines allow you to build your own workout plans that you can save and schedule on the calendar. With access to our entire workout library,", 47 | image: 48 | 'https://cloudfront.fitnessblender.com/assets/img/fbplus/routines.jpg', 49 | }, 50 | { 51 | title: 'Routines FB Plus', 52 | text: 53 | "Whether you want to save time scheduling your favorite morning warm-up each week, or you want to create a comprehensive fitness plan", 54 | image: 55 | 'https://d18zdz9g6n5za7.cloudfront.net/wellness-videos/67-guided-practice-to-embrace-vulnerability-96cb.jpg', 56 | }, 57 | { 58 | title: 'Routines FB Plus', 59 | text: 60 | "Routines wouldn't be complete without the ability to add your own workouts.", 61 | image: 62 | 'https://d18zdz9g6n5za7.cloudfront.net/wellness-videos/64-guided-meditation-for-grief-9028.jpg', 63 | }, 64 | ]; 65 | 66 | return ( 67 | 72 | {/* CSS files for react-slick */} 73 | 79 | 84 | {/* Left Icon */} 85 | slider?.slickPrev()}> 94 | 95 | 96 | {/* Right Icon */} 97 | slider?.slickNext()}> 106 | 107 | 108 | {/* Slider */} 109 | setSlider(slider)}> 110 | {cards.map((card, index) => ( 111 | 119 | {/* This is the block you need to change, to customize the caption */} 120 | 121 | 129 | 130 | {card.title} 131 | 132 | 133 | {card.text} 134 | 135 | 136 | 137 | 138 | ))} 139 | 140 | 141 | ); 142 | } -------------------------------------------------------------------------------- /src/components/Footer/Footer.jsx: -------------------------------------------------------------------------------- 1 | import { ReactNode } from "react"; 2 | import { 3 | Box, 4 | Container, 5 | Stack, 6 | SimpleGrid, 7 | Text, 8 | Link, 9 | VisuallyHidden, 10 | chakra, 11 | useColorModeValue, 12 | Heading, 13 | } from "@chakra-ui/react"; 14 | import { FaTwitter, FaYoutube, FaInstagram } from "react-icons/fa"; 15 | 16 | // import AppStoreBadge from "@/components/AppStoreBadge"; 17 | // import PlayStoreBadge from "@/components/PlayStoreBadge"; 18 | 19 | const ListHeader = ({ children }) => { 20 | return ( 21 | 22 | {children} 23 | 24 | ); 25 | }; 26 | 27 | const SocialButton = ({ children, label, href }) => { 28 | return ( 29 | 45 | {label} 46 | {children} 47 | 48 | ); 49 | }; 50 | 51 | function Footer() { 52 | return ( 53 | 57 | 58 | 59 | 60 | 61 | WORKOUTS 62 | 63 | 64 | WORKOUT VIDEOS 65 | 66 | 67 | CUSTOM WORKOUTS 68 | 69 | 70 | 71 | 72 | 73 | HEALTHY LIVING 74 | 75 | 76 | FITNESS 77 | 78 | 79 | HEALTH 80 | 81 | 82 | NUTRITION 83 | 84 | 85 | HEALTHY RECIPES 86 | 87 | 88 | EXPERTS 89 | 90 | 91 | 92 | 93 | 94 | ABOUT 95 | 96 | 97 | CAREERS 98 | 99 | 100 | TUTORIALS 101 | 102 | 103 | OUR TEAM 104 | 105 | 106 | B2B OPTIONS 107 | 108 | 109 | 110 | 111 | 112 | MEMBERSHIP 113 | 114 | 115 | FB PLUS 116 | 117 | 118 | COMMUNITY 119 | 120 | 121 | BLOG 122 | 123 | 124 | CONTACT US 125 | 126 | 127 | FAQ 128 | 129 | 130 | STORE 131 | 132 | 133 | 134 | 135 | 136 | 141 | 150 | 151 | Copyright © 2022 Sparta Fitness Club. All rights reserved. 152 | 153 | 154 | 155 | 156 | 157 | 158 | 159 | 160 | 161 | 162 | 163 | 164 | 165 | 166 | 167 | ); 168 | } 169 | 170 | export default Footer; 171 | -------------------------------------------------------------------------------- /src/pages/Program/Pilot.jsx: -------------------------------------------------------------------------------- 1 | import React, { useEffect, useState } from "react"; 2 | import Card from "./Card"; 3 | import { useSelector, useDispatch } from "react-redux"; 4 | import { getMeal, getPilot, getProduct } from "../../store/workout/work.action"; 5 | import { 6 | Grid, 7 | GridItem, 8 | Heading, 9 | Box, 10 | Flex, 11 | Button, 12 | Collapse, 13 | useDisclosure, 14 | InputGroup, 15 | Input, 16 | InputRightElement, 17 | Accordion, 18 | AccordionItem, 19 | AccordionButton, 20 | AccordionPanel, 21 | Text, 22 | IconButton, 23 | Hide, 24 | } from "@chakra-ui/react"; 25 | 26 | import { BiSearchAlt2 } from "react-icons/bi"; 27 | import { 28 | AddIcon, 29 | MinusIcon, 30 | SearchIcon, 31 | TriangleDownIcon, 32 | } from "@chakra-ui/icons"; 33 | import { Link } from "react-router-dom"; 34 | 35 | const Pilot = () => { 36 | const pilots = useSelector((store) => store.pilot); 37 | const dispatch = useDispatch(); 38 | const { isOpen, onToggle } = useDisclosure(); 39 | 40 | useEffect(() => { 41 | dispatch(getPilot()); 42 | }, []); 43 | 44 | // return ( 45 | //
46 | // 47 | // 53 | // Pilot Program 54 | // 55 | // 56 | // 57 | // 58 | // 59 | // 60 | // 64 | 65 | // useEffect(() => { 66 | // dispatch(getPilot()); 67 | // }, []); 68 | 69 | return ( 70 |
71 | 72 | 78 | Pilot Programs 79 | 80 | 81 | 82 | 83 | 84 | 85 | 89 | 90 | 91 | 99 |

Hello Its Me!

100 | 101 | 102 | 103 | 104 | 105 | 106 | 107 | {({ isExpanded }) => ( 108 | <> 109 |

110 | 111 | 112 | 113 | 114 | Search 115 | 116 | 117 | 118 |

119 | 120 | 121 | 125 | } 128 | /> 129 | 130 | 131 | 132 | )} 133 | 134 | 135 | 136 | 137 | 138 | 139 | 151 | {pilots.pilot[0] && 152 | pilots.pilot[0].map((pro) => ( 153 | 154 | 155 | 162 | 163 | 164 | ))} 165 | 166 |
167 | ); 168 | }; 169 | 170 | export default Pilot; 171 | -------------------------------------------------------------------------------- /src/pages/Workouts/Workout.css: -------------------------------------------------------------------------------- 1 | .effect:hover{ 2 | box-shadow: #4296cb 0px 3px 8px; 3 | box-shadow: #4296cb 0px 1px 4px, #4296cb 0px 0px 0px 3px; 4 | box-shadow: rgba(3, 102, 214, 0.3) 0px 0px 0px 3px; 5 | box-shadow: #4296cb 6px 2px 16px 0px, #4296cb -6px -2px 16px 0px; 6 | } 7 | .effect1:hover{ 8 | box-shadow: -6px -6px 11px 0px rgba(207, 52 , 118 ,0.34); 9 | } 10 | .WorkTop 11 | { 12 | width: 100%; 13 | height: 550px; 14 | margin: auto; 15 | background-image: url('https://d18zdz9g6n5za7.cloudfront.net/workouts_programs/masthead-workouts.jpg'); 16 | background-repeat: no-repeat; 17 | background-size: cover; 18 | background-position: center center; 19 | font-family: "Maison Neue","Helvetica Neue",Helvetica,Arial,"Lucida Grande",sans-serif; 20 | color: #fff; 21 | font-weight: 400; 22 | padding-top: 170px; 23 | } 24 | .WorkTopdiv{ 25 | width: 75%; 26 | height: auto; 27 | margin: auto; 28 | 29 | text-align: left; 30 | } 31 | .WorkTopdiv>div{ 32 | padding-bottom: 15px; 33 | padding-left: 0px; 34 | color: #4296cb; 35 | font-weight: 600; 36 | letter-spacing: 0.042em; 37 | font-size: 1rem; 38 | line-height: 26px; 39 | } 40 | .WorkTopdiv>h1{ 41 | letter-spacing: -0.02em; 42 | font-size: 2.8rem; 43 | font-weight: 400; 44 | line-height: 1.2em; 45 | margin: 0 0 0.5em 0; 46 | } 47 | .WorkTopdiv>p{ 48 | line-height: 1.625em; 49 | padding: 0px 30px 0px 0px; 50 | margin: -9px 0px 0px 0px; 51 | font-size: 1.2rem; 52 | } 53 | /* card sec start */ 54 | .WorkCard{ 55 | width: 100%; 56 | height: auto; 57 | background-color: #e3ebee; 58 | padding-top: 4rem; 59 | padding-bottom: 6rem; 60 | padding-right: 3rem; 61 | padding-left: 3rem; 62 | color: #212432; 63 | font-family: "Maison Neue","Helvetica Neue",Helvetica,Arial,"Lucida Grande",sans-serif; 64 | } 65 | .WorkCard2{ 66 | width: 100%; 67 | height: auto; 68 | background-color: #f0f4f6; 69 | padding-top: 4rem; 70 | padding-bottom: 6rem; 71 | padding-right: 3rem; 72 | padding-left: 3rem; 73 | color: #212432; 74 | font-family: "Maison Neue","Helvetica Neue",Helvetica,Arial,"Lucida Grande",sans-serif; 75 | } 76 | .WorkCard1{ 77 | width: 85%; 78 | height: auto; 79 | margin: auto; 80 | padding: 10px; 81 | } 82 | .Free{ 83 | width: 100%; 84 | color: #fff; 85 | text-align: center; 86 | font-size: 1rem; 87 | font-weight: bold; 88 | display: flex; 89 | padding-bottom: -20px; 90 | justify-content: center 91 | } 92 | .Free>div{ 93 | background-color: greenyellow; 94 | border: 2px solid #fff; 95 | width: 4rem; 96 | height: 20px; 97 | border-radius: 10px; 98 | text-align: center; 99 | 100 | } 101 | @media only screen and (min-width: 0px) and (max-width: 612px) { 102 | .WorkTop 103 | { 104 | width: 100%; 105 | height: 400px; 106 | margin: auto; 107 | background-image: url('https://d18zdz9g6n5za7.cloudfront.net/workouts_programs/masthead-workouts.jpg'); 108 | background-repeat: no-repeat; 109 | background-size: cover; 110 | background-position: center center; 111 | font-family: "Maison Neue","Helvetica Neue",Helvetica,Arial,"Lucida Grande",sans-serif; 112 | color: #fff; 113 | font-weight: 400; 114 | padding-top: 80px; 115 | } 116 | .WorkTopdiv{ 117 | width: 80%; 118 | 119 | text-align: center; 120 | } 121 | .WorkTopdiv>div{ 122 | padding-bottom: 12px; 123 | 124 | font-weight: 500; 125 | 126 | font-size: 0.8rem; 127 | line-height: 20px; 128 | } 129 | .WorkTopdiv>h1{ 130 | 131 | font-size: 2rem; 132 | font-weight: 400; 133 | 134 | } 135 | .WorkCard{ 136 | width: 100%; 137 | height: auto; 138 | padding-top: 0.7rem; 139 | padding-bottom: 2rem; 140 | padding-right: 1rem; 141 | padding-left: 1rem; 142 | 143 | 144 | } 145 | .WorkCard2{ 146 | width: 100%; 147 | height: auto; 148 | 149 | padding-top: 0.7rem; 150 | padding-bottom: 2rem; 151 | padding-right: 1rem; 152 | padding-left: 1rem; 153 | 154 | } 155 | .workoutlink 156 | { 157 | display: none; 158 | 159 | } 160 | } 161 | 162 | 163 | @media only screen and (min-width: 613px) and (max-width: 1090px) { 164 | .WorkTop 165 | { 166 | width: 100%; 167 | height: 400px; 168 | margin: auto; 169 | background-image: url('https://d18zdz9g6n5za7.cloudfront.net/workouts_programs/masthead-workouts.jpg'); 170 | background-repeat: no-repeat; 171 | background-size: cover; 172 | background-position: center center; 173 | font-family: "Maison Neue","Helvetica Neue",Helvetica,Arial,"Lucida Grande",sans-serif; 174 | color: #fff; 175 | font-weight: 400; 176 | padding-top: 80px; 177 | } 178 | .WorkTopdiv{ 179 | width: 80%; 180 | 181 | text-align: left; 182 | } 183 | .WorkTopdiv>div{ 184 | padding-bottom: 12px; 185 | 186 | font-weight: 500; 187 | 188 | font-size: 0.8rem; 189 | line-height: 20px; 190 | } 191 | .WorkTopdiv>h1{ 192 | 193 | font-size: 2rem; 194 | font-weight: 400; 195 | 196 | } 197 | .WorkCard{ 198 | width: 100%; 199 | height: auto; 200 | padding-top: 1rem; 201 | padding-bottom: 2.5rem; 202 | padding-right: 1rem; 203 | padding-left: 1rem; 204 | 205 | 206 | } 207 | .WorkCard2{ 208 | width: 100%; 209 | height: auto; 210 | 211 | padding-top: 0.7rem; 212 | padding-bottom: 2rem; 213 | padding-right: 1rem; 214 | padding-left: 1rem; 215 | 216 | } 217 | .WorkTopdiv>p{ 218 | width: 62%; 219 | line-height: 1.625em; 220 | padding: 0px 30px 0px 0px; 221 | margin: -9px 0px 0px 0px; 222 | font-size: 1.2rem; 223 | 224 | } 225 | } -------------------------------------------------------------------------------- /src/pages/about/Careers.jsx: -------------------------------------------------------------------------------- 1 | import React from "react"; 2 | import "./Careers.css" 3 | 4 | function Careers(){ 5 | return ( 6 | <> 7 |
8 |
9 |
10 |
11 |

Come Join the FB Family.

16 |
17 | 18 |
26 |

Our Story

27 |

28 | Fitness Blender was created by a husband and wife team of personal 29 | trainers who felt that there was a lack of reliable health and fitness 30 | information on the web. They were frustrated that too many people in 31 | the fitness industry were more focused on monetary gain or outward 32 | appearance than on good, achievable, long-term health. Now, more than 33 | 10 years later, Kelli and Daniel Segars, are still focused on their 34 | original goals and approach for the company: 35 |

36 |
  • 37 | Make health and fitness attainable, affordable, and approachable—for 38 | as many people as possible. 39 |
    • 40 |
  • 41 | Endorse eating unprocessed, whole foods, and working out for a strong, 42 | healthy body. 43 |
    • 44 |
  • Encourage a personal, mindful approach to eating and exercise.
    • 45 |
  • 46 | Promote the fact that overall wellness looks different for each 47 | individual. 48 |
    • 49 |
    50 |
    61 |
    68 |

    Become a Fitness Blender

    69 |

    Content Creator

    70 |

    71 | We are working to expand the depth and diversity of the content we 72 | offer. From Workout Videos to Healthy Living articles and recipes, 73 | we want to be able to provide users with as much reliable health and 74 | fitness content as possible. If you're an experienced professional 75 | in the areas we have listed below, we'd like to hear from you. 76 |

    77 |
    78 |
    79 | 85 |
    86 |
    87 |
    94 |

    Open Content Roles

    95 |
    103 |
    104 |
    105 | 110 |
    111 |
    112 |

    Certified Personal Trainer

    113 |

    114 | Join our CPTs in creating workout videos to enhance our overall 115 | library, and diversity of workout options. 116 |

    117 |
    118 |
    119 |
    120 |
    121 | 126 |
    127 |
    128 |

    Yoga Instructor

    129 |

    130 | Are you a fitness professional? Join the content team to bring 131 | new types of fitness videos to our growing library and audience. 132 |

    133 |
    134 |
    135 |
    136 |
    137 | 142 |
    143 |
    144 |

    Professional Recipe Developer

    145 |

    146 | {" "} 147 | Join our content team, working closely with RDNs/LDNs to create 148 | easy-to-understand, easy-to-use healthy recipe content. 149 |

    150 |
    151 |
    152 |
    153 |
    154 | 159 |
    160 |
    161 |

    Registered Dietitian Nutritionist

    162 |

    163 | Join the content team to help create easy-to-understand 164 | nutrition and healthy eating content, including recipe-based 165 | meal plans. 166 |

    167 |
    168 |
    169 |
    170 |
    171 | 172 | 173 | ); 174 | } 175 | 176 | export default Careers; 177 | -------------------------------------------------------------------------------- /src/pages/Workouts/CustomWorkout/CustomWorkout.jsx: -------------------------------------------------------------------------------- 1 | import React from "react"; 2 | import { 3 | AspectRatio, 4 | Box, 5 | Grid, 6 | GridItem, 7 | Heading, 8 | Image, 9 | Link, 10 | Text, 11 | } from "@chakra-ui/react"; 12 | import "./CustomWorkout.css"; 13 | import Slide from "./Slide" 14 | const CustomWorkout = () => { 15 | return ( 16 | 20 | {/* */} 28 | 29 | 35 | Walkthrough 36 | 37 | 38 | 47 | 48 | 49 | 50 | 51 | 61 | 69 | Add Your Own Workouts to Fitness Blender 70 | 71 | 87 | Whether you want to track your evening walk or earn your workout 88 | complete with your favorite videos from outside Fitness Blender, 89 | you can now add custom workouts to your{" "} 90 | FB Plus account. 91 | 92 | 93 | 94 | 95 | 96 | 97 | 106 | 107 | 117 | 125 | Add, Schedule, and Track 126 | 127 | 143 | Create a custom workout with detailed information just like a 144 | Fitness Blender workout. You can then add it to your calendar, 145 | earn your workout complete, and track its stats on the FB 146 | dashboard. 147 | 148 | 149 | 150 | 151 | 152 | 153 | 154 | 155 | 156 | 166 | 176 |