improved about footer and field change boxes
This commit is contained in:
parent
ab401ce65c
commit
9b989389b5
|
|
@ -285,14 +285,12 @@ impl Lobby {
|
|||
},
|
||||
message: ClientMessage::Goodbye,
|
||||
}) => {
|
||||
log::error!("we are in there");
|
||||
if let Some(remove_idx) = self
|
||||
.players_in_lobby
|
||||
.iter()
|
||||
.enumerate()
|
||||
.find_map(|(idx, p)| (p.0.player_id == player_id).then_some(idx))
|
||||
{
|
||||
log::error!("removing player {player_id} at idx {remove_idx}");
|
||||
self.players_in_lobby.swap_remove(remove_idx);
|
||||
self.send_lobby_info_to_host().await?;
|
||||
self.send_lobby_info_to_clients().await;
|
||||
|
|
|
|||
|
|
@ -94,10 +94,11 @@ body {
|
|||
app {
|
||||
max-width: 100vw;
|
||||
width: 100vw;
|
||||
min-height: 100vh;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
top: 0;
|
||||
left: 0;
|
||||
display: block;
|
||||
position: absolute;
|
||||
}
|
||||
|
||||
.big-screen {
|
||||
|
|
@ -957,18 +958,45 @@ input {
|
|||
}
|
||||
|
||||
.info-update {
|
||||
border: 1px solid rgba(255, 255, 255, 0.5);
|
||||
padding: 30px 0px 30px 0px;
|
||||
font-size: 2rem;
|
||||
align-content: stretch;
|
||||
margin: 0;
|
||||
position: absolute;
|
||||
left: 0;
|
||||
position: fixed;
|
||||
left: 5vw;
|
||||
z-index: 3;
|
||||
background-color: #000;
|
||||
min-width: 2cm;
|
||||
width: 90vw;
|
||||
|
||||
& * {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
flex-wrap: nowrap;
|
||||
align-items: center;
|
||||
gap: 10px;
|
||||
|
||||
&>input {
|
||||
border: 1px solid rgba(255, 255, 255, 0.25);
|
||||
background-color: black;
|
||||
|
||||
color: white;
|
||||
padding: 0;
|
||||
font-size: 1.5em;
|
||||
|
||||
&:focus {
|
||||
background-color: white;
|
||||
color: black;
|
||||
outline: 1px solid rgba(255, 255, 255, 0.25);
|
||||
}
|
||||
}
|
||||
|
||||
&>button {
|
||||
font-size: 1.1em;
|
||||
}
|
||||
|
||||
&>* {
|
||||
margin: 0;
|
||||
width: 100%;
|
||||
width: 80% !important;
|
||||
text-align: center;
|
||||
}
|
||||
}
|
||||
|
|
@ -2307,7 +2335,7 @@ li.choice {
|
|||
display: flex;
|
||||
flex-direction: row;
|
||||
flex-wrap: nowrap;
|
||||
overflow: hidden;
|
||||
margin-top: auto;
|
||||
max-height: 1cm;
|
||||
justify-content: center;
|
||||
background-color: #000;
|
||||
|
|
|
|||
|
|
@ -48,10 +48,10 @@ pub fn ClientFooter() -> Html {
|
|||
};
|
||||
|
||||
html! {
|
||||
<nav class="footer">
|
||||
<footer class="footer">
|
||||
<button class="default-button solid" onclick={about_click}>{"about"}</button>
|
||||
{about_dialog}
|
||||
</nav>
|
||||
</footer>
|
||||
}
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -102,6 +102,7 @@ pub fn ClientNav(
|
|||
on_submit={on_submit}
|
||||
state={number_open.clone()}
|
||||
on_open={close_others}
|
||||
label={String::from("number")}
|
||||
>
|
||||
<div class="number">{current_num}</div>
|
||||
</ClickableNumberEdit>
|
||||
|
|
@ -137,10 +138,11 @@ pub fn ClientNav(
|
|||
<ClickableTextEdit
|
||||
value={name.clone()}
|
||||
submit_ident={identity.clone()}
|
||||
field_name="pronouns"
|
||||
field_name="name"
|
||||
on_submit={on_submit}
|
||||
state={name_open.clone()}
|
||||
on_open={close_others}
|
||||
label={String::from("name")}
|
||||
>
|
||||
<div class="name">{identity.1.name.as_str()}</div>
|
||||
</ClickableTextEdit>
|
||||
|
|
@ -180,6 +182,7 @@ pub fn ClientNav(
|
|||
on_submit={on_submit}
|
||||
state={pronouns_open}
|
||||
on_open={close_others}
|
||||
label={String::from("pronouns")}
|
||||
>
|
||||
{pronouns}
|
||||
</ClickableTextEdit>
|
||||
|
|
@ -228,6 +231,8 @@ struct ClickableTextEditProps {
|
|||
pub max_length: usize,
|
||||
#[prop_or_default]
|
||||
pub on_open: Option<Callback<()>>,
|
||||
#[prop_or_default]
|
||||
pub label: String,
|
||||
}
|
||||
|
||||
#[function_component]
|
||||
|
|
@ -241,6 +246,7 @@ fn ClickableTextEdit(
|
|||
state,
|
||||
max_length,
|
||||
on_open,
|
||||
label,
|
||||
}: &ClickableTextEditProps,
|
||||
) -> Html {
|
||||
let on_input = crate::components::input_element_string_oninput(value.setter(), *max_length);
|
||||
|
|
@ -260,9 +266,13 @@ fn ClickableTextEdit(
|
|||
}
|
||||
}
|
||||
};
|
||||
let label = label.is_empty().not().then_some(html! {
|
||||
<label>{label}</label>
|
||||
});
|
||||
let options = html! {
|
||||
<div class="row-list info-update">
|
||||
<input type="text" oninput={on_input} name={*field_name}/>
|
||||
<div class="info-update">
|
||||
{label}
|
||||
<input type="text" oninput={on_input} name={*field_name} autofocus=true/>
|
||||
<Button on_click={submit}>{"ok"}</Button>
|
||||
</div>
|
||||
};
|
||||
|
|
|
|||
|
|
@ -12,6 +12,7 @@
|
|||
//
|
||||
// You should have received a copy of the GNU Affero General Public License
|
||||
// along with this program. If not, see <https://www.gnu.org/licenses/>.
|
||||
use core::ops::Not;
|
||||
use yew::prelude::*;
|
||||
|
||||
use crate::components::Button;
|
||||
|
|
@ -92,6 +93,8 @@ pub struct ClickableNumberEditProps {
|
|||
pub state: UseStateHandle<bool>,
|
||||
#[prop_or_default]
|
||||
pub on_open: Option<Callback<()>>,
|
||||
#[prop_or_default]
|
||||
pub label: String,
|
||||
}
|
||||
|
||||
#[function_component]
|
||||
|
|
@ -103,14 +106,19 @@ pub fn ClickableNumberEdit(
|
|||
on_submit,
|
||||
state,
|
||||
on_open,
|
||||
label,
|
||||
}: &ClickableNumberEditProps,
|
||||
) -> Html {
|
||||
let on_input = crate::components::input_element_string_oninput(value.setter(), 20);
|
||||
let on_submit = on_submit.clone();
|
||||
let label = label.is_empty().not().then_some(html! {
|
||||
<label>{label}</label>
|
||||
});
|
||||
|
||||
let options = html! {
|
||||
<div class="row-list info-update">
|
||||
<input type="text" oninput={on_input} name={*field_name}/>
|
||||
<div class="info-update">
|
||||
{label}
|
||||
<input type="text" oninput={on_input} name={*field_name} autofocus=true/>
|
||||
<Button on_click={on_submit.clone()}>{"ok"}</Button>
|
||||
</div>
|
||||
};
|
||||
|
|
|
|||
Loading…
Reference in New Issue