fix(web): invert navigator and login, fix r padding
This commit is contained in:
parent
01beeeca5c
commit
8f91b91ebe
2 changed files with 24 additions and 10 deletions
|
@ -97,14 +97,16 @@
|
||||||
display: block;
|
display: block;
|
||||||
}
|
}
|
||||||
hr.sep {
|
hr.sep {
|
||||||
|
border: 1px solid #bf616a70;
|
||||||
|
}
|
||||||
|
hr.sticky {
|
||||||
|
position: sticky;
|
||||||
z-index: 100;
|
z-index: 100;
|
||||||
margin-top: 0;
|
margin-top: 0;
|
||||||
padding-top: 0;
|
padding-top: 0;
|
||||||
margin-bottom: 0;
|
margin-bottom: 0;
|
||||||
padding-bottom: 0;
|
padding-bottom: 0;
|
||||||
border: 1px solid #bf616a70;
|
|
||||||
top: 1.65rem;
|
top: 1.65rem;
|
||||||
position: sticky;
|
|
||||||
}
|
}
|
||||||
div.sticky {
|
div.sticky {
|
||||||
z-index: 100;
|
z-index: 100;
|
||||||
|
@ -244,6 +246,9 @@
|
||||||
.depth-r {
|
.depth-r {
|
||||||
margin-left: .5em;
|
margin-left: .5em;
|
||||||
}
|
}
|
||||||
|
.only-on-mobile {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
@media screen and (max-width: 786px) {
|
@media screen and (max-width: 786px) {
|
||||||
.depth-r {
|
.depth-r {
|
||||||
margin-left: .125em;
|
margin-left: .125em;
|
||||||
|
@ -251,9 +256,15 @@
|
||||||
.ml-1-r {
|
.ml-1-r {
|
||||||
margin-left: 0;
|
margin-left: 0;
|
||||||
}
|
}
|
||||||
|
.only-on-mobile {
|
||||||
|
display: inherit;
|
||||||
|
}
|
||||||
.hidden-on-mobile {
|
.hidden-on-mobile {
|
||||||
display: none;
|
display: none;
|
||||||
}
|
}
|
||||||
|
div.col-side {
|
||||||
|
padding-right: .25em;
|
||||||
|
}
|
||||||
main {
|
main {
|
||||||
margin: 0;
|
margin: 0;
|
||||||
}
|
}
|
||||||
|
|
|
@ -59,10 +59,12 @@ pub fn App() -> impl IntoView {
|
||||||
/* TODO kinda jank with the float but whatever, will do for now */
|
/* TODO kinda jank with the float but whatever, will do for now */
|
||||||
<input type="submit" class="mr-2 rev" on:click=move |_| set_menu.set(!menu.get()) value="menu" style="float: right" />
|
<input type="submit" class="mr-2 rev" on:click=move |_| set_menu.set(!menu.get()) value="menu" style="float: right" />
|
||||||
</nav>
|
</nav>
|
||||||
<hr class="sep" />
|
<hr class="sep sticky" />
|
||||||
<div class="container mt-2 pt-2" >
|
<div class="container mt-2 pt-2" >
|
||||||
<div class="two-col" >
|
<div class="two-col" >
|
||||||
<div class="col-side sticky pb-s" class:hidden=move || menu.get() >
|
<div class="col-side sticky pb-s" class:hidden=move || menu.get() >
|
||||||
|
<Navigator />
|
||||||
|
<hr class="mt-1 mb-1" />
|
||||||
<LoginBox
|
<LoginBox
|
||||||
token_tx=set_token
|
token_tx=set_token
|
||||||
userid_tx=set_userid
|
userid_tx=set_userid
|
||||||
|
@ -70,13 +72,14 @@ pub fn App() -> impl IntoView {
|
||||||
server_tl=server_tl
|
server_tl=server_tl
|
||||||
/>
|
/>
|
||||||
<hr class="mt-1 mb-1" />
|
<hr class="mt-1 mb-1" />
|
||||||
<Navigator />
|
<div class:hidden=move || !auth.present() >
|
||||||
<hr class="mt-1 mb-1" />
|
{move || if advanced.get() { view! {
|
||||||
{move || if advanced.get() { view! {
|
<AdvancedPostBox advanced=set_advanced/>
|
||||||
<AdvancedPostBox advanced=set_advanced/>
|
}} else { view! {
|
||||||
}} else { view! {
|
<PostBox advanced=set_advanced/>
|
||||||
<PostBox advanced=set_advanced/>
|
}}}
|
||||||
}}}
|
<hr class="only-on-mobile sep mb-0 pb-0" />
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="col-main" class:w-100=move || menu.get() >
|
<div class="col-main" class:w-100=move || menu.get() >
|
||||||
<Router // TODO maybe set base="/web" ?
|
<Router // TODO maybe set base="/web" ?
|
||||||
|
|
Loading…
Reference in a new issue