yisroelbaum/Rabbi_Gerzi
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

space testimonial cards

Browse source
This commit is contained in:
Yisroel Baum 2026-06-06 22:45:51 +03:00
parent fa70a4a1b7
commit 289ecec44e
Signed by: yisroelbaum
GPG key ID: 0FA60884F75520A9
1 changed files with 16 additions and 8 deletions
Download patch file Download diff file Expand all files Collapse all files

24
frontend/rabbi_gerzi/src/views/HomePage.vue
View file

@ -698,10 +698,14 @@ const projects: Project[] = [
.testimonials {
background: var(--color-cream);
padding: 5rem 2rem;
--testimonials-card-gap: 24px;
--testimonials-card-height: 220px;
--testimonials-controls-gap: 0.75rem;
--testimonials-stage-width: 1008px;
}
.testimonials__inner {
max-width: 960px;
max-width: var(--testimonials-stage-width);
margin: 0 auto;
text-align: center;
}
@ -716,9 +720,9 @@ const projects: Project[] = [
.testimonials__stage {
position: relative;
width: min(100%, 960px);
width: min(100%, var(--testimonials-stage-width));
height: var(--testimonials-card-height);
margin: 0 auto;
min-height: 220px;
overflow: hidden;
}
@ -727,8 +731,8 @@ const projects: Project[] = [
border-radius: 14px;
padding: 2rem;
text-align: left;
width: 50%;
max-width: 480px;
width: calc(50% - var(--testimonials-card-gap));
height: var(--testimonials-card-height);
opacity: 0;
visibility: hidden;
position: absolute;
@ -758,11 +762,11 @@ const projects: Project[] = [
}
.testimonials__card--previous {
transform: translateX(-150%);
transform: translateX(calc(-150% - var(--testimonials-card-gap)));
}
.testimonials__card--next {
transform: translateX(50%);
transform: translateX(calc(50% + var(--testimonials-card-gap)));
}
.testimonials__name {
@ -786,7 +790,7 @@ const projects: Project[] = [
display: flex;
justify-content: center;
gap: 0.75rem;
margin-top: 2rem;
margin-top: var(--testimonials-controls-gap);
}
.testimonials__arrow {
@ -1127,6 +1131,10 @@ const projects: Project[] = [
}
@media (max-width: 768px) {
.testimonials {
--testimonials-card-height: 320px;
}
.hero__content {
grid-template-columns: 1fr;
text-align: center;