dearwolf/aider
1
0
Fork 0
mirror of https://github.com/Aider-AI/aider.git synced 2025-06-01 02:05:00 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions 9

feat: maintain consistent height for testimonial cards

Browse source
This commit is contained in:
Paul Gauthier (aider) 2025-03-28 16:02:54 -10:00
parent 775a9f86a1
commit f3f0416d31
1 changed files with 34 additions and 1 deletions
Download patch file Download diff file Expand all files Collapse all files

35
aider/website/index.html
View file

@ -241,7 +241,11 @@ aider --model o3-mini --api-key openai=&lt;key&gt;</code></pre>
.testimonial-card {
opacity: 1;
transform: translateY(0);
transition: opacity 0.4s ease, transform 0.4s ease;
transition: opacity 0.4s ease, transform 0.4s ease, height 0.4s ease;
display: flex;
flex-direction: column;
justify-content: center;
overflow: hidden;
}
</style>
@ -433,6 +437,29 @@ const testimonials = [
}
container.innerHTML = html;
// Set a fixed height for all testimonial cards after they've been created
setTimeout(setMaxTestimonialHeight, 50);
}
// Calculate and set the maximum height for all testimonial cards
function setMaxTestimonialHeight() {
const cards = document.querySelectorAll('.testimonial-card');
if (!cards.length) return;
// Find the maximum height among all cards
let maxHeight = 0;
cards.forEach(card => {
// Temporarily remove any set height to get the natural height
card.style.height = 'auto';
const height = card.offsetHeight;
maxHeight = Math.max(maxHeight, height);
});
// Set the max height on all cards
cards.forEach(card => {
card.style.height = `${maxHeight}px`;
});
}
// Function to update a single testimonial
@ -485,11 +512,17 @@ const testimonials = [
// Update content when fully faded out
setTimeout(() => {
// Keep the current height during the content swap
const currentHeight = testimonialElement.style.height;
testimonialElement.innerHTML = `
<p class="testimonial-text">${newTestimonial.text}</p>
<p class="testimonial-author">— <a href="${newTestimonial.link}" target="_blank">${newTestimonial.author}</a></p>
`;
// Ensure the height remains consistent
testimonialElement.style.height = currentHeight;
// Start fade in
setTimeout(() => {
testimonialElement.style.opacity = "1";