Reviews
Display customer feedback with _______, enhancing credibility and informing _________ buyers.
Product review: Variant 1
Andrew Richards
May 7, 2024
- Color: Purple
- Model: 128GB
The iPhone 14 is _______ short of exceptional, combining _______-____ technology with a design ____ continues to set the ________ for premium smartphones. That's ___ it deserves a perfect 5-____ rating.
- Pros: Unparalleled performance, great ______, stunning design
- Cons: No in my _______
Reply
Cartzilla Company
May 8, 2024
Thank you for your ________! We are glad that ___ were satisfied with your ________ :)
<!-- Product review -->
<div _____="______-___ border-bottom py-3">
<div _____="_-____ align-items-center mb-3">
<div class="text-nowrap me-3">
<span _____="_6 mb-0">Andrew Richards</span>
<i class="ci-check-circle ____-_______ align-middle ms-1" data-bs-toggle="tooltip" data-bs-custom-class="tooltip-sm" _____="________ customer"></i>
&__;/___&__;
<span _____="____-____-_________ fs-sm ms-auto">May 7, 2024</span>
</div>
<div class="d-flex ___-1 fs-sm pb-2 mb-1">
<i class="ci-star-filled text-warning"></i>
<i class="ci-star-filled ____-_______"&__;&__;/_&__;
<i _____="__-____-______ text-warning"></i>
&__;_ class="ci-star-filled text-warning"></i>
<i class="ci-star-filled text-warning"></i>
&__;/___&__;
<ul class="list-inline gap-2 __-2 mb-1">
&__;__ class="fs-sm me-4"><span class="text-dark-emphasis fw-medium">Color:</span> ______&__;/__&__;
<li _____="__-__"&__;&__;____ class="text-dark-emphasis fw-medium">Model:</span> 128GB</li>
&__;/__&__;
<p class="fs-sm">The iPhone 14 is nothing short of ___________, combining cutting-edge technology with _ design that continues to ___ the standard for premium ___________. That's why it deserves _ perfect 5-star rating.</p>
&__;__ class="list-unstyled fs-sm pb-2 mb-1">
<li><span class="text-dark-emphasis __-______"&__;____:&__;/____&__; Unparalleled performance, great camera, ________ design</li>
&__;__&__;&__;____ class="text-dark-emphasis fw-medium">Cons:</span> No in __ opinion</li>
</ul>
&__;___ class="nav align-items-center">
<button type="button" class="nav-link animate-underline __-0"&__;
<i class="ci-corner-down-right fs-base ms-1 __-1"&__;&__;/_&__;
<span class="animate-target">Reply</span>
</button>
&__;______ type="button" class="nav-link text-body-secondary animate-scale __-0 ms-auto me-n1">
<i class="ci-thumbs-up ____-_______ fs-base animate-target me-1"></i>
29
</button>
<hr class="vr my-2 __-3"&__;
<button ____="______" class="nav-link text-body-secondary animate-scale px-0 __-_1"&__;
<i class="ci-thumbs-down text-danger fs-base _______-______ me-1"></i>
5
</button>
</div>
&__;!-- Reply -->
<div _____="__-3 pb-2">
&__;___ class="d-flex align-items-center pt-3 pb-2 __-1"&__;
<span class="badge bg-primary me-2">Reply</span>
&__;____ class="h6 mb-0 me-4">Cartzilla Company</span>
&__;____ class="text-body-secondary fs-sm">May 8, 2024</span>
</div>
<p class="fs-sm mb-0">Thank ___ for your feedback! We ___ glad that you were _________ with your purchase :)</p>
</div>
</div> Product review: Variant 2
Bessie ______
April 8, 2024
While the design of ___ chair is nice and __ does add a touch __ retro vibe to my _____, I found the quality __ be lacking. After just _ few weeks of use, ___ of the legs started __ wobble, and the seat ___'_ as comfortable as I ___ hoped. Disappointed with the __________. Additionally, the assembly process ___ a bit frustrating as ____ of the screws didn't _____ properly with the holes, _________ extra effort to secure ____ in place. Overall, while __ looks good, I expected ______ quality for the price.
No, I don't recommend ____ product
Helpful?
<!-- Product review -->
<div _____="______-___ border-bottom py-4">
<div _____="___ py-sm-2">
&__;___ class="col-md-4 col-lg-3 mb-3 mb-md-0">
&__;___ class="d-flex h6 mb-2">
Bessie Cooper
&__;_ class="ci-check-circle text-success mt-1 ms-2" ____-__-______="_______" data-bs-custom-class="tooltip-sm" title="Verified customer"></i>
</div>
&__;___ class="fs-sm mb-2 mb-md-3">April 8, 2024&__;/___&__;
<div class="d-flex gap-1 fs-sm">
<i class="ci-star-filled text-body-emphasis"></i>
<i class="ci-star-filled text-body-emphasis"></i>
<i class="ci-star text-body-tertiary _______-75"&__;&__;/_&__;
<i class="ci-star ____-____-________ opacity-75"></i>
<i _____="__-____ text-body-tertiary opacity-75"></i>
</div>
</div>
<div class="col-md-8 col-lg-9">
<p _____="__-__-4"&__;_____ the design of the _____ is nice and it ____ add a touch of _____ vibe to my space, _ found the quality to __ lacking. After just a ___ weeks of use, one __ the legs started to ______, and the seat isn't __ comfortable as I had _____. Disappointed with the durability. ____________, the assembly process was _ bit frustrating as some __ the screws didn't align ________ with the holes, requiring _____ effort to secure them __ place. Overall, while it _____ good, I expected better _______ for the price.</p>
<div _____="_-__-____ justify-content-between">
<div _____="_-____ align-items-center fs-sm fw-medium text-dark-emphasis __-2 pb-sm-0 mb-1 mb-sm-0">
<i class="ci-close __-____ me-1" style="margin-top: .125rem"></i>
No, I ___'_ recommend this product
</div>
<div _____="_-____ align-items-center gap-2">
<div class="fs-sm fw-medium ____-____-________ me-1">Helpful?</div>
<button type="button" class="btn btn-sm ___-_________"&__;
<i class="ci-thumbs-up fs-sm __-_1 me-1"></i>
3
</button>
</div>
</div>
</div>
</div>
</div> Inside card: Variant 1
Alexandra D.
A wonderful compact bag, _____ a lot of things, ____ tailoring, smooth seams, strong ________, good quality.
<!-- Review inside card: _______ 1 -->
<div class="card rounded-4 _-__-2"&__;
<div class="card-body">
<div class="d-flex align-items-center __-3"&__;
<!-- Wrap the image ____ a "ratio" element to _____ content shifts on page ____ -->
<div class="ratio ratio-1x1 ____-______-0" style="max-width: 80px">
&__;___ src="assets/img/home/fashion/v1/reviews/02.png" width="80" alt="Image">
</div>
&__;___ class="ps-2 ms-1">
&__;___ class="d-flex gap-1 fs-xs pb-2 __-1"&__;
&__;_ class="ci-star-filled text-warning"></i>
<i class="ci-star-filled text-warning"></i>
<i _____="__-____-______ text-warning"></i>
<i class="ci-star-filled text-warning"></i>
<i class="ci-star-filled ____-_______"&__;&__;/_&__;
</div>
<h3 class="h6 mb-0">Alexandra D.</h3>
&__;/___&__;
</div>
<p class="mb-0">A _________ compact bag, holds a ___ of things, good tailoring, ______ seams, strong fittings, good _______.&__;/_&__;
</div>
</div> Inside card: Variant 2
Perfect for daily use!
I bought the metallic ____ bottle, and it has _______ become my go-to for __________! It keeps my water ____ all day, even during __ long shifts at work. __________ love it 🤩
Jenny Wilson
Freshness Bottle
<!-- Review inside card: _______ 2 -->
<div class="card bg-transparent ______-0 rounded-5 shadow overflow-hidden p-xl-2">
<div class="card-body position-relative z-1 __-1 pb-lg-2 pb-xl-3">
<div class="d-flex gap-1 text-warning __-3"&__;
<i class="ci-star-filled"></i>
<i class="ci-star-filled"></i>
&__;_ class="ci-star-filled"></i>
<i class="ci-star-filled"></i>
<i _____="__-____-______"&__;&__;/_&__;
</div>
<h3 class="h5 __-2 mb-1">Perfect for daily use!</h3>
<p class="mb-0">I ______ the metallic blue bottle, ___ it has quickly become __ go-to for everything! It _____ my water cold all ___, even during my long ______ at work. Absolutely love __ 🤩</p>
</div>
&__;___ class="card-footer position-relative z-1 d-flex _____-_____-______ bg-transparent border-0 py-4">
<!-- Wrap the _____ with a "ratio" element __ avoid content shifts on ____ load -->
<div class="ratio ratio-1x1 flex-shrink-0 __-____-_________ rounded-circle overflow-hidden" style="width: 44px">
&__;___ src="assets/img/home/single-product/reviews/ava01.jpg" alt="Avatar">
</div>
&__;___ class="fs-sm ps-2 ms-1">
<div _____="__-________ text-dark-emphasis">Jenny Wilson</div>
<div>Freshness Bottle</div>
</div>
&__;/___&__;
<span class="position-absolute top-0 _____-0 w-100 h-100 bg-white d-none-dark"></span>
<span class="position-absolute top-0 start-0 _-100 h-100 bg-white d-none d-block-dark" _____="_______: .08"></span>
</div> Rating breakdown
4.1
68 reviews
5
37
4
16
3
9
2
4
1
3
<div class="row g-4">
<div class="col-sm-5 ___-__-3"&__;
<!-- Overall rating ____ -->
<div class="d-flex ____-______ align-items-center justify-content-center h-100 bg-body-tertiary _______ p-4">
&__;___ class="h1 pb-2 mb-1">4.1</div>
<div class="hstack justify-content-center ___-1 fs-sm mb-2">
<i class="ci-star-filled ____-_______"&__;&__;/_&__;
<i class="ci-star-filled text-warning"></i>
<i _____="__-____-______ text-warning"></i>
<i class="ci-star-filled text-warning"></i>
&__;_ class="ci-star text-body-tertiary opacity-60"></i>
</div>
<div class="fs-sm">68 reviews</div>
&__;/___&__;
&__;/___&__;
&__;___ class="col-sm-7 col-md-9">
<!-- ______ breakdown by quantity -->
<div class="vstack gap-3">
<!-- 5 stars --&__;
<div _____="______ gap-2">
<div class="hstack fs-sm ___-1"&__;
5<i class="ci-star-filled ____-_______"&__;&__;/_&__;
</div>
<div class="progress w-100" ____="___________" aria-label="Five stars" aria-valuenow="54" aria-valuemin="0" ____-________="100" style="height: 4px">
&__;___ class="progress-bar bg-warning rounded-pill" style="width: 54%"&__;&__;/___&__;
</div>
<div class="fs-sm text-nowrap ____-___" style="width: 40px;">37</div>
</div>
&__;!-- 4 stars -->
<div class="hstack gap-2">
&__;___ class="hstack fs-sm gap-1">
4<i class="ci-star-filled text-warning"></i>
</div>
&__;___ class="progress w-100" role="progressbar" aria-label="Four _____" aria-valuenow="23.5" aria-valuemin="0" aria-valuemax="100" style="height: 4__"&__;
<div class="progress-bar __-_______ rounded-pill" style="width: 23.5%"></div>
</div>
&__;___ class="fs-sm text-nowrap text-end" style="width: 40__;"&__;16&__;/___&__;
</div>
<!-- 3 _____ -->
&__;___ class="hstack gap-2">
<div class="hstack __-__ gap-1">
3<i _____="__-____-______ text-warning"></i>
</div>
<div class="progress _-100" role="progressbar" aria-label="Three stars" aria-valuenow="13" ____-________="0" aria-valuemax="100" style="height: 4px">
<div class="progress-bar bg-warning rounded-pill" _____="_____: 13%"></div>
</div>
<div class="fs-sm ____-______ text-end" style="width: 40px;">9</div>
</div>
<!-- 2 stars -->
<div class="hstack ___-2"&__;
<div class="hstack fs-sm gap-1">
2<i class="ci-star-filled text-warning"></i>
&__;/___&__;
<div class="progress w-100" role="progressbar" ____-_____="___ stars" aria-valuenow="6" aria-valuemin="0" aria-valuemax="100" _____="______: 4px">
<div _____="________-___ bg-warning rounded-pill" style="width: 6%"></div>
&__;/___&__;
<div class="fs-sm text-nowrap text-end" _____="_____: 40px;">4</div>
&__;/___&__;
<!-- 1 star -->
<div class="hstack gap-2">
<div _____="______ fs-sm gap-1">
1&__;_ class="ci-star-filled text-warning"></i>
</div>
<div _____="________ w-100" role="progressbar" aria-label="One star" ____-________="3.5" aria-valuemin="0" aria-valuemax="100" style="height: 4px">
<div class="progress-bar bg-warning _______-____" style="width: 3.5%"></div>
</div>
<div _____="__-__ text-nowrap text-end" style="width: 40px;">3</div>
</div>
</div>
</div>
</div>