Report of Gym Website

1|Page
Introduction of the Project Gym Website:

The "Gym Website" has been developed to override the problems prevailing in the
practicing manual system. This software is supported to eliminate and in some cases
reduce the hardships faced by this existing system. Moreover, this system is designed
for the particular need of the company to carry out operations in a smooth and effective
manner.

The application is reduced as much as possible to avoid errors while entering the data.
It also provides error message while entering invalid data. No formal knowledge is
needed for the user to use this system. Thus by this all it proves it is user-friendly. Gym
Website, as described above, can lead to error free, secure, reliable and fast
management system. It can assist the user to concentrate on their other activities rather
to concentrate on the record keeping. Thus it will help organization in better utilization of
resources.

Every organization, whether big or small, has challenges to overcome and managing
the information of Trainer, Gym, Facility, Time Slot, Fitness Class. Every Gym Website
has different Gym needs; therefore, we design exclusive employee management
systems that are adapted to your managerial requirements. This is designed to assist in
strategic planning, and will help you ensure that your organization is equipped with the
right level of information and details for your future goals. Also, for those busy executive
who are always on the go, our systems come with remote access features, which will
allow you to manage your workforce anytime, at all times. These systems will ultimately
allow you to better manage resources.

2|Page
Abstract of the Project Gym Website:
The purpose of Gym Website is to automate the existing manual system by the
help of computerized equipment’s and full-fledged computer software, fulfilling their
requirements, so that their valuable data/information can be stored for a longer period
with easy accessing and manipulation of the same. The required software and hardware
are easily available and easy to work with.

Gym Website, as described above, can lead to error free, secure, reliable and
fast management system. It can assist the user to concentrate on their other activities
rather to concentrate on the record keeping. Thus it will help organization in better
utilization of resources. The organization can maintain computerized records without
redundant entries. That means that one need not be distracted by information that is not
relevant, while being able to reach the information.

The aim is to automate its existing manual system by the help of computerized
equipment’s and full-fledged computer software, fulfilling their requirements, so that
their valuable data/information can be stored for a longer period with easy accessing
and manipulation of the same. Basically the project describes how to manage for good
performance and better services for the clients.

3|Page
Objective of Project on Gym Website:

The main objective of the Project on Gym Website is to manage the details of
Gym, Trainer, Member, Facility, Fitness Class. It manages all the information about
Gym, Time Slot, Fitness Class, Gym. The project is totally built at administrative end
and thus only the administrator is guaranteed the access. The purpose of the project is
to build an application program to reduce the manual work for managing the Gym,
Trainer, Time Slot, Member. It tracks all the details about the Member, Facility, Fitness
Class.

Functionalities provided by Gym Website are as follows:

 Provides the searching facilities based on various factors. Such as Gym, Member,
Facility, Fitness Class

 Gym Website also manage the Time Slot details online for Facility details, Fitness
Class details, Gym.

 It tracks all the information of Trainer, Time Slot, Facility etc.

 Manage the information of Trainer

 Shows the information and description of the Gym, Member

 To increase efficiency of managing the Gym, Trainer

 It deals with monitoring the information and transactions of Facility.

 Manage the information of Gym

 Editing, adding and updating of Records is improved which results in proper

resource management of Gym data.

 Manage the information of Facility

 Integration of all records of Fitness Class.

4|Page
Scope of the project Gym Website

It may help collecting perfect management in details. In a very short time, the
collection will be obvious, simple and sensible. It will help a person to know the
management of passed year perfectly and vividly. It also helps in current all works
relative to Gym Website. It will be also reduced the cost of collecting the management &
collection procedure will go on smoothly.

Our project aims at Business process automation, i.e. we have tried to

computerize various processes of Gym Website.

 In computer system the person has to fill the various forms & number of copies of
the forms can be easily generated at a time.
 In computer system, it is not necessary to create the manifest but we can directly
print it, which saves our time.
 To assist the staff in capturing the effort spent on their respective working areas.
 To utilize resources in an efficient manner by increasing their productivity through
automation.
 The system generates types of information that can be used for various
purposes.
 It satisfies the user requirement
 Be easy to understand by the user and operator
 Be easy to operate
 Have a good user interface
 Be expandable
 Delivered on schedule within the budget.

