User profile page styles

This commit is contained in:
Mouse Reeve 2020-09-29 13:39:44 -07:00
parent c7520b5279
commit 37a0ec0ba3
6 changed files with 67 additions and 55 deletions

View file

@ -10,11 +10,11 @@
{% if request.user.is_authenticated %} {% if request.user.is_authenticated %}
<div class="level-right"> <div class="level-right">
<a href="{{ book.id }}/edit">edit <a href="{{ book.id }}/edit">edit
<span class="icon icon-pencil"> <span class="icon icon-pencil">
<span class="hidden-text">Edit Book</span> <span class="hidden-text">Edit Book</span>
</span> </span>
</a> </a>
</div> </div>
{% endif %} {% endif %}
</div> </div>

View file

@ -3,18 +3,20 @@
{% block content %} {% block content %}
{% include 'user_header.html' with user=user %} {% include 'user_header.html' with user=user %}
<div class="content-container"> <div class="block">
<h2>Followers</h2> <h2 class="title">Followers</h2>
{% for followers in followers %} {% for followers in followers %}
<div class="row shrink"> <div class="block">
<div> <div class="field is-grouped">
{% include 'snippets/avatar.html' with user=followers %} <div class="control">
</div> {% include 'snippets/avatar.html' with user=followers %}
<div> </div>
{% include 'snippets/username.html' with user=followers show_full=True %} <div class="control">
</div> {% include 'snippets/username.html' with user=followers show_full=True %}
<div> </div>
{% include 'snippets/follow_button.html' with user=followers %} <div class="control">
{% include 'snippets/follow_button.html' with user=followers %}
</div>
</div> </div>
</div> </div>
{% endfor %} {% endfor %}

View file

@ -3,18 +3,20 @@
{% block content %} {% block content %}
{% include 'user_header.html' %} {% include 'user_header.html' %}
<div class="content-container"> <div class="block">
<h2>Following</h2> <h2 class="title">Following</h2>
{% for follower in user.following.all %} {% for follower in user.following.all %}
<div class="row shrink"> <div class="block">
<div> <div class="field is-grouped">
{% include 'snippets/avatar.html' with user=follower %} <div class="control">
</div> {% include 'snippets/avatar.html' with user=follower %}
<div> </div>
{% include 'snippets/username.html' with user=follower show_full=True %} <div class="control">
</div> {% include 'snippets/username.html' with user=follower show_full=True %}
<div> </div>
{% include 'snippets/follow_button.html' with user=follower %} <div class="control">
{% include 'snippets/follow_button.html' with user=follower %}
</div>
</div> </div>
</div> </div>
{% endfor %} {% endfor %}

View file

@ -11,14 +11,14 @@ Follow request already sent.
{% csrf_token %} {% csrf_token %}
<input type="hidden" name="user" value="{{ user.username }}"> <input type="hidden" name="user" value="{{ user.username }}">
{% if user.manually_approves_followers %} {% if user.manually_approves_followers %}
<button type="submit">Send follow request</button> <button class="button is-small" type="submit">Send follow request</button>
{% else %} {% else %}
<button type="submit">Follow</button> <button class="button is-small" type="submit">Follow</button>
{% endif %} {% endif %}
</form> </form>
<form action="/unfollow/" method="POST" onsubmit="interact(event)" class="follow-{{ user.id }} {% if not request.user in user.followers.all %}hidden{%endif %}" data-id="follow-{{ user.id }}"> <form action="/unfollow/" method="POST" onsubmit="interact(event)" class="follow-{{ user.id }} {% if not request.user in user.followers.all %}hidden{%endif %}" data-id="follow-{{ user.id }}">
{% csrf_token %} {% csrf_token %}
<input type="hidden" name="user" value="{{ user.username }}"> <input type="hidden" name="user" value="{{ user.username }}">
<button type="submit">Unfollow</button> <button class="button is-small" type="submit">Unfollow</button>
</form> </form>
{% endif %} {% endif %}

View file

@ -3,11 +3,11 @@
<form action="/accept_follow_request/" method="POST"> <form action="/accept_follow_request/" method="POST">
{% csrf_token %} {% csrf_token %}
<input type="hidden" name="user" value="{{ user.username }}"> <input type="hidden" name="user" value="{{ user.username }}">
<button type="submit">Accept</button> <button class="button is-small" type="submit">Accept</button>
</form> </form>
<form action="/delete_follow_request/" method="POST"> <form action="/delete_follow_request/" method="POST">
{% csrf_token %} {% csrf_token %}
<input type="hidden" name="user" value="{{ user.username }}"> <input type="hidden" name="user" value="{{ user.username }}">
<button type="submit" class="warning">Delete</button> <button class="button is-small" type="submit" class="warning">Delete</button>
</form> </form>
{% endif %} {% endif %}

View file

@ -1,33 +1,41 @@
{% load humanize %} {% load humanize %}
{% load fr_display %} {% load fr_display %}
<div class="content-container user-profile"> <div class="block">
<h2>User Profile <div class="level">
{% if is_self %} <h2 class="title">User Profile</h2>
<a href="/user-edit/" class="edit-link">edit {% if is_self %}
<span class="icon icon-pencil"> <div class="level-right">
<span class="hidden-text">Edit profile</span> <a href="/user-edit/" class="edit-link">edit
</span> <span class="icon icon-pencil">
</a> <span class="hidden-text">Edit profile</span>
</span>
</a>
</div>
{% endif %} {% endif %}
</h2> </div>
<div class="row"> <div class="columns">
<div class="pic-container"> <div class="column is-narrow">
{% include 'snippets/avatar.html' with user=user large=True %} <div class="media">
<div class="media-left">
{% include 'snippets/avatar.html' with user=user large=True %}
</div>
<div class="media-content">
<p>{% if user.name %}{{ user.name }}{% else %}{{ user.localname }}{% endif %}</p>
<p>{{ user.username }}</p>
<p>Joined {{ user.created_date | naturaltime }}</p>
<p>
<a href="/user/{{ user|username }}/followers">{{ user.followers.count }} follower{{ user.followers.count | pluralize }}</a>,
<a href="/user/{{ user|username }}/following">{{ user.following.count }} following</a></p>
</div>
</div>
</div> </div>
<div> <div class="column">
<p>{% if user.name %}{{ user.name }}{% else %}{{ user.localname }}{% endif %}</p> {% if user.summary %}
<p>{{ user.username }}</p> <blockquote><span class="icon icon-quote-open"></span>{{ user.summary | safe }}</blockquote>
<p>Joined {{ user.created_date | naturaltime }}</p> {% endif %}
<p>
<a href="/user/{{ user|username }}/followers">{{ user.followers.count }} follower{{ user.followers.count | pluralize }}</a>,
<a href="/user/{{ user|username }}/following">{{ user.following.count }} following</a></p>
</div> </div>
{% if user.summary %}
<blockquote><span class="icon icon-quote-open"></span>{{ user.summary | safe }}</blockquote>
{% endif %}
</div> </div>
{% if not is_self %} {% if not is_self %}
{% include 'snippets/follow_button.html' with user=user %} {% include 'snippets/follow_button.html' with user=user %}