Move species image into right column detail card with attribution
This commit is contained in:
@@ -554,37 +554,9 @@ pub fn SpeciesDetail(slug: String) -> Element {
|
||||
.or_else(|| s.primary_image_key.clone());
|
||||
|
||||
rsx! {
|
||||
div { class: "species-header",
|
||||
div { class: "species-header-text",
|
||||
h1 { em { "{s.name_scientific}" } }
|
||||
if common_name != s.name_scientific {
|
||||
p { class: "name-common", "{common_name}" }
|
||||
}
|
||||
}
|
||||
if let Some(ref key) = img_key {
|
||||
div { class: "species-image-wrap",
|
||||
img { class: "species-image", src: "/img/{key}", alt: "{s.name_scientific}" }
|
||||
if let Some(ref img) = primary_img {
|
||||
div { class: "image-attribution",
|
||||
if let Some(ref caption) = img.caption {
|
||||
span { "{caption}" }
|
||||
}
|
||||
if let Some(ref lic) = img.license {
|
||||
if img.caption.is_some() {
|
||||
" | "
|
||||
}
|
||||
span { "{lic}" }
|
||||
}
|
||||
if let Some(ref url) = img.source_url {
|
||||
if img.caption.is_some() || img.license.is_some() {
|
||||
" | "
|
||||
}
|
||||
a { href: "{url}", target: "_blank", class: "attribution-link", "Source" }
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
h1 { em { "{s.name_scientific}" } }
|
||||
if common_name != s.name_scientific {
|
||||
p { class: "name-common", "{common_name}" }
|
||||
}
|
||||
|
||||
div { class: "detail-row",
|
||||
@@ -690,6 +662,35 @@ pub fn SpeciesDetail(slug: String) -> Element {
|
||||
// === RIGHT COLUMN ===
|
||||
div { class: "detail-col",
|
||||
|
||||
// Image card
|
||||
if let Some(ref key) = img_key {
|
||||
div { class: "detail-card",
|
||||
div { class: "detail-card-header", "Image" }
|
||||
div { class: "image-card-body",
|
||||
img { class: "species-image", src: "/img/{key}", alt: "{s.name_scientific}" }
|
||||
if let Some(ref img) = primary_img {
|
||||
div { class: "image-attribution",
|
||||
if let Some(ref caption) = img.caption {
|
||||
span { "{caption}" }
|
||||
}
|
||||
if let Some(ref lic) = img.license {
|
||||
if img.caption.is_some() {
|
||||
" | "
|
||||
}
|
||||
span { "{lic}" }
|
||||
}
|
||||
if let Some(ref url) = img.source_url {
|
||||
if img.caption.is_some() || img.license.is_some() {
|
||||
" | "
|
||||
}
|
||||
a { href: "{url}", target: "_blank", class: "attribution-link", "Source" }
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// Card 4: Growing Requirements
|
||||
div { class: "detail-card",
|
||||
div { class: "detail-card-header", "Growing Requirements" }
|
||||
|
||||
Reference in New Issue
Block a user