JezK

Edit File: index1.php

<?php
include("mainHeader.php");
$categories = $users->categories();
?>
<html>

<head>
    <meta charset="utf-8">
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <title>Video Consultation</title>
    <meta name="description" content="">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <meta name="robots" content="all,follow">
    <link rel="stylesheet" href="css/bootstrap.min.css">
    <link rel="stylesheet" href="css/custom.css">
    <link rel="stylesheet" href="css/font-awesome.min.css">
    <link rel="stylesheet" href="css/fontastic.css">
    
    <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Roboto:300,400,500,700">
    
    <link rel="stylesheet" href="css/jquery.mCustomScrollbar.css">
    
    <link rel="stylesheet" href="css/style.default.css" id="theme-stylesheet">
    <link rel="stylesheet" href="css/style.css">
    <link rel="stylesheet" href="build/css/intlTelInput.css" />
    <link rel="stylesheet" type="text/css" href="css/daterangepicker.css" />
    <link rel="stylesheet" type="text/css" href="css/dataTables.bootstrap4.min.css">
    <link rel="stylesheet" href="css/user.css" />
    <link href='https://fonts.googleapis.com/css?family=Poppins' rel='stylesheet'>
</head>
<style>
    .masthead {
        padding-top: calc(6rem + 0px);
        padding-bottom: 6rem;
    }

@media screen and (max-width: 768px) and (min-width: 360px) {
        .mrWidth {
            width: 100%;
        }
    }

.bappntmnt {
        padding: 10px 60px;
        border-radius: 10px;
        border: none;
        background: #133087;
        color: white;
        font-weight: bold;
    }

.bigbappntmnt {
        padding: 10px 53px;
        border: none;
        color: white;
        border-radius: 13px;
        background: #133087;
        font-weight: bold;
    }

.textCgrey {
        color: rgb(122, 122, 122);
        ;
    }

.textCblue {
        color: #133087;
    }

.nv-pad {
        padding: 0px 20px;
    }

.nv-pad>a {
        color: black !important;
    }

.clsShadow {
        box-shadow: 0 0 3px !important;
    }

.clsWord {
        word-spacing: 5px;
    }

.social-media {
        display: inline-block;
        float: right;
        margin-bottom: 0;
    }

.social-media li {
        display: inline-block;
    }

.smlBorder:before {

content: "";
        position: absolute;
        left: 45%;
        top: 10px;
        height: 1px;
        width: 12%;
        /* percentage of the element width*/
        border-bottom: 1px solid #133087;
        margin-top: 1.2em;

}

#home-section {
        background: #262626;
        position: relative;
        z-index: 999999;
    }

body {
        font-family: 'Poppins' !important;
        font-weight: normal !important;
    }

.scrollNav {
        top: 0 !important;
    }

.navbartop {
        top: 0 !important;
    }

.fixed-top-nav {
        position: fixed;
        top: 39;
        right: 0;
        left: 0;
        z-index: 1030;
    }
</style>

