21 |
24 | Address
50 |Rahjung street, Pune, India
51 |├── .gitignore ├── CSS ├── about-us.css ├── contact-us.css ├── footer.css ├── friend.css ├── header.css ├── homepage.css ├── login.css ├── notification.css ├── post.css ├── profile.css ├── search.css ├── signup.css └── style.css ├── Database └── travellog.sql ├── Images ├── Background │ ├── img1.jpg │ ├── img3.jpg │ ├── img5.jpg │ ├── pexels-dominika-roseclay-1252500.jpg │ ├── pexels-ketut-subiyanto-4436363.jpg │ ├── pexels-mohamed-almari-368893.jpg │ └── pexels-nappy-1058959.jpg ├── Landing-Page-SS.png ├── Landing-Page-Screenshot.png ├── Mobile-Background │ ├── pexels-alex-azabache-3214958.jpg │ ├── pexels-ketut-subiyanto-4429452.jpg │ ├── pexels-simon-migaj-885880.jpg │ └── pexels-taryn-elliott-3889855.jpg ├── about-us-rec.gif ├── alps_favicon.png ├── mountain.png ├── search.png └── traveller.png ├── JS ├── about-us-toggle.js ├── change-bg.js ├── homepage.js ├── script.js └── scroll-homepage.js ├── LICENSE.txt ├── PHP ├── accept-request.php ├── add-friend.php ├── contact-us.php ├── create-post.php ├── decline-request.php ├── delete-post.php ├── disp-friend-box.php ├── edit-profile.php ├── footer.php ├── functions.php ├── header.php ├── homepage.php ├── login.php ├── logout.php ├── notification.php ├── post.php ├── profile.php ├── remove-friend.php ├── search.php ├── signup.php └── terms-and-conditions.php ├── README.md ├── about-us.html └── index.html /.gitignore: -------------------------------------------------------------------------------- 1 | .vscode/ -------------------------------------------------------------------------------- /CSS/about-us.css: -------------------------------------------------------------------------------- 1 | @import url('https://fonts.googleapis.com/css?family=Poppins:300,400,500,600,700,800,900&display=swap'); 2 | 3 | * { 4 | margin: 0; 5 | padding: 0; 6 | box-sizing: border-box; 7 | font-family: 'Montserrat', sans-serif; 8 | scroll-behavior: smooth; 9 | } 10 | 11 | body { 12 | background: #111; 13 | display: flex; 14 | flex-direction: column; 15 | } 16 | 17 | ::-webkit-scrollbar { 18 | width: 0; 19 | /* Remove scrollbar space */ 20 | background: transparent; 21 | /* Optional: just make scrollbar invisible */ 22 | } 23 | 24 | /*****************************************Header Styles *************************************************/ 25 | ul, 26 | nav { 27 | list-style: none; 28 | display: flex; 29 | flex-direction: row; 30 | } 31 | 32 | a { 33 | text-decoration: none; 34 | opacity: 0.75; 35 | color: #fff; 36 | display: flex; 37 | cursor: pointer; 38 | } 39 | 40 | a:hover { 41 | opacity: 1; 42 | } 43 | 44 | .grid { 45 | width: 100%; 46 | display: flex; 47 | flex-wrap: wrap; 48 | justify-content: center; 49 | } 50 | 51 | hr { 52 | width: 250px; 53 | height: 3px; 54 | background-color: #3f51b5; 55 | border: 0; 56 | margin-bottom: 50px; 57 | } 58 | 59 | a.btn { 60 | border-radius: 4px; 61 | text-transform: uppercase; 62 | font-weight: bold; 63 | text-align: center; 64 | background-color: #333; 65 | opacity: 1; 66 | color: #fff; 67 | border: 2px solid #fff; 68 | } 69 | 70 | header { 71 | width: 95%; 72 | color: #fff; 73 | display: flex; 74 | justify-content: space-between; 75 | font-family: "Raleway", sans-serif; 76 | font-weight: 500; 77 | align-items: center; 78 | animation: 1s fadein 0.5s forwards; 79 | opacity: 0; 80 | margin: 20px auto; 81 | } 82 | 83 | @keyframes fadein { 84 | 100% { 85 | opacity: 1; 86 | } 87 | } 88 | 89 | header h2 { 90 | margin-left: 5%; 91 | } 92 | 93 | header nav { 94 | display: flex; 95 | align-items: center; 96 | justify-content: center; 97 | } 98 | 99 | header nav li { 100 | margin: 0 15px; 101 | cursor: pointer; 102 | } 103 | 104 | @media (max-width: 800px) { 105 | .content { 106 | flex-direction: column; 107 | } 108 | 109 | header { 110 | /* padding: 20px 50px; */ 111 | flex-direction: column; 112 | } 113 | 114 | header h2 { 115 | margin-left: 0; 116 | margin-bottom: 12px; 117 | } 118 | } 119 | 120 | /***************************************** Main Content Styles *************************************************/ 121 | section { 122 | position: relative; 123 | padding: 100px; 124 | } 125 | 126 | .banner { 127 | position: relative; 128 | width: 100%; 129 | min-height: 100vh; 130 | display: flex; 131 | justify-content: center; 132 | align-items: center; 133 | } 134 | 135 | .banner:before { 136 | position: absolute; 137 | bottom: 0; 138 | left: 0; 139 | width: 100%; 140 | height: 400px; 141 | z-index: 1; 142 | background: linear-gradient(to top, #111, transparent); 143 | background: linear-gradient(to bottom, #111, transparent); 144 | } 145 | 146 | .banner .content { 147 | position: relative; 148 | max-width: 900; 149 | text-align: center; 150 | z-index: 1; 151 | } 152 | 153 | .banner .content h2 { 154 | color: #fff; 155 | font-size: 5em; 156 | } 157 | 158 | .banner .content p { 159 | color: #fff; 160 | font-size: 1.2em; 161 | } 162 | 163 | .btn { 164 | position: relative; 165 | display: inline-block; 166 | margin-top: 30px; 167 | padding: 10px 30px; 168 | background: #fff; 169 | color: #333; 170 | text-decoration: none; 171 | } 172 | 173 | .fitBg { 174 | position: absolute; 175 | top: 0; 176 | left: 0; 177 | width: 100%; 178 | height: 100%; 179 | object-fit: cover; 180 | opacity: 0.5; 181 | box-shadow: 8px 8px 8px 8px black inset; 182 | background: linear-gradient(to top, #111, transparent); 183 | background: linear-gradient(to bottom, #111, transparent); 184 | border: none; 185 | } 186 | 187 | .about { 188 | position: relative; 189 | width: 100%; 190 | display: flex; 191 | justify-content: center; 192 | align-items: center; 193 | } 194 | 195 | .about .contentBx { 196 | min-width: 50%; 197 | width: 50%; 198 | text-align: end; 199 | padding-right: 40px; 200 | } 201 | 202 | .titleText { 203 | font-weight: 600; 204 | color: #fff; 205 | font-size: 2em; 206 | margin-bottom: 10px; 207 | } 208 | 209 | .text { 210 | color: #fff; 211 | font-size: 1em; 212 | } 213 | 214 | .about .imgBx { 215 | position: relative; 216 | min-width: 50%; 217 | width: 50%; 218 | min-height: 500px; 219 | } 220 | 221 | /***************************************** Banner 2 aand Banner 3 *************************************************/ 222 | .banner2, 223 | .banner3 { 224 | position: relative; 225 | width: 100%; 226 | min-height: 100vh; 227 | display: flex; 228 | justify-content: center; 229 | align-items: center; 230 | } 231 | 232 | .banner2:before, 233 | .banner3:before { 234 | /* content: ''; */ 235 | position: absolute; 236 | bottom: 0; 237 | left: 0; 238 | width: 100%; 239 | height: 400px; 240 | z-index: 1; 241 | background: linear-gradient(to top, #111, transparent); 242 | } 243 | 244 | .banner2:after, 245 | .banner3:after { 246 | /* content: ''; */ 247 | position: absolute; 248 | top: 0; 249 | left: 0; 250 | width: 100%; 251 | height: 400px; 252 | z-index: 1; 253 | background: linear-gradient(to bottom, #111, transparent); 254 | } 255 | 256 | /***************************************** Banner 2 Section Text Styles *************************************************/ 257 | .banner2 .Tagline { 258 | color: white !important; 259 | margin: 30px; 260 | display: flex; 261 | flex-direction: column; 262 | width: 60%; 263 | margin: auto; 264 | text-align: center; 265 | } 266 | 267 | .banner2 .Tagline h1 { 268 | font-family: 'Merriweather Sans', sans-serif; 269 | font-size: 40px; 270 | margin-bottom: 5px; 271 | display: inline-block; 272 | opacity: 1; 273 | } 274 | 275 | .banner2 .Tagline h3 { 276 | font-family: 'Montserrat', sans-serif; 277 | font-size: 20px; 278 | margin-top: 5px; 279 | margin-bottom: 10%; 280 | display: inline-block; 281 | } 282 | 283 | .banner2 .Tagline .buttons-flex { 284 | display: flex; 285 | justify-content: space-around; 286 | } 287 | 288 | /***************************************** Testimonial Section Styles *************************************************/ 289 | .testimonials { 290 | text-align: center; 291 | } 292 | 293 | .testimonials .content2 { 294 | text-align: center; 295 | } 296 | 297 | .testimonials .testimonialsList { 298 | position: relative; 299 | display: flex; 300 | justify-content: center; 301 | align-items: center; 302 | flex-wrap: wrap; 303 | margin-top: 40px; 304 | } 305 | 306 | .testimonials .testimonialsList .box { 307 | position: relative; 308 | width: 300px; 309 | height: 400px; 310 | background: #191919; 311 | transition: 0.5s; 312 | margin: 10px; 313 | display: flex; 314 | align-items: center; 315 | flex-direction: column; 316 | } 317 | 318 | .testimonials .testimonialsList:hover .box { 319 | opacity: 0.2; 320 | } 321 | 322 | .testimonials .testimonialsList .box:hover { 323 | opacity: 1; 324 | } 325 | 326 | .testimonials .testimonialsList .box .imgBx { 327 | display: flex; 328 | position: relative; 329 | width: 100px; 330 | height: 100px; 331 | border-radius: 100%; 332 | margin-top: 20%; 333 | } 334 | 335 | .testimonials-img { 336 | width: 100px; 337 | height: 100px; 338 | border-radius: 100%; 339 | } 340 | 341 | .testimonials .testimonialsList .box .content { 342 | width: 100%; 343 | height: 80px; 344 | padding: 20px; 345 | display: flex; 346 | flex-direction: column; 347 | justify-content: center; 348 | align-items: center; 349 | } 350 | 351 | .testimonials .testimonialsList .box .content blockquote { 352 | color: #fff; 353 | font-weight: 500; 354 | line-height: 1.2em; 355 | display: flex; 356 | padding-top: 100px; 357 | } 358 | 359 | .testimonials .testimonialsList .box .content h2 { 360 | padding-top: 20px; 361 | color: #fff; 362 | font-weight: 500; 363 | line-height: 1.2em; 364 | display: flex; 365 | } 366 | 367 | .testimonials .testimonialsList .box .content span { 368 | font-size: 0.8em !important; 369 | opacity: 0.5 !important; 370 | display: flex !important; 371 | color: #fff; 372 | font-weight: 500; 373 | line-height: 1.2em; 374 | } 375 | 376 | /***************************************** Banner 3 Section Text Styles *************************************************/ 377 | .banner3 .Tagline { 378 | color: white !important; 379 | margin: 30px; 380 | display: flex; 381 | flex-direction: column; 382 | width: 60%; 383 | margin: auto; 384 | text-align: center; 385 | } 386 | 387 | .banner3 .Tagline h1 { 388 | font-family: 'Merriweather Sans', sans-serif; 389 | font-size: 40px; 390 | margin-bottom: 5px; 391 | display: inline-block; 392 | opacity: 1; 393 | } 394 | 395 | .banner3 .Tagline h3 { 396 | font-family: 'Montserrat', sans-serif; 397 | font-size: 20px; 398 | margin-top: 5px; 399 | margin-bottom: 10%; 400 | display: inline-block; 401 | } 402 | 403 | .banner3 .Tagline .buttons-flex { 404 | display: flex; 405 | justify-content: space-around; 406 | } 407 | 408 | /***************************************** Footer Styles *************************************************/ 409 | .footer { 410 | display: flex; 411 | justify-content: center; 412 | align-items: center; 413 | flex-direction: column; 414 | } 415 | 416 | .footer .footer-links { 417 | color: #ffffff; 418 | padding: 0; 419 | } 420 | 421 | .footer .footer-links a { 422 | display: inline-block; 423 | line-height: 1.8; 424 | text-decoration: none; 425 | color: inherit; 426 | margin: 10px; 427 | padding: 5px 20px; 428 | margin-bottom: 40px; 429 | } 430 | 431 | .footer-links a:hover { 432 | background-color: black; 433 | text-decoration: underline; 434 | } 435 | 436 | .footer .sci { 437 | position: relative; 438 | display: flex; 439 | } 440 | 441 | .footer .sci li { 442 | list-style: none; 443 | } 444 | 445 | .footer .sci li a { 446 | text-decoration: none; 447 | margin: 0 20px; 448 | } 449 | 450 | .footer .sci li a .fa { 451 | color: #fff; 452 | font-size: 40px; 453 | } 454 | 455 | .copyrightText { 456 | margin-top: 20px; 457 | color: #fff; 458 | font-size: 18px; 459 | font-weight: 300; 460 | color: #666; 461 | text-align: center; 462 | } 463 | 464 | .copyrightText a { 465 | color: #fff; 466 | text-decoration: none; 467 | display: inline-block; 468 | } 469 | 470 | /***************************************** To Top Button Styles *************************************************/ 471 | .toTop { 472 | position: fixed; 473 | bottom: 40px; 474 | right: 40px; 475 | padding-top: 7px; 476 | border-radius: 50%; 477 | background: #fff; 478 | color: #333; 479 | font-size: 25px; 480 | z-index: 2; 481 | opacity: 0.7; 482 | pointer-events: auto; 483 | transition: all 0.4s; 484 | width: 50px; 485 | height: 50px; 486 | text-align: center; 487 | display: inline-block; 488 | } 489 | 490 | .toTop:hover { 491 | opacity: 1; 492 | } 493 | 494 | /***************************************** Responsive Styles for mobile *************************************************/ 495 | @media (max-width: 767px) { 496 | section { 497 | padding: 40px; 498 | } 499 | 500 | header nav li { 501 | margin: 0 !important; 502 | } 503 | 504 | nav { 505 | width: 90% !important; 506 | } 507 | 508 | nav a { 509 | font-size: 12px; 510 | margin: 5px !important; 511 | padding: 0 !important; 512 | } 513 | 514 | .banner .content { 515 | width: 95%; 516 | /* justify-content: flex-start; */ 517 | } 518 | 519 | h2 { 520 | font-size: 2em !important; 521 | /* text-align: left !important; */ 522 | } 523 | 524 | /* p { 525 | text-align: left !important; 526 | } */ 527 | p, a { 528 | font-size: 1em !important; 529 | } 530 | 531 | .about { 532 | flex-direction: column; 533 | justify-content: flex-start; 534 | background-image: linear-gradient(rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5)), url("../Images/Mobile-Background/pexels-alex-azabache-3214958.jpg"); 535 | background-position: center; 536 | background-repeat: no-repeat; 537 | background-size: cover; 538 | } 539 | 540 | .about .contentBx { 541 | max-width: 100%; 542 | width: 100%; 543 | text-align: left; 544 | padding-right: 0px; 545 | } 546 | 547 | .about .imgBx { 548 | display: none; 549 | } 550 | 551 | .Tagline { 552 | width: 100% !important; 553 | } 554 | 555 | .Tagline h1 { 556 | font-size: 1.5em !important; 557 | text-align: left; 558 | } 559 | 560 | .Tagline h3 { 561 | font-size: 1em !important; 562 | text-align: left; 563 | } 564 | 565 | .Tagline .buttons-flex { 566 | justify-content: flex-start; 567 | } 568 | 569 | .banner2 .Tagline .buttons-flex .btn { 570 | margin-right: 20%; 571 | } 572 | 573 | .banner3 .Tagline .buttons-flex .btn { 574 | font-size: 12px; 575 | margin-right: 10%; 576 | } 577 | 578 | .btn { 579 | margin-bottom: 30px; 580 | /* margin-right: 20%; */ 581 | font-size: 0.7em !important; 582 | padding: 10px 10px; 583 | } 584 | 585 | .testimonials .content2 .titleText { 586 | font-size: 1.5em !important; 587 | text-align: left; 588 | } 589 | 590 | .testimonials .testimonialsList .box .imgBx { 591 | margin-top: 30px; 592 | margin-bottom: 80px; 593 | } 594 | 595 | .testimonials .testimonialsList .box .content blockquote { 596 | padding-top: 0; 597 | text-align: left; 598 | } 599 | 600 | .footer .sci li a .fa { 601 | font-size: 30px; 602 | } 603 | } 604 | -------------------------------------------------------------------------------- /CSS/contact-us.css: -------------------------------------------------------------------------------- 1 | * { 2 | box-sizing: border-box; 3 | font-family: 'Montserrat', sans-serif; 4 | margin: 0; 5 | padding: 0; 6 | /* color: white; */ 7 | } 8 | 9 | /***************************************** CONTACT SECTION STYLING *************************************************/ 10 | .contact { 11 | align-items: center; 12 | background-image: linear-gradient(rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5)), url('../Images/Background/img1.jpg'); 13 | background-size: cover; 14 | display: flex; 15 | flex-direction: column; 16 | justify-content: center; 17 | min-height: 100vh; 18 | padding: 50px 100px; 19 | position: relative; 20 | } 21 | 22 | /********************************* CONTAINER WITHIN CONTACT SECTION STYLING *****************************************/ 23 | .container { 24 | display: flex; 25 | justify-content: center; 26 | align-items: center; 27 | width: 100%; 28 | margin-top: 30px; 29 | } 30 | 31 | /***************************************** LEFT SIDE OF CONTAINER STYLING *************************************************/ 32 | .container .contact-info { 33 | display: flex; 34 | flex-direction: column; 35 | width: 50%; 36 | } 37 | 38 | .container .contact-info a { 39 | text-decoration: none; 40 | } 41 | 42 | .container .contact-info h2 { 43 | font-size: 40px; 44 | font-weight: 300; 45 | color: white; 46 | text-decoration: none; 47 | padding-bottom: 20px; 48 | margin-top: 0; 49 | padding-top: 5px; 50 | } 51 | 52 | .container .contact-info .box { 53 | display: flex; 54 | padding: 20px 0; 55 | position: relative; 56 | } 57 | 58 | .container .contact-info .box .icon { 59 | min-width: 50px; 60 | height: 50px; 61 | background: white; 62 | display: flex; 63 | justify-content: center; 64 | align-items: center; 65 | border-radius: 50%; 66 | font-size: 20px; 67 | } 68 | 69 | .container .contact-info .box .text { 70 | display: flex; 71 | flex-direction: column; 72 | justify-content: center; 73 | /* align-items: center; */ 74 | margin-left: 20px; 75 | font-size: 16px; 76 | color: white; 77 | } 78 | 79 | .container .contact-info .box .text h3 { 80 | color: #e27802; 81 | } 82 | 83 | /***************************************** RIGHT SIDE OF CONTAINER STYLING *************************************************/ 84 | .contact-form { 85 | width: 40%; 86 | padding: 40px; 87 | background: #fff; 88 | } 89 | 90 | .contact-form h2 { 91 | font-size: 30px; 92 | color: #333; 93 | font-weight: 500; 94 | } 95 | 96 | .contact-form .input-box { 97 | position: relative; 98 | width: 100%; 99 | margin-top: 10px; 100 | } 101 | 102 | .contact-form .input-box input, textarea { 103 | width: 100%; 104 | padding: 5px 0; 105 | font-size: 16px; 106 | margin: 10px 0; 107 | border: none; 108 | outline: none; 109 | border-bottom: 1px solid #333; 110 | resize: none; 111 | } 112 | 113 | .contact-form .input-box span { 114 | position: absolute; 115 | left: 0; 116 | padding-bottom: 10px; 117 | color: gray; 118 | font-size: 12px; 119 | } 120 | 121 | .contact-form .input-box input[type="submit"] { 122 | background: none; 123 | border-radius: 18px; 124 | border: 2px solid #e27802; 125 | color: #e27802; 126 | cursor: pointer; 127 | } 128 | 129 | .contact-form .input-box input[type="submit"]:hover { 130 | background-color: #e27802; 131 | color: #333; 132 | } 133 | 134 | /***************************************** RESONSIVE STYLING *************************************************/ 135 | @media (max-width: 991px) { 136 | .contact { 137 | padding: 50px; 138 | } 139 | 140 | .container { 141 | flex-direction: column; 142 | align-items: center; 143 | } 144 | 145 | .container .contact-info { 146 | padding: 20px 0; 147 | justify-content: center; 148 | } 149 | 150 | .container .contact-info .box { 151 | padding: 0; 152 | } 153 | 154 | .container .contact-info .box .icon { 155 | height: 40px; 156 | min-width: 40px; 157 | } 158 | 159 | .container .contact-info a h2 { 160 | font-size: 30px; 161 | } 162 | 163 | .container .contact-info .box .text { 164 | margin-bottom: 40px; 165 | font-size: 12px !important; 166 | } 167 | 168 | .container .contact-info, .contact-form { 169 | width: 100%; 170 | } 171 | 172 | .contact-form h2 { 173 | font-size: 15px; 174 | } 175 | 176 | .contact-form .input-box span { 177 | font-size: 12px; 178 | } 179 | 180 | .contact-form .input-box input, textarea { 181 | font-size: 12px; 182 | } 183 | 184 | .contact-form .input-box input[type="submit"] { 185 | font-size: 12px; 186 | } 187 | } 188 | -------------------------------------------------------------------------------- /CSS/footer.css: -------------------------------------------------------------------------------- 1 | a{ 2 | text-decoration: none; 3 | opacity: 0.75; 4 | color: #fff; 5 | } 6 | 7 | a:hover{ 8 | opacity: 1; 9 | } 10 | 11 | /******************************************* FOOTER STYLING ***********************************/ 12 | footer { 13 | position: relative; 14 | text-align: center!important; 15 | padding: 20px; 16 | font-size: 20px!important; 17 | font-family: 'Montserrat'!important; 18 | } 19 | 20 | hr { 21 | /* width: 250px; */ 22 | height: 3px; 23 | background-color: #3f51b5; 24 | border: 0; 25 | margin-bottom: 50px; 26 | } 27 | 28 | .footer-distributed { 29 | background-color: #292c2f; 30 | box-shadow: 0 1px 1px 0 rgba(0, 0, 0, 0.12); 31 | box-sizing: border-box; 32 | width: 100%; 33 | font-family: 'Montserrat', sans-serif; 34 | font: bold 16px; 35 | } 36 | 37 | .footer-distributed { 38 | display: inline-block; 39 | vertical-align: top; 40 | } 41 | 42 | .footer-distributed .footer-links { 43 | color: #ffffff; 44 | padding: 0; 45 | } 46 | 47 | .footer-distributed .footer-links a { 48 | display: inline-block; 49 | line-height: 1.8; 50 | text-decoration: none; 51 | color: inherit; 52 | margin: 10px; 53 | padding: 5px; 54 | } 55 | 56 | .footer-links a:hover { 57 | background-color: black; 58 | text-decoration: underline; 59 | } 60 | 61 | .footer-distributed .footer-company-name { 62 | color: #8f9296; 63 | font-size: 14px; 64 | font-weight: normal; 65 | /* margin: 0; */ 66 | } 67 | 68 | .footer-distributed .footer-icons { 69 | margin-top: 15px; 70 | margin-bottom: 25px; 71 | } 72 | 73 | .footer-distributed .footer-icons a { 74 | display: inline-block; 75 | width: 35px; 76 | height: 35px; 77 | cursor: pointer; 78 | background-color: #33383b; 79 | border-radius: 2px; 80 | font-size: 20px; 81 | color: #ffffff; 82 | text-align: center; 83 | line-height: 35px; 84 | margin-right: 3px; 85 | margin-bottom: 5px; 86 | } 87 | 88 | .footer-icons a:hover { 89 | background-color: black; 90 | } 91 | 92 | @media (max-width: 880px) { 93 | .footer-distributed { 94 | font: bold 14px sans-serif; 95 | } 96 | 97 | .main { 98 | line-height: normal; 99 | font-size: auto; 100 | } 101 | } -------------------------------------------------------------------------------- /CSS/friend.css: -------------------------------------------------------------------------------- 1 | 2 | /************************************* ACCEPT/DECLINE FRIEND REQUESTS ******************************/ 3 | @import url('https://fonts.googleapis.com/css?family=Montserrat:400,600,700'); 4 | 5 | a { 6 | color: #333 !important; 7 | } 8 | 9 | .profile-links { 10 | color: #333 !important; 11 | text-decoration: none; 12 | } 13 | 14 | .profile-links :hover { 15 | text-decoration: none!important; 16 | color: #333!important; 17 | } 18 | 19 | .panel-body { 20 | display: flex; 21 | flex-direction: column; 22 | box-sizing: border-box; 23 | margin-top: 10%; 24 | margin-bottom: 5%; 25 | } 26 | 27 | .friend-list { 28 | font-family: 'Montserrat', sans-serif; 29 | } 30 | 31 | .friend-requests { 32 | font-family: 'Montserrat', sans-serif; 33 | text-align: center; 34 | } 35 | 36 | .friend-box { 37 | position: relative; 38 | /* background-color: #eee; */ 39 | border-radius: 5px; 40 | box-shadow: 0 0 1px rgba(0, 0, 0, 0.63); 41 | border-radius: 10px; 42 | padding: 20px; 43 | } 44 | 45 | .friend-profile { 46 | float: left; 47 | border-radius: 5px; 48 | height: 70px; 49 | width: 70px; 50 | background-size: cover; 51 | background-position: center; 52 | box-shadow: 0px 0px 15px #aaa; 53 | margin-right: 3%; 54 | } 55 | 56 | .name-box { 57 | text-align: left; 58 | color: #4F7091; 59 | font-size: 18px; 60 | } 61 | 62 | .user-name-box { 63 | text-align: left; 64 | font-size: 12px; 65 | line-height: 16px; 66 | } 67 | 68 | .request-btn-row { 69 | bottom: 10px; 70 | text-align: center; 71 | display: flex; 72 | justify-content: space-between; 73 | } 74 | 75 | .friend-request { 76 | margin-top: 10px; 77 | border-radius: 5px; 78 | border: 2px solid transparent; 79 | padding: 5px; 80 | cursor: pointer; 81 | } 82 | 83 | .decline-request { 84 | display: flex; 85 | background-color: #FF6666; 86 | text-align: center; 87 | color: #fff; 88 | } 89 | 90 | .decline-request:hover { 91 | background-color: #993333; 92 | } 93 | 94 | .accept-request { 95 | display: flex; 96 | text-align: center; 97 | background-color: #41c764; 98 | color: #fff; 99 | } 100 | 101 | .accept-request:hover { 102 | background-color: #419764; 103 | } 104 | 105 | .fr-request-pending { 106 | position: relative; 107 | top: -10px; 108 | color: #17406f; 109 | font-weight: bold; 110 | } 111 | 112 | .request-btn-row.disappear { 113 | display: none; 114 | } -------------------------------------------------------------------------------- /CSS/header.css: -------------------------------------------------------------------------------- 1 | * { 2 | margin: 0; 3 | padding: 0; 4 | font-size: 12px; 5 | font-family: "Raleway", sans-serif; 6 | } 7 | 8 | ::-webkit-scrollbar { 9 | width: 0; 10 | /* Remove scrollbar space */ 11 | background: transparent; 12 | /* Optional: just make scrollbar invisible */ 13 | } 14 | 15 | /****************************************** NAVBAR STYLE ********************************************/ 16 | 17 | .nav-wrapper { 18 | width: 100%; 19 | /* position: -webkit-sticky; */ 20 | /* Safari */ 21 | position: sticky; 22 | top: 0; 23 | background-color: #fff; 24 | } 25 | 26 | nav { 27 | position: sticky; 28 | top: 0; 29 | left: 0; 30 | right: 0; 31 | /* height: 10%; */ 32 | display: flex; 33 | justify-content: space-between; 34 | padding-left: 3%; 35 | background-color: #333; 36 | color: white; 37 | box-shadow: 1px 3px 4px #e6e6e6; 38 | align-items: center; 39 | } 40 | 41 | /****************************************** NAVBAR LOGO STYLE ********************************************/ 42 | 43 | .Logo { 44 | width: auto; 45 | padding: 5px; 46 | display: flex; 47 | align-items: baseline; 48 | justify-content: center; 49 | } 50 | 51 | .Logo a { 52 | text-decoration: none; 53 | } 54 | 55 | .Logo-Img { 56 | height: 45px; 57 | width: 45px; 58 | margin-top: 5px; 59 | } 60 | 61 | .Logo-Text { 62 | color: lightgray; 63 | font-family: "Raleway", sans-serif; 64 | font-size: 45px; 65 | font-weight: 300; 66 | margin-right: 25px; 67 | flex: 1; 68 | } 69 | 70 | /****************************************** NAVBAR RIGHT NAVIGATION STYLE ********************************************/ 71 | .navigation { 72 | display: flex; 73 | right: 25px; 74 | float: right; 75 | align-items: center; 76 | padding-right: 20px; 77 | } 78 | 79 | .menu { 80 | display: flex; 81 | flex-direction: row; 82 | list-style: none; 83 | } 84 | 85 | .menu li a { 86 | color: inherit; 87 | text-decoration: none; 88 | margin: 0 15px; 89 | display: flex; 90 | padding: 5px; 91 | } 92 | 93 | .menu li a:hover { 94 | background-color: black; 95 | } 96 | 97 | .menu li a i { 98 | height: 30px; 99 | width: 30px; 100 | display: flex; 101 | align-items: center; 102 | justify-content: center; 103 | font-size: 20px; 104 | } 105 | 106 | .not-menu { 107 | display: flex; 108 | align-items: center; 109 | justify-content: space-between; 110 | flex-direction: row; 111 | } 112 | 113 | /***************************************** NAVBAR NOTIFICATION SECTION *********************************************/ 114 | 115 | .dropdown-menu { 116 | width: 250px !important; 117 | } 118 | 119 | a.dropdown-menu-header:hover { 120 | background-color: #e6e6e6 !important; 121 | } 122 | 123 | a.dropdown-menu-header { 124 | background: #f7f9fe; 125 | font-weight: bold; 126 | border-bottom: 1px solid #e3e3e3; 127 | } 128 | /* .dropdown-menu > li a { 129 | padding: 10px; 130 | } */ 131 | 132 | .dropdown-menu li { 133 | padding: 10px; 134 | /* margin-left: 10px; */ 135 | } 136 | 137 | 138 | /****************************************** NAVBAR SEARCH SECTION STYLE ********************************************/ 139 | .search { 140 | position: relative; 141 | display: flex; 142 | } 143 | 144 | .search-input::placeholder { 145 | color: white; 146 | opacity: 0.8; 147 | font-family: "Raleway", sans-serif; 148 | font-size: 15px; 149 | } 150 | 151 | .search-input { 152 | height: 0px; 153 | border: none; 154 | position: absolute; 155 | left: -200px; 156 | visibility: hidden; 157 | opacity: 0; 158 | top: 40px; 159 | background: #333; 160 | color: white; 161 | padding: 6px; 162 | font-size: 12px; 163 | outline: none; 164 | width: 220px; 165 | transition: 80ms all ease-in; 166 | border-bottom-left-radius: 5px; 167 | border-bottom-right-radius: 5px; 168 | box-shadow: none; 169 | } 170 | 171 | .search-button { 172 | background: transparent; 173 | color: white; 174 | cursor: pointer; 175 | font-size: 14px; 176 | padding-top: 4px; 177 | border: 0; 178 | margin: 0 15px; 179 | } 180 | 181 | .search-button i { 182 | height: 30px; 183 | width: 30px; 184 | display: flex; 185 | align-items: center; 186 | justify-content: center; 187 | font-size: 20px; 188 | } 189 | 190 | .search-button:hover+.search-input, 191 | .search-input:hover, 192 | .search:hover .search-input { 193 | visibility: visible !important; 194 | /* The search bar comes into view when hovered over */ 195 | opacity: 1 !important; 196 | z-index: 9 !important; 197 | box-shadow: 1px 3px 4px #e6e6e6; 198 | height: 25px !important; 199 | } 200 | 201 | /****************************************** NAVBAR SIGNOUT STYLE ********************************************/ 202 | 203 | .sign-out { 204 | display: flex; 205 | } 206 | 207 | .sign-out a { 208 | text-decoration: none; 209 | } 210 | 211 | .sign-out .menu-text { 212 | font-family: "Raleway", sans-serif; 213 | font-size: 20px; 214 | color: white; 215 | margin: 0 15px; 216 | border: 1px solid white; 217 | border-radius: 5px; 218 | padding: 5px; 219 | } 220 | 221 | .sign-out .menu-text:hover { 222 | background-color: white; 223 | color: #333; 224 | } 225 | 226 | .sign-out-mobile { 227 | display: none; 228 | } 229 | 230 | /**************************************** RESPONSIVE DESIGN CODE ******************************************************/ 231 | 232 | @media only screen and (max-width: 720px) { 233 | h1 { 234 | font-size: 20px; 235 | } 236 | 237 | h2 { 238 | font-size: 20px; 239 | } 240 | 241 | p { 242 | font-size: 12px; 243 | } 244 | 245 | /* MOBILE NAVIGATION */ 246 | .nav-wrapper { 247 | background-color: #333; 248 | width: 100%; 249 | } 250 | 251 | .navbar { 252 | flex-direction: column; 253 | width: 100%; 254 | background-color: #333; 255 | /* align-items: stretch; */ 256 | } 257 | 258 | .navigation { 259 | background-color: #333; 260 | flex-direction: column; 261 | } 262 | 263 | nav { 264 | height: auto; 265 | } 266 | 267 | .Logo { 268 | align-items: baseline; 269 | justify-content: center; 270 | } 271 | 272 | .Logo-Text { 273 | font-size: 30px; 274 | padding-bottom: 0; 275 | } 276 | 277 | .Logo-Img { 278 | height: 30px; 279 | width: 30px; 280 | } 281 | 282 | .not-menu { 283 | display: flex; 284 | align-items: center; 285 | justify-content: space-between; 286 | } 287 | 288 | .search { 289 | background-color: #333; 290 | } 291 | 292 | .search-input { 293 | top: 34px; 294 | left: -60px; 295 | } 296 | 297 | .sign-out { 298 | display: none; 299 | } 300 | 301 | .sign-out-mobile { 302 | display: flex; 303 | } 304 | 305 | .sign-out-mobile a { 306 | color: white; 307 | text-decoration: none; 308 | } 309 | 310 | .sign-out-mobile a i { 311 | height: 30px; 312 | width: 30px; 313 | display: flex; 314 | align-items: center; 315 | justify-content: center; 316 | font-size: 20px; 317 | } 318 | } -------------------------------------------------------------------------------- /CSS/homepage.css: -------------------------------------------------------------------------------- 1 | * { 2 | margin: 0; 3 | padding: 0; 4 | /* font-family: Arial, Helvetica, sans-serif; */ 5 | font-size: 12px; 6 | } 7 | 8 | ::-webkit-scrollbar { 9 | width: 0; 10 | /* Remove scrollbar space */ 11 | background: transparent; 12 | /* Optional: just make scrollbar invisible */ 13 | } 14 | 15 | body { 16 | height: 100vh; 17 | width: 100%; 18 | } 19 | 20 | /************************************** NAVBAR CUSTOM ************************************************/ 21 | .nav-wrapper { 22 | /* position: relative !important; */ 23 | position: absolute!important; 24 | display: block; 25 | /* overflow: hidden; */ 26 | top: 0; 27 | } 28 | 29 | nav { 30 | /* position: relative !important; */ 31 | position: absolute!important; 32 | top: 0; 33 | } 34 | 35 | nav a { 36 | color: #fff !important; 37 | } 38 | 39 | .menu { 40 | margin-bottom: 0; 41 | } 42 | 43 | main { 44 | padding-top: 3%; 45 | } 46 | 47 | /************************************** TEXT CONTAINER **********************************************/ 48 | .container { 49 | font-family: "Raleway", sans-serif; 50 | padding-top: 3%; 51 | padding-bottom: 3%; 52 | position: absolute; 53 | top: 100px; 54 | left: 30px; 55 | right: 30px; 56 | /* overflow: auto; */ 57 | /* margin-top: 10%; */ 58 | } 59 | 60 | .container .user { 61 | color: #333 !important; 62 | } 63 | 64 | input[type="file"] { 65 | display: none; 66 | } 67 | 68 | .input-group-btn { 69 | display: flex; 70 | justify-content: space-between; 71 | } 72 | 73 | .btn { 74 | background-color: #333; 75 | border: #333; 76 | color: #fff; 77 | margin: 0; 78 | } 79 | 80 | .btn :hover { 81 | /* color: #fff !important; */ 82 | background-color: #ccc !important; 83 | } 84 | 85 | .container hr { 86 | background-color: #333; 87 | margin-bottom: 0px; 88 | } 89 | 90 | .media-body { 91 | margin-left: 10px; 92 | } 93 | 94 | /************************************** PROFILE CARD ***********************************************/ 95 | /*Profile Card 5*/ 96 | .profile-card-5 { 97 | display: flex; 98 | margin-top: 20px; 99 | } 100 | 101 | .profile-card-5 .btn { 102 | border-radius: 2px; 103 | text-transform: uppercase; 104 | font-size: 12px; 105 | padding: 7px 20px; 106 | } 107 | 108 | .btn :hover { 109 | background-color: #330; 110 | color: #eee !important; 111 | } 112 | 113 | .profile-card-5 .card-img-block { 114 | width: 150px; 115 | height: 150px; 116 | margin: 0 auto; 117 | position: relative; 118 | top: -20px; 119 | 120 | } 121 | 122 | .profile-card-5 .card-img-block img { 123 | border-radius: 5px; 124 | box-shadow: 0 0 10px rgba(0, 0, 0, 0.63); 125 | } 126 | 127 | .profile-card-5 h5 { 128 | font-weight: 600; 129 | } 130 | 131 | .profile-card-5 p { 132 | font-size: 14px; 133 | font-weight: 300; 134 | } 135 | 136 | .profile-card-5 a { 137 | color: #eee !important; 138 | } 139 | 140 | /************************************ FRIEND BOXES **************************************************/ 141 | h4 { 142 | padding-top: 10px; 143 | } -------------------------------------------------------------------------------- /CSS/login.css: -------------------------------------------------------------------------------- 1 | body { 2 | margin: 0; 3 | padding: 0; 4 | } 5 | 6 | ::-webkit-scrollbar { 7 | width: 0; 8 | /* Remove scrollbar space */ 9 | background: transparent; 10 | /* Optional: just make scrollbar invisible */ 11 | } 12 | 13 | /* Style for background video */ 14 | #backgroundVideo { 15 | object-fit: cover; 16 | width: 100vw; 17 | height: 100vh; 18 | position: fixed; 19 | top: 0; 20 | left: 0; 21 | } 22 | 23 | #backgroundImage { 24 | display: none; 25 | } 26 | 27 | /* Style for title of the page */ 28 | .Site-Title { 29 | text-align: center; 30 | color: white; 31 | font-family: "Raleway", sans-serif; 32 | font-size: 60px; 33 | font-weight: 500; 34 | /* text-decoration: double; */ 35 | flex: 1; 36 | padding: 30px auto; 37 | padding-top: 50px; 38 | position: absolute; 39 | top: 0; 40 | bottom: 0; 41 | left: 0; 42 | right: 0; 43 | margin: auto; 44 | } 45 | 46 | .Text { 47 | color: white; 48 | text-decoration: none; 49 | } 50 | 51 | /* The div of login form is centered */ 52 | .login-box { 53 | color: white; 54 | width: 340px; 55 | position: absolute; 56 | top: 20%; 57 | bottom: 0; 58 | left: 0; 59 | right: 0; 60 | margin: auto; 61 | } 62 | 63 | .login-box h1 { 64 | float: left; 65 | font-family: 'Montserrat', sans-serif; 66 | font-size: 30px; 67 | font-weight: 200; 68 | border-bottom: 6px solid #e27802; 69 | margin-bottom: 30px; 70 | margin-top: 50px; 71 | margin-right: 10px; 72 | padding-bottom: 10px; 73 | } 74 | 75 | /* Style for textboxes of the form */ 76 | .textbox { 77 | width: 100%; 78 | overflow: hidden; 79 | font-size: 20px; 80 | padding: 8px 0; 81 | margin: 8px 0; 82 | border-bottom: 1px solid #e27802; 83 | } 84 | 85 | .textbox i { 86 | width: 26px; 87 | float: left; 88 | text-align: center; 89 | } 90 | 91 | .textbox input { 92 | border: none; 93 | outline: none; 94 | background: none; 95 | color: white; 96 | font-size: 18px; 97 | width: 250px; 98 | float: left; 99 | margin: 0 10px; 100 | } 101 | 102 | .btn { 103 | background: none; 104 | border: 2px solid #e27802; 105 | color: white; 106 | cursor: pointer; 107 | font-size: 18px; 108 | margin: 12px 0; 109 | padding: 10px; 110 | width: 100%; 111 | } 112 | 113 | .btn:hover { 114 | background-color: white; 115 | color: #e27802; 116 | } 117 | 118 | .forgot-password { 119 | text-align: left; 120 | padding: 10px 0; 121 | margin: 0; 122 | } 123 | 124 | /* Style for redirecting to signup page */ 125 | .Acc { 126 | font-family: 'Montserrat', sans-serif; 127 | font-size: 16px; 128 | padding-top: 10%; 129 | text-align: center; 130 | width: 100%; 131 | } 132 | 133 | .login-box a { 134 | background: none; 135 | color: #e27802; 136 | cursor: pointer; 137 | font-family: 'Montserrat', sans-serif; 138 | font-size: 18px; 139 | margin: 12px 0; 140 | padding: 10px; 141 | } 142 | 143 | /********************* Responsive Styling *************************************/ 144 | 145 | @media (max-width: 480px) { 146 | 147 | .login-box { 148 | width: 90%; 149 | /* background: linear-gradient(rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5)); */ 150 | } 151 | 152 | #backgroundVideo { 153 | display: none; 154 | } 155 | 156 | #backgroundImage { 157 | background: linear-gradient(rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5)); 158 | object-fit: cover; 159 | width: 100vw; 160 | height: 100vh; 161 | position: fixed; 162 | top: 0; 163 | left: 0; 164 | margin: 0; 165 | padding: 0; 166 | display: inline; 167 | } 168 | 169 | .Site-Title { 170 | width: 90%; 171 | font-size: 35px; 172 | } 173 | 174 | .login-box h1 { 175 | font-size: 20px; 176 | } 177 | 178 | .textbox { 179 | width: 90%; 180 | } 181 | } 182 | -------------------------------------------------------------------------------- /CSS/notification.css: -------------------------------------------------------------------------------- 1 | /* ------------- */ 2 | /* Basic Setting */ 3 | /* ------------- */ 4 | 5 | html, 6 | body { 7 | box-sizing: border-box; 8 | font-family: 'Raleway', sans-serif; 9 | font-weight: 300; 10 | font-style: normal; 11 | font-size: 1em; 12 | line-height: 1.5; 13 | color: #ffffffee; 14 | scroll-behavior: smooth; 15 | } 16 | 17 | *, 18 | *::before, 19 | *::after { 20 | box-sizing: inherit; 21 | } 22 | 23 | .nav-wrapper { 24 | position: relative!important; 25 | } 26 | 27 | .navbar { 28 | position: relative !important; 29 | } 30 | 31 | main { 32 | position: relative; 33 | display: flex; 34 | justify-content: center; 35 | align-items: center; 36 | flex-direction: column; 37 | width: 100%; 38 | height: 100vh; 39 | min-height: 400px; 40 | } 41 | 42 | ::selection { 43 | color: #fff; 44 | background-color: #3ed0ff; 45 | } 46 | 47 | 48 | /* ------------- */ 49 | /* Content Style */ 50 | /* ------------- */ 51 | 52 | section { 53 | display: block; 54 | } 55 | 56 | .notification { 57 | position: relative; 58 | display: flex; 59 | justify-content: space-between; 60 | align-items: center; 61 | width: 90%; 62 | height: 50px; 63 | margin: 10px; 64 | padding: 0 20px; 65 | background-color: #333; 66 | border-radius: 10px; 67 | box-shadow: 0 0 25px #00384a44; 68 | font-weight: 400; 69 | } 70 | 71 | .notification a { 72 | text-decoration: none; 73 | color: #ffffffee; 74 | font-weight: 700; 75 | letter-spacing: .5px; 76 | transition: 300ms; 77 | } 78 | 79 | .notification a:hover { 80 | color: #ffffffaa; 81 | } 82 | 83 | .animation { 84 | animation: FadeIn 4s ease-in-out; 85 | } 86 | 87 | 88 | /* --------- */ 89 | /* Animation */ 90 | /* --------- */ 91 | 92 | @keyframes FadeIn { 93 | 0% { 94 | top: 50px; 95 | opacity: 0; 96 | } 97 | 98 | 25% { 99 | top: -5px; 100 | opacity: .75; 101 | } 102 | 103 | 50% { 104 | top: 5px; 105 | opacity: 1; 106 | } 107 | 108 | 100% { 109 | top: 0px; 110 | } 111 | } -------------------------------------------------------------------------------- /CSS/post.css: -------------------------------------------------------------------------------- 1 | /************************************** ONE POST CARD **********************************************/ 2 | 3 | .scrollable { 4 | overflow-y: scroll!important; 5 | } 6 | 7 | #main-window { 8 | margin: auto; 9 | left: 0; 10 | right: 0; 11 | max-width: 650px; 12 | width: 95%; 13 | padding: 10px 0; 14 | /* background:black; */ 15 | } 16 | 17 | .post { 18 | margin: 10px; 19 | width: 90%; 20 | background: #fff; 21 | border-radius: 4px; 22 | box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24); 23 | transition: all 0.2s ease-in-out; 24 | overflow: hidden; 25 | } 26 | 27 | .post:hover { 28 | box-shadow: 0 10px 20px rgba(0, 0, 0, 0.19), 0 6px 6px rgba(0, 0, 0, 0.23); 29 | } 30 | 31 | .post .user { 32 | padding: 10px; 33 | background: #f9f9f9; 34 | overflow: hidden; 35 | display: flex; 36 | align-items: center; 37 | justify-content: space-between; 38 | } 39 | 40 | .post .user-stuff { 41 | display: flex; 42 | align-items: center; 43 | } 44 | 45 | .post .user .user-stuff .user-img { 46 | margin-right: 10px; 47 | width: 35px; 48 | height: 35px; 49 | float: left; 50 | border-radius: 6px; 51 | background: #444; 52 | box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24); 53 | overflow: hidden; 54 | } 55 | 56 | .post .user .user-stuff .user-info { 57 | margin-right: 10px; 58 | /* width:calc(100% - 190px); */ 59 | /* height:35px; */ 60 | line-height: 18px; 61 | float: left; 62 | color: #98d; 63 | } 64 | 65 | .post .user .user-stuff .user-info .post-date { 66 | font-size: 13px; 67 | color: #444; 68 | } 69 | 70 | .post .user .actions { 71 | display: flex; 72 | } 73 | 74 | .post .user .actions span { 75 | margin-right: 10px; 76 | width: 20px; 77 | height: 20px; 78 | float: left; 79 | display: block; 80 | cursor: pointer; 81 | overflow: hidden; 82 | background-size: 80%; 83 | background-position: 50% 50%; 84 | background-repeat: no-repeat; 85 | opacity: 0.2; 86 | transition: 0.25s opacity ease-in-out; 87 | } 88 | 89 | .post .user .actions span:hover { 90 | opacity: 1; 91 | } 92 | 93 | .post .user .actions span:last-child { 94 | margin-right: 0; 95 | } 96 | 97 | .post .user .actions span.heart { 98 | background-image: 99 | url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAYAAABzenr0AAACAUlEQVRYR82XjU0DMQxGv04ATAAbQCeATkA7ATABsAEbABMAEwATABNAJ6BsUCYAvZNducf9JHcnlUioIrHzvdiOoxtpw2O0YX3VAZxIOrK/PYP8kPQq6dl+q9jxOTa/AzNYmP2T+a75lQFwupPkznUBYrMzSUsz2Da/aUtEOcClJA5TjAhwKulaEpv5+A7GQG2FNU42s/8fJXmkmGryAxo/YFYAbP4SxN8kXVWEGkjmd004RoCpL1u/L0WC1OB3GPwmHM4jgDhGjAdJCNUNIgT9fslgbns4VJU/YNQXgz0mACBG3hmc3EEaGIo0RYgUcd8PP4/EDIBIRViK3CQMIG7M7iIUZJsrByTiRbQB+LQConBiAbZt1GedNFHQCwB+MsPfR/hPGv4FAE2BiiYsO0McL2EPj/qcCFBI5+ZEdyvf4YT9skzirbsFIFYl3W2cUdFZylbk76Frjr0R0dt5RBikhOvY1FByhbHnhnH9/J3hUZs6AIsIe4sdGqIsTssGZBkfIyZoQv7gDAVRFqffkPbiRax6joeEaBSvAmBuqEi0itcBDAGRJN4E0AciWbwNoAtElngKQA5EtngqQApEJ/EcgCYI1mKHW7vnbS0z98Ok6oo6HL9Z4rkR8MOUIXw+W7wrQFU6Oon3AXAIXlEGX0Srr522vMf13BrI2TvJduMAv9o2lX4LR6fmAAAAAElFTkSuQmCC'); 100 | } 101 | 102 | .post .user .actions span.comment { 103 | background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAYAAABzenr0AAABIElEQVRYR+2X0bEBQRBFjwgQARkgAkKQASJQIkAGRIAMhEAGRPCeDGRAXTVTtTW1ip4dy8f2z+58TN9z7/ZHb40vVw1oAHNg7N7LQLoCW2AmgBUwLUM1R2MtANHUgSMwdOdP8ijxPdAH/gVwc2rNEsS9sTbwp0MWQO9l1sN4BfDTCZyATqKhUK9e0OvlDKQEOANdK0Ai80/bvEygAvi5BCxDmTf1oSHzDFgA8qa+MEDqT2JOoAKoEvh4Al9byfxSegAmWhRTWw36aR/cAAPgooVk4f4LLLoC1V6fLf1XqLGlln4RFYQatAy3sxBW8YszsIjZhOV85EAFofLOd87I2z5iANQ8C+HFzOK6GAsQQkSJFwXwEHpqBqKqSAJRguGlOwYCUNzXkk7/AAAAAElFTkSuQmCC'); 104 | } 105 | 106 | .post .user .actions span.share { 107 | background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAYAAABzenr0AAAB6ElEQVRYR82XgTEEQRBF/0WACBABGSADIkAEiIAMEAEi4CJABkTgZEAG6l1Nq941s9d7s1unq1Sp2pnu37+7//RNNJ6dSDqTtJtCPEm6lfTiQ05GiL8u6VHSfsH3vaRT+zYGgJuUeVduR5JgREMD2JL0EWB1Jml7DADU/S4AgCMAmA3NwJWkyyCAAxpySADQT/NZ1y/CsSHpawgAdD3jRvZRe7UpqQVwKOlaEtlH7TsFf6tpQgLSbKVZn6Zvay1UBAf0rxiVGIDWnXT5nVql/xfRzdnzFICzTIWxQ8bMvvmau2wD4BKUctEbF/mjzjm6yYxviFAv8wAI/tyjiy3QQ8q6kVkUhQcQkVDv19MdjffnnAdABu2myTlemu6cMwNAN0N/xC6WqXXJ8b8BAMBoCThHx7NcVFtNEzLXlKOx4fRF1B5DnJkARX2x4QCkegwJiBYwjset6EirCdFmBtnSZemSYntWodpLMVJbevN9WUiGRLwUk0inFEdpxynU7xUuwBajDQhvBGcfXPgYRYHwslGyXFlKPgDBNlT1HHvnZNlVlhwQGADEoFsxZYH66BQNtpL5DFe6lAJk5Wt59IfJp41n7VKaa7DIXjHaTzNTU5qxpBE8YkzN3MZgwHzTDwSyqUAFYafxeP0AlftgIScjdPAAAAAASUVORK5CYII='); 108 | } 109 | 110 | .post .user .actions a i { 111 | font-size: 20px; 112 | } 113 | 114 | #del-this { 115 | width: 35px; 116 | height: 35px; 117 | opacity: 0.9 !important; 118 | color: #eee; 119 | } 120 | 121 | .post .content { 122 | padding: 20px; 123 | font-size: 16px; 124 | line-height: 22px; 125 | font-family: 'Helvetica Neue'; 126 | overflow: hidden; 127 | } 128 | 129 | .post .media { 130 | margin: 0 20px 20px; 131 | } 132 | 133 | .post .media img { 134 | border-radius: 4px; 135 | width: 100%; 136 | } 137 | 138 | .post .media iframe { 139 | border-radius: 4px; 140 | } 141 | 142 | .post .content img { 143 | width: 100%; 144 | /* height: px; */ 145 | display: block; 146 | margin-bottom: 2%; 147 | } 148 | 149 | @media only screen and (max-width: 720px) { 150 | .profile-card-5 { 151 | display: none; 152 | } 153 | 154 | .panel-body { 155 | display: none; 156 | } 157 | 158 | .col-md-6 { 159 | top: 50px; 160 | left: 0; 161 | width: 80%; 162 | } 163 | 164 | .post .user { 165 | flex-direction: column; 166 | } 167 | 168 | .post .user .actions { 169 | margin-top: 15px; 170 | justify-content: space-between; 171 | } 172 | 173 | .post .user .actions span { 174 | margin-right: 25px; 175 | justify-content: space-between; 176 | } 177 | } 178 | 179 | /************************************** COMMENTS SECTION ***********************************************/ 180 | .card__footer { 181 | display: flex; 182 | color: #666; 183 | margin-left: 10px; 184 | font-size: 16px !important; 185 | } 186 | 187 | .card__footer__like { 188 | font-size: 16px !important; 189 | } 190 | 191 | .card__footer__comment { 192 | margin-left: 1em; 193 | font-size: 16px !important; 194 | } 195 | 196 | form button { 197 | margin: 5px 0px; 198 | } 199 | 200 | textarea { 201 | display: block; 202 | margin-bottom: 10px; 203 | } 204 | 205 | .clearfix { 206 | margin-bottom: 5px; 207 | } 208 | 209 | /*post*/ 210 | .post { 211 | border: 1px solid #ccc; 212 | margin-top: 10px; 213 | } 214 | 215 | /*comments*/ 216 | .comments-section { 217 | margin-top: 10px; 218 | border: 1px solid #ccc; 219 | border-radius: 4px; 220 | margin: 10px; 221 | padding: 10px; 222 | } 223 | 224 | .comment { 225 | margin-bottom: 10px; 226 | } 227 | 228 | .comment .comment-name { 229 | font-weight: bold; 230 | } 231 | 232 | .comment .comment-date { 233 | font-style: italic; 234 | font-size: 0.8em; 235 | } 236 | 237 | .comment .reply-btn, 238 | .edit-btn { 239 | font-size: 0.8em; 240 | } 241 | 242 | .comment-details { 243 | width: 91.5%; 244 | float: left; 245 | } 246 | 247 | .comment-details p { 248 | margin-bottom: 0px; 249 | } 250 | 251 | .comment .profile_pic { 252 | width: 35px; 253 | height: 35px; 254 | margin-right: 5px; 255 | float: left; 256 | border-radius: 50%; 257 | } 258 | 259 | /*replies*/ 260 | .reply { 261 | margin-left: 30px; 262 | } 263 | 264 | .reply_form { 265 | margin-left: 40px; 266 | display: none; 267 | } 268 | 269 | #comment_form { 270 | margin-top: 10px; 271 | } -------------------------------------------------------------------------------- /CSS/profile.css: -------------------------------------------------------------------------------- 1 | /* styles */ 2 | 3 | * { 4 | font-family: 'Raleway', sans-serif; 5 | } 6 | 7 | .scrollable a { 8 | color: #333 !important; 9 | } 10 | 11 | body { 12 | font-family: 'Raleway'; 13 | } 14 | 15 | /* .container { 16 | height: 100vh; 17 | width: 100%; 18 | overflow: hidden; 19 | } */ 20 | 21 | .nav-wrapper { 22 | position: relative !important; 23 | } 24 | 25 | nav { 26 | position: relative !important; 27 | } 28 | 29 | nav a { 30 | color: #fff !important; 31 | } 32 | 33 | .menu { 34 | margin-bottom: 0; 35 | } 36 | 37 | main { 38 | padding-top: 3%; 39 | } 40 | 41 | .btn { 42 | background-color: #333; 43 | border: #333; 44 | } 45 | 46 | main hr { 47 | background-color: #333; 48 | } 49 | 50 | .media-body { 51 | margin-left: 10px; 52 | } 53 | 54 | /************************************** TEXT CONTAINER **********************************************/ 55 | .container { 56 | font-family: "Raleway", sans-serif; 57 | padding-top: 3%; 58 | padding-bottom: 3%; 59 | /* overflow: auto; */ 60 | /* margin-top: 10%; */ 61 | } 62 | 63 | .container .user { 64 | color: #333 !important; 65 | } 66 | 67 | input[type="file"] { 68 | display: none; 69 | } 70 | 71 | .input-group-btn { 72 | display: flex; 73 | justify-content: space-between; 74 | } 75 | 76 | .btn { 77 | background-color: #333; 78 | border: #333; 79 | color: #fff; 80 | margin: 0; 81 | } 82 | 83 | .btn :hover { 84 | /* color: #fff !important; */ 85 | background-color: #ccc !important; 86 | } 87 | 88 | .container hr { 89 | background-color: #333; 90 | margin-bottom: 0px; 91 | } 92 | 93 | .media-body { 94 | margin-left: 10px; 95 | } 96 | 97 | 98 | /************************************* TIMELINE ***********************************************/ 99 | 100 | 101 | 102 | /*************************************************** FRIENDS ************************************************/ 103 | 104 | /************************************* ACCEPT/DECLINE FRIEND REQUESTS ******************************/ 105 | @import url('https://fonts.googleapis.com/css?family=Montserrat:400,600,700'); 106 | 107 | .panel-body { 108 | display: flex; 109 | flex-direction: column; 110 | box-sizing: border-box; 111 | margin-top: 10%; 112 | margin-bottom: 5%; 113 | } 114 | 115 | .friend-list { 116 | font-family: 'Montserrat', sans-serif; 117 | } 118 | 119 | .friend-requests { 120 | font-family: 'Montserrat', sans-serif; 121 | text-align: center; 122 | } 123 | 124 | .friend-box { 125 | position: relative; 126 | /* background-color: #eee; */ 127 | border-radius: 5px; 128 | box-shadow: 0 0 1px rgba(0, 0, 0, 0.63); 129 | border-radius: 10px; 130 | padding: 20px; 131 | } 132 | 133 | .friend-profile { 134 | float: left; 135 | border-radius: 5px; 136 | height: 70px; 137 | width: 70px; 138 | background-size: cover; 139 | background-position: center; 140 | box-shadow: 0px 0px 15px #aaa; 141 | margin-right: 3%; 142 | } 143 | 144 | .name-box { 145 | text-align: left; 146 | color: #4F7091; 147 | font-size: 18px; 148 | } 149 | 150 | .user-name-box { 151 | text-align: left; 152 | font-size: 12px; 153 | line-height: 16px; 154 | } 155 | 156 | .request-btn-row { 157 | bottom: 10px; 158 | text-align: center; 159 | display: flex; 160 | justify-content: space-between; 161 | } 162 | 163 | .friend-request { 164 | margin-top: 10px; 165 | border-radius: 5px; 166 | border: 2px solid transparent; 167 | padding: 5px; 168 | cursor: pointer; 169 | } 170 | 171 | .decline-request { 172 | display: flex; 173 | background-color: #FF6666; 174 | text-align: center; 175 | color: #fff; 176 | } 177 | 178 | .decline-request:hover { 179 | background-color: #993333; 180 | } 181 | 182 | .accept-request { 183 | display: flex; 184 | text-align: center; 185 | background-color: #41c764; 186 | color: #fff; 187 | } 188 | 189 | .accept-request:hover { 190 | background-color: #419764; 191 | } 192 | 193 | .fr-request-pending { 194 | position: relative; 195 | top: -10px; 196 | color: #17406f; 197 | font-weight: bold; 198 | } 199 | 200 | .request-btn-row.disappear { 201 | display: none; 202 | } -------------------------------------------------------------------------------- /CSS/search.css: -------------------------------------------------------------------------------- 1 | * { 2 | margin: 0; 3 | padding: 0; 4 | font-family: 'Raleway', Helvetica, sans-serif; 5 | font-size: 12px; 6 | } 7 | 8 | ::-webkit-scrollbar { 9 | width: 0; 10 | /* Remove scrollbar space */ 11 | background: transparent; 12 | /* Optional: just make scrollbar invisible */ 13 | } 14 | 15 | body { 16 | height: 100vh; 17 | width: 100%; 18 | } 19 | 20 | /************************************** NAVBAR CUSTOM ************************************************/ 21 | .nav-wrapper { 22 | /* position: relative !important; */ 23 | position: relative !important; 24 | display: block; 25 | /* overflow: hidden; */ 26 | top: 0; 27 | } 28 | 29 | nav { 30 | position: relative !important; 31 | /* position: absolute !important; */ 32 | /* top: 0; */ 33 | } 34 | 35 | nav a { 36 | color: #fff !important; 37 | } 38 | 39 | .menu { 40 | margin-bottom: 0; 41 | } 42 | 43 | main { 44 | padding-top: 3%; 45 | display: flex !important; 46 | justify-content: center; 47 | align-items: center; 48 | padding: 20px; 49 | flex-direction: row; 50 | flex-wrap: wrap; 51 | } 52 | 53 | .btn { 54 | background-color: #333; 55 | border: #333; 56 | color: #fff; 57 | margin: 0; 58 | } 59 | 60 | .btn :hover { 61 | /* color: #fff !important; */ 62 | background-color: #ccc !important; 63 | } 64 | 65 | .container hr { 66 | background-color: #333; 67 | margin-bottom: 0px; 68 | } 69 | 70 | .media-body { 71 | margin-left: 10px; 72 | } 73 | 74 | /************************************** PROFILE CARD ***********************************************/ 75 | /*Profile Card 5*/ 76 | .profile-card-5 { 77 | display: flex !important; 78 | margin-top: 20px; 79 | width: 300px; 80 | margin: 15px 20px; 81 | } 82 | 83 | .profile-card-5 .btn { 84 | border-radius: 2px; 85 | text-transform: uppercase; 86 | font-size: 12px; 87 | padding: 7px 20px; 88 | } 89 | 90 | .btn :hover { 91 | background-color: #330; 92 | color: #eee !important; 93 | } 94 | 95 | .profile-card-5 .card-img-block { 96 | width: 150px; 97 | height: 150px; 98 | margin: 0 auto; 99 | position: relative; 100 | top: -20px; 101 | 102 | } 103 | 104 | .profile-card-5 .card-img-block img { 105 | border-radius: 5px; 106 | box-shadow: 0 0 10px rgba(0, 0, 0, 0.63); 107 | } 108 | 109 | .profile-card-5 h5 { 110 | font-weight: 600; 111 | } 112 | 113 | .profile-card-5 p { 114 | font-size: 14px; 115 | font-weight: 300; 116 | } 117 | 118 | .profile-card-5 a { 119 | color: #eee !important; 120 | } -------------------------------------------------------------------------------- /CSS/signup.css: -------------------------------------------------------------------------------- 1 | body { 2 | margin: 0; 3 | padding: 0; 4 | } 5 | 6 | ::-webkit-scrollbar { 7 | width: 0; 8 | /* Remove scrollbar space */ 9 | background: transparent; 10 | /* Optional: just make scrollbar invisible */ 11 | } 12 | 13 | /* Style for background video */ 14 | #backgroundVideo { 15 | object-fit: cover; 16 | width: 100vw; 17 | height: 100vh; 18 | position: fixed; 19 | top: 0; 20 | left: 0; 21 | } 22 | 23 | #backgroundImage { 24 | display: none; 25 | } 26 | 27 | /* Style for title of the page */ 28 | .Site-Title { 29 | text-align: center; 30 | color: white; 31 | font-family: "Raleway", sans-serif; 32 | font-size: 60px; 33 | font-weight: 500; 34 | /* text-decoration: double; */ 35 | flex: 1; 36 | padding: 30px auto; 37 | padding-top: 50px; 38 | position: absolute; 39 | top: 0; 40 | bottom: 0; 41 | left: 0; 42 | right: 0; 43 | margin: auto; 44 | } 45 | 46 | .Text { 47 | color: white; 48 | text-decoration: none; 49 | } 50 | 51 | /* The div of login form is centered */ 52 | .login-box { 53 | color: white; 54 | width: 340px; 55 | position: absolute; 56 | top: 20%; 57 | bottom: 0; 58 | left: 0; 59 | right: 0; 60 | margin: auto; 61 | } 62 | 63 | .login-box h1 { 64 | float: left; 65 | font-family: 'Montserrat', sans-serif; 66 | font-size: 30px; 67 | font-weight: 200; 68 | border-bottom: 6px solid #e27802; 69 | margin-bottom: 30px; 70 | margin-top: 50px; 71 | margin-right: 10px; 72 | padding-bottom: 10px; 73 | } 74 | 75 | /* Style for textboxes of the form */ 76 | .textbox { 77 | width: 100%; 78 | overflow: hidden; 79 | font-size: 20px; 80 | padding: 8px 0; 81 | margin: 8px 0; 82 | border-bottom: 1px solid #e27802; 83 | } 84 | 85 | .textbox i { 86 | width: 26px; 87 | float: left; 88 | text-align: center; 89 | } 90 | 91 | .textbox input { 92 | border: none; 93 | outline: none; 94 | background: none; 95 | color: white; 96 | font-size: 18px; 97 | width: 250px; 98 | float: left; 99 | margin: 0 10px; 100 | } 101 | 102 | /************** Terms and Conditions iframe ****************/ 103 | #t-and-c { 104 | border: none; 105 | outline: none; 106 | margin: 10px 0; 107 | } 108 | 109 | .btn { 110 | background: none; 111 | border: 2px solid #e27802; 112 | color: white; 113 | cursor: pointer; 114 | font-size: 18px; 115 | margin: 12px 0; 116 | padding: 10px; 117 | width: 100%; 118 | } 119 | 120 | .btn:hover { 121 | background-color: white; 122 | color: #e27802; 123 | } 124 | 125 | /* Style for redirecting to signup page */ 126 | 127 | hr { 128 | color: #e27802; 129 | background-color: #e27802; 130 | } 131 | 132 | .Acc { 133 | font-family: 'Montserrat', sans-serif; 134 | font-size: 16px; 135 | padding-top: 8%; 136 | text-align: center; 137 | width: 100%; 138 | } 139 | 140 | .login-box a { 141 | background: none; 142 | color: #e27802; 143 | cursor: pointer; 144 | font-family: 'Montserrat', sans-serif; 145 | font-size: 16px; 146 | margin: 10px 0; 147 | padding: 5px; 148 | } 149 | 150 | /********************* Responsive Styling *************************************/ 151 | 152 | @media (max-width: 480px) { 153 | .login-box { 154 | width: 90%; 155 | } 156 | 157 | #backgroundVideo { 158 | display: none; 159 | } 160 | 161 | #backgroundImage { 162 | /* background-image: url("../Images/Mobile-Background/pexels-alex-azabache-3214958.jpg"); 163 | background-position: center; 164 | background-repeat: no-repeat; 165 | background-size: cover; */ 166 | object-fit: cover; 167 | width: 100vw; 168 | height: 100vh; 169 | position: fixed; 170 | top: 0; 171 | left: 0; 172 | margin: 0; 173 | padding: 0; 174 | display: inline; 175 | } 176 | 177 | .Site-Title { 178 | width: 90%; 179 | font-size: 35px; 180 | } 181 | 182 | .login-box h1 { 183 | font-size: 20px; 184 | } 185 | 186 | .textbox { 187 | width: 90%; 188 | } 189 | } 190 | -------------------------------------------------------------------------------- /CSS/style.css: -------------------------------------------------------------------------------- 1 | body { 2 | margin: 0; 3 | overflow-y: scroll; 4 | /* overflow: hidden; */ 5 | padding: 0; 6 | } 7 | 8 | ::-webkit-scrollbar { 9 | width: 0; 10 | /* Remove scrollbar space */ 11 | background: transparent; 12 | /* Optional: just make scrollbar invisible */ 13 | } 14 | 15 | /*****************************************Header Styles *************************************************/ 16 | 17 | ul, 18 | nav { 19 | list-style: none; 20 | } 21 | 22 | a{ 23 | text-decoration: none; 24 | opacity: 0.75; 25 | color: #fff; 26 | } 27 | 28 | a:hover{ 29 | opacity: 1; 30 | } 31 | 32 | .grid { 33 | width: 100%; 34 | display: flex; 35 | flex-wrap: wrap; 36 | justify-content: center; 37 | } 38 | 39 | hr { 40 | width: 250px; 41 | height: 3px; 42 | background-color: #3f51b5; 43 | border: 0; 44 | margin-bottom: 50px; 45 | } 46 | 47 | a.btn { 48 | border-radius: 4px; 49 | text-transform: uppercase; 50 | font-weight: bold; 51 | text-align: center; 52 | background-color: #3f51b5; 53 | opacity: 1; 54 | } 55 | 56 | header { 57 | width: 95%; 58 | color: #fff; 59 | display: flex; 60 | justify-content: space-between; 61 | font-family: "Raleway", sans-serif; 62 | font-weight: 500; 63 | align-items: center; 64 | animation: 1s fadein 0.5s forwards; 65 | opacity: 0; 66 | padding: 20px auto; 67 | } 68 | 69 | @keyframes fadein { 70 | 100% { 71 | opacity: 1; 72 | } 73 | } 74 | 75 | header h2 { 76 | margin-left: 5%; 77 | } 78 | 79 | header nav { 80 | display: flex; 81 | } 82 | 83 | header nav li{ 84 | padding: 0 15px; 85 | } 86 | 87 | @media (max-width: 800px) { 88 | 89 | #content { 90 | flex-direction: column; 91 | } 92 | header { 93 | /* padding: 20px 50px; */ 94 | flex-direction: column; 95 | } 96 | header h2 { 97 | margin-bottom: 12px; 98 | } 99 | } 100 | 101 | /******************************************* BODY CONTENT ***********************************/ 102 | #content { 103 | height: 100vh; 104 | width: 100%; 105 | } 106 | 107 | /********************************************* MOBILE BACKGROUND IMAGE ANIMATION ************************************/ 108 | @media (max-width: 1025px) { 109 | #content { 110 | display: flex; 111 | flex-direction: column; 112 | animation-name: animate-mobile; 113 | animation-direction: alternate-reverse; 114 | animation-duration: 60s; 115 | animation-fill-mode: forwards; 116 | animation-iteration-count: infinite; 117 | animation-play-state: running; 118 | animation-timing-function: ease-in; 119 | background-image: linear-gradient(rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5)), url('../Images/Mobile-Background/pexels-alex-azabache-3214958.jpg'); 120 | background-size: cover; 121 | background-position: center; 122 | background-repeat: no-repeat; 123 | } 124 | 125 | /* Mobile display styles */ 126 | .Site-Title { 127 | font-size: 40px !important; 128 | padding-top: 30px !important; 129 | } 130 | 131 | .Tagline { 132 | width: 100% !important; 133 | } 134 | 135 | .Tagline h1 { 136 | font-size: 20px !important 137 | } 138 | 139 | .Tagline h3 { 140 | font-size: 15px !important; 141 | margin-bottom: 8% !important; 142 | } 143 | 144 | .button { 145 | font-size: 16px !important; 146 | /* margin-right: 30px !important; */ 147 | } 148 | 149 | .button-flex { 150 | display: flex; 151 | justify-content: space-between; 152 | } 153 | } 154 | 155 | /********************************************* CONTENT STYLING ************************************/ 156 | .Site-Title { 157 | text-align: center; 158 | color: lightgray; 159 | font-family: "Raleway", sans-serif; 160 | font-size: 60px; 161 | font-weight: 500; 162 | flex: 1; 163 | padding: 30px auto; 164 | padding-top: 50px; 165 | } 166 | 167 | .Tagline { 168 | color: white; 169 | margin: 30px; 170 | display: flex; 171 | flex-direction: column; 172 | width: 60%; 173 | margin: auto; 174 | text-align: center; 175 | } 176 | 177 | .Tagline h1 { 178 | font-family: 'Merriweather Sans', sans-serif; 179 | font-size: 40px; 180 | margin-bottom: 5px; 181 | display: inline-block; 182 | } 183 | 184 | .Tagline h3 { 185 | font-family: 'Montserrat', sans-serif; 186 | font-size: 20px; 187 | margin-top: 5px; 188 | margin-bottom: 10%; 189 | display: inline-block; 190 | } 191 | 192 | .button { 193 | color: white; 194 | background-color: #292c2f; 195 | text-decoration: none; 196 | font-family: 'Montserrat', sans-serif; 197 | font-size: 20px; 198 | padding: 10px 15px; 199 | } 200 | 201 | .button:hover { 202 | color: black; 203 | background-color: white; 204 | } 205 | 206 | .buttons-flex { 207 | width: 100%; 208 | display: flex; 209 | justify-content: space-around; 210 | } 211 | 212 | /******************************************* FOOTER STYLING ***********************************/ 213 | footer { 214 | position: relative; 215 | text-align: center; 216 | } 217 | 218 | .footer-distributed { 219 | background-color: #292c2f; 220 | box-shadow: 0 1px 1px 0 rgba(0, 0, 0, 0.12); 221 | box-sizing: border-box; 222 | width: 100%; 223 | font-family: 'Montserrat', sans-serif; 224 | font: bold 16px; 225 | } 226 | 227 | .footer-distributed { 228 | display: inline-block; 229 | vertical-align: top; 230 | } 231 | 232 | .footer-distributed .footer-links { 233 | color: #ffffff; 234 | padding: 0; 235 | } 236 | 237 | .footer-distributed .footer-links a { 238 | display: inline-block; 239 | line-height: 1.8; 240 | text-decoration: none; 241 | color: inherit; 242 | margin: 10px; 243 | padding: 5px; 244 | } 245 | 246 | .footer-links a:hover { 247 | background-color: black; 248 | text-decoration: underline; 249 | } 250 | 251 | .footer-distributed .footer-company-name { 252 | color: #8f9296; 253 | font-size: 14px; 254 | font-weight: normal; 255 | /* margin: 0; */ 256 | } 257 | 258 | .footer-distributed .footer-icons { 259 | margin-top: 15px; 260 | margin-bottom: 25px; 261 | } 262 | 263 | .footer-distributed .footer-icons a { 264 | display: inline-block; 265 | width: 35px; 266 | height: 35px; 267 | cursor: pointer; 268 | background-color: #33383b; 269 | border-radius: 2px; 270 | font-size: 20px; 271 | color: #ffffff; 272 | text-align: center; 273 | line-height: 35px; 274 | margin-right: 3px; 275 | margin-bottom: 5px; 276 | } 277 | 278 | .footer-icons a:hover { 279 | background-color: black; 280 | } 281 | 282 | @media (max-width: 880px) { 283 | .footer-distributed { 284 | font: bold 14px sans-serif; 285 | } 286 | 287 | .main { 288 | line-height: normal; 289 | font-size: auto; 290 | } 291 | } 292 | -------------------------------------------------------------------------------- /Images/Background/img1.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/sn2606/TravelLog/502b00e5da1dc01c0b300f8bb07dd3b3939c32c4/Images/Background/img1.jpg -------------------------------------------------------------------------------- /Images/Background/img3.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/sn2606/TravelLog/502b00e5da1dc01c0b300f8bb07dd3b3939c32c4/Images/Background/img3.jpg -------------------------------------------------------------------------------- /Images/Background/img5.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/sn2606/TravelLog/502b00e5da1dc01c0b300f8bb07dd3b3939c32c4/Images/Background/img5.jpg -------------------------------------------------------------------------------- /Images/Background/pexels-dominika-roseclay-1252500.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/sn2606/TravelLog/502b00e5da1dc01c0b300f8bb07dd3b3939c32c4/Images/Background/pexels-dominika-roseclay-1252500.jpg -------------------------------------------------------------------------------- /Images/Background/pexels-ketut-subiyanto-4436363.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/sn2606/TravelLog/502b00e5da1dc01c0b300f8bb07dd3b3939c32c4/Images/Background/pexels-ketut-subiyanto-4436363.jpg -------------------------------------------------------------------------------- /Images/Background/pexels-mohamed-almari-368893.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/sn2606/TravelLog/502b00e5da1dc01c0b300f8bb07dd3b3939c32c4/Images/Background/pexels-mohamed-almari-368893.jpg -------------------------------------------------------------------------------- /Images/Background/pexels-nappy-1058959.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/sn2606/TravelLog/502b00e5da1dc01c0b300f8bb07dd3b3939c32c4/Images/Background/pexels-nappy-1058959.jpg -------------------------------------------------------------------------------- /Images/Landing-Page-SS.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/sn2606/TravelLog/502b00e5da1dc01c0b300f8bb07dd3b3939c32c4/Images/Landing-Page-SS.png -------------------------------------------------------------------------------- /Images/Landing-Page-Screenshot.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/sn2606/TravelLog/502b00e5da1dc01c0b300f8bb07dd3b3939c32c4/Images/Landing-Page-Screenshot.png -------------------------------------------------------------------------------- /Images/Mobile-Background/pexels-alex-azabache-3214958.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/sn2606/TravelLog/502b00e5da1dc01c0b300f8bb07dd3b3939c32c4/Images/Mobile-Background/pexels-alex-azabache-3214958.jpg -------------------------------------------------------------------------------- /Images/Mobile-Background/pexels-ketut-subiyanto-4429452.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/sn2606/TravelLog/502b00e5da1dc01c0b300f8bb07dd3b3939c32c4/Images/Mobile-Background/pexels-ketut-subiyanto-4429452.jpg -------------------------------------------------------------------------------- /Images/Mobile-Background/pexels-simon-migaj-885880.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/sn2606/TravelLog/502b00e5da1dc01c0b300f8bb07dd3b3939c32c4/Images/Mobile-Background/pexels-simon-migaj-885880.jpg -------------------------------------------------------------------------------- /Images/Mobile-Background/pexels-taryn-elliott-3889855.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/sn2606/TravelLog/502b00e5da1dc01c0b300f8bb07dd3b3939c32c4/Images/Mobile-Background/pexels-taryn-elliott-3889855.jpg -------------------------------------------------------------------------------- /Images/about-us-rec.gif: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/sn2606/TravelLog/502b00e5da1dc01c0b300f8bb07dd3b3939c32c4/Images/about-us-rec.gif -------------------------------------------------------------------------------- /Images/alps_favicon.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/sn2606/TravelLog/502b00e5da1dc01c0b300f8bb07dd3b3939c32c4/Images/alps_favicon.png -------------------------------------------------------------------------------- /Images/mountain.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/sn2606/TravelLog/502b00e5da1dc01c0b300f8bb07dd3b3939c32c4/Images/mountain.png -------------------------------------------------------------------------------- /Images/search.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/sn2606/TravelLog/502b00e5da1dc01c0b300f8bb07dd3b3939c32c4/Images/search.png -------------------------------------------------------------------------------- /Images/traveller.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/sn2606/TravelLog/502b00e5da1dc01c0b300f8bb07dd3b3939c32c4/Images/traveller.png -------------------------------------------------------------------------------- /JS/about-us-toggle.js: -------------------------------------------------------------------------------- 1 | function menuToggle() { 2 | var nav = document.getElementById('menu-overlay'); 3 | nav.classList.toggle('active'); 4 | var nav1 = document.getElementById('toggle'); 5 | nav1.classList.toggle('active'); 6 | }; 7 | 8 | const toTop = document.querySelector(".toTop"); 9 | window.addEventListener("scroll", () => { 10 | if (window.pageYOffset > 300) { 11 | toTop.classList.add("active"); 12 | } else { 13 | toTop.classList.remove("active"); 14 | } 15 | }) 16 | -------------------------------------------------------------------------------- /JS/change-bg.js: -------------------------------------------------------------------------------- 1 | // onload document window using js 2 | window.onload = function(){ 3 | // pick body element ID 4 | var image = document.getElementById("content"); 5 | 6 | var x = window.matchMedia("(max-width: 1025px)"); 7 | if(x.matches){ 8 | // Background Images 9 | var images = [ 10 | 'url(../Images/Mobile-Background/pexels-taryn-elliott-3889855.jpg)', 11 | 'url(../Images/Mobile-Background/pexels-alex-azabache-3214958.jpg)', 12 | 'url(../Images/Mobile-Background/pexels-ketut-subiyanto-4429452.jpg)', 13 | 'url(../Images/Mobile-Background/pexels-simon-migaj-885880.jpg)', 14 | ] 15 | 16 | // change image every after 5 seconds 17 | var i = 0; 18 | i = Math.floor(images.length * Math.random()); 19 | image.style.backgroundImage = 'linear-gradient(rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5)), ' + images[i]; 20 | image.style.backgroundSize = "cover"; 21 | image.style.backgroundRepeat = "no-repeat"; 22 | image.style.backgroundPosition = "center"; 23 | 24 | } else { 25 | 26 | // Background Images 27 | var images = [ 28 | 'url(../Images/Background/img1.jpg)', 29 | 'url(../Images/Background/img3.jpg)', 30 | 'url(../Images/Background/img5.jpg)', 31 | 'url(../Images/Background/pexels-dominika-roseclay-1252500.jpg)', 32 | 'url(../Images/Background/pexels-ketut-subiyanto-4436363.jpg)', 33 | 'url(../Images/Background/pexels-nappy-1058959.jpg)', 34 | 'url(../Images/Background/pexels-mohamed-almari-368893.jpg)', 35 | ] 36 | 37 | // change image every after 5 seconds 38 | var i = 0; 39 | i = Math.floor(images.length * Math.random()); 40 | console.log(i); 41 | image.style.backgroundImage = 'linear-gradient(rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5)), ' + images[i]; 42 | image.style.backgroundSize = "cover"; 43 | image.style.backgroundRepeat = "no-repeat"; 44 | image.style.backgroundPosition = "center"; 45 | } 46 | } -------------------------------------------------------------------------------- /JS/homepage.js: -------------------------------------------------------------------------------- 1 | document.getElementById("get-photo").onchange = function() { 2 | var img = document.getElementById("get-photo"); 3 | var txt = document.getElementById("size-chk"); 4 | var imgSize = img.files[0].size; 5 | var imgName = img.files[0].name; 6 | console.log(imgSize + " " + imgName); 7 | if(imgSize >= 16777216) { 8 | txt.innerHTML = "File size should be less than 16MiB"; 9 | txt.style.color = "red"; 10 | document.getElementById("create-post").reset(); 11 | }else{ 12 | txt.innerHTML = imgName; 13 | txt.style.color = "#334"; 14 | } 15 | } 16 | 17 | hearts = ['url("data:image/png;base64,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")', 18 | 'url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAYAAABzenr0AAACAUlEQVRYR82XjU0DMQxGv04ATAAbQCeATkA7ATABsAEbABMAEwATABNAJ6BsUCYAvZNducf9JHcnlUioIrHzvdiOoxtpw2O0YX3VAZxIOrK/PYP8kPQq6dl+q9jxOTa/AzNYmP2T+a75lQFwupPkznUBYrMzSUsz2Da/aUtEOcClJA5TjAhwKulaEpv5+A7GQG2FNU42s/8fJXmkmGryAxo/YFYAbP4SxN8kXVWEGkjmd004RoCpL1u/L0WC1OB3GPwmHM4jgDhGjAdJCNUNIgT9fslgbns4VJU/YNQXgz0mACBG3hmc3EEaGIo0RYgUcd8PP4/EDIBIRViK3CQMIG7M7iIUZJsrByTiRbQB+LQConBiAbZt1GedNFHQCwB+MsPfR/hPGv4FAE2BiiYsO0McL2EPj/qcCFBI5+ZEdyvf4YT9skzirbsFIFYl3W2cUdFZylbk76Frjr0R0dt5RBikhOvY1FByhbHnhnH9/J3hUZs6AIsIe4sdGqIsTssGZBkfIyZoQv7gDAVRFqffkPbiRax6joeEaBSvAmBuqEi0itcBDAGRJN4E0AciWbwNoAtElngKQA5EtngqQApEJ/EcgCYI1mKHW7vnbS0z98Ok6oo6HL9Z4rkR8MOUIXw+W7wrQFU6Oon3AXAIXlEGX0Srr522vMf13BrI2TvJduMAv9o2lX4LR6fmAAAAAElFTkSuQmCC")' 19 | ] 20 | 21 | var i = 0; 22 | document.getElementsByClassName("heart").onclick = function() { 23 | i = (i == 0) ? 1 : 0; 24 | document.getElementsByClassName("heart").style.backgroundImage = hearts[i]; 25 | } 26 | 27 | -------------------------------------------------------------------------------- /JS/script.js: -------------------------------------------------------------------------------- 1 | document.querySelector('.img-btn').addEventListener('click', function() 2 | { 3 | document.querySelector('.cont').classList.toggle('s-signup') 4 | } 5 | ); 6 | -------------------------------------------------------------------------------- /JS/scroll-homepage.js: -------------------------------------------------------------------------------- 1 | // When the user scrolls the page, execute myFunction 2 | window.onscroll = function() {myFunction()}; 3 | 4 | // Get the header 5 | var header = document.getElementById("header"); 6 | 7 | // Get the offset position of the navbar 8 | var sticky = header.offsetTop; 9 | 10 | // Add the sticky class to the header when you reach its scroll position. Remove "sticky" when you leave the scroll position 11 | function myFunction() { 12 | if (window.pageYOffset > sticky) { 13 | header.classList.add("sticky"); 14 | } else { 15 | header.classList.remove("sticky"); 16 | } 17 | } -------------------------------------------------------------------------------- /LICENSE.txt: -------------------------------------------------------------------------------- 1 | MIT License 2 | 3 | Copyright (c) 2018 Othneil Drew 4 | 5 | Permission is hereby granted, free of charge, to any person obtaining a copy 6 | of this software and associated documentation files (the "Software"), to deal 7 | in the Software without restriction, including without limitation the rights 8 | to use, copy, modify, merge, publish, distribute, sublicense, and/or sell 9 | copies of the Software, and to permit persons to whom the Software is 10 | furnished to do so, subject to the following conditions: 11 | 12 | The above copyright notice and this permission notice shall be included in all 13 | copies or substantial portions of the Software. 14 | 15 | THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR 16 | IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, 17 | FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE 18 | AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER 19 | LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, 20 | OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE 21 | SOFTWARE. 22 | -------------------------------------------------------------------------------- /PHP/accept-request.php: -------------------------------------------------------------------------------- 1 | prepare("INSERT INTO friends (user_id, friend_id) VALUES (?, ?), (?, ?)"); 6 | // friendship is 2-sided 7 | $statement->bind_param('iiii', $_SESSION['userid'], $_GET['uid'], $_GET['uid'], $_SESSION['userid']); 8 | // remove friend request 9 | if ($statement->execute()) { 10 | redirect_to("decline-request.php?uid=" . $_GET['uid']); 11 | } else { 12 | echo "Error: " . $conn->error; 13 | } -------------------------------------------------------------------------------- /PHP/add-friend.php: -------------------------------------------------------------------------------- 1 | prepare($sql); 6 | $statement->bind_param('ii', $_SESSION['userid'], $_GET['uid']); 7 | if ($statement->execute()) { 8 | $id = $_GET['uid']; 9 | $un = $_SESSION['username']; 10 | $msg = "@".$un." sent you a friend request."; 11 | $sql = "INSERT into notifications(user_id, notification) VALUES('$id','$msg')"; 12 | if($conn->query($sql)){ 13 | redirect_to("homepage.php?request_sent=true"); 14 | } 15 | } else { 16 | echo "Error: " . $conn->error; 17 | } -------------------------------------------------------------------------------- /PHP/contact-us.php: -------------------------------------------------------------------------------- 1 | 14 | 15 | 16 | 17 | 18 |
19 | 20 | 21 |Rahjung street, Pune, India
51 |contact@travellog.com
61 |123-456-7890
71 |
27 |
30 | Nothing to display yet!
89 | prepare($sql); 8 | $statement->bind_param('ssi', $_POST['status'], $_POST['location'], $_SESSION['userid']); 9 | if($statement->execute()) { 10 | redirect_to("profile.php?username={$_SESSION['username']}"); 11 | } else { 12 | echo "Error: ".$conn->error; 13 | } 14 | } 15 | 16 | if (isset($_POST['update_img'])) { 17 | 18 | if (empty($_FILES['get-photo']['tmp_name'])) { 19 | print "Invalid request"; 20 | $_SESSION['prof-flag'] = 0; 21 | redirect_to("profile.php?username={$_SESSION['username']}"); 22 | } else { 23 | 24 | // $sql = "INSERT INTO posts (user_id, content, content_img, created_at) VALUES (?, ?, ?, ?)"; 25 | $blobimg = file_get_contents($_FILES['get-photo']['tmp_name']); 26 | $uid = $_SESSION['userid']; 27 | // $sql = "INSERT INTO users(profile_img) VALUES '$blobimg' WHERE user_id = '$uid'"; 28 | $statement = $conn->prepare("UPDATE users SET profile_img = ? WHERE user_id = ?"); 29 | $statement->bind_param('si', $blobimg, $uid); 30 | // $statement->bind_param('s', $content); 31 | // $statement->bind_param('b', $blobimg); 32 | // $statement->bind_param('s', $date); 33 | if ($statement->execute()) { 34 | $_SESSION['prof-flag'] = 1; 35 | redirect_to("profile.php?username={$_SESSION['username']}"); 36 | } else { 37 | echo "Error: " . $conn->error; 38 | } 39 | } 40 | } 41 | $conn->close(); -------------------------------------------------------------------------------- /PHP/footer.php: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 |Hello
108 | 129 |User does not exist.
44 | fetch_assoc(); 47 | $db_pass = $userpass['password']; 48 | $pass_decode = password_verify($password, $db_pass); 49 | 50 | if ($pass_decode) { 51 | $_SESSION['name'] = $userpass['name']; 52 | $_SESSION['username'] = $username; 53 | $_SESSION['post-flag'] = 1; 54 | $_SESSION['prof-flag'] = 1; 55 | $_SESSION['userid'] = $userpass['user_id']; 56 | ?> 57 | 60 | 61 | 69 | 70 | 71 | 94 | 95 | 96 | 97 | -------------------------------------------------------------------------------- /PHP/logout.php: -------------------------------------------------------------------------------- 1 | 4 | 5 | 6 |
21 |
24 | No posts yet!
123 | close(); 126 | ?> 127 | 128 | -------------------------------------------------------------------------------- /PHP/profile.php: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 |
108 |
111 |
112 | Status:
Location:
25 |
26 |
27 |
28 |
29 |
30 |
33 |
34 | query($emailquery);
48 |
49 | $userquery = "SELECT * FROM users WHERE username = '$username'";
50 | $userres = $conn->query($userquery);
51 |
52 | if ($emailres->num_rows > 0) {
53 | echo "Email already exists.";
54 | } elseif ($userres->num_rows > 0) {
55 | echo "User already exists.";
56 | } else {
57 | if ($password === $cpassword) {
58 | $sql = "INSERT INTO users(name, email, username, password) VALUES('$name', '$email', '$username', '$pass')";
59 | $result = $conn->query($sql);
60 | $sql = "SELECT user_id FROM users WHERE username='$username'";
61 | $result = $conn->query($sql);
62 | if ($result->num_rows > 0) {
63 | while($row = $result->fetch_assoc()) {
64 | $id = $row['user_id'];
65 | $sql = "INSERT into notifications(user_id, notification) VALUES('$id', 'Welcome to TravelLog')";
66 | $res = $conn->query($sql);
67 | }
68 | }
69 | redirect_to("login.php");
70 | } else {
71 | echo "Passwords not matching.";
72 | }
73 | }
74 | $conn->close();
75 | }
76 | ?>
77 |
78 |
79 |
114 |
115 |
116 |
--------------------------------------------------------------------------------
/PHP/terms-and-conditions.php:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 |
6 | 42 | TravelLog Mgmt., SRL ("TravelLog Mgmt.") operates TravelLog (as defined below), your use of TravelLog is governed by these Terms of Service (“Terms”), and your use of TravelLog constitutes your acceptance of the Terms. 43 |
44 |45 | "TravelLog" (the "Service") means TravelLog project management solution made available at Repository (the “Site”) and any other software, sites, and services offered by TravelLog Mgmt. in connection therewith but does not include any sites, services, products, or offerings governed by other terms of use, or, other agreements between you and TravelLog Mgmt.. "Customer Data" means any data you make available to TravelLog Mgmt. or TravelLog from your GitHub account for the purpose of using TravelLog. "Content" means all content generated by TravelLog Mgmt. on your behalf (including metric data) and does not include Customer Data. 46 |
47 |48 | We will endeavor to provide you with notice about major changes to the Terms or TravelLog and other changes (via email to the address on your account), but we make no guarantees. Other changes could be, without limitation, changes to payment policies, security patches, added or removed functionality, and other enhancements or restrictions to TravelLog. Your use of TravelLog after the Terms have changed constitutes your acceptance of the Terms as changed. You may reject changes to the Terms by terminating your subscription in accordance with the "Cancellation and Termination" section of these Terms of Service. TravelLog Mgmt. shall not be liable to you or to any third party for any change to TravelLog. 49 |
50 |51 | Please use TravelLog responsibly and in compliance with these Terms. If you don't, we reserve the right to terminate your subscription in accordance with the "Cancellation and Termination" section of these Terms of Service. 52 |
53 | 54 |56 | To use TravelLog, you must (i) Sign Up (ii) authorize TravelLog Mgmt. to access your Customer Data to provide TravelLog, (iii) provide accurate account information any time you register to use TravelLog, (iv) provide accurate GitHub account information when you register to use TravelLog, and (v) be a human over the age of 13. Uses by automated methods are not permitted. You grant TravelLog Mgmt. a non-exclusive, royalty-free, and worldwide license to use, store, and copy your Customer Data in order to provide TravelLog. 57 |
58 |59 | You are responsible for the security of your passwords and for any use of your account. You may not allow multiple people to use the same account or otherwise access TravelLog in a manner intended to avoid incurring fees. 60 |
61 |62 | You must comply with all applicable GitHub policies and terms of service. TravelLog Mgmt. is not responsible for any acts or omissions of GitHub whether related to your account or otherwise. 63 |
64 |65 | TravelLog Mgmt. reserves the right to enforce quotas and usage limits (to any resources, including the API) at its sole discretion, with or without notice, which may result in TravelLog Mgmt. disabling or throttling your usage of the Service for any amount of time. 66 |
67 |68 | You are responsible for obtaining access to TravelLog and that access may involve third party fees (such as Internet service provider or airtime charges). You are responsible for those fees. In addition, you must provide and are responsible for all equipment necessary to access the Site. 69 |
70 |71 | You may not use TravelLog: 72 |
73 |90 | To cancel your subscription, account, and access to TravelLog, send us an email at hi@tryTravelLog.com instructing us to do so or cancel via the functionality on the Waffle website. If you paid for your subscription, TravelLog Mgmt. is not obligated to provide any refunds if you cancel your subscription or if TravelLog Mgmt. terminates your subscription because you breached these Terms. If your subscription is cancelled or terminated in accordance with the foregoing before the end of the current paid-up month, your cancellation will take effect immediately and you will not be charged again. All of your Customer Data and Content will, within a reasonable amount of time to be determined solely by TravelLog Mgmt., be deleted from TravelLog upon cancellation. 91 |
92 |93 | You agree that TravelLog Mgmt., in its sole discretion and for any or no reason, may terminate or suspend your account. You agree that any termination of your access to the Service may be without prior notice, and you agree that TravelLog Mgmt. will not be liable to you or any third party for such termination. If you paid for your subscription, and TravelLog Mgmt. did not terminate or suspend your account due to your breach of these Terms, TravelLog Mgmt. will provide a pro-rata refund of unused subscription fees if it terminates or suspends your account in accordance with this paragraph. 94 |
95 | 96 |98 | TravelLog Mgmt. claims no ownership or control over any Customer Data. Except for the license expressly granted by you to TravelLog Mgmt. to provide TravelLog, you retain all right, title, and interest in and to Customer Data and you are responsible for protecting those rights and interests, as appropriate. Notwithstanding the foregoing, you grant to TravelLog Mgmt. for its use a worldwide, non-exclusive, royalty-free license to aggregate or compile Customer Data with customer data of other users of TravelLog so long as such aggregation or compilation omits any data that would enable the identification of you (“Aggregated Data”). TravelLog Mgmt. shall have a worldwide, perpetual, royalty-free license to use, modify, distribute and create derivative works based on such Aggregated Data, and as between you and TravelLog Mgmt., TravelLog Mgmt. shall own all compilations of the Aggregated Data, including all reports, statistics or analyses created or derived therefrom. 99 |
100 |101 | You understand that projects in TravelLog will display Customer Data to you and any collaborators that you designate for that project. You are solely responsible for any collaborators and third-parties (including third-party services) that you allow to view Customer Data and entrust them at your own risk. 102 |
103 |104 | You are solely responsible for configuring TravelLog to allow appropriate access to your Customer Data. TravelLog Mgmt. is not responsible if you fail to configure, or misconfigure, your project and inadvertently allow unauthorized parties to view any Customer Data. 105 |
106 | 107 |109 | As part of your use of TravelLog, you may choose, or we may invite you, to submit comments, feedback or ideas about TravelLog, including but not limited to ideas about improving TravelLog or our other offerings ("Ideas"). You hereby grant TravelLog Mgmt. a perpetual, royalty-free, unlimited, worldwide license to use and/or incorporate such Ideas into any TravelLog Mgmt. offering (including TravelLog) at any time in TravelLog Mgmt.’s sole discretion. Ideas you submit will not be afforded any confidential treatment by TravelLog Mgmt., regardless of whether you request such treatment or otherwise designate Ideas as proprietary or confidential. 110 |
111 | 112 |114 | The TravelLog may contain links to other websites or content (“Third Party Sites”). TravelLog Mgmt. does not endorse, sanction or verify the accuracy or ownership of the information contained in/on any Third Party Site or any products or services advertised on Third Party Sites. If you decide to leave the Site and navigate to Third Party Sites, or install any software or download content from any such Third Party Sites, you do so at your own risk. Once you access a Third Party Site through a link on our Site, you may be subject to the terms and conditions of such Third Party Site. You should review the applicable policies, including privacy and data gathering practices, of any Third Party Site to which you navigate from the Site, or relating to any software you use or install from a Third Party Site, including any applicable license agreement. Concerns regarding a Third Party Site should be directed to the Third Party Site itself. TravelLog Mgmt. bears no responsibility for any action associated with any Third Party Site. 115 |
116 | 117 |119 | Subject to and conditioned upon your agreement to and compliance with these Terms, we will make TravelLog available to you on a subscription basis solely for your own use and not for resale or to provide services to any third party. 120 |
121 |122 | Excluding Third Party Sites and their related content, all of the content available on or through TravelLog, including without limitation, text, photographs, graphics, logos, trade/service marks, and/or audiovisual content, but expressly excluding Customer Data, is owned and/or controlled by TravelLog Mgmt., its licensors or TravelLog users and is protected, as applicable, by copyright, trademark, trade dress, patent, and trade secret laws, other proprietary rights, and international treaties. You acknowledge that TravelLog and any underlying technology or software used in connection with TravelLog contain our proprietary information. 123 |
124 |125 | You will not, nor will you attempt to (or allow anyone else to or attempt to): 126 |
127 |171 | Open source software licenses for components of TravelLog released under an open source license constitute separate written agreements. To the limited extent that the open source software licenses expressly supersede these Terms, the open source licenses govern your agreement with TravelLog Mgmt. only for the use of the components of TravelLog released under an open source license. 172 |
173 | 174 |176 | You understand that TravelLog Mgmt. may access and disclose Customer Data or otherwise provide third parties access to it for the following reasons: 177 |
178 |204 | TravelLog Mgmt. respects the intellectual property of others and requires that our users do the same. If you believe that material or content residing on or accessible through TravelLog infringes a copyright, please send a notice of copyright infringement containing the following information to the Designated Copyright Agent listed below: 205 |
206 |227 | Our Designated Copyright Agent for notification of claimed infringement can be reached by email at: hi@tryTravelLog.com or at the following postal address: 228 |
229 |230 | Attn: Legal/Urgent, TravelLog Mgmt./TravelLog, 1011 Cassinoni, Montevideo, Uruguay 231 |
232 |233 | Disclaimer of Warranties: 234 |
235 |236 | IF YOU ACCESS TravelLog, YOU DO SO AT YOUR OWN RISK. WE PROVIDE TravelLog “AS IS,” “WITH ALL FAULTS” AND “AS AVAILABLE.” WE MAKE NO EXPRESS OR IMPLIED WARRANTIES OR GUARANTEES ABOUT TravelLog. TO THE MAXIMUM EXTENT PERMITTED BY LAW, WE HEREBY DISCLAIM ALL SUCH WARRANTIES, INCLUDING ALL STATUTORY WARRANTIES, WITH RESPECT TO TravelLog, INCLUDING WITHOUT LIMITATION ANY WARRANTIES THAT TravelLog IS MERCHANTABLE, OF SATISFACTORY QUALITY, ACCURATE, FIT FOR A PARTICULAR PURPOSE OR NEED, OR NON-INFRINGING. WE DO NOT GUARANTEE THAT THE RESULTS THAT MAY BE OBTAINED FROM THE USE OF TravelLog WILL BE EFFECTIVE, RELIABLE OR ACCURATE OR WILL MEET YOUR REQUIREMENTS. WE DO NOT GUARANTEE THAT YOU WILL BE ABLE TO ACCESS OR USE TravelLog (EITHER DIRECTLY OR THROUGH THIRD-PARTY NETWORKS) AT TIMES OR LOCATIONS OF YOUR CHOOSING. WE ARE NOT RESPONSIBLE FOR THE ACCURACY, RELIABILITY, TIMELINESS OR COMPLETENESS OF INFORMATION PROVIDED BY ANY OTHER USERS OF TravelLog OR ANY OTHER DATA OR INFORMATION PROVIDED OR RECEIVED THROUGH TravelLog. EXCEPT AS EXPRESSLY SET FORTH HEREIN, TravelLog Mgmt. MAKES NO WARRANTIES ABOUT THE INFORMATION SYSTEMS, SOFTWARE AND FUNCTIONS MADE ACCESSIBLE BY OR THROUGH TravelLog OR ANY SECURITY ASSOCIATED WITH THE TRANSMISSION OF SENSITIVE INFORMATION. TravelLog Mgmt. DOES NOT WARRANT THAT TravelLog WILL OPERATE ERROR-FREE, THAT ERRORS IN THE SERVICE WILL BE FIXED, THAT LOSS OF DATA WILL NOT OCCUR, OR THAT TravelLog IS FREE OF COMPUTER VIRUSES, CONTAMINANTS OR OTHER HARMFUL ITEMS. UNDER NO CIRCUMSTANCES WILL TravelLog Mgmt., ANY OF OUR AFFILIATES, DISTRIBUTORS, PARTNERS, LICENSORS, AND/OR ANY OF OUR OR THEIR DIRECTORS, OFFICERS, EMPLOYEES, CONSULTANTS, AGENTS, OR OTHER REPRESENTATIVES BE LIABLE FOR ANY LOSS OR DAMAGE CAUSED BY YOUR RELIANCE ON INFORMATION OBTAINED THROUGH THE SERVICE. 237 |
238 | 239 |241 | YOUR SOLE AND EXCLUSIVE REMEDY FOR ANY DISPUTE WITH US IS THE CANCELLATION OF YOUR USE OF TravelLog. IN NO EVENT SHALL WE BE LIABLE TO YOU (OR TO ANY THIRD PARTY CLAIMING UNDER OR THROUGH YOU) FOR ANY DAMAGES WHATSOEVER, INCLUDING, INDIRECT, SPECIAL, INCIDENTAL, CONSEQUENTIAL, PUNITIVE OR EXEMPLARY DAMAGES OR ANY BODILY INJURY, EMOTIONAL DISTRESS, DEATH OR ANY OTHER DAMAGES ARISING FROM YOUR USE OF OR INABILITY TO USE TravelLog, WHETHER ON-LINE OR OFF-LINE, OR OTHERWISE IN CONNECTION WITH TravelLog. THESE EXCLUSIONS APPLY TO ANY CLAIMS FOR LOST PROFITS, LOST DATA, LOSS OF GOODWILL OR BUSINESS REPUTATION, COST OF PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES, WORK STOPPAGE, COMPUTER FAILURE OR MALFUNCTION, ANY OTHER COMMERCIAL DAMAGES OR LOSSES, OR ANY PERSONAL INJURY OR PROPERTY DAMAGES, EVEN IF WE KNEW OR SHOULD HAVE KNOWN OF THE POSSIBILITY OF SUCH DAMAGES. TravelLog Mgmt.’S LIABILITY UNDER THESE TERMS SHALL BE LIMITED TO THE FEES YOU PAID TravelLog Mgmt. IN THE TWELVE MONTHS PRIOR TO THE DATE THE CLAIM AROSE. BECAUSE SOME STATES OR JURISDICTIONS DO NOT ALLOW THE EXCLUSION OR THE LIMITATION OF LIABILITY FOR CONSEQUENTIAL OR INCIDENTAL DAMAGES, IN SUCH STATES OR JURISDICTIONS, OUR LIABILITY SHALL BE LIMITED TO THE EXTENT PERMITTED BY LAW. 242 |
243 | 244 |246 | You agree to hold harmless and indemnify TravelLog Mgmt., and its subsidiaries, affiliates, officers, agents, employees, advertisers, licensors, suppliers or partners from and against any third party claim arising from or in any way related to (a) your breach of the Terms, (b) your use of TravelLog, (c) your violation of applicable laws, rules or regulations in connection with TravelLog, or (d) your Customer Data, including any liability or expense arising from all claims, losses, damages (actual and consequential), suits, judgments, litigation costs and attorneys' fees, of every kind and nature. In such a case, TravelLog Mgmt. will provide you with written notice of such claim, suit or action. 247 |
248 | 249 |251 | These Terms will be governed by and construed in accordance with the laws of the State of California without giving effect to principles of conflict of laws, and the parties consent to the jurisdiction of the federal courts of the State of California. Each party irrevocably submits to the jurisdiction and venue of any such court in any such action or proceeding. The United Nations Convention on Contracts for the International Sale of Goods will not apply to These Terms. 252 |
253 | 254 |256 | These Terms constitute the whole legal agreement between you and TravelLog Mgmt. and govern your use of the Service and completely replace any prior agreements between you and TravelLog Mgmt., written or oral, in relation to TravelLog. 257 |
258 |259 | If any part of the Terms is held invalid or unenforceable, that portion shall be construed in a manner consistent with applicable law to reflect, as nearly as possible, the original intentions of the parties, and the remaining portions shall remain in full force and effect. 260 |
261 |262 | The failure of TravelLog Mgmt. to exercise or enforce any right or provision of the Terms shall not constitute a waiver of such right or provision. 263 |
264 |265 | TravelLog Mgmt. shall not be liable for failing or delaying performance of its obligations resulting from any condition beyond its reasonable control, including but not limited to, governmental action, acts of terrorism, earthquake, fire, flood or other acts of God, labor conditions, power failures, and Internet disturbances. 266 |
267 |268 | TravelLog Mgmt. may assign this contract at any time to any parent, subsidiary, or any affiliated company, or as part of the sale to, merger with, or other transfer of our company to another entity. You may not assign these Terms. 269 |
270 |271 | These Terms are adapted from the Waffle.io Terms of Service, which is an adaption of the CodeClimate Terms of Service, which is an adaption of the Heroku Terms of Service, which in turn is an adaptation of the Google App Engine Terms of Service. The original work has been modified with permission under the Creative Commons Attribution 3.0 License. Neither CA, Inc, CodeClimate, LLC, Heroku, Inc. nor Google, Inc. is connected with, nor do they sponsor or endorse, TravelLog Mgmt. or its use of the work. 272 |
273 |274 | Version 1.0, Feb 21, 2021 275 |
276 | 277 |
34 |
35 |
36 |
37 |
38 |
41 | Social Network website for sharing travel experiences & travel micro-blogging.
42 |
43 |
44 |
45 |
46 |
47 | ·
48 | Report Bug
49 | ·
50 |
51 |
44 | Are you the one for camping the the rainforests? Or backpacking through Europe? Or scaling the tallest mountains?
45 |
46 | At TravelLog, meet others that share your love for travelling. All are welcome. The team is committed to making the platform as safe and inclusive as
47 | possible.
48 |
49 | Share photos, videos and post your experiences with the rest of the world. Carve a corner in the internet
50 | where people can see the world through your eyes.
51 |
52 | Connect with explorers and create content that reflects your free soul. Grow your brand with our global community. And it's completely free!
53 |
58 |
82 | 85 | 86 | An amazing experience with an awesome community! Got to share my love for Hungarian Architecture with the world. 87 | 88 |89 |
96 | 99 | 100 | Found so many others to explore the Australian wildlife with! No more shrieking over spiders alone! 101 | 102 |103 |
110 | 113 | 114 | Absolutely the best place to share my city core photography! 115 | 116 |117 |