heartles/fediglam
1
1
Fork 0
Code Issues 64 Pull requests Projects Releases Packages Wiki Activity

Use default avatar on signup page

Browse source
This commit is contained in:
jaina heartles 2022-12-10 02:23:40 -08:00
parent 0777ea83bb
commit bbbaa3f8b0
2 changed files with 56 additions and 31 deletions
Download patch file Download diff file Expand all files Collapse all files

17
src/main/controllers/web/signup.tmpl.html
View file

@ -10,14 +10,17 @@
<div> <div>
<div>You are about to accept an invite from:</div> <div>You are about to accept an invite from:</div>
<div class="user-mini"> <div class="user-mini">
<div> <img class="avatar" src="{$invite.creator.avatar_url}" />
{=#if $invite.creator.display_name |$name|=} <div class="details">
{$name} <div class="display_name">
{= #else =} {=#if $invite.creator.display_name |$name|=}
{$invite.creator.username} {$name}
{= /if =} {= #else =}
{$invite.creator.username}
{= /if =}
</div>
<div class="handle">@{$invite.creator.username}@{$invite.creator.host}</div>
</div> </div>
<div>@{$invite.creator.username}@{$invite.creator.host}</div>
</div> </div>
{#if @isTag($invite.kind, community_owner) =} {#if @isTag($invite.kind, community_owner) =}
<div>This act will make your new account the owner of { %community.name }</div> <div>This act will make your new account the owner of { %community.name }</div>

70
static/site.css
View file

@ -43,56 +43,78 @@ nav > ul > li.title > a {
main { main {
padding: 1em; padding: 1em;
overflow: scroll;
}
.user-mini {
display: flex;
margin: 0.5em 0px;
}
.user-mini .avatar {
max-width: 3em;
}
.user-mini .details {
margin: 5px;
}
.user-mini .handle {
font-size: small;
} }
form { form {
display: flex; display: flex;
flex-direction: column; flex-direction: column;
max-width: 400px; max-width: 400px;
}
.textinput {
display: inline-block;
padding: 6px;
border: solid 1px black;
border-radius: 8px;
/* max-width: 300px;*/
}
form {
padding: 1em; padding: 1em;
} }
form > * { form > * {
margin: 5px 0px; margin: 5px 0px;
} }
form .textinput {
form[action*=login] .textinput {
display: flex; display: flex;
padding: 6px;
border: solid 1px black;
border-radius: 8px;
outline: solid 2px transparent; outline: solid 2px transparent;
transition: outline 0.2s; transition: outline 0.2s;
} }
form[action*=login] .textinput input { form .textinput input {
flex-grow: 1; flex-grow: 1;
flex-basis: 3em;
width: 10px;
appearance: none;
border: none;
} }
form[action*=login] .textinput:focus-within { form .textinput input:focus-visible{
outline: none;
}
form .textinput:focus-within {
outline: solid 2px var(--theme-color); outline: solid 2px var(--theme-color);
} }
form[action*=login] .textinput span.prefix, form .textinput span.prefix {
form[action*=login] .textinput span.suffix {
user-select: none; user-select: none;
flex-basis: 1.5em; flex-basis: 1.5em;
text-align: center; text-align: center;
} }
.textinput > input { form .textinput span.suffix {
appearance: none; user-select: none;
border: none; flex-basis: 3em;
} flex-grow: 1;
.textinput > input:focus-visible{ max-width: min-content;
outline: none; text-overflow: ellipsis;
overflow: hidden;
white-space: nowrap;
} }
.form-helpinfo { @media (max-width: 360px) {
form .textinput span.suffix {
display: none;
}
}
form .form-helpinfo {
font-size: small; font-size: small;
} }