<body>
    <div class="border-bottom top-bar py- " id="home-section">
        <div class="container">
            <div class="row">
                <div class="col-12 col-sm-6 col-md-6">
                    
                </div>
                <div class=" col-12 col-sm-6 col-md-6">
                    <ul class="social-media">
                        <li><a href="#" class="px-1 py-1"><span class="icon-facebook"><img src="./img/fb.png" alt=""></span></a></li>
                        <li><a href="#" class="px-1 py-1"><span class="icon-twitter"><img src="./img/google.png" alt=""></span></a></li>
                        <li><a href="#" class="px-1 py-1"><span class="icon-instagram"><img src="./img/in.png" alt=""></span></a></li>
                        <li><a href="#" class="px-1 py-1"><span class="icon-linkedin"><img src="./img/twitter.png" alt=""></span></a></li>
                    </ul>
                </div>
            </div>
        </div>
    </div>
    <nav class="navbar navbar-expand-lg navbar-light bg-light fixed-top-nav mx-0" id="nav_bar">
        <div class="container-fluid mx-0">
            <a class="navbar-brand" href="#"><img src="img/logo1.png" alt="logo" width="207px" height="41px"></a>
            <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarResponsive" aria-controls="navbarResponsive" aria-expanded="false" aria-label="Toggle navigation">
                <span class="navbar-toggler-icon"></span>
            </button>
            <div class="collapse navbar-collapse" id="navbarResponsive">
                <ul class="navbar-nav ml-auto">
                    <?php if (isset($_SESSION['id'])) { ?>
                        <li class="nav-item nv-pad">
                            <a class="nav-link login-padding border-right-0" href="appointment.php">Dashboard</a>
                        </li>
                    <?php } ?>
                    <li class="nav-item nv-pad">
                        <a class="nav-link Help-padding border-right-0" href="#">Help</a>
                    </li>
                    <li class="nav-item nv-pad">
                        <a class="nav-link support-padding border-right-0" href="#">Support</a>
                    </li>
                    <?php if (isset($_SESSION['id'])) { ?>
                        <li class="nav-item nv-pad">
                            <a class="nav-link login-padding border-right-0" href="logout.php">Logout</a>
                        </li>
                    <?php } else { ?>
                        <li class="nav-item nv-pad">
                            <a class="nav-link login-padding border-right-0" href="signup.php">Signup</a>
                        </li>
                        <li class="nav-item nv-pad">
                            <a class="nav-link login-padding border-right-0" href="login.php">Login</a>
                        </li>
                    <?php } ?>
                </ul>
            </div>
        </div>
    </nav>
    <header class="masthead mt-4">
        <div class="container    flex-column">
            <div class="row">
                <div class="col-12 col-sm-6 col-md-6">
                    <img src="./img/call.jpg" class="img-fluid" alt="" height="400px" width="582px">
                </div>
                <div class="col-12 col-sm-6 col-md-6">
                    <div class="px-5">
                        <h1 class="" style="font-size:27.8px;"><span class="smlBorder">Welcome to the Practman.com</span></h1>
                        <div></div>
                    </div>
                    <div class="px-5 py-4">
                        <p style="line-height:30px; " class="textCgrey">
                            Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s
                        </p>
                    </div>
                    <div class="px-5 pb-5">
                        <h3>No of professionals 5</h3>
                    </div>
                    <div class="px-5">
                        <div class="row">
                            <div class="col-sm-4 pt-4">
                                <h4 class="d-flex"> <img class="img-fluid" src="./img/greenverified.png" alt=""> &nbsp;&nbsp;<span class="pt-2">Verified</span></h4>
                            </div>
                            <div class="col-sm-8 text-center">
                                <h4 class="textCblue">Consultation 100Rs./ 10min</h4>
                                <button class="bigbappntmnt">BOOK AN APPOINTMENT</button>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </header>
    <section class="bg-white pb-5">
        <div class="container ">
            <div class="row">
                <div class="col-sm-6 col-md-4 col-lg-4 mt-4">
                    <div class="card">
                        <img class="card-img-top" src="./img/call.jpg" width="350" height="263" style="border-bottom:3px solid #133087;">
                        <div class="p-3 clsShadow">
                            <h4 class="textCblue">Sree Hospitals</h4>
                            <p class="text-dark">Profesion : <span class="textCgrey">ITI</span></p>
                            <p class="textCgrey clsWord"><span class="text-dark">About : </span> Lorem ipsum dolor sit amet, consectetur adipisicing elit. Quam velit quisquam veniam excepturi temporibus inventore
                            </p>
                            <p class="textCgrey"><span><img src="./img/locaddress.png" alt="">&nbsp;</span><span class="text-dark">Address : </span> Lorem ipsum dolor sit amet</p>
                            <div class="text-center">
                                <h4 class="textCblue">Consultation 100Rs./ 10min</h4>
                            </div>
                            <div class="text-center"><button class="bappntmnt">BOOK AN APPOINTMENT</button></div>
                        </div>

</div>
                </div>
                <div class="col-sm-6 col-md-4 col-lg-4 mt-4">
                    <div class="card">
                        <img class="card-img-top" src="./img/call.jpg" width="350" height="263" style="border-bottom:3px solid #133087;">
                        <div class="p-3 clsShadow">
                            <h4 class="textCblue">Sree Hospitals</h4>
                            <p class="text-dark">Profesion : <span class="textCgrey">ITI</span></p>
                            <p class="textCgrey clsWord"><span class="text-dark">About : </span> Lorem ipsum dolor sit amet, consectetur adipisicing elit. Quam velit quisquam veniam excepturi temporibus inventore
                            </p>
                            <p class="textCgrey"><span><img src="./img/locaddress.png" alt="">&nbsp;</span><span class="text-dark">Address : </span> Lorem ipsum dolor sit amet</p>
                            <div class="text-center">
                                <h4 class="textCblue">Consultation 100Rs./ 10min</h4>
                            </div>
                            <div class="text-center"><button class="bappntmnt">BOOK AN APPOINTMENT</button></div>
                        </div>

