Revamp the welcome screen for a hopefully final iteration

This commit is contained in:
Jonas Schäfer
2021-01-28 18:47:09 +01:00
parent 6235231db5
commit 205b0173a7
6 changed files with 103 additions and 78 deletions

View File

@@ -385,6 +385,13 @@ div.form.layout-expanded {
}
}
div.avatar-wrap {
> .avatar {
margin: 0;
margin-right: $w-0;
}
}
textarea {
width: 100%;
border: none;
@@ -848,13 +855,19 @@ ul.inline {
/* welcome screen specials */
#home main {
> h1, > p {
text-align: center;
}
}
nav.welcome {
> ul {
display: flex;
flex-wrap: wrap;
list-style-type: none;
justify-content: center;
padding: 0;
justify-content: center;
> li {
@extend .el-3;
@@ -872,7 +885,6 @@ nav.welcome {
&.wide {
flex: 1 0 auto;
text-align: left;
display: block;
}
@@ -900,6 +912,7 @@ div.profile-card {
display: flex;
flex-direction: row;
margin: $w-l1 0;
text-align: left;
> div.picture {
flex: 0 0 auto;

View File

@@ -127,4 +127,9 @@ licensed under the terms of the Apache 2.0 License -->
<path d="M0 0h24v24H0V0z" fill="none" />
<path d="M3 17.46v3.04c0 .28.22.5.5.5h3.04c.13 0 .26-.05.35-.15L17.81 9.94l-3.75-3.75L3.15 17.1c-.1.1-.15.22-.15.36zM20.71 7.04c.39-.39.39-1.02 0-1.41l-2.34-2.34c-.39-.39-1.02-.39-1.41 0l-1.83 1.83 3.75 3.75 1.83-1.83z" />
</symbol>
<!-- from: action/admin_panel_settings/materialiconsround/24px.svg -->
<symbol id="icon-admin" viewBox="0 0 24 24">
<g><rect fill="none" height="24" width="24" /><rect fill="none" height="24" width="24" /></g>
<g><g><path d="M17,11c0.34,0,0.67,0.04,1,0.09V7.58c0-0.8-0.47-1.52-1.2-1.83l-5.5-2.4c-0.51-0.22-1.09-0.22-1.6,0l-5.5,2.4 C3.47,6.07,3,6.79,3,7.58v3.6c0,4.54,3.2,8.79,7.5,9.82c0.55-0.13,1.08-0.32,1.6-0.55C11.41,19.47,11,18.28,11,17 C11,13.69,13.69,11,17,11z" /><path d="M17,13c-2.21,0-4,1.79-4,4c0,2.21,1.79,4,4,4s4-1.79,4-4C21,14.79,19.21,13,17,13z M17,14.38c0.62,0,1.12,0.51,1.12,1.12 s-0.51,1.12-1.12,1.12s-1.12-0.51-1.12-1.12S16.38,14.38,17,14.38z M17,19.75c-0.93,0-1.74-0.46-2.24-1.17 c0.05-0.72,1.51-1.08,2.24-1.08s2.19,0.36,2.24,1.08C18.74,19.29,17.93,19.75,17,19.75z" /></g></g>
</symbol>
</defs></svg>

Before

Width:  |  Height:  |  Size: 13 KiB

After

Width:  |  Height:  |  Size: 14 KiB

View File

@@ -1,8 +1,9 @@
{% extends "unauth.html" %}
{% from "library.j2" import avatar with context %}
{% from "library.j2" import standard_button %}
{% block head_lead %}
<title>{% trans %}Snikket Web Portal{% endtrans %}</title>
{% endblock %}
{% block topbar_right %}
{{- super() -}}
{% call standard_button("logout", url_for("user.logout"), class="tertiary") %}{% trans %}Log out{% endtrans %}{% endcall %}
{%- endblock %}

View File

@@ -1,5 +1,6 @@
{% extends "app.html" %}
{% from "library.j2" import clipboard_button, standard_button %}
{% from "library.j2" import clipboard_button, standard_button, avatar with context %}
{% set body_id = "home" %}
{% block head_lead %}
{{ super() }}
{% include "copy-snippet.html" %}
@@ -10,7 +11,7 @@
<nav class="welcome">
<ul>
<li class="wide">
<h2>{% trans %}Your profile{% endtrans %}</h2>
<h2>{% trans %}Your account{% endtrans %}</h2>
<div class="profile-card">
<div class="picture" aria-label="Your profile picture">{% call avatar(user_info.address, user_info.avatar_hash ) %}{% endcall %}</div>
<div class="details">
@@ -27,31 +28,19 @@
{# <img aria-hidden="true" src="{{ url_for("static", filename="img/illus-profile.svg") }}"> #}
{#- -#}
<div>{% call standard_button("edit", url_for(".profile"), class="primary") %}{% trans %}Edit profile{% endtrans %}{% endcall %}</div>
{#- -#}
</li>
<li>
{#- -#}
<p>{% trans %}If need be, you can change your password here.{% endtrans %}</p>
{#- -#}
<div><a class="button primary" href="{{ url_for(".change_pw") }}">{% trans %}Change password{% endtrans %}</a></div>
<div>{% call standard_button("passwd", url_for(".change_pw"), class="secondary") %}{% trans %}Change password{% endtrans %}{% endcall %}</div>
{#- -#}
</li>
{% if user_info.is_admin %}
<li>
<h2>{% trans %}Your Snikket{% endtrans %}</h2>
{#- -#}
<p>{% trans %}Manage users, invitations and circles of your Snikket service.{% endtrans %}</p>
{#- -#}
<div><a class="button primary" href="{{ url_for("admin.index") }}">{% trans %}Admin panel{% endtrans %}</a></div>
<div>{% call standard_button("admin", url_for("admin.index"), class="primary") %}{% trans %}Admin panel{% endtrans %}{% endcall %}</div>
{#- -#}
</li>
{% endif %}
<li>
{#- -#}
<p>{% trans %}Exit the Snikket Web Portal, without logging out your other devices.{% endtrans %}</p>
{#- -#}
<div><a class="button secondary" href="{{ url_for(".logout") }}">{% trans %}Log out{% endtrans %}</a></div>
{#- -#}
</li>
</ul>
</nav>
{% endblock %}

View File

@@ -8,7 +8,7 @@ msgid ""
msgstr ""
"Project-Id-Version: PROJECT VERSION\n"
"Report-Msgid-Bugs-To: EMAIL@ADDRESS\n"
"POT-Creation-Date: 2021-01-27 17:16+0100\n"
"POT-Creation-Date: 2021-01-28 18:47+0100\n"
"PO-Revision-Date: YEAR-MO-DA HO:MI+ZONE\n"
"Last-Translator: FULL NAME <EMAIL@ADDRESS>\n"
"Language-Team: LANGUAGE <LL@li.org>\n"
@@ -190,7 +190,7 @@ msgstr ""
msgid "Profile visibility"
msgstr ""
#: snikket_web/templates/user_home.html:7 snikket_web/user.py:68
#: snikket_web/user.py:68
msgid "Update profile"
msgstr ""
@@ -264,7 +264,6 @@ msgid "Admin area"
msgstr ""
#: snikket_web/templates/admin_circles.html:4
#: snikket_web/templates/admin_home.html:11
msgid "Manage circles"
msgstr ""
@@ -394,11 +393,11 @@ msgstr ""
#: snikket_web/templates/admin_delete_user.html:19
#: snikket_web/templates/admin_edit_circle.html:43
#: snikket_web/templates/admin_edit_invite.html:45
#: snikket_web/templates/admin_edit_invite.html:49
#: snikket_web/templates/admin_reset_user_password.html:25
#: snikket_web/templates/user_logout.html:13
#: snikket_web/templates/user_passwd.html:30
#: snikket_web/templates/user_profile.html:25
#: snikket_web/templates/user_profile.html:28
msgid "Back"
msgstr ""
@@ -418,6 +417,7 @@ msgstr ""
#: snikket_web/templates/admin_edit_circle.html:19
#: snikket_web/templates/admin_edit_circle.html:35
#: snikket_web/templates/invite_success.html:15
#: snikket_web/templates/user_home.html:21
msgid "Copy address"
msgstr ""
@@ -481,17 +481,8 @@ msgstr ""
msgid "Link"
msgstr ""
#: snikket_web/templates/admin_edit_invite.html:18
msgid ""
"This invitation link can be used arbitrarily often, until it expires, is "
"revoked or a service-wide user limit is reached."
msgstr ""
#: snikket_web/templates/admin_edit_invite.html:18
msgid "This invitation link can only be used once and is then depleted."
msgstr ""
#: snikket_web/templates/admin_edit_invite.html:22
#: snikket_web/templates/admin_home.html:20
msgid "Circles"
msgstr ""
@@ -508,7 +499,16 @@ msgstr ""
msgid "The user will not be added to any circle and will have no contacts."
msgstr ""
#: snikket_web/templates/admin_edit_invite.html:39
#: snikket_web/templates/admin_edit_invite.html:40
msgid "Contact"
msgstr ""
#: snikket_web/templates/admin_edit_invite.html:41
#, python-format
msgid "The user will get added as contact of %(peer_jid)s."
msgstr ""
#: snikket_web/templates/admin_edit_invite.html:43
msgid "Created"
msgstr ""
@@ -543,36 +543,38 @@ msgstr ""
msgid "At your service, %(user_name)s."
msgstr ""
#: snikket_web/templates/admin_home.html:7
#: snikket_web/templates/admin_users.html:4
msgid "Manage users"
#: snikket_web/templates/admin_home.html:9
msgid "Create password reset links or delete users."
msgstr ""
#: snikket_web/templates/admin_home.html:8
msgid "Modify administrative user information or delete users."
#: snikket_web/templates/admin_home.html:13
msgid "Users"
msgstr ""
#: snikket_web/templates/admin_home.html:12
#: snikket_web/templates/admin_home.html:18
msgid "Create and manage social circles represented on your service."
msgstr ""
#: snikket_web/templates/admin_home.html:15
#: snikket_web/templates/admin_home.html:25
msgid "Create, revoke or copy invitations."
msgstr ""
#: snikket_web/templates/admin_home.html:27
msgid "Invitations"
msgstr ""
#: snikket_web/templates/admin_home.html:32
msgid "Go back to your users web portal page."
msgstr ""
#: snikket_web/templates/admin_home.html:34
msgid "Exit Admin Panel"
msgstr ""
#: snikket_web/templates/admin_invites.html:8
msgid "Manage invitations"
msgstr ""
#: snikket_web/templates/admin_home.html:16
msgid "Create, revoke or view invitations."
msgstr ""
#: snikket_web/templates/admin_home.html:19
msgid "Back to the main view"
msgstr ""
#: snikket_web/templates/admin_home.html:20
msgid "Go back to your users web portal page."
msgstr ""
#: snikket_web/templates/admin_invites.html:10
msgid "Pending invitations"
msgstr ""
@@ -612,6 +614,10 @@ msgstr ""
msgid "Destroy link"
msgstr ""
#: snikket_web/templates/admin_users.html:4
msgid "Manage users"
msgstr ""
#: snikket_web/templates/admin_users.html:25
#, python-format
msgid "Show debug information for %(user_name)s"
@@ -626,6 +632,10 @@ msgstr ""
msgid "Snikket Web Portal"
msgstr ""
#: snikket_web/templates/app.html:8
msgid "Log out"
msgstr ""
#: snikket_web/templates/backend_error.html:3
#: snikket_web/templates/exception.html:3
#: snikket_web/templates/internal_error.html:3
@@ -649,13 +659,13 @@ msgstr ""
msgid "The web portal encountered an internal error."
msgstr ""
#: snikket_web/templates/invite_invalid.html:4
#: snikket_web/templates/invite_invalid.html:5
#: snikket_web/templates/invite_view.html:12
#, python-format
msgid "Invite to %(site_name)s"
msgstr ""
#: snikket_web/templates/invite_invalid.html:5
#: snikket_web/templates/invite_invalid.html:6
#: snikket_web/templates/invite_register.html:10
#: snikket_web/templates/invite_success.html:11
#: snikket_web/templates/invite_view.html:13
@@ -663,11 +673,11 @@ msgstr ""
msgid "Powered by <img src=\"%(logo_url)s\" alt=\"Snikket\">"
msgstr ""
#: snikket_web/templates/invite_invalid.html:7
#: snikket_web/templates/invite_invalid.html:8
msgid "Invite expired"
msgstr ""
#: snikket_web/templates/invite_invalid.html:8
#: snikket_web/templates/invite_invalid.html:9
msgid "Sorry, it looks like this invitation link has expired!"
msgstr ""
@@ -870,6 +880,14 @@ msgstr ""
msgid "deleted"
msgstr ""
#: snikket_web/templates/library.j2:121
msgid "Can be used multiple times to create accounts on this Snikket service."
msgstr ""
#: snikket_web/templates/library.j2:123
msgid "Can be used once to create an account on this Snikket service."
msgstr ""
#: snikket_web/templates/login.html:5
msgid "Snikket Login"
msgstr ""
@@ -882,40 +900,38 @@ msgstr ""
msgid "Login failed"
msgstr ""
#: snikket_web/templates/user_home.html:3
#: snikket_web/templates/user_home.html:9
msgid "Welcome!"
msgstr ""
#: snikket_web/templates/user_home.html:4
#: snikket_web/templates/user_home.html:10
#, python-format
msgid "Welcome home, %(user_name)s."
msgstr ""
#: snikket_web/templates/user_home.html:8
msgid ""
"Change display name, set avatar and configure visibility of your personal"
" data to others."
#: snikket_web/templates/user_home.html:14
msgid "Your account"
msgstr ""
#: snikket_web/templates/user_home.html:11
#: snikket_web/templates/user_home.html:30
msgid "Edit profile"
msgstr ""
#: snikket_web/templates/user_home.html:31
#: snikket_web/templates/user_passwd.html:32
msgid "Change password"
msgstr ""
#: snikket_web/templates/user_home.html:15
msgid "Admin dashboard"
#: snikket_web/templates/user_home.html:36
msgid "Your Snikket"
msgstr ""
#: snikket_web/templates/user_home.html:16
msgid "Manage users and invitations of this Snikket service."
#: snikket_web/templates/user_home.html:38
msgid "Manage users, invitations and circles of your Snikket service."
msgstr ""
#: snikket_web/templates/user_home.html:20
msgid "Log out"
msgstr ""
#: snikket_web/templates/user_home.html:21
msgid "Exit the Snikket Web Portal, without logging out your other devices."
#: snikket_web/templates/user_home.html:40
msgid "Admin panel"
msgstr ""
#: snikket_web/templates/user_logout.html:8
@@ -949,11 +965,11 @@ msgstr ""
msgid "Profile"
msgstr ""
#: snikket_web/templates/user_profile.html:18
#: snikket_web/templates/user_profile.html:21
msgid "Visibility"
msgstr ""
#: snikket_web/templates/user_profile.html:19
#: snikket_web/templates/user_profile.html:22
msgid ""
"This section allows you to control who can see your profile information, "
"like avatar and nickname."

View File

@@ -23,3 +23,4 @@ social/person_add:add_user
social/person_remove:remove_user
navigation/close:close
image/edit:edit
action/admin_panel_settings:admin