349 lines
22 KiB
Vue
349 lines
22 KiB
Vue
<script setup>
|
|
|
|
const model = ref(0);
|
|
const sliderItems = ref([
|
|
{
|
|
"id": 1,
|
|
"title": 'Chad',
|
|
"subject": 'Verified Trt Patient',
|
|
"text": 'HGH has truly improved my life. I had always suspected I had low testosterone and eventually decided to get tested. As I suspected, my levels were extremely low. Since starting with HGH, there has been a consistent improvement in my overall well-being.'
|
|
|
|
},
|
|
{
|
|
"id": 2,
|
|
"title": 'Lee',
|
|
"subject": 'Verified Trt Patient',
|
|
"text": 'After undergoing Hormone Replacement Therapy (HRT) for over 8 months, my symptoms of depression, mood swings, low energy, and nonexistent libido have significantly diminished. I now feel like myself again. I am extremely satisfied with my experience with HGH and look forward to their continued treatment.'
|
|
},
|
|
{
|
|
"id": 3,
|
|
"title": 'Hunter',
|
|
"subject": 'Verified Trt Patient',
|
|
"text": 'Since partnering with HGH, they have assisted in addressing thyroid and testosterone issues. I now feel confident and consistent with my wife, and I can enjoy fitness once again. I have increased energy and improved focus throughout the day—its fantastic.'
|
|
|
|
},
|
|
{
|
|
"id": 4,
|
|
"title": 'Chad',
|
|
"subject": 'Verified Trt Patient',
|
|
"text": 'Since beginning my journey with HGH, I experience improved sleep, increased energy throughout the day, and an overall enhanced sense of well-being. I have gained muscle, shed fat, and now feel closer to 25 years old rather than 49. The customer service is unparalleled.'
|
|
|
|
},
|
|
{
|
|
"id": 5,
|
|
"title": 'Lee',
|
|
"subject": 'Verified Trt Patient',
|
|
"text": 'I began using testosterone cream and thyroid treatment just over three months ago and am now on my second cycle. The product is excellent and user-friendly (no large needles!), and my interactions with Dr. Fotinos have been exceptional. I am already noticing positive changes in my energy levels.'
|
|
|
|
},
|
|
{
|
|
"id": 6,
|
|
"title": 'Hunter',
|
|
"subject": 'Verified Trt Patient',
|
|
"text": 'As a 53-year-old active and athletic male, I have been on this program for approximately a year. Although it took about four weeks to see noticeable results, I have been consistently pleased with the outcomes since then.'
|
|
|
|
},
|
|
|
|
]);
|
|
const prevSlide = () => {
|
|
model.value = Math.max(model.value - 1, 0);
|
|
};
|
|
|
|
const nextSlide = () => {
|
|
console.log('Test');
|
|
model.value = Math.min(model.value + 1, sliderItems.value.length - 1);
|
|
};
|
|
|
|
const goToSlide = (index) => {
|
|
model.value = index;
|
|
};
|
|
</script>
|
|
|
|
<template>
|
|
<section id="landingFAQ" class="section-py bg-body landing-faq">
|
|
<div class="container">
|
|
<div class="text-center mb-3">
|
|
<span class="">TESTIMONIALS</span>
|
|
</div>
|
|
<h3 class="text-center mb-1"><b>Patient Stories</b></h3>
|
|
<p class="text-center mb-4">Read the success stories from men using HGH and enjoying their best life
|
|
because of it…</p>
|
|
<div class="text-center mb-3">
|
|
<main id="tp-widget-wrapper" class="tp-widget-wrapper visible">
|
|
<a id="profile-link" href="#">
|
|
<!-- Logo -->
|
|
<div id="tp-widget-logo" class="tp-widget-logo text-center">
|
|
<div class="">
|
|
<div
|
|
style="position: relative; height: 0; width: 100%; padding: 0; padding-bottom: 24.6031746031746%;">
|
|
|
|
<svg role="img" aria-labelledby="trustpilotLogo-6i7t4v1im9l" viewBox="0 0 126 31"
|
|
xmlns="http://www.w3.org/2000/svg"
|
|
style="position: absolute; height: 100%; width: 100%; left: 0; top: 0;">
|
|
<title id="trustpilotLogo-6i7t4v1im9l">Trustpilot</title>
|
|
<path class="tp-logo__text"
|
|
d="M33.074774 11.07005H45.81806v2.364196h-5.010656v13.290316h-2.755306V13.434246h-4.988435V11.07005h.01111zm12.198892 4.319629h2.355341v2.187433h.04444c.077771-.309334.222203-.60762.433295-.894859.211092-.287239.466624-.56343.766597-.79543.299972-.243048.633276-.430858.999909-.585525.366633-.14362.744377-.220953 1.12212-.220953.288863 0 .499955.011047.611056.022095.1111.011048.222202.033143.344413.04419v2.408387c-.177762-.033143-.355523-.055238-.544395-.077333-.188872-.022096-.366633-.033143-.544395-.033143-.422184 0-.822148.08838-1.199891.254096-.377744.165714-.699936.41981-.977689.740192-.277753.331429-.499955.729144-.666606 1.21524-.166652.486097-.244422 1.03848-.244422 1.668195v5.39125h-2.510883V15.38968h.01111zm18.220567 11.334883H61.02779v-1.579813h-.04444c-.311083.574477-.766597 1.02743-1.377653 1.369908-.611055.342477-1.233221.51924-1.866497.51924-1.499864 0-2.588654-.364573-3.25526-1.104765-.666606-.740193-.999909-1.856005-.999909-3.347437V15.38968h2.510883v6.948968c0 .994288.188872 1.701337.577725 2.1101.377744.408763.922139.618668 1.610965.618668.533285 0 .96658-.077333 1.322102-.243048.355524-.165714.644386-.37562.855478-.65181.222202-.265144.377744-.596574.477735-.972194.09999-.37562.144431-.784382.144431-1.226288v-6.573349h2.510883v11.323836zm4.27739-3.634675c.07777.729144.355522 1.237336.833257 1.535623.488844.287238 1.06657.441905 1.744286.441905.233312 0 .499954-.022095.799927-.055238.299973-.033143.588836-.110476.844368-.209905.266642-.099429.477734-.254096.655496-.452954.166652-.198857.244422-.452953.233312-.773335-.01111-.320381-.133321-.585525-.355523-.784382-.222202-.209906-.499955-.364573-.844368-.497144-.344413-.121525-.733267-.232-1.17767-.320382-.444405-.088381-.888809-.18781-1.344323-.287239-.466624-.099429-.922138-.232-1.355432-.37562-.433294-.14362-.822148-.342477-1.166561-.596573-.344413-.243048-.622166-.56343-.822148-.950097-.211092-.386668-.311083-.861716-.311083-1.436194 0-.618668.155542-1.12686.455515-1.54667.299972-.41981.688826-.75124 1.14434-1.005336.466624-.254095.97769-.430858 1.544304-.541334.566615-.099429 1.11101-.154667 1.622075-.154667.588836 0 1.15545.066286 1.688736.18781.533285.121524 1.02213.320381 1.455423.60762.433294.276191.788817.640764 1.07768 1.08267.288863.441905.466624.98324.544395 1.612955h-2.621984c-.122211-.596572-.388854-1.005335-.822148-1.204193-.433294-.209905-.933248-.309334-1.488753-.309334-.177762 0-.388854.011048-.633276.04419-.244422.033144-.466624.088382-.688826.165715-.211092.077334-.388854.198858-.544395.353525-.144432.154667-.222203.353525-.222203.60762 0 .309335.111101.552383.322193.740193.211092.18781.488845.342477.833258.475048.344413.121524.733267.232 1.177671.320382.444404.088381.899918.18781 1.366542.287239.455515.099429.899919.232 1.344323.37562.444404.14362.833257.342477 1.17767.596573.344414.254095.622166.56343.833258.93905.211092.37562.322193.850668.322193 1.40305 0 .673906-.155541 1.237336-.466624 1.712385-.311083.464001-.711047.850669-1.199891 1.137907-.488845.28724-1.04435.508192-1.644295.640764-.599946.132572-1.199891.198857-1.788727.198857-.722156 0-1.388762-.077333-1.999818-.243048-.611056-.165714-1.14434-.408763-1.588745-.729144-.444404-.33143-.799927-.740192-1.05546-1.226289-.255532-.486096-.388853-1.071621-.411073-1.745528h2.533103v-.022095zm8.288135-7.700208h1.899828v-3.402675h2.510883v3.402675h2.26646v1.867052h-2.26646v6.054109c0 .265143.01111.486096.03333.684954.02222.18781.07777.353524.155542.486096.07777.132572.199981.232.366633.298287.166651.066285.377743.099428.666606.099428.177762 0 .355523 0 .533285-.011047.177762-.011048.355523-.033143.533285-.077334v1.933338c-.277753.033143-.555505.055238-.811038.088381-.266642.033143-.533285.04419-.811037.04419-.666606 0-1.199891-.066285-1.599855-.18781-.399963-.121523-.722156-.309333-.944358-.552381-.233313-.243049-.377744-.541335-.466625-.905907-.07777-.364573-.13332-.784383-.144431-1.248384v-6.683825h-1.899827v-1.889147h-.02222zm8.454788 0h2.377562V16.9253h.04444c.355523-.662858.844368-1.12686 1.477644-1.414098.633276-.287239 1.310992-.430858 2.055369-.430858.899918 0 1.677625.154667 2.344231.475048.666606.309335 1.222111.740193 1.666515 1.292575.444405.552382.766597 1.193145.9888 1.92229.222202.729145.333303 1.513527.333303 2.3421 0 .762288-.099991 1.50248-.299973 2.20953-.199982.718096-.499955 1.347812-.899918 1.900194-.399964.552383-.911029.98324-1.533194 1.31467-.622166.33143-1.344323.497144-2.18869.497144-.366634 0-.733267-.033143-1.0999-.099429-.366634-.066286-.722157-.176762-1.05546-.320381-.333303-.14362-.655496-.33143-.933249-.56343-.288863-.232-.522175-.497144-.722157-.79543h-.04444v5.656393h-2.510883V15.38968zm8.77698 5.67849c0-.508193-.06666-1.005337-.199981-1.491433-.133321-.486096-.333303-.905907-.599946-1.281527-.266642-.37562-.599945-.673906-.988799-.894859-.399963-.220953-.855478-.342477-1.366542-.342477-1.05546 0-1.855387.364572-2.388672 1.093717-.533285.729144-.799928 1.701337-.799928 2.916578 0 .574478.066661 1.104764.211092 1.59086.144432.486097.344414.905908.633276 1.259432.277753.353525.611056.629716.99991.828574.388853.209905.844367.309334 1.355432.309334.577725 0 1.05546-.121524 1.455423-.353525.399964-.232.722157-.541335.97769-.905907.255531-.37562.444403-.79543.555504-1.270479.099991-.475049.155542-.961145.155542-1.458289zm4.432931-9.99812h2.510883v2.364197h-2.510883V11.07005zm0 4.31963h2.510883v11.334883h-2.510883V15.389679zm4.755124-4.31963h2.510883v15.654513h-2.510883V11.07005zm10.210184 15.963847c-.911029 0-1.722066-.154667-2.433113-.452953-.711046-.298287-1.310992-.718097-1.810946-1.237337-.488845-.530287-.866588-1.160002-1.12212-1.889147-.255533-.729144-.388854-1.535622-.388854-2.408386 0-.861716.133321-1.657147.388853-2.386291.255533-.729145.633276-1.35886 1.12212-1.889148.488845-.530287 1.0999-.93905 1.810947-1.237336.711047-.298286 1.522084-.452953 2.433113-.452953.911028 0 1.722066.154667 2.433112.452953.711047.298287 1.310992.718097 1.810947 1.237336.488844.530287.866588 1.160003 1.12212 1.889148.255532.729144.388854 1.524575.388854 2.38629 0 .872765-.133322 1.679243-.388854 2.408387-.255532.729145-.633276 1.35886-1.12212 1.889147-.488845.530287-1.0999.93905-1.810947 1.237337-.711046.298286-1.522084.452953-2.433112.452953zm0-1.977528c.555505 0 1.04435-.121524 1.455423-.353525.411074-.232.744377-.541335 1.01102-.916954.266642-.37562.455513-.806478.588835-1.281527.12221-.475049.188872-.961145.188872-1.45829 0-.486096-.066661-.961144-.188872-1.44724-.122211-.486097-.322193-.905907-.588836-1.281527-.266642-.37562-.599945-.673907-1.011019-.905907-.411074-.232-.899918-.353525-1.455423-.353525-.555505 0-1.04435.121524-1.455424.353525-.411073.232-.744376.541334-1.011019.905907-.266642.37562-.455514.79543-.588835 1.281526-.122211.486097-.188872.961145-.188872 1.447242 0 .497144.06666.98324.188872 1.458289.12221.475049.322193.905907.588835 1.281527.266643.37562.599946.684954 1.01102.916954.411073.243048.899918.353525 1.455423.353525zm6.4883-9.66669h1.899827v-3.402674h2.510883v3.402675h2.26646v1.867052h-2.26646v6.054109c0 .265143.01111.486096.03333.684954.02222.18781.07777.353524.155541.486096.077771.132572.199982.232.366634.298287.166651.066285.377743.099428.666606.099428.177762 0 .355523 0 .533285-.011047.177762-.011048.355523-.033143.533285-.077334v1.933338c-.277753.033143-.555505.055238-.811038.088381-.266642.033143-.533285.04419-.811037.04419-.666606 0-1.199891-.066285-1.599855-.18781-.399963-.121523-.722156-.309333-.944358-.552381-.233313-.243049-.377744-.541335-.466625-.905907-.07777-.364573-.133321-.784383-.144431-1.248384v-6.683825h-1.899827v-1.889147h-.02222z"
|
|
fill="#191919"></path>
|
|
<path class="tp-logo__star" fill="#00B67A"
|
|
d="M30.141707 11.07005H18.63164L15.076408.177071l-3.566342 10.892977L0 11.059002l9.321376 6.739063-3.566343 10.88193 9.321375-6.728016 9.310266 6.728016-3.555233-10.88193 9.310266-6.728016z">
|
|
</path>
|
|
<path class="tp-logo__star-notch" fill="#005128"
|
|
d="M21.631369 20.26169l-.799928-2.463625-5.755033 4.153914z"></path>
|
|
</svg>
|
|
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<!-- Stars -->
|
|
<div class="tp-widget-stars" id="tp-widget-stars">
|
|
<div class="">
|
|
<div class="tp-stars tp-stars--4 tp-stars--4--half">
|
|
<div
|
|
style="position: relative; height: 0; width: 100%; padding: 0; padding: 0px 0px 5.3267%;left: 4%;">
|
|
|
|
<svg role="img" aria-labelledby="starRating-wx0ilj5p87h" viewBox="0 0 251 46"
|
|
xmlns="http://www.w3.org/2000/svg"
|
|
style="position: absolute; height: 100%; width: 100%; left: 0; top: 0;">
|
|
<title id="starRating-wx0ilj5p87h" lang="en">4.7 out of five star rating on
|
|
Trustpilot</title>
|
|
<g class="tp-star">
|
|
<path class="tp-star__canvas" fill="#dcdce6"
|
|
d="M0 46.330002h46.375586V0H0z"></path>
|
|
<path class="tp-star__shape"
|
|
d="M39.533936 19.711433L13.230239 38.80065l3.838216-11.797827L7.02115 19.711433h12.418975l3.837417-11.798624 3.837418 11.798624h12.418975zM23.2785 31.510075l7.183595-1.509576 2.862114 8.800152L23.2785 31.510075z"
|
|
fill="#FFF"></path>
|
|
</g>
|
|
<g class="tp-star">
|
|
<path class="tp-star__canvas" fill="#dcdce6"
|
|
d="M51.24816 46.330002h46.375587V0H51.248161z"></path>
|
|
<path class="tp-star__canvas--half" fill="#dcdce6"
|
|
d="M51.24816 46.330002h23.187793V0H51.248161z"></path>
|
|
<path class="tp-star__shape"
|
|
d="M74.990978 31.32991L81.150908 30 84 39l-9.660206-7.202786L64.30279 39l3.895636-11.840666L58 19.841466h12.605577L74.499595 8l3.895637 11.841466H91L74.990978 31.329909z"
|
|
fill="#FFF"></path>
|
|
</g>
|
|
<g class="tp-star">
|
|
<path class="tp-star__canvas" fill="#dcdce6"
|
|
d="M102.532209 46.330002h46.375586V0h-46.375586z"></path>
|
|
<path class="tp-star__canvas--half" fill="#dcdce6"
|
|
d="M102.532209 46.330002h23.187793V0h-23.187793z"></path>
|
|
<path class="tp-star__shape"
|
|
d="M142.066994 19.711433L115.763298 38.80065l3.838215-11.797827-10.047304-7.291391h12.418975l3.837418-11.798624 3.837417 11.798624h12.418975zM125.81156 31.510075l7.183595-1.509576 2.862113 8.800152-10.045708-7.290576z"
|
|
fill="#FFF"></path>
|
|
</g>
|
|
<g class="tp-star">
|
|
<path class="tp-star__canvas" fill="#dcdce6"
|
|
d="M153.815458 46.330002h46.375586V0h-46.375586z"></path>
|
|
<path class="tp-star__canvas--half" fill="#dcdce6"
|
|
d="M153.815458 46.330002h23.187793V0h-23.187793z"></path>
|
|
<path class="tp-star__shape"
|
|
d="M193.348355 19.711433L167.045457 38.80065l3.837417-11.797827-10.047303-7.291391h12.418974l3.837418-11.798624 3.837418 11.798624h12.418974zM177.09292 31.510075l7.183595-1.509576 2.862114 8.800152-10.045709-7.290576z"
|
|
fill="#FFF"></path>
|
|
</g>
|
|
<g class="tp-star">
|
|
<path class="tp-star__canvas" fill="#dcdce6"
|
|
d="M205.064416 46.330002h46.375587V0h-46.375587z"></path>
|
|
<path class="tp-star__canvas--half" fill="#dcdce6"
|
|
d="M205.064416 46.330002h23.187793V0h-23.187793z"></path>
|
|
<path class="tp-star__shape"
|
|
d="M244.597022 19.711433l-26.3029 19.089218 3.837419-11.797827-10.047304-7.291391h12.418974l3.837418-11.798624 3.837418 11.798624h12.418975zm-16.255436 11.798642l7.183595-1.509576 2.862114 8.800152-10.045709-7.290576z"
|
|
fill="#FFF"></path>
|
|
</g>
|
|
</svg>
|
|
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<!-- Business Info -->
|
|
<div id="reviews-summary" class="tp-widget-businessinfo">
|
|
<div aria-hidden="true" class="tp-widget-businessinfo__trustscore">
|
|
<span>TrustScore</span> <strong id="trust-score">4.7</strong>
|
|
</div>
|
|
<div class="tp-widget-businessinfo__total">
|
|
<strong id="businessEntity-numberOfReviews-total">689</strong>
|
|
<span id="translations-reviews">reviews</span>
|
|
</div>
|
|
</div>
|
|
</a>
|
|
</main>
|
|
</div>
|
|
|
|
</div>
|
|
<!-- <v-sheet elevation="8">
|
|
<v-slide-group v-model="model" class="" center-active show-arrows>
|
|
<v-slide-group-item v-for="n in sliderIteam" :key="n">
|
|
<v-card class="ma-3" height="240" width="380" @click="toggle">
|
|
<h5>{{ n.title }}</h5>
|
|
<p>
|
|
{{ n.subject }}</p>
|
|
</v-card>
|
|
</v-slide-group-item>
|
|
</v-slide-group>
|
|
</v-sheet> -->
|
|
|
|
|
|
|
|
|
|
<div>
|
|
<v-slide-group v-model="model" class="pa-4" selected-class="bg-primary" mandatory show-arrows>
|
|
<v-slide-group-item v-for="(n, index) in sliderItems" :key="n"
|
|
v-slot="{ isSelected, toggle, selectedClass }">
|
|
<v-card class="text-center border-0 px-0" width="450" :title="n.title" :subtitle="n.subject"
|
|
:text="n.text">
|
|
<!-- Your card content goes here -->
|
|
</v-card>
|
|
</v-slide-group-item>
|
|
</v-slide-group>
|
|
|
|
<!-- Container for arrows and slider numbers -->
|
|
<!-- <div class="arrows-and-numbers"> -->
|
|
<!-- <v-icon class="arrow left" @click="prevSlide">mdi-chevron-left</v-icon> -->
|
|
<!-- <div class="slider-counter">{{ model + 1 }} / {{ sliderItems.length }}</div> -->
|
|
<!-- <v-icon class="arrow right" @click="nextSlide">mdi-chevron-right</v-icon> -->
|
|
<!-- <div class="slider-number-container">
|
|
<div v-for="(n, index) in sliderItems" :key="n" class="slider-number-indicator"
|
|
@click="goToSlide(index)">
|
|
</div>
|
|
</div> -->
|
|
<!-- </div> -->
|
|
</div>
|
|
|
|
</section>
|
|
</template>
|
|
|
|
|
|
|
|
<style>
|
|
.arrows-and-numbers {
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: space-between;
|
|
}
|
|
|
|
.slider-counter {
|
|
font-size: 18px;
|
|
margin: 0 10px;
|
|
}
|
|
|
|
.arrow {
|
|
cursor: pointer;
|
|
font-size: 24px;
|
|
margin: 0 10px;
|
|
}
|
|
|
|
.slider-number-container {
|
|
display: flex;
|
|
}
|
|
|
|
.slider-number-indicator {
|
|
margin: 0 5px;
|
|
}
|
|
|
|
.slider-number {
|
|
display: flex;
|
|
align-items: center;
|
|
cursor: pointer;
|
|
}
|
|
|
|
.slider-number span {
|
|
margin-left: 5px;
|
|
}
|
|
|
|
.slider-number.active span {
|
|
color: #ffffff;
|
|
}
|
|
|
|
.tp-widget-wrapper {
|
|
max-width: 255px;
|
|
}
|
|
|
|
.tp-widget-wrapper {
|
|
height: 100%;
|
|
margin: 0 auto;
|
|
max-width: 750px;
|
|
position: relative;
|
|
}
|
|
|
|
a>#reviews-summary {
|
|
color: #191919 !important;
|
|
text-decoration: none;
|
|
}
|
|
|
|
@media screen and (min-width: 200px) {
|
|
.tp-widget-logo {
|
|
max-width: 140.25px;
|
|
position: relative;
|
|
display: block;
|
|
left: 37%;
|
|
}
|
|
}
|
|
|
|
.tp-widget-logo {
|
|
margin: 0 0 8px;
|
|
width: 55%;
|
|
}
|
|
|
|
.tp-widget-stars {
|
|
margin: 0 0 8px;
|
|
width: 94%;
|
|
}
|
|
|
|
.tp-widget-businessinfo {
|
|
font-size: 11px;
|
|
line-height: 1.2;
|
|
}
|
|
|
|
@media screen and (min-width: 200px) {
|
|
.tp-widget-businessinfo {
|
|
font-size: 14px;
|
|
position: relative;
|
|
display: block;
|
|
margin: 0 auto;
|
|
text-align: center;
|
|
/* max-width: 255px; */
|
|
}
|
|
|
|
}
|
|
|
|
@media screen and (min-width: 235px) {
|
|
|
|
.tp-widget-businessinfo__trustscore,
|
|
.tp-widget-businessinfo__total {
|
|
display: inline-block;
|
|
vertical-align: middle;
|
|
}
|
|
}
|
|
|
|
.tp-widget-businessinfo__trustscore,
|
|
.tp-widget-businessinfo__total {
|
|
text-transform: none;
|
|
}
|
|
|
|
b,
|
|
strong {
|
|
font-weight: 700;
|
|
}
|
|
|
|
@media screen and (min-width: 235px) {
|
|
.tp-widget-businessinfo__trustscore::after {
|
|
content: "|";
|
|
margin: 0 2px;
|
|
}
|
|
}
|
|
|
|
@media screen and (min-width: 235px) {
|
|
|
|
.tp-widget-businessinfo__trustscore,
|
|
.tp-widget-businessinfo__total {
|
|
display: inline-block;
|
|
vertical-align: middle;
|
|
}
|
|
}
|
|
|
|
.tp-widget-businessinfo__trustscore,
|
|
.tp-widget-businessinfo__total {
|
|
text-transform: none;
|
|
}
|
|
</style>
|