-
- {=#if $invite.creator.display_name |$name|=}
- {$name}
- {= #else =}
- {$invite.creator.username}
- {= /if =}
+
+
+
+ {=#if $invite.creator.display_name |$name|=}
+ {$name}
+ {= #else =}
+ {$invite.creator.username}
+ {= /if =}
+
+
@{$invite.creator.username}@{$invite.creator.host}
-
@{$invite.creator.username}@{$invite.creator.host}
{#if @isTag($invite.kind, community_owner) =}
This act will make your new account the owner of { %community.name }
diff --git a/static/site.css b/static/site.css
index 2eff495..482d889 100644
--- a/static/site.css
+++ b/static/site.css
@@ -43,56 +43,78 @@ nav > ul > li.title > a {
main {
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 {
display: flex;
flex-direction: column;
max-width: 400px;
-}
-.textinput {
- display: inline-block;
- padding: 6px;
- border: solid 1px black;
- border-radius: 8px;
-/* max-width: 300px;*/
-}
-
-form {
padding: 1em;
}
-
form > * {
margin: 5px 0px;
}
-
-form[action*=login] .textinput {
+form .textinput {
display: flex;
+ padding: 6px;
+ border: solid 1px black;
+ border-radius: 8px;
outline: solid 2px transparent;
transition: outline 0.2s;
}
-form[action*=login] .textinput input {
+form .textinput input {
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);
}
-form[action*=login] .textinput span.prefix,
-form[action*=login] .textinput span.suffix {
+form .textinput span.prefix {
user-select: none;
flex-basis: 1.5em;
text-align: center;
}
-.textinput > input {
- appearance: none;
- border: none;
-}
-.textinput > input:focus-visible{
- outline: none;
+form .textinput span.suffix {
+ user-select: none;
+ flex-basis: 3em;
+ flex-grow: 1;
+ max-width: min-content;
+ 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;
}