Tabs
Dynamic tabbed interfaces.
Tabs #1
Set your priorities and align your teams
This is where we sit down, grab a cup of coffee and dial in the details.
- Understanding who you are
- Whether it's branding, print, UI + UX
- We've got your front end and back end needs covered
Focus on achieving measurable outcomes
Now that we've aligned the details, it's time to get things mapped out and organized.
- We aim high at being focused on building relationships
- Working together on the daily requires each individual
- It's important to stay detail oriented with every project we tackle
Review performance and improve strategy
The time has come to bring those ideas and plans to life.
- Whether through commerce or just an experience
- Now that your brand is all dressed up
- This part is really crucial in keeping the project
<!-- Features Section -->
<div id="SVGmockupBg" class="svg-preloader container space-2">
<!-- Nav Classic -->
<div class="position-relative w-lg-85 bg-white text-center z-index-2 mx-lg-auto">
<ul class="nav nav-classic nav-rounded nav-shadow nav-justified" id="pills-tab" role="tablist">
<li class="nav-item">
<a class="nav-link font-weight-medium active" id="pills-one-example1-tab" data-toggle="pill" href="#pills-one-example1" role="tab" aria-controls="pills-one-example1" aria-selected="true">
<div class="d-md-flex justify-content-md-center align-items-md-center">
<figure class="ie-height-40 d-none d-md-block w-100 max-width-6 mr-3">
<img class="js-svg-injector" src="../../assets/svg/icons/icon-14.svg" alt="SVG"
data-parent="#SVGmockupBg">
</figure>
Priority
</div>
</a>
</li>
<li class="nav-item">
<a class="nav-link font-weight-medium" id="pills-two-example1-tab" data-toggle="pill" href="#pills-two-example1" role="tab" aria-controls="pills-two-example1" aria-selected="false">
<div class="d-md-flex justify-content-md-center align-items-md-center">
<figure class="ie-height-40 d-none d-md-block w-100 max-width-6 mr-3">
<img class="js-svg-injector" src="../../assets/svg/icons/icon-21.svg" alt="SVG"
data-parent="#SVGmockupBg">
</figure>
Achieve
</div>
</a>
</li>
<li class="nav-item">
<a class="nav-link font-weight-medium" id="pills-three-example1-tab" data-toggle="pill" href="#pills-three-example1" role="tab" aria-controls="pills-three-example1" aria-selected="false">
<div class="d-md-flex justify-content-md-center align-items-md-center">
<figure class="ie-height-40 d-none d-md-block w-100 max-width-6 mr-3">
<img class="js-svg-injector" src="../../assets/svg/icons/icon-5.svg" alt="SVG"
data-parent="#SVGmockupBg">
</figure>
Performance
</div>
</a>
</li>
</ul>
</div>
<!-- End Nav Classic -->
<!-- Tab Content -->
<div class="tab-content" id="pills-tabContent">
<div class="tab-pane fade pt-9 show active" id="pills-one-example1" role="tabpanel" aria-labelledby="pills-one-example1-tab">
<!-- Mockup Block -->
<div class="row justify-content-lg-between align-items-lg-center">
<div class="col-lg-4 mb-9 mb-lg-0">
<!-- Info -->
<div class="mb-5">
<h3 class="h4 font-weight-semi-bold">Set your priorities and align your teams</h3>
<p>This is where we sit down, grab a cup of coffee and dial in the details.</p>
</div>
<ul class="list-unstyled text-secondary font-size-1">
<li class="media my-3">
<span class="fas fa-check text-primary mt-1 mr-3"></span>
<span class="media-body">
Understanding who you are
</span>
</li>
<li class="media my-3">
<span class="fas fa-check text-primary mt-1 mr-3"></span>
<span class="media-body">
Whether it's branding, print, UI + UX
</span>
</li>
<li class="media my-3">
<span class="fas fa-check text-primary mt-1 mr-3"></span>
<span class="media-body">
We've got your front end and back end needs covered
</span>
</li>
</ul>
<!-- End Info -->
</div>
<div class="col-lg-7 position-relative">
<div class="pl-md-9">
<img class="img-fluid shadow rounded" src="../../assets/img/700x525/img1.jpg" alt="Image Description">
</div>
<!-- SVG Component -->
<div class="position-absolute bottom-0 left-0 w-75 z-index-n1">
<figure class="ie-abstract-shapes-2">
<img class="js-svg-injector" src="../../assets/svg/components/abstract-shapes-2.svg" alt="Image Description"
data-parent="#SVGmockupBg">
</figure>
</div>
<!-- End SVG Component -->
</div>
</div>
<!-- End Mockup Block -->
</div>
<div class="tab-pane fade pt-9" id="pills-two-example1" role="tabpanel" aria-labelledby="pills-two-example1-tab">
<!-- Mockup Block -->
<div class="row justify-content-lg-between align-items-lg-center">
<div class="col-lg-4 mb-9 mb-lg-0">
<!-- Info -->
<div class="mb-5">
<h3 class="h4 font-weight-semi-bold">Focus on achieving measurable outcomes</h3>
<p>Now that we've aligned the details, it's time to get things mapped out and organized.</p>
</div>
<ul class="list-unstyled text-secondary font-size-1">
<li class="media my-3">
<span class="fas fa-check text-primary mt-1 mr-3"></span>
<span class="media-body">
We aim high at being focused on building relationships
</span>
</li>
<li class="media my-3">
<span class="fas fa-check text-primary mt-1 mr-3"></span>
<span class="media-body">
Working together on the daily requires each individual
</span>
</li>
<li class="media my-3">
<span class="fas fa-check text-primary mt-1 mr-3"></span>
<span class="media-body">
It's important to stay detail oriented with every project we tackle
</span>
</li>
</ul>
<!-- End Info -->
</div>
<div class="col-lg-7 position-relative">
<div class="pl-md-9">
<img class="img-fluid shadow-sm rounded" src="../../assets/img/700x525/img2.jpg" alt="Image Description">
</div>
<!-- SVG Component -->
<div class="position-absolute bottom-0 left-0 w-75 z-index-n1">
<figure class="ie-abstract-shapes-4">
<img class="js-svg-injector" src="../../assets/svg/components/abstract-shapes-4.svg" alt="Image Description"
data-parent="#SVGmockupBg">
</figure>
</div>
<!-- End SVG Component -->
</div>
</div>
<!-- End Mockup Block -->
</div>
<div class="tab-pane fade pt-9" id="pills-three-example1" role="tabpanel" aria-labelledby="pills-three-example1-tab">
<!-- Mockup Block -->
<div class="row justify-content-lg-between align-items-lg-center">
<div class="col-lg-4 mb-9 mb-lg-0">
<!-- Info -->
<div class="mb-5">
<h3 class="h4 font-weight-semi-bold">Review performance and improve strategy</h3>
<p>The time has come to bring those ideas and plans to life.</p>
</div>
<ul class="list-unstyled text-secondary font-size-1">
<li class="media my-3">
<span class="fas fa-check text-primary mt-1 mr-3"></span>
<span class="media-body">
Whether through commerce or just an experience
</span>
</li>
<li class="media my-3">
<span class="fas fa-check text-primary mt-1 mr-3"></span>
<span class="media-body">
Now that your brand is all dressed up
</span>
</li>
<li class="media my-3">
<span class="fas fa-check text-primary mt-1 mr-3"></span>
<span class="media-body">
This part is really crucial in keeping the project
</span>
</li>
</ul>
<!-- End Info -->
</div>
<div class="col-lg-7 position-relative">
<div class="pl-md-9">
<img class="img-fluid shadow-sm rounded" src="../../assets/img/700x525/img3.jpg" alt="Image Description">
</div>
<!-- SVG Component -->
<div class="position-absolute bottom-0 left-0 w-75 z-index-n1">
<figure class="ie-abstract-shapes-3">
<img class="js-svg-injector" src="../../assets/svg/components/abstract-shapes-3.svg" alt="Image Description"
data-parent="#SVGmockupBg">
</figure>
</div>
<!-- End SVG Component -->
</div>
</div>
<!-- End Mockup Block -->
</div>
</div>
<!-- End Tab Content -->
</div>
<!-- End Features Section -->
<!-- JS Implementing Plugins -->
<script src="../../assets/vendor/svg-injector/dist/svg-injector.min.js"></script>
<!-- JS Front -->
<script src="../../assets/js/components/hs.svg-injector.js"></script>
<!-- JS Plugins Init. -->
<script>
$(window).on('load', function () {
// initialization of svg injector module
$.HSCore.components.HSSVGIngector.init('.js-svg-injector');
});
</script>
Tabs #2
Key facts
- Property ID: HG328e91UA
- Property type: Studio, House
- Year built: 2015
- Lot size: 1,328 sq.m.
- Bedrooms: 2
- Bathrooms: 1.5
- Kitchen: 1
- Living room: 3
Last 30 days:
920 page views
Since listed:
471 page views
This extremely spacious two/three bedroom duplex apartment occupies a desirable position to the South-West of Harrogate's town centre and offers a huge amount of scope to update and re-model to suit the individual including a large eaves storage room ripe for conversion into a second bathroom.
Accessed via a communal hall up to the first floor, the apartment opens into a split level hall. To the front elevation there is a lovely, light and airy lounge with far reaching views towards the town centre and countryside beyond. Adjoining there is a well proportioned double bedroom with a fitted wardrobe.
<!-- JS Implementing Plugins -->
<script src="../../assets/vendor/svg-injector/dist/svg-injector.min.js"></script>
<!-- JS Front -->
<script src="../../assets/js/components/hs.svg-injector.js"></script>
<!-- JS Plugins Init. -->
<script>
$(window).on('load', function () {
// initialization of svg injector module
$.HSCore.components.HSSVGIngector.init('.js-svg-injector');
});
</script>