</div>
                </div>
            </div>
        </div>
    </section>
    <?php include('mainFooter.php') ?>
    <script async defer src="https://maps.googleapis.com/maps/api/js?key=AIzaSyBmzC6LorWBcIWA94XksFf6IrpHej_z_pI&callback=GetAddress">
    </script>
    <script type="text/javascript" src="js/geoPosition.js"></script>
    <script type="text/javascript" src="js/geoPositionSimulator.js"></script>
    <script type="text/javascript" src="js/underscore.js"></script>

}

}
               return false;

}

});
         $('#location').html(city); 
         
    });
    return false;
} */
        function parse_place(place) {
            var location = [];

for (var ac = 0; ac < place.address_components.length; ac++) {
                var component = place.address_components[ac];

switch (component.types[0]) {
                    case 'locality':
                        location['city'] = component.long_name;
                        break;
                    case 'administrative_area_level_1':
                        location['state'] = component.long_name;
                        break;
                    case 'country':
                        location['country'] = component.long_name;
                        break;
                }
            };

return location;
        }

function detectlocation() { //user clicks button    
            if ("geolocation" in navigator) { //check geolocation available 
                //try to get user current location using getCurrentPosition() method
                navigator.geolocation.getCurrentPosition(function(position) {

/*$.ajax('https://maps.googleapis.com/maps/api/geocode/json?latlng=' + position.coords.latitude + ',' + position.coords.longitude + '&key=AIzaSyBmzC6LorWBcIWA94XksFf6IrpHej_z_pI')
                     $.ajax('https://maps.googleapis.com/maps/api/geocode/json?latlng=16.9891,82.2475&key=AIzaSyBmzC6LorWBcIWA94XksFf6IrpHej_z_pI')
                      .then(
                        function success (response) {
                          console.log('User\'s Address Data is ', response)
                        },
                        function fail (status) {
                          console.log('Request failed.  Returned status of',
                                      status)
                        }
                       )*/
                    GetAddress(position.coords.latitude, position.coords.longitude);
                    //alert(position.coords.latitude)
                    //$("#result").html("Found your location <br />Lat : "+position.coords.latitude+" </br>Lang :"+ position.coords.longitude);
                });
            } else {
                console.log("Browser doesn't support geolocation!");
            }
            return false;
        }

}
            });*/
            var latlng = new google.maps.LatLng(lat, lng);
            var geocoder = geocoder = new google.maps.Geocoder();
            geocoder.geocode({
                latLng: latlng
            }, function(results, status) {
                if (status == google.maps.GeocoderStatus.OK) {

if (results[1]) {
                        var arrAddress = results;

$.each(arrAddress, function(i, address_component) {
                            //console.log(address_component);
                            if (address_component.types[0] == "locality") {
                                $("#location").val(address_component.address_components[0].long_name)
                            }
                            /*else if(address_component.types[0] == "administrative_area_level_1"){
                            							$("#location").val(address_component.address_components[0].long_name)		
                            					  } 
                            					  else if(address_component.types[0] == "country"){
                            							$("#location").val(address_component.address_components[0].long_name)		
                            					  } */
                        });
                    } else {
                        console.log("No results found");
                    }
                } else {
                    console.log("Geocoder failed due to: " + status);
                }
            });
        }

function searchValidation() {
            if ($('#location').val() == '' && $('#search').val() == '') {
                alert("Please enter city or search");
                return false;
            }
        }

// $(document).ready(function() {
       
            $(window).scroll(function() {
                if ($(window).scrollTop() > 10) {
                    $('nav.navbar ').addClass('navbartop');
                
                }
                if ($(window).scrollTop() < 10) {
                    $('#nav_bar').removeClass('navbartop');
                }

});
        // });
        $(document).ready(function(){
            $(window).scrollTop(0);
        });
    </script>