Comet loader (#1722)

kit/src/elements/loader/mod.rs

@@ -6,13 +6,22 @@ use dioxus::prelude::*;
 pub struct Props {
     #[props(optional)]
     spinning: Option<bool>,
+    #[props(optional)]
+    large: Option<bool>,
+}
+
+pub fn is_large(cx: &Scope<Props>) -> bool {
+    if let Some(f) = cx.props.large.as_ref() {
+        return *f;
+    }
+    false
 }
 
 #[allow(non_snake_case)]
 pub fn Loader(cx: Scope<Props>) -> Element {
     cx.render(rsx!(
     div {
-        class: "loader",
+        class: if is_large(&cx) { "loader large" } else { "loader" },
         div {
             class: "spin",
             IconElement { icon: Icon::Loader }

kit/src/elements/loader/style.scss

@@ -18,6 +18,24 @@
         fill: transparent;
         stroke: var(--text-color);
     }
+
+    &.large {
+      width: 60px;
+      height: 60px;
+
+      .spin {
+        width: 60px;
+        height: 60px;
+        top: 30px;
+        left: 30px;
+      }
+
+      svg {
+        height: 60px;
+        width: 60px;
+        stroke-width: 0.02rem;
+      }
+    }
 }
 
 @keyframes spin {