long.rsx 955 B

1234567891011121314151617181920212223242526272829303132333435363738394041
  1. use dioxus::prelude::*;
  2. #[component]
  3. pub fn Explainer<'a>(
  4. cx: Scope<'a>,
  5. invert: bool,
  6. title: &'static str,
  7. content: Element,
  8. flasher: Element,
  9. ) -> Element {
  10. // pt-5 sm:pt-24 lg:pt-24
  11. let mut right = rsx! {
  12. div { class: "relative w-1/2", {flasher} }
  13. };
  14. let align = match invert {
  15. true => "mr-auto ml-16",
  16. false => "ml-auto mr-16",
  17. };
  18. let mut left = rsx! {
  19. div { class: "relative w-1/2 {align} max-w-md leading-8",
  20. h2 { class: "mb-6 text-3xl leading-tight md:text-4xl md:leading-tight lg:text-3xl lg:leading-tight font-heading font-mono font-bold",
  21. "{title}"
  22. }
  23. {content}
  24. }
  25. };
  26. if *invert {
  27. std::mem::swap(&mut left, &mut right);
  28. }
  29. rsx! {
  30. div { class: "flex flex-wrap items-center dark:text-white py-16 border-t font-light",
  31. {left}
  32. {right}
  33. }
  34. }
  35. }