148 lines
6.2 KiB
HTML
148 lines
6.2 KiB
HTML
@use crate::{templates::{layouts::home, profiles::{banner, icon, view}}, profiles::ProfileState};
|
|
@use hyaenidae_accounts::LogoutState;
|
|
@use hyaenidae_toolkit::{templates::{button, button_group, card, card_body, card_title, file_input, text_input, statics::{button_js, file_input_js}}, Button, Card};
|
|
|
|
@(state: &ProfileState, logout: LogoutState)
|
|
|
|
@:home("Profile Settings", &format!("{}'s profile", state.profile.name()), &Some(logout), {
|
|
<script src="/toolkit/@file_input_js.name"></script>
|
|
<script src="/toolkit/@button_js.name"></script>
|
|
}, {
|
|
@:view("standalone account-page", &state.profile)
|
|
@:card(&Card::full_width().classes(&["account-page"]).dark(true), {
|
|
@:card_title({ Update Profile })
|
|
@:card_body({
|
|
<form method="POST" action="/profiles/update/bio">
|
|
<div class="columns">
|
|
<div class="columns--column"></div>
|
|
<div class="columns--column">
|
|
<h3>Update Bio</h3>
|
|
<p>
|
|
Update the name that appears by your posts and on the top of your profile, and
|
|
the description that appears on your profile page.
|
|
</p>
|
|
@:text_input(&state.display_name)
|
|
@:text_input(&state.description)
|
|
<div class="button-section">
|
|
@:button_group(&[&Button::primary("Save").dark(true)])
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</form>
|
|
})
|
|
@:card_body({
|
|
<form
|
|
method="POST"
|
|
action="/profiles/update/icon"
|
|
enctype="multipart/form-data"
|
|
>
|
|
@if let Some(error) = &state.icon_error {
|
|
<p class="error">@error</p>
|
|
}
|
|
<div class="columns">
|
|
<div class="columns--column">
|
|
@if let Some(key) = state.profile.icon_key() {
|
|
<div class="image-box">
|
|
@:icon(key, state.profile.name())
|
|
</div>
|
|
} else {
|
|
<p>No icon set</p>
|
|
}
|
|
</div>
|
|
<div class="columns--column">
|
|
<h3>New Icon</h3>
|
|
<p>
|
|
This icon appears at the top of your profile, and next to any submissions or
|
|
comments you create
|
|
</p>
|
|
<div class="button-section">
|
|
<div class="toolkit-button-group">
|
|
@:file_input(&state.icon)
|
|
@:button(&Button::primary("Save").dark(true))
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</form>
|
|
})
|
|
@:card_body({
|
|
<form
|
|
method="POST"
|
|
action="/profiles/update/banner"
|
|
enctype="multipart/form-data"
|
|
>
|
|
@if let Some(error) = &state.banner_error {
|
|
<p class="error">@error</p>
|
|
}
|
|
<div class="columns">
|
|
<div class="columns--column">
|
|
@if let Some(key) = state.profile.banner_key() {
|
|
<div class="image-box">
|
|
@:banner(key, state.profile.name())
|
|
</div>
|
|
} else {
|
|
<p>No banner set</p>
|
|
}
|
|
</div>
|
|
<div class="columns--column">
|
|
<h3>New Banner</h3>
|
|
<p>
|
|
This banner appears at the top of your profile on the profile page
|
|
</p>
|
|
<div class="button-section">
|
|
<div class="toolkit-button-group">
|
|
@:file_input(&state.banner)
|
|
@:button(&Button::primary("Save").dark(true))
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</form>
|
|
})
|
|
@:card_body({
|
|
<form method="POST" action="/profiles/update/require-login">
|
|
@if let Some(error) = &state.login_required_error {
|
|
<p class="error">@error</p>
|
|
}
|
|
<div class="columns">
|
|
<div class="columns--column"></div>
|
|
<div class="columns--column">
|
|
<h3>Require Login</h3>
|
|
<p>
|
|
Choose whether your profile is visible to everyone, or only logged-in users.
|
|
</p>
|
|
<div class="text-section">
|
|
<label for="require_login">
|
|
@if state.profile.login_required() {
|
|
<input
|
|
type="checkbox"
|
|
name="require_login"
|
|
checked
|
|
/>
|
|
} else {
|
|
<input
|
|
type="checkbox"
|
|
name="require_login"
|
|
/>
|
|
}
|
|
<span>Require Login</span>
|
|
</label>
|
|
</div>
|
|
<div class="button-section">
|
|
@:button_group(&[&Button::primary("Save").dark(true)])
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</form>
|
|
})
|
|
})
|
|
@:card(&Card::full_width().classes(&["account-page"]).dark(true), {
|
|
@:card_title({ Danger })
|
|
@:card_body({
|
|
@:button_group(&[
|
|
Button::primary_outline("Delete Profile").href("/profiles/delete").dark(true),
|
|
])
|
|
})
|
|
})
|
|
})
|