Identity profile menus

This commit is contained in:
Michael Manfre 2022-12-30 03:01:03 -05:00 committed by GitHub
parent 6a1caae79b
commit 0250f2800b
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
8 changed files with 121 additions and 30 deletions

View file

@ -285,6 +285,11 @@ header menu a.identity i {
padding: 0 7px 2px 0; padding: 0 7px 2px 0;
} }
header menu a.identity a.view-profile {
display: inline-block;
margin-right: 20px;
}
header menu a img { header menu a img {
display: inline-block; display: inline-block;
vertical-align: middle; vertical-align: middle;
@ -592,26 +597,85 @@ form.inline {
padding: 0; padding: 0;
} }
form.follow-profile { div.follow-profile {
float: right; float: right;
margin: 20px 0 0 0; margin: 20px 0 0 0;
font-size: 16px; font-size: 16px;
text-align: center; text-align: center;
} }
form.follow-profile.has-reverse { div.follow-profile.has-reverse {
margin-top: 0; margin-top: 0;
} }
form.follow-profile .reverse-follow { div.follow-profile .reverse-follow {
display: block; display: block;
margin: 0 0 5px 0; margin: 0 0 5px 0;
} }
form.follow-profile button { div.follow-profile button,
div.follow-profile .button {
margin: 0; margin: 0;
} }
div.follow-profile .actions {
/* display: flex; */
position: relative;
justify-content: space-between;
/* padding: 8px 0 0 0; */
align-items: center;
align-content: center;
}
div.follow-profile .actions a {
border-radius: 4px;
min-width: 40px;
text-align: center;
cursor: pointer;
}
div.follow-profile .actions menu {
display: none;
background-color: var(--color-bg-menu);
border-radius: 5px;
box-shadow: 0 0 10px rgba(0, 0, 0, 0.5);
position: absolute;
right: 0;
top: 43px;
}
div.follow-profile .actions menu.enabled {
display: block;
min-width: 160px;
z-index: 10;
}
div.follow-profile .actions menu a {
text-align: left;
display: block;
font-size: 15px;
padding: 4px 10px;
color: var(--color-text-dull);
}
div.follow-profile .actions menu a i {
margin-right: 4px;
width: 16px;
}
div.follow-profile .actions a:hover {
color: var(--color-text-main);
}
div.follow-profile .actions a.active {
color: var(--color-highlight);
}
form.inline-menu {
margin: 0px;
display:inline;
}
form.follow { form.follow {
display: inline; display: inline;
} }
@ -1166,6 +1230,8 @@ table.metadata td .emoji {
/* Fixes a bit of extra padding on the bottom of the link. */ /* Fixes a bit of extra padding on the bottom of the link. */
} }
/* Posts */ /* Posts */
.post { .post {

View file

@ -186,7 +186,7 @@ urlpatterns = [
path("auth/reset/<token>/", auth.PerformReset.as_view(), name="password_reset"), path("auth/reset/<token>/", auth.PerformReset.as_view(), name="password_reset"),
# Identity selection # Identity selection
path("@<handle>/activate/", identity.ActivateIdentity.as_view()), path("@<handle>/activate/", identity.ActivateIdentity.as_view()),
path("identity/select/", identity.SelectIdentity.as_view()), path("identity/select/", identity.SelectIdentity.as_view(), name="identity_select"),
path("identity/create/", identity.CreateIdentity.as_view()), path("identity/create/", identity.CreateIdentity.as_view()),
# Flat pages # Flat pages
path("about/", core.About.as_view(), name="about"), path("about/", core.About.as_view(), name="about"),

View file

@ -36,6 +36,9 @@
<a href="{% url "settings" %}" {% if top_section == "settings" %}class="selected"{% endif %} title="Settings"> <a href="{% url "settings" %}" {% if top_section == "settings" %}class="selected"{% endif %} title="Settings">
<i class="fa-solid fa-gear"></i> Settings <i class="fa-solid fa-gear"></i> Settings
</a> </a>
<a href="{% url "identity_select" %}" title="Select Identity">
<i class="fa-solid fa-users-viewfinder"></i> Select Identity
</a>
{% else %} {% else %}
<a href="{% url "local" %}" {% if current_page == "local" %}class="selected"{% endif %} title="Local Posts"> <a href="{% url "local" %}" {% if current_page == "local" %}class="selected"{% endif %} title="Local Posts">
<i class="fa-solid fa-city"></i> Local Posts <i class="fa-solid fa-city"></i> Local Posts

View file

@ -55,7 +55,7 @@
</a> </a>
{% endif %} {% endif %}
<div class="gap"></div> <div class="gap"></div>
<a href="/identity/select/" role="menuitem" class="identity"> <a href="{{ request.identity.urls.view }}" role="menuitem" class="identity">
{% if not request.identity %} {% if not request.identity %}
No Identity No Identity
<img src="{% static "img/unknown-icon-128.png" %}" title="No identity selected"> <img src="{% static "img/unknown-icon-128.png" %}" title="No identity selected">

View file

@ -1,6 +1,6 @@
<nav> <nav>
<a href="/identity/select/" {% if identities %}class="selected"{% endif %} title="Select Identity"> <a href="/identity/select/" {% if identities %}class="selected"{% endif %} title="Select Identity">
<i class="fa-solid fa-user"></i> Select Identity <i class="fa-solid fa-users-viewfinder"></i> Select Identity
</a> </a>
<a href="/identity/create/" {% if form %}class="selected"{% endif %} title="Create Identity"> <a href="/identity/create/" {% if form %}class="selected"{% endif %} title="Create Identity">
<i class="fa-solid fa-plus"></i> Create Identity <i class="fa-solid fa-plus"></i> Create Identity

View file

@ -0,0 +1,43 @@
<div class="inline follow-profile {% if reverse_follow %}has-reverse{% endif %}">
<div class="actions" role="menubar">
{% if request.identity == identity %}
<a href="{% url "settings_profile" %}" class="button" title="Edit Profile">
<i class="fa-solid fa-user-edit"></i>
</a>
{% else %}
{% if reverse_follow %}
<span class="reverse-follow">Follows You</span>
{% endif %}
<form action="{{ identity.urls.action }}" method="POST" class="inline-menu">
{% csrf_token %}
{% if follow %}
<input type="hidden" name="action" value="unfollow">
<button class="destructive" title="Unfollow"><i class="fa-solid fa-user-minus"></i>
{% if follow.pending %}Follow Pending{% else %}Unfollow{% endif %}
</button>
{% else %}
<input type="hidden" name="action" value="follow">
<button><i class="fa-solid fa-user-plus"></i> Follow</button>
{% endif %}
</form>
{% endif %}
{% if request.user.admin %}
<a title="Menu" class="menu button" _="on click toggle .enabled on the next <menu/> then halt" aria-haspopup="menu">
<i class="fa-solid fa-bars"></i>
</a>
<menu>
{% if request.user.admin %}
<a href="{{ identity.urls.admin_edit }}" role="menuitem">
<i class="fa-solid fa-user-gear"></i> View in Admin
</a>
<a href="{{ identity.urls.djadmin_edit }}" role="menuitem">
<i class="fa-solid fa-gear"></i> View in djadmin
</a>
{% endif %}
</menu>
{% endif %}
</div>
</div>

View file

@ -22,29 +22,7 @@
<img src="{{ identity.local_icon_url.relative }}" class="icon"> <img src="{{ identity.local_icon_url.relative }}" class="icon">
{% if request.identity %} {% if request.identity %}{% include "identity/_view_menu.html" %}{% endif %}
{% if identity == request.identity %}
<form class="inline follow-profile">
<a class="button" href="{% url "settings_profile" %}">Edit Profile</a>
</form>
{% else %}
<form action="{{ identity.urls.action }}" method="POST" class="inline follow-profile {% if reverse_follow %}has-reverse{% endif %}">
{% csrf_token %}
{% if reverse_follow %}
<span class="reverse-follow">Follows You</span>
{% endif %}
{% if follow %}
<input type="hidden" name="action" value="unfollow">
<button class="destructive">
{% if follow.pending %}Follow Pending{% else %}Unfollow{% endif %}
</button>
{% else %}
<input type="hidden" name="action" value="follow">
<button>Follow</button>
{% endif %}
</form>
{% endif %}
{% endif %}
{{ identity.html_name_or_handle }} {{ identity.html_name_or_handle }}
<small> <small>

View file

@ -232,6 +232,7 @@ class Identity(StatorModel):
activate = "{view}activate/" activate = "{view}activate/"
admin = "/admin/identities/" admin = "/admin/identities/"
admin_edit = "{admin}{self.pk}/" admin_edit = "{admin}{self.pk}/"
djadmin_edit = "/djadmin/users/identity/{self.id}/change/"
def get_scheme(self, url): def get_scheme(self, url):
return "https" return "https"