Giter VIP home page Giter VIP logo

milestone-1-gym's Introduction

Milestone Project 1

Fortitude Gym

Purpose:

Fortitude gym is fictional gym created using HTML and CSS for my milestone project. It will provide users with information on the gym and it's services for existing and potential members.

Gym owner would like to aqquire new customers and provide existing customers with any relevant information.

User Stories:

As a user, I wish to be able to:

Find out what services are provided.

Find location and contact details.

See what's included in membership.

Sign up to gym.

Structure:

All pages will consist of a navigation bar, a callout with a sign up button, a footer with contact and membership details and links to social media

Features:

The navbar will bring users to their desired location.

The join now button will trigger a pop out modal prompting users to enter their details.

The social media links will all direct users to the associated website in a new window.

Technologies:

Bootstrap 4 was used for layout, to reduce navbar to hamburger menu and for the modal popout. https://getbootstrap.com/

Google fonts was used for the fonts used on site(Piedra an Roboto). https://fonts.google.com/

Font Awesome was used for the social media icon links and also for the hamburger menu icon on mobile. https://fontawesome.com/

Testing:

The nav links bring you to the desired location.

The join now button triggers the modal - had to add required for inputs.

The social media links bring you to the corresponding page in a new tab.

Deployment:

Code was deployed from Gitpod to GitHub:

Settings - Github pages - Source:branch-master - https://patricksingleton86.github.io/milestone-1-gym/.

Credits:

Content:

Got text for classes and personal trainers from 24 hour fittness - https://www.24hourfitness.com/classes/studio/ https://www.24hourfitness.com/training/

Photos:

Leon Ardho - https://www.pexels.com/photo/barbell-on-the-floor-1552252/

Andrea Piacquadio - https://www.pexels.com/photo/serious-sportsman-training-on-exercise-machine-in-modern-gym-3838937/

Jonathan Borba - https://www.pexels.com/photo/woman-kneeling-with-barbel-on-shoulders-3076514/

William Choquette - https://www.pexels.com/photo/an-on-treadmill-1954524/

Victor Freitas - https://www.pexels.com/photo/man-wearing-black-shorts-lifting-heavy-barbells-841135/

Andrea Piacquadio - https://www.pexels.com/photo/photo-of-woman-using-earphones-3757954/

Ketut Subiyanto - https://www.pexels.com/photo/photo-of-man-doing-push-ups-using-yellow-kettlebell-4720251/

Andrea Piacquadio - https://www.pexels.com/photo/women-doing-yoga-class-on-pink-yoga-mat-3775593/

Pixabay - https://www.pexels.com/photo/adult-athlete-body-bodybuilding-414029/

Burst - https://www.pexels.com/photo/shallow-focus-photo-of-spoon-373941/

milestone-1-gym's People

Contributors

patricksingleton86 avatar

Watchers

James Cloos avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.