zaaarf/upub
1
0
Fork 0
forked from alemi/upub
Code Pull requests Activity

feat(web): togglable menu, footer

Browse source
This commit is contained in:
əlemi 2024-04-17 05:39:45 +02:00
parent 663cea79ad
commit a83b557513
Signed by: alemi
GPG key ID: A4895B84D311642C
2 changed files with 35 additions and 19 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

38
web/index.html
View file

@ -19,16 +19,33 @@
}
body {
margin: 0;
padding-bottom: 1.2em;
}
nav {
top: 0;
position: sticky;
background-color: var(--background);
padding-top: .05em;
background-color: var(--background);
}
hr.nav {
footer {
width: 100%;
position: fixed;
bottom: 0;
background-color: var(--background);
text-align: center;
padding-bottom: 0;
line-height: 1rem;
}
span.footer {
padding: .1em;
font-size: .6em;
color: var(--secondary);
}
hr.sep {
margin-top: 0;
padding-top: 0;
margin-bottom: 0;
padding-bottom: 0;
border: 1px solid #bf616a70;
top: 1.65rem;
position: sticky;
@ -36,8 +53,8 @@
div.sticky {
top: 4em;
position: sticky;
background-color: var(--background);
}
.hidden { display: none; }
a.upub-title {
color: var(--primary);
text-decoration: none;
@ -53,8 +70,6 @@
max-height: 2em;
border-radius: 50%;
}
div.boxscroll {
}
div.tl-header {
background-color: #bf616a55;
color: #bf616a;
@ -62,20 +77,13 @@
table.post-table {
border-collapse: collapse;
}
tr.post-table {
border: 1px dashed #bf616a;
table p {
margin: .5em;
}
tr.post-table,
td.post-table {
border: 1px dashed #bf616a;
}
@media screen and (max-width: 786px) {
div.boxscroll {
max-height: 100%;
}
}
table.align {
line-height: 1rem;
}
td.top {
vertical-align: top;
}

16
web/src/main.rs
View file

@ -17,6 +17,8 @@ fn main() {
let home_tl = Timeline::new(format!("{URL_BASE}/users/{}/inbox/page", username.get().unwrap_or_default()));
let server_tl = Timeline::new(format!("{URL_BASE}/inbox/page"));
let (menu, set_menu) = create_signal(false);
spawn_local(async move {
if let Err(e) = server_tl.more(cookie).await {
console_error(&format!("error populating timeline: {e}"));
@ -37,9 +39,9 @@ fn main() {
<code class="color ml-3" ><a class="upub-title" href=move || if cookie.get().present() { "/web/home" } else { "/web/server" } >μpub</a></code>
<small class="ml-1 mr-1" ><a class="clean" href="/web/server" >micro social network, federated</a></small>
/* TODO kinda jank with the float but whatever, will do for now */
<small class="mr-1" style="float: right" ><a href="https://git.alemi.dev/upub.git" >src</a></small>
<input type="submit" class="mr-2 rev" on:click=move |_| set_menu.set(!menu.get()) value="menu" style="float: right" />
</nav>
<hr class="nav" />
<hr class="sep" />
<div class="container mt-2 pt-2" >
<Router // TODO maybe set base="/web" ?
trailing_slash=TrailingSlash::Redirect
@ -58,7 +60,7 @@ fn main() {
view! {
<main>
<div class="two-col" >
<div class="col-side sticky" >
<div class="col-side sticky" class:hidden=move || menu.get() >
<LoginBox
token_tx=set_cookie
token=cookie
@ -71,7 +73,7 @@ fn main() {
<hr class="mt-1 mb-1" />
<PostBox />
</div>
<div class="col-main" >
<div class="col-main" class:w-100=move || menu.get() >
<Routes>
<Route path="/web" view=About />
@ -90,6 +92,12 @@ fn main() {
}}
</Router>
</div>
<footer>
<div>
<hr class="sep" />
<span class="footer" >"\u{26fc} woven under moonlight :: "<a href="https://git.alemi.dev/upub.git" target="_blank" >src</a>" :: wip by alemi "</span>
</div>
</footer>
}
);
}