5|Page
Reports of Gym Website:

 It generates the report on Gym, Trainer, Time Slot

 Provide filter reports on Member, Facility, Fitness Class

 You can easily export PDF for the Gym, Time Slot, Facility

 Application also provides excel export for Trainer, Member, Fitness Class

 You can also export the report into csv format for Gym, Trainer, Fitness Class

Modules of Gym Website:

 Gym Management Module: Used for managing the Gym details.

 Fitness Class Module: Used for managing the details of Fitness Class
 Time Slot Module: Used for managing the details of Time Slot
 Trainer Management Module: Used for managing the information and details of
the Trainer.
 Member Module: Used for managing the Member details
 Facility Module: Used for managing the Facility information
 Login Module: Used for managing the login details
 Users Module: Used for managing the users of the system

6|Page
Features of the project Gym Website:

 Product and Component based

 Reporting & Charting in more comprehensive way
 Simple Status & Resolutions
 Accuracy in work.
 Easy & fast retrieval of information.
 Access of any information individually.
 Work becomes very speedy.
 Easy to update information
Tools/Platform, Hardware and Software Requirement specifications:

Software Requirements:

Name of component Specification

Operating System Windows 10, Windows7, Linux
Language Html, Css
Browser Any of Microsoft Edge, Chrome etc.
Software Visual studio, Sublime text editor etc.

Hardware Requirements:

Name of component Specification

Processor Intel core2duo
RAM 2Gb
Hard disk 20 GB
Monitor 15” color monitor
Keyboard 122 keys

7|Page
 Screenshot of the
Project Gym
Website

8|Page
9|Page
10 | P a g e
 Code of the Project
Gym Website

11 | P a g e
 Coding for home.html
1 <!DOCTYPE html>

2 <html lang="en">

3 <head>

4 <meta charset="UTF-8">

5 <meta http-equiv="X-UA-Compatible" content="IE=edge">

6 <meta name="viewport" content="width=device-width, initial-scale=1.0">

7 <title>MGYM</title>

8 <link rel="stylesheet" href="css/style.css">

9 <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font- awesome/5.15.4/css/all.min.css">

10 </head>

11 <body>

12

13 <header class="header">

14

15 <a href="#" class="logo"> MGYM </a>

16

17 <nav class="navbar">

18 <a href="#home">home</a>

19 <a href="#about">about</a>

20 <a href="#service">service</a>

21 <a href="#products">products</a>

22 <a href="#review">review</a>

23 <a href="#contact">contact</a>

24 <a href="#blogs">blogs</a>

25 </nav>

26 </header>

27 <section class="home" id="home">

28 <div class="content">

29 <h2>GYM/YOGA/FITNESS</h2>

30 <h3>Get Fitnass Now!</h3>

31 <p>We Are More Ffffective To Making Different Yourself From Others</p>

32 <a href="#" class="btn">Join us today</a>

33 </div>

12 | P a g e
34 </section>

35

36 <section class="about" id="about">

37

38 <h1 class="heading"> <span>about</span> us </h1>

39

40 <div class="row">

41

42 <div class="image">

43 <img src="images/about-img.jpg" alt="">

44 </div>

45

46 <div class="content">

47 <h3>We Have Expert Team Member Meet Our Trainer</h3>

48 <p>Avoids pleasure itself, because it is pleasure,

49 but because those who do not know how to pursue pleasure rationally encounter consequences that are extremely painful.

50 Nor again is there anyone who loves or pursues or desires to obtain pain of itself because it is pain.</p>

51 <a href="#" class="btn">learn more</a>

52 </div>

53

54 </div>

55

56 </section>

57

58 <section class="menu" id="service">

59

60 <h1 class="heading"> our <span>Services.</span> </h1>

61

62 <div class="box-container">

63

64 <div class="box">

65 <img src="images/service-1.jpg" alt="">

66 <h3>Consultation</h3>

67 </div>

13 | P a g e
68

69 <div class="box">

70 <img src="images/service-2.jpg" alt="">

71 <h3>Body Building</h3>

72 </div>

73

74 <div class="box">

