Rakia/Maryam-s-work
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

pushing all files

Browse Source
This commit is contained in:
rakia
2025-08-30 11:03:32 +03:00
parent fd2dcf0daa
commit 81b875023b
510 changed files with 81710 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

244
public/assets/sass/section/_testimonial.scss Normal file
View File

@ -0,0 +1,244 @@
/*==========================================================================
Testimonial CSS
==========================================================================*/
.testimonial__area {
position: relative;
z-index: 1;
overflow: hidden;
&-shape {
position: absolute;
top: -210px;
right: 20px;
z-index: -1;
}
&-item {
border: 1px solid var(--color-10);
padding: 50px;
padding-bottom: 45px;
transition: 0.4s;
position: relative;
&-icon {
position: absolute;
right: 50px;
bottom: 45px;
color: var(--text-heading-color);
opacity: 0.05;
font-size: 50px;
}
&-client {
display: flex;
align-items: center;
gap: 30px;
margin-bottom: 30px;
&-image {
img {
width: 80px;
height: 80px;
max-width: 80px;
object-fit: cover;
border-radius: 50%;
}
}
&-title {
h5 {
transition: 0.4s;
}
span {
color: var(--color-2);
transition: 0.4s;
}
}
}
p {
font-size: 19px;
line-height: 34px;
transition: 0.4s;
}
&-reviews {
margin-top: 30px;
i {
color: var(--primary-color-1);
transition: 0.4s;
}
}
&:hover {
background: var(--primary-color-1);
border-color: var(--primary-color-1);
p {
color: var(--text-white);
}
.testimonial__area-item {
&-icon {
color: var(--text-white);
opacity: 0.09;
}
&-client-title {
h5 {
color: var(--text-white);
}
span {
color: var(--color-9);
}
}
&-reviews i {
color: var(--text-white);
}
}
}
}
&-button {
padding-right: 23px;
&-next {
display: inline-block;
position: static;
margin: 0;
margin-left: 40px;
i {
width: 60px;
height: 60px;
line-height: 60px;
display: inline-block;
text-align: center;
border: 1px solid var(--color-10);
font-size: 22px;
color: var(--text-heading-color);
border-radius: 50%;
transition: 0.4s;
&:hover {
background: var(--primary-color-1);
color: var(--text-white);
border-color: var(--primary-color-1);
}
}
}
&-prev {
display: inline-block;
position: static;
margin: 0;
i {
width: 60px;
height: 60px;
line-height: 60px;
display: inline-block;
text-align: center;
border: 1px solid var(--color-10);
font-size: 22px;
color: var(--text-heading-color);
border-radius: 50%;
transition: 0.4s;
&:hover {
background: var(--primary-color-1);
color: var(--text-white);
border-color: var(--primary-color-1);
}
}
}
}
}
/*==========================================================================
Testimonial Two CSS
==========================================================================*/
.testimonial__two {
&-item {
padding: 40px;
box-shadow: var(--box-shadow-2);
&-top {
display: flex;
align-items: center;
gap: 30px;
margin-bottom: 20px;
&-reviews {
h6 {
font-size: 17px;
line-height: 27px;
}
ul {
padding: 0;
margin: 0;
li {
display: inline-block;
i {
color: var(--primary-color-1);
}
}
}
}
}
&-bottom {
display: flex;
align-items: center;
gap: 20px;
border: 1px solid var(--border-color-1);
padding: 20px;
margin-top: 40px;
border-radius: 6px;
position: relative;
&::before {
content: '';
position: absolute;
left: 30px;
top: -10px;
transform: rotate(45deg);
width: 20px;
height: 20px;
background: var(--bg-white);
border-top: var(--border-color-1) solid 1px;
border-left: var(--border-color-1) solid 1px;
}
img {
max-width: 60px;
border-radius: 50%;
}
}
}
}
@media (max-width: 1399px) {
.testimonial__area {
&-item {
padding: 40px 30px;
padding-bottom: 35px;
&-icon {
right: 30px;
bottom: 40px;
}
&-client {
margin-bottom: 25px;
}
&-reviews {
margin-top: 25px;
}
}
}
.testimonial__two-item {
padding: 40px 30px;
}
}
@media (max-width: 991px) {
.testimonial__two-item {
padding: 35px 25px;
}
}
@media (max-width: 359px) {
.testimonial__area {
&-item {
padding: 35px 30px;
padding-bottom: 30px;
&-icon {
right: 30px;
bottom: 35px;
}
&-client {
gap: 20px;
&-image img {
width: 65px;
height: 65px;
max-width: 65px;
}
}
p {
font-size: 15px;
line-height: 28px;
}
}
}
}