Skip to content

Commit a4eabef

Browse files
ngnijlandngnijland
authored
Add team testimonial (#725)
1 parent 8e9f9b4 commit a4eabef

File tree

4 files changed

+146
-113
lines changed

4 files changed

+146
-113
lines changed

‎docs/src/components/Reviews.astro‎

Lines changed: 21 additions & 113 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
---
2-
import { Image } from "astro:assets";
2+
import Testimonial from "./Testimonial.astro";
33
44
import majidImage from "../assets/majid.jpeg";
55
import peterImage from "../assets/peter.png";
@@ -15,7 +15,6 @@ import jordiImage from "../assets/jordi.jpeg";
1515
ul {
1616
row-gap: 4rem;
1717
padding: 0;
18-
1918
list-style: none;
2019
}
2120

@@ -24,126 +23,35 @@ import jordiImage from "../assets/jordi.jpeg";
2423
grid-column: span 4;
2524
}
2625
}
27-
28-
figure {
29-
margin: 0;
30-
}
31-
32-
blockquote {
33-
margin: 0 0 1rem;
34-
35-
font-size: 1.375rem;
36-
font-weight: 600;
37-
}
38-
39-
p {
40-
margin: 0;
41-
}
42-
43-
strong {
44-
font-weight: 600;
45-
}
46-
47-
figcaption {
48-
display: flex;
49-
align-items: center;
50-
gap: 1rem;
51-
}
52-
53-
.image {
54-
width: 3rem;
55-
height: 3rem;
56-
57-
border-radius: 50%;
58-
}
59-
60-
cite {
61-
display: block;
62-
63-
color: var(--text-color-light);
64-
font-style: normal;
65-
}
66-
67-
.testimonial-position {
68-
display: block;
69-
70-
font-style: italic;
71-
color: var(--text-color);
72-
text-decoration: none;
73-
74-
&:hover {
75-
text-decoration: underline;
76-
}
77-
}
7826
</style>
7927

8028
<section aria-label="Reviews from users">
8129
<ul class="grid">
8230
<li>
83-
<figure data-aos="fade-up">
84-
<blockquote>
85-
<p>
86-
"I use RocketSim a lot to <strong>create recordings</strong> for my articles.
87-
The touches now make it even easier to share my learnings."
88-
</p>
89-
</blockquote>
90-
<figcaption>
91-
<Image
92-
src={majidImage}
93-
alt="Majid Jabrayilov"
94-
width="96"
95-
class="image"
96-
/>
97-
<div class="cite-wrapper">
98-
<cite>Majid Jabrayilov</cite>
99-
<a
100-
class="testimonial-position"
101-
href="https://www.swiftwithmajid.com"
102-
target="_blank">swiftwithmajid.com</a
103-
>
104-
</div>
105-
</figcaption>
106-
</figure>
31+
<Testimonial
32+
quote='"I use RocketSim a lot to <strong>create recordings</strong> for my articles. The touches now make it even easier to share my learnings."'
33+
author="Majid Jabrayilov"
34+
position="swiftwithmajid.com"
35+
website="https://www.swiftwithmajid.com"
36+
image={majidImage}
37+
/>
10738
</li>
10839
<li>
109-
<figure data-aos="fade-up" data-aos-delay="750">
110-
<blockquote>
111-
<p>
112-
"RocketSim helps me to <strong
113-
>create localized preview videos</strong
114-
>
115-
for Soosee, ready to upload to App Store Connect."
116-
</p>
117-
</blockquote>
118-
<figcaption>
119-
<Image src={jordiImage} alt="Jordi Bruin" width="96" class="image" />
120-
<div class="cite-wrapper">
121-
<cite>Jordi Bruin</cite>
122-
<a
123-
class="testimonial-position"
124-
href="https://www.soosee.app"
125-
target="_blank">soosee.app</a
126-
>
127-
</div>
128-
</figcaption>
129-
</figure>
40+
<Testimonial
41+
quote='"RocketSim helps me to <strong>create localized preview videos</strong> for Soosee, ready to upload to App Store Connect."'
42+
author="Jordi Bruin"
43+
position="soosee.app"
44+
website="https://www.soosee.app"
45+
image={jordiImage}
46+
/>
13047
</li>
13148
<li>
132-
<figure data-aos="fade-up" data-aos-delay="1500">
133-
<blockquote>
134-
<p>
135-
"I love <strong>RocketSim’s Network Monitor!</strong> It lets me inspect
136-
outgoing requests and quickly spot why any fail. Incredibly useful."
137-
</p>
138-
</blockquote>
139-
<figcaption>
140-
<Image src={peterImage} alt="Peter Friese" width="96" class="image" />
141-
<div class="cite-wrapper">
142-
<cite>Peter Friese</cite>
143-
<span class="testimonial-position">Developer Advocate, Google</span>
144-
</div>
145-
</figcaption>
146-
</figure>
49+
<Testimonial
50+
quote='"I love <strong>RocketSim’s Network Monitor!</strong> It lets me inspect outgoing requests and quickly spot why any fail. Incredibly useful."'
51+
author="Peter Friese"
52+
position="Developer Advocate, Google"
53+
image={peterImage}
54+
/>
14755
</li>
14856
</ul>
14957
</section>