75 <img src="images/service-3.jpg" alt="">

76 <h3>Cycling</h3>

77 </div>

78

79 <div class="box">

80 <img src="images/service-4.jpg" alt="">

81 <h3>Lose Weight</h3>

82 </div>

83

84 <div class="box">

85 <img src="images/service-5.jpg" alt="">

86 <h3>Weight Lifting</h3>

87 </div>

88

89 <div class="box">

90 <img src="images/service-6.jpg" alt="">

91 <h3>Fitness Track</h3>

92 </div>

93

94 </div>

95

96 </section>

97

98 <section class="products" id="products">

99

100 <h1 class="heading"> our <span>products</span> </h1>

101

14 | P a g e
102 <div class="box-container">

103

104 <div class="box">

105 <div class="image">

106 <img src="images/product-1.png" alt="">

107 </div>

108 <div class="content">

109 <h3>Boxing Gloves</h3>

110 <div class="price">500<span>650</span></div>

111 <a href="#" class="btn">Shop Now</a>

112 </div>

113 </div>

114

115 <div class="box">

116 <div class="image">

117 <img src="images/product-2.png" alt="">

118 </div>

119 <div class="content">

120 <h3>Sports jercy</h3>

121 <div class="price">999 <span>1299</span></div>

122 <a href="#" class="btn">Shop Now</a>

123 </div>

124 </div>

125

126 <div class="box">

127

128 <div class="image">

129 <img src="images/product-3.png" alt="">

130 </div>

131 <div class="content">

132 <h3>Protein powder & pill</h3>

133 <div class="price">4599<span>6999</span></div>

134 <a href="#" class="btn">Shop Now</a>

135 </div>

15 | P a g e
136 </div>

137

138 </div>

139

140 </section>

141 <section class="review" id="review">

142

143 <h1 class="heading"> customer's <span>review</span> </h1>

144 <div class="box-container">

145 <div class="box">

146 <img src="images/pic-1.png" class="user" alt="">

147 <h3>john</h3>

148 <p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Saepe, ducimus!</p>

149 </div>

150

151 <div class="box">

152 <img src="images/pic-2.png" class="user" alt=""> <h3>Rina</h3>

153

154 <p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Repellat, odio?</p>

155

156 </div>

157

158 <div class="box">

159

160 <img src="images/pic-3.png" class="user" alt="">

161 <h3>Rahul</h3>

162

163 <p>Lorem ipsum, dolor sit amet consectetur adipisicing elit. Expedita, reiciendis?</p>

164 </div>

165

166 </div>

167 </section>

168 <section class="contact" id="contact">

169

16 | P a g e
170 <h1 class="heading"> <span>contact</span> us </h1>

171 <div class="row">

172 <div class="left-contact">

173 <h3 class="table-heading">Reach Us</h3>

174 <table>

175 <tr>

176 <td>Email</td>

177 <td>mks.utttam@gmail.com</td>

178 </tr>

179 <tr>

180 <td>Mobile</td>

181 <td>+918905528388</td>

182 </tr>

183 <tr>

184 <td>Address</td>

185 <td>Word no. 21 1knn phephana raj. </td>

186 </tr>

187 </table>

188 </div>

189 <form action="">

190 <h3>get in touch</h3>

191 <div class="inputBox">

192 <span class="fas fa-user"></span>

193 <input type="text" placeholder="name">

194 </div>

195 <div class="inputBox">

196 <span class="fas fa-envelope"></span>

197 <input type="email" placeholder="email">

198 </div>

199 <div class="inputBox">

200 <span class="fas fa-phone"></span>

201 <input type="number" placeholder="number">

202 </div>

203 <input type="submit" value="contact now" class="btn">

17 | P a g e
204 </form>

205

206 </div>

207

208 </section>

209

210 <section class="blogs" id="blogs">

211

212 <h1 class="heading"> our <span>blogs</span> </h1>

213

214 <div class="box-container">

215

216 <div class="box">

217 <div class="image">

218 <img src="images/blog-1.jpg" alt="">

219 </div>

220 <div class="content">

221 <a href="#" class="title">How To Manage A Healthy Diet Plan</a>

