Change how homepage is constructed to better align everything

This commit is contained in:
Lol3rrr
2024-10-19 01:01:07 +02:00
parent f22c1a1420
commit f3dde4a9cd
2 changed files with 100 additions and 76 deletions

View File

@@ -1,5 +1,4 @@
use leptos::*;
use leptos_router::A;
pub mod demo;
pub use demo::Demo;
@@ -7,59 +6,15 @@ pub use demo::Demo;
mod navbar;
pub use navbar::TopBar;
pub mod homepage;
pub use homepage::Homepage;
#[derive(Debug, Clone, Copy, PartialEq, Eq)]
pub enum DemoUploadStatus {
Hidden,
Shown,
}
#[leptos::component]
pub fn demo_list_entry(demo: common::BaseDemoInfo) -> impl leptos::IntoView {
let style = stylers::style! {
"DemoListEntry",
.entry {
display: inline-grid;
grid-template-columns: auto auto auto;
border: solid #030303aa 1px;
margin-top: 5px;
margin-bottom: 5px;
}
.score, .map {
padding-left: 5px;
padding-right: 5px;
margin-top: auto;
margin-bottom: auto;
}
.date {
display: inline-grid;
grid-template-columns: auto;
grid-template-rows: auto auto;
}
};
view! {
class=style,
<li>
<A href=format!("demo/{}/scoreboard", demo.id)>
<div class="entry">
<span class="score">{demo.team2_score}:{demo.team3_score}</span>
<div class="date">
<span>{demo.uploaded_at.format("%Y-%m-%d").to_string()}</span>
<span>{demo.uploaded_at.format("%H-%M-%S").to_string()}</span>
</div>
<span class="map">{demo.map}</span>
</div>
</A>
</li>
}
}
#[leptos::component]
pub fn upload_demo(
shown: ReadSignal<DemoUploadStatus>,
@@ -105,31 +60,3 @@ pub fn upload_demo(
</div>
}
}
#[leptos::component]
pub fn homepage() -> impl leptos::IntoView {
let demo_data = create_resource(
|| (),
|_| async move {
let res = reqwasm::http::Request::get("/api/demos/list")
.send()
.await
.unwrap();
let demos: Vec<common::BaseDemoInfo> = res.json().await.unwrap();
demos
},
);
view! {
<div>
<div>
<h2>Demos</h2>
</div>
<ul>
{ move || demo_data.get().unwrap_or_default().into_iter().map(|demo| crate::DemoListEntry(DemoListEntryProps {
demo
})).collect::<Vec<_>>() }
</ul>
</div>
}
}