‎docs/src/components/TeamTestimonial.astro‎

Lines changed: 27 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,27 @@
1+
---
2+
import Testimonial from "./Testimonial.astro";
3+
---
4+
5+
<style>
6+
section {
7+
margin-top: 5rem;
8+
margin-bottom: 5rem;
9+
padding: 0 var(--side-padding);
10+
}
11+
12+
.container {
13+
max-width: var(--content-max-width);
14+
margin: 0 auto;
15+
}
16+
</style>
17+
18+
<section aria-label="Customer testimonial" class="grid">
19+
<div class="container">
20+
<Testimonial
21+
quote='"RocketSim Team Insights finally gives us <strong>visibility into our build times</strong> beyond just gut feeling. We can actually measure the impact of adding SDKs or improving configurations, seeing results reflected in <strong>incremental and clean builds</strong>. It’s been invaluable for decisions like upgrading hardware—we can point to real data showing how different machines affect build times. The metrics are broken down beautifully, no extra setup or build phase hacks required—it just works quietly in the background. Honestly, it’s something we could never have justified building in-house, but it’s been a <strong>total game-changer</strong>."'
22+
author="Max Godfrey"
23+
position="iOS Developer at Empower Finance"
24+
fullWidth={true}
25+
/>
26+
</div>
27+
</section>

‎docs/src/components/Testimonial.astro‎

Lines changed: 96 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,96 @@
1+
---
2+
import { Image } from "astro:assets";
3+
import type { ImageMetadata } from "astro";
4+
5+
interface Props {
6+
quote: string;
7+
author: string;
8+
position: string;
9+
website?: string;
10+
image?: ImageMetadata;
11+
fullWidth?: boolean;
12+
}
13+
14+
const {
15+
quote,
16+
author,
17+
position,
18+
website,
19+
image,
20+
fullWidth = false,
21+
} = Astro.props;
22+
---
23+
24+
<style>
25+
figure {
26+
margin: 0;
27+
}
28+
29+
blockquote {
30+
margin: 0 0 1rem;
31+
font-size: 1.375rem;
32+
font-weight: 600;
33+
}
34+
35+
p {
36+
margin: 0;
37+
}
38+
39+
:global(.testimonial-quote strong) {
40+
font-weight: 600;
41+
}
42+
43+
figcaption {
44+
display: flex;
45+
align-items: center;
46+
gap: 1rem;
47+
}
48+
49+
.image {
50+
width: 3rem;
51+
height: 3rem;
52+
border-radius: 50%;
53+
}
54+
55+
cite {
56+
display: block;
57+
color: var(--text-color-light);
58+
font-style: normal;
59+
}
60+
61+
.testimonial-position {
62+
display: block;
63+
font-style: italic;
64+
color: var(--text-color);
65+
text-decoration: none;
66+
}
67+
68+
a.testimonial-position:hover {
69+
text-decoration: underline;
70+
}
71+
72+
.full-width {
73+
width: 100%;
74+
}
75+
</style>
76+
77+
<figure data-aos="fade-up" class={fullWidth ? "full-width" : ""}>
78+
<blockquote>
79+
<p class="testimonial-quote" set:html={quote} />
80+
</blockquote>
81+
<figcaption>
82+
{image ? <Image src={image} alt={author} width="96" class="image" /> : null}
83+
<div class="cite-wrapper">
84+
<cite>{author}</cite>
85+
{
86+
website ? (
87+
<a class="testimonial-position" href={website} target="_blank">
88+
{position}
89+
</a>
90+
) : (
91+
<span class="testimonial-position">{position}</span>
92+
)
93+
}
94+
</div>
95+
</figcaption>
96+
</figure>

‎docs/src/pages/team-insights.astro‎

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -10,6 +10,7 @@ import InsightsActionable from "../components/InsightsActionable.astro";
1010
import OnlineTeamManager from "../components/OnlineTeamManager.astro";
1111
import Pricing from "../components/Pricing.astro";
1212
import AppStore from "../components/AppStore.astro";
13+
import TeamTestimonial from "../components/TeamTestimonial.astro";
1314
1415
import logoImage from "../assets/rocketsim-insights-logo.svg";
1516
---
@@ -43,6 +44,7 @@ import logoImage from "../assets/rocketsim-insights-logo.svg";
4344
</NavigationLink>
4445
</Navigation>
4546
<main>
47+
<TeamTestimonial />
4648
<Insights />
4749
<InsightsBreakdown
4850
title="Is it worth getting an M4 Max?"

0 commit comments

Comments
 (0)