222 <span>by Mukesh kumar / 21st dec, 2021</span>

223 <a href="#" class="btn">read more</a>

224 </div>

225 </div>

226

227 <div class="box">

228 <div class="image">

229 <img src="images/blog-2.jpg" alt="">

230 </div>

231 <div class="content">

232 <a href="#" class="title">Follow Simple Rukes To Get Best Fitness</a>

233 <span>by Mukesh kumar / 22st dec, 2021</span>

234 <a href="#" class="btn">read more</a>

235 </div>

236 </div>

237

18 | P a g e
238 <div class="box">

239 <div class="image">

240 <img src="images/blog-3.jpg" alt="">

241 </div>

242 <div class="content">

243 <a href="#" class="title">10 Rukes For Daily Routine To Folllow</a>

244 <span>by Mukesh kumar / 23st dec, 2021</span>

245

246 <a href="#" class="btn">read more</a>

247 </div>

248 </div>

249

250 </div>

251

252 </section>

253 <section class="footer">

254

255 <div class="share">

256 <a href="#" class="fab fa-facebook-f"></a>

257 <a href="#" class="fab fa-twitter"></a>

258 <a href="#" class="fab fa-instagram"></a>

259 <a href="#" class="fab fa-linkedin"></a>

260 <a href="#" class="fab fa-pinterest"></a>

261 </div>

262

263 <div class="credit">created by <span>Mr. Mukesh Kumar</span> | all rights reserved</div>

264

265 </section>

266

267 </body>

268 </html>

19 | P a g e
 Coding for style.css

1 @import url('./Poppins-Black.ttf');

3 :root{

4 --main-color:#ff7800;

5 --black:#13131a;

6 --bg:#010103;

7 --border:.1rem solid rgba(255,255,255,.3);

8 --outline-hover:.2rem solid var(--main-color);

10 }

11

12 *{

13 font-family: 'poppins';

14 margin:0; padding:0;

15 box-sizing: border-box;

16 outline: none; border:none;

17 text-decoration: none;

18 text-transform: capitalize;

19 transition: .2s linear;

20 }

21

22 html{

23 font-size: 62.5%;

24 overflow-x: hidden;

25 scroll-padding-top: 9rem;

26 scroll-behavior: smooth;

27 }

28

29 html::-webkit-scrollbar{

30 width: .8rem;

31 }

20 | P a g e
32

33 html::-webkit-scrollbar-track{

34 background: transparent;

35 }

36

37 html::-webkit-scrollbar-thumb{

38 background: #fff;

39 border-radius: 5rem;

40 }

41

42 body{

43 background: var(--bg);

44 }

45

46 section{

47 padding:2rem 7%;

48 }

49 .header{

50 background: var(--bg);

51 display: flex;

52 align-items: center;

53 justify-content: space-between;

54 padding:1.5rem 7%;

55 border-bottom: var(--border);

56 position: absolute;

57 top:0; left: 0; right: 0;

58 z-index: 1000;

59 }

60

61 .header .logo{

62 font-size: 1.7rem;

63 font-weight: bolder;

64 color: var(--main-color);

65 }

21 | P a g e
66

67 .header .navbar a{

68 margin:0 1rem;

69 font-size: 1.6rem;

70 color:#fff;

71 }

72

73 .header .navbar a:hover{

74 color:var(--main-color);

75 border-bottom: .1rem solid var(--main-color);

76 padding-bottom: .5rem;

77 }

78

79

80 .heading{

81 text-align: center;

82 color:#fff;

83 text-transform: uppercase;

84 padding-bottom: 3.5rem;

85 font-size: 4rem;

86 }

87

88 .heading span{

89 color:var(--main-color);

90 text-transform: uppercase;

91 }

92

93 .btn{

94 margin-top: 1rem;

95 display: inline-block;

96 padding:.9rem 3rem;

97 font-size: 1.7rem;

98 color:#fff;

99 background: var(--main-color);

22 | P a g e
100 cursor: pointer;

101 }

102

103 .btn:hover{

104 letter-spacing: .2rem;

105 }

106

107

108 .home{

109 min-height: 80vh;

110 display: flex;

111 align-items: center;

112 background:url(../home-img.jpeg) no-repeat;

113 background-size: cover;

114 background-position: center;

115 }

