%PDF-
%PDF-
Mini Shell
Mini Shell
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<!-- The above 3 meta tags *must* come first in the head; any other head content must come *after* these tags -->
<title>RealWed | Wedding Vendor & Supplier Directory HTML Template - List View Sidebar</title>
<!-- Bootstrap -->
<link href="<?php echo base_url().'assets/';?>css/bootstrap.min.css" rel="stylesheet">
<link href="<?php echo base_url().'assets/';?>css/main.css" rel="stylesheet">
<!-- Style CSS -->
<link href="<?php echo base_url().'assets/';?>css/style2.css" rel="stylesheet">
<!-- Google Fonts -->
<link href="<?php echo base_url().'assets/';?>https://fonts.googleapis.com/css?family=Rubik:300,300i,400,400i,500,500i,700,700i,900,900i" rel="stylesheet">
<!-- FontAwesome icon -->
<link href="<?php echo base_url().'assets/';?>fontawesome/css/fontawesome-all.css" rel="stylesheet">
<!-- Fontello icon -->
<link href="<?php echo base_url().'assets/';?>fontello/css/fontello.css" rel="stylesheet">
<script src = "https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries -->
<!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
<!--[if lt IE 9]>
<script src="https://oss.maxcdn.com/html5shiv/3.7.3/html5shiv.min.js"></script>
<script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
<![endif]-->
<style>
.tabs{
height:auto;
margin:0 auto;
}
/* tab list item */
.tabs .tabs-list{
list-style:none;
margin:0px;
padding:0px;
}
.tabs .tabs-list li{
width:100px;
float:left;
margin:0px;
margin-right:2px;
padding:10px 5px;
text-align: center;
}
.tabs .tabs-list li:hover{
cursor:pointer;
}
.tabs .tabs-list li a{
text-decoration: none;
color:#000;
}
/* Tab content section */
.tabs .tab{
display:none;
width:96%;
min-height:250px;
height:auto;
border-radius:3px;
padding:20px 15px;
color:darkslategray;
clear:both;
}
.tabs .tab h3{
letter-spacing: 1px;
font-weight: normal;
padding: 5px;
font-size: 15px;
}
.tabs .tab p{
}
/* When active state */
.active{
display:block !important;
}
.tabs .tabs-list li.active{
background-color:white !important;
color:black !important;
border-bottom: 3px solid #a81818;
}
.active a{
color:black !important;
}
/* media query */
@media screen and (max-width:360px){
.tabs{
margin:0;
width:96%;
}
.tabs .tabs-list li{
width:80px;
}
}
.blockcard{
border: 1px solid #c8c8c8;
box-shadow: 0 4px 8px 0 rgba(138, 107, 118, 0.08);
padding: 10px;
min-height: 160px;
margin-top: 3%;
padding: 35px;
}
.blockcard h2{
font-size: 17px;
font-weight: bold;
}
</style>
</head>
<body>
<!-- header-top -->
<div class="header-top">
<div class="container">
<div class="row">
<div class="col-xl-6 col-lg-6 col-sm-6 col-md-6 col-sm-6 col-6 d-none d-xl-block d-lg-block d-md-block">
<div class="header-text">
<p class="wlecome-text">Welcome to.</p>
</div>
</div>
<div class="col-xl-6 col-lg-6 col-sm-6 col-md-6 col-sm-12 col-12">
<div class="header-text text-right">
<p> <a href="vendor-forms.html">List </a></p>
</div>
</div>
</div>
</div>
</div>
<!--/.header-top -->
<!-- header -->
<!-- /.header -->
<!-- page-header -->
<div class="venue-pageheader">
<div class="page-section">
<div class="container">
<div class="row">
<!-- page section -->
<div class="col-xl-12 col-lg-12 col-md-12 col-sm-12 col-12">
<a href="#" class="btn btn-default" id="open-popup">View Gallery</a>
</div>
</div>
</div>
</div>
</div>
<!-- /.page-header -->
<!-- page-header -->
<div class="bg-white">
<div class="container">
<div class="row">
<div class="col-md-8">
<div class="tabs">
<ul class="tabs-list">
<li class="active"><a href="#tab1">Day Plan</a></li>
<li ><a href="#tab2">Flights</a></li>
<li ><a href="#tab3">Hotels<a/></li>
<li ><a href="#tab4">Transfers<a/></li>
<li ><a href="#tab5">Activities<a/></li>
<li ><a href="#tab6">Summary<a/></li>
</ul>
<div id="tab1" class="tab active">
<div class="vendor-headings">
<!-- <h2 class="mb10"><?=$details['product_name']?></h2>-->
<h2>Day 1: Arrival</h2>
</div>
<div class="row blockcard">
<div class="col-md-3">
<img src="<?php echo base_url().'assets/';?>images/smFD.gif">
<p class="font12">FD-171</p>
</div>
<div class="col-md-3">
<span class="price-box vendor-meta-box">
<span class="vendor-price">23:00</span>
<span>Kochi</span>
</span>
</div>
<div class="col-md-3">
<span class="price-box vendor-meta-box">
<span class="vendor-price"> <img src="<?php echo base_url().'assets/';?>images/flight-line.png">
</span>
<span>04h 15m</span>
</span>
</div>
<div class="col-md-3">
<span class="price-box vendor-meta-box">
<span class="vendor-price">5:00</span>
<span>Don Mueang Airport</span>
</span>
</div>
</div>
<div class="row blockcard">
<div class="col-md-4">
<img src="<?php echo base_url().'assets/';?>images/private_transfer.png">
</div>
<div class="col-md-8">
<h3>Airport to Hotel in pattaya</h3>
<h2>Private Transfer</h2>
</div>
</div>
<div class="row blockcard">
<div class="col-md-4">
<img src="<?php echo base_url().'assets/';?>images/hotel.jpg">
</div>
<div class="col-md-8">
<h2>Hotel Mariott</h2>
<h3>H</h3>
</div>
</div>
<div class="vendor-descriptions">
<h3 class="border-bottom mb20 pdb10">About Hospital</h3>
</div>
<!--vendor-description -->
<!--venue-highlights -->
<!-- /.venue-highlights -->
<!-- aminities-block -->
</div>
<div id="tab2" class="tab active">
<div id="reviews">
<div class="review-block">
<div class="row">
<div class="col-xl-3 col-lg-3 col-md-12 col-sm-12 col-12">
</div>
<div class="col-xl-6 col-lg-6 col-md-6 col-sm-12 col-12">
</div>
<div class="col-md-12 col-sm-12 col-12 mt40">
<a href="#" class="btn btn-default"></a>
<div class="row blockcard">
<div class="col-md-3">
<img src="<?php echo base_url().'assets/';?>images/smFD.gif">
<p class="font12">FD-171</p>
</div>
<div class="col-md-3">
<span class="price-box vendor-meta-box">
<span class="vendor-price">23:00</span>
<span>Kochi</span>
</span>
</div>
<div class="col-md-3">
<span class="price-box vendor-meta-box">
<span class="vendor-price"> <img src="<?php echo base_url().'assets/';?>images/flight-line.png">
</span>
<span>04h 15m</span>
</span>
</div>
<div class="col-md-3">
<span class="price-box vendor-meta-box">
<span class="vendor-price">5:00</span>
<span>Don Mueang Airport</span>
</span>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<div id="tab3" class="tab">
<div class="row blockcard">
<div class="col-md-4">
<img src="<?php echo base_url().'assets/';?>images/hotel.jpg">
</div>
<div class="col-md-8">
<h2>Hotel Mariott</h2>
<h3>H</h3>
</div>
</div>
</div>
<div id="tab4" class="tab">
<div class="row blockcard">
<div class="col-md-4">
<img src="<?php echo base_url().'assets/';?>images/hotel.jpg">
</div>
<div class="col-md-8">
<h2>Hotel Mariott</h2>
<h3>H</h3>
</div>
</div>
</div>
</div>
</div>
<div class="col-md-4">
<div class="sidebar-venue">
<div class="well-box-dark">
<form>
<div class="row">
<div class="col-xl-12 col-lg-12 col-md-12 col-sm-12 col-12">
<h3 class="mb30">Request Quote</h3>
</div>
<!-- Text input-->
<div class="col-xl-12 col-lg-12 col-md-12 col-sm-12 col-12">
<div class="form-group">
<label class="control-label sr-only" for="name">Name</label>
<input id="name" name="name" type="text" placeholder="Name" class="form-control input-md" required="">
</div>
</div>
<!-- Text input-->
<div class="col-xl-12 col-lg-12 col-md-12 col-sm-12 col-12">
<div class="form-group">
<label class=" control-label sr-only" for="email">Email</label>
<input id="email" name="email" type="text" placeholder="Email" class="form-control input-md" required="">
</div>
</div>
<!-- Text input-->
<div class="col-xl-12 col-lg-12 col-md-12 col-sm-12 col-12">
<div class="form-group">
<label class=" control-label sr-only" for="phone">Phone</label>
<input id="phone" name="phone" type="text" placeholder="Phone" class="form-control input-md" required="">
</div>
</div>
<!-- Text input-->
<div class="col-xl-12 col-lg-12 col-md-12 col-sm-12 col-12">
<div class="form-group">
<label class="control-label sr-only" for="weddingdate">Wedding Date</label>
<input id="weddingdate" name="weddingdate" type="text" placeholder="Wedding Date" class="form-control input-md" required="">
<div class="venue-form-calendar"><i class="far fa-calendar-alt"></i></div>
</div>
</div>
<!-- Textarea -->
<div class="col-xl-12 col-lg-12 col-md-12 col-sm-12 col-12">
<div class="form-group">
<label class="control-label sr-only" for="comments">Comment</label>
<textarea class="form-control" id="comments" name="comments" rows="5" placeholder="Write Comment"></textarea>
</div>
</div>
<div class="col-xl-12 col-lg-12 col-md-12 col-sm-12 col-12">
<div class="form-group">
<button type="submit" class="btn btn-default btn-block">Submit Quote</button>
</div>
</div>
</form>
</div>
</div>
</div>
</div>
</div>
</div>
<!-- /.tiny-footer-section -->
<!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
<script type="text/javascript">
$(document).ready(function(){
$(".tabs-list li a").click(function(e){
e.preventDefault();
});
$(".tabs-list li").click(function(){
var tabid = $(this).find("a").attr("href");
$(".tabs-list li,.tabs div.tab").removeClass("active"); // removing active class from tab
$(".tab").hide(); // hiding open tab
$(tabid).show(); // show tab
$(this).addClass("active"); // adding active class to clicked tab
});
});
</script>
</body>
</html>
Zerion Mini Shell 1.0