<!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.0">
<title>Pimcore Company</title>
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/swiper@10/swiper-bundle.min.css"/>
{#font awesome cdn link#}
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.4/css/all.min.css">
{#custom css file link#}
<style>
.heading{
margin-top:5px;
}
.box-container .box{
padding:10px;
text-align:center;
}
.box-container .box h2{
color:#5D5D5D;
font-size:revert;
font-style:oblique;
word-spacing:1px;
}
#review_fas{
padding:10px;
color:#759698;
}
.box-container .box h3{
font-size:18px;
color:#132444;
word-spacing:1px;
padding:4px;
}
.box-container .box p{
font-size:13px;
color:#6B7381;
word-spacing:1px;
}
#designation{
color:#164293;
font-size:12px;
word-spacing:1px;
}
</style>
</head>
<body>
{#header section starts#}
{% include 'includes/company-home-header.html.twig' %}
{#header section ends#}
{#article section starts#}
<section class="articles_reviews articles" id="reviews">
<h1 class="heading"><span>Reviews</span></h1>
<div class="box-container">
{% for repos in ReviewsAndRatings %}
<div class="box">
<i class="fas fa-user" style="font-size:10rem; text-align:center" id="review_fas"></i>
<h3>{{repos.companies}}</h3>
<p>{{repos.writeReview}}</p>
{% if repos.name|length %}
<h2>Reviewer's Name: {{repos.name}}</h2>
{% endif %}
{% if repos.designation|length %}
<p id="designation">{{repos.designation}}</p>
{% endif %}
<h3> {{repos.rating}}</h3>
<div class="d-flex" style="color: orange;">
{% for i in range(0, 4) %}
{% if repos.rating - i >= 0.8 %}
<i class="fas fa-star"></i>
{% elseif repos.rating - i <= 0.2 %}
<i class="far fa-star"></i>
{% else %}
<i class="fas fa-star-half-alt"></i>
{% endif %}
{% endfor %}
{#<span class="ps-1">{{repos.rating}}</span>#}
</div>
{#rating looping section ends#}
</div>
{% endfor %}
</div>
</section>
{#article section ends#}
{#footer section starts#}
{% include 'includes/company-footer.html.twig' %}
{#footer section ends#}
{#custom js file link#}
{#<script src="https://cdn.jsdelivr.net/npm/swiper@10/swiper-bundle.min.js"></script>#}
{#<script>#}
{# let navbar = document.querySelector('.navbar');#}
{# document.querySelector('#menu-btn').onclick = () => {#}
{# navbar.classList.toggle('active');#}
{# searchForm.classList.remove('active');#}
{# shoppingCart.classList.remove('active');#}
{# loginForm.classList.remove('active');#}
{# }#}
{# window.onscroll = () =>{#}
{# searchForm.classList.remove('active');#}
{# shoppingCart.classList.remove('active');#}
{# loginForm.classList.remove('active');#}
{# navbar.classList.remove('active');#}
{# }#}
{# var swiper = new Swiper(".review-slider",{#}
{# loop:true,#}
{# spaceBetween: 20,#}
{# autoplay: {#}
{# delay: 7500,#}
{# disableOnInteraction: false,#}
{# },#}
{# centeredSlides: true,#}
{# breakpoints: {#}
{# 0: {#}
{# slidePreview: 1,#}
{# },#}
{# 768: {#}
{# slidesPerView: 2,#}
{# },#}
{# 1024: {#}
{# slidesPerView: 3,#}
{# },#}
{# },#}
{# });#}
{#</script>#}
</body>
</html>