1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
use dioxus::prelude::*;
#[component]
pub fn ProblemSolution(
image: String,
title: String,
problem: String,
solution: String,
class: Option<String>,
) -> Element {
rsx! {
section {
class: format!("md:flex lg:max-w-5xl gap-8 w-full {}", class.unwrap_or("".to_string())),
div {
class: "flex-1",
h1 {
class: "text-primary sm:text-3xl text-2xl font-medium",
"{title}"
}
p {
class: "py-6",
"{problem}"
}
p {
class: "py-6",
"{solution}"
}
}
div {
class: "flex-1",
img {
width: "560",
height: "315",
loading: "lazy",
class: "w-full aspect-[4/3]",
alt: "Product screenshot",
src: "{image}",
}
}
}
}
}