116

117 .home .content{

118 max-width: 60rem;

119 }

120

121 .home .content h3{

122 font-size: 6rem;

123 text-transform: uppercase;

124 color:#fff;

125 }

126

127 .home .content p, h2{

128 font-size: 2rem;

129 font-weight: lighter;

130 line-height: 1.8;

131 padding:1rem 0;

132 color:#eee;

133 }

23 | P a g e
134

135 .about .row{

136 display: flex;

137 align-items: center;

138 background:var(--black);

139 flex-wrap: wrap;

140 }

141

142 .about .row .image{

143 flex:1 1 45rem;

144 }

145

146 .about .row .image img{

147 width: 100%;

148 }

149 .about .row .content{

150 flex:1 1 45rem;

151 padding:2rem;

152 }

153

154 .about .row .content h3{

155 font-size: 3rem;

156 color:#fff;

157 }

158

159 .about .row .content p{

160 font-size: 1.6rem;

161 color:#ccc;

162 padding:1rem 0;

163 line-height: 1.8;

164 }

165

166 .menu .box-container{

167 display: grid;

24 | P a g e
168 grid-template-columns: repeat(auto-fit, minmax(30rem, 1fr));

169 gap:1.5rem;

170 }

171

172 .menu .box-container .box{

173 text-align: center;

174 border:var(--border);

175 padding-top: 30px;

176 }

177

178 .menu .box-container .box img{

179 height: 20rem;

180

181

182 }

183

184 .menu .box-container .box h3{

185 color: #fff;

186 font-size: 2rem;

187 bottom: 0px;

188

189 }

190

191 .box:hover{

192 outline: var(--outline-hover);

193 }

194

195 .products .box-container{

196 display: grid;

197 grid-template-columns: repeat(auto-fit, minmax(30rem, 1fr));

198 gap:1.5rem;

199 }

200

201 .products .box-container .box{

25 | P a g e
202 text-align: center;

203 border:var(--border);

204 padding: 2rem;

205 }

206

207

208

209 .products .box-container .box .image{

210 padding: 2.5rem 0;

211 }

212

213 .products .box-container .box .image img{

214 height: 25rem;

215 }

216

217 .products .box-container .box .content h3{

218 color:#fff;

219 font-size: 2.5rem;

220 }

221

222 .products .box-container .box .content .price{

223 color:#fff;

224 font-size: 2.5rem;

225 }

226

227 .products .box-container .box .content .price span{

228 text-decoration: line-through;

229 font-weight: lighter;

230 font-size: 1.5rem;

231 }

232

233 .review .box-container{

234 display: grid;

235 grid-template-columns: repeat(auto-fit, minmax(30rem, 1fr));

26 | P a g e
236 gap:1.5rem;

237 }

238

239 .review .box-container .box{

240 border:var(--border);

241 text-align: center;

242 padding:3rem 2rem;

243 }

244

245 .review .box-container .box p{

246 font-size: 1.5rem;

247 line-height: 1.8;

248 color:#ccc;

249 padding:2rem 0;

250 }

251

252 .review .box-container .box .user{

253 height: 7rem;

254 width: 7rem;

255 border-radius: 50%;

256 object-fit: cover;

257 }

258

259 .review .box-container .box h3{

260 padding:1rem 0;

261 font-size: 2rem;

262 color:#fff;

263 }

264

265 .contact .row{

266 display: flex;

267 justify-content: space-between;

268 background:var(--black);

269

27 | P a g e
270 }

271

272 .contact .row form{

273 flex-basis: 60%;

274 padding:1rem 1rem;

275 text-align: center;

276 }

277

278 .contact .row form h3{

279 text-transform: uppercase;

280 font-size: 3.5rem;

281 color:#fff;

282 }

283

284 .contact .row form .inputBox{

285 display: flex;

286 align-items: center;

287 margin-top: 1rem;

288 margin-bottom: 1rem;

289 background:var(--bg);

290 border:var(--border);

291 }

292

293 .contact .row form .inputBox span{

294 color:#fff;

295 font-size: 1rem;

296 padding-left: 1rem;

297 }

298

299 .contact .row form .inputBox input{

300 width: 100%;

301 padding:2rem;

302 font-size: 1.7rem;

303 color:#fff;

28 | P a g e
304 text-transform: none;

305 background:none;

306 }

307 .left-contact{

308 flex-basis: 40%;

309 font-size: 2rem;

310 padding-top: 5rem;

311 padding-left: 2rem;

312 color: #fff;

313 }

314 tr td:first-child{

315 padding-right: 20px;

316 }

317 .table-heading{

318 margin-bottom: 30px;

319 }

320 tr {

321 padding-bottom: 30px;

322 }

323 .blogs .box-container{

324 display: grid;

325 grid-template-columns: repeat(auto-fit, minmax(30rem, 1fr));

326 gap:1.5rem;

327 }

328

329 .blogs .box-container .box{

330 border:var(--border);

331 }

332

333 .blogs .box-container .box .image{

334 height: 25rem;

335 overflow:hidden;

336 width: 100%;

337 }

29 | P a g e
338

339 .blogs .box-container .box .image img{

340 height: 100%;

341 object-fit: cover;

342 width: 100%;

343 }

344

345 .blogs .box-container .box:hover .image img{

346 transform: scale(1.2);

347 }

348

349 .blogs .box-container .box .content{

350 padding:2rem;

351 }

352

353 .blogs .box-container .box .content .title{

354 font-size: 2.5rem;

355 line-height: 1.5;

356 color:#fff;

357 }

358

359 .blogs .box-container .box .content .title:hover{

360 color:var(--main-color);

361 }

362

363 .blogs .box-container .box .content span{

364 color:var(--main-color);

365 display: block;

366 padding-top: 1rem;

367 font-size: 2rem;

368 }

369

370 .blogs .box-container .box .content p{

371 font-size: 1.6rem;

30 | P a g e
372 line-height: 1.8;

373 color:#ccc;

374 padding:1rem 0;

375 }

376

377 .footer{

378 background:var(--black);

379 text-align: center;

380 }

381

382 .footer .share{

383 padding:1rem 0;

384 }

385

386 .footer .share a{

387 height: 5rem;

388 width: 5rem;

389 line-height: 5rem;

390 font-size: 2rem;

391 color:#fff;

392 border:var(--border);

393 margin:.3rem;

394 border-radius: 50%;

395 }

396

397 .footer .share a:hover{

398 background-color: var(--main-color);

399 }

400

401 .footer .links{

402 display: flex;

403 justify-content: center;

404 flex-wrap: wrap;

405 padding:2rem 0;

31 | P a g e
406 gap:1rem;

407 }

408

409 .footer .links a{

410 padding:.7rem 2rem;

411 color:#fff;

412 border:var(--border);

413 font-size: 2rem;

414 }

415

416 .footer .links a:hover{

417 background:var(--main-color);

418 }

419

420 .footer .credit{

421 font-size: 2rem;

422 color:#fff;

423 font-weight: lighter;

424 padding:1.5rem;

425 }

426

427 .footer .credit span{

428 color:var(--main-color);

32 | P a g e
Conclusion of the Project Gym Website:

Our project is only a humble venture to satisfy the needs to manage their project
work. Several user friendly coding have also adopted. The objective of software
planning is to provide a frame work that enables the manger to make reasonable
estimates made within a limited time frame at the beginning of the website project and
should be updated regularly as the project progresses.

Future Scope of the Project:

The above mentioned points are the enhancements which can be done to increase
the applicability and usage of this project. Here we can maintain the records of Gym
and Trainer. Also, as it can be seen that now-a-days the players are versatile, i.e. so
there is a scope for introducing a method to maintain the Gym Website. Enhancements
can be done to maintain all the Gym, Trainer, Member, Facility, Fitness Class.

We have left all the options open so that if there is any other future requirement
in the system by the user for the enhancement of the system then it is possible to
implement them. In the last we would like to thanks all the persons involved in the
development of the system directly or indirectly. We hope that the project will serve its
purpose for which it is develop there by underlining success of process.
References and Bibliography:
 Google fonts
 W3school
 cloudflare

33 | P a g e