Update some views

Author: Sergio-prog

blog/static/style.css

@@ -27,7 +27,6 @@
     margin: 10px 10px;
 }
 .auth-form {
-    margin: 10px;
     display: flex;
     flex-direction: column;
     align-items: center;
@@ -46,5 +45,26 @@
 }
 
 .blog-small-image {
-    max-width: 100px;
+    max-width: 150px;
+}
+
+.btn-index-form {
+    width: 160px;
+    height: 40px;
+    align-content: center;
+    font-size: 18px;
+    margin-top: 10px;
+}
+
+.product-item {
+    margin-bottom: 20px;
+    height: 100%;
+    display: flex;
+    flex-direction: column;
+}
+
+.product-item .panel-body {
+    flex: 1;
+    display: flex;
+    flex-direction: column;
 }

blog/templates/blog/navbar.html

@@ -25,6 +25,13 @@
                             <button class="btn btn-primary" type="button">Create new article</button>
                         </a>
                     </div>
+                    <div>
+                        <a href="{% url 'profile' user.id %}">
+                            <button class="btn btn-secondary" type="button" style="font-size: 16px">
+                                <i class="bi bi-person-fill"></i>
+                            </button>
+                        </a>
+                    </div>
                     <form class="d-flex" action="{% url 'logout' %}" method="post">
                         {% csrf_token %}
                         <!-- Используйте Bootstrap Icons -->

blog/templates/blog/profile.html

@@ -3,28 +3,26 @@
 {% block title %}Profile{% endblock %}
 
 {% block content %}
+{% include 'blog\navbar.html' %}
 
 <div class="index-form center-block">
-    <div class="product-item panel panel-default">
-        <div class="panel-body">
-            <div class="center-block" style="font-size: 35px">
-                <span class="glyphicon glyphicon-user"></span>
+    <div class="product-item card">
+        <div class="card-body">
+            <div class="d-flex justify-content-center" style="font-size: 55px">
+                <i class="bi bi-person-fill"></i>
             </div>
 
-            <p><b>Username</b>: {{ user.username }}</p>
-            <p><b>Email</b>: {{ user.email }}</p>
-            <p><b>Balance</b>: {{ user.balance }}$</p>
+            <p><b>Username</b>: {{ profile.username }}</p>
+            <p><b>Email</b>: {{ profile.email }}</p>
 
-            <form class="center-block" action="{% url 'password_change' %}" method="POST">
-                {% csrf_token %}
-                <button type="submit" class="btn btn-primary btn-index-form">Reset Password</button>
-            </form>
+            {% if profile.id == user.id %}
+                <form class="d-flex justify-content-center mt-4" action="{% url 'password_change' %}" method="POST">
+                    {% csrf_token %}
+                    <button type="submit" class="btn btn-primary btn-index-form">Reset Password</button>
+                </form>
+            {% endif %}
         </div>
     </div>
-
-    <a style="font-size: 30px;" href="{% url 'blog:index' %}">
-        <span class="glyphicon glyphicon-home"></span>
-    </a>
 </div>
 
 {% endblock %}

blog/templates/blog/write_article.html

@@ -6,7 +6,7 @@
 
 {% include 'blog\navbar.html' %}
 
-<div class="container mt-5 d-flex justify-content-center align-items-center full-height">
+<div class="container mt-10 d-flex justify-content-center align-items-center full-height">
     <form method="POST" class="w-50">
         {% csrf_token %}
 

blog/templates/registration/signup.html

@@ -7,17 +7,17 @@
   <h2><b>Sign up</b></h2>
   <form class="auth-form" method="post">
     {% csrf_token %}
-    <div class="form-group">
+    <div class="mt-3 mb-3">
       <div>
-        <label for="id_username">Username:</label>
+        <label class="form-label" for="id_username">Username:</label>
         <div class="helptext" id="id_username_helptext">Required. 150 characters or fewer. Letters, digits and @/./+/-/_ only.</div>
         <input style="width: 470px" class="form-control" type="text" name="username" autocapitalize="none" autocomplete="username" autofocus="" required="" aria-describedby="id_username_helptext" id="id_username">
       </div>
     </div>
 
-    <div class="form-group">
-      <div>
-        <label for="id_password1">Password:</label>
+    <div class="mt-3 mb-3">
+      <div style="max-width: 470px">
+        <label class="form-label" for="id_password1">Password:</label>
         <div class="helptext" id="id_password1_helptext">
           <ul>
             <li>Your password can’t be too similar to your other personal information.</li><li>Your password must contain at least 8 characters.</li>
@@ -28,17 +28,17 @@ <h2><b>Sign up</b></h2>
       </div>
     </div>
 
-    <div class="form-group">
+    <div class="mt-3 mb-3">
       <div>
-        <label for="id_password2">Password confirmation:</label>
+        <label class="form-label" for="id_password2">Password confirmation:</label>
         <div class="helptext" id="id_password2_helptext">Enter the same password as before, for verification.</div>
         <input style="width: 470px" class="form-control" type="password" name="password2" autocomplete="new-password" required="" aria-describedby="id_password2_helptext" id="id_password2">
       </div>
     </div>
 
-    <button class="btn btn-default btn-lg" type="submit">Sign Up</button>
+    <button class="btn btn-primary btn-lg mt-2" type="submit">Sign Up</button>
   </form>
 
-  <a style="margin-top: 20px" class="btn-sm btn-default" href="{% url 'index' %}">Back</a>
+  <a style="margin-top: 20px" class="btn btn-secondary" href="{% url 'index' %}">Back</a>
 </div>
 {% endblock %}

blog/views.py

@@ -1,7 +1,7 @@
 from django.contrib import messages
 from django.contrib.auth.decorators import permission_required, login_required
 from django.contrib.auth.forms import UserCreationForm
-from django.shortcuts import render
+from django.shortcuts import render, get_object_or_404
 from django.urls import reverse, reverse_lazy
 from django.views import generic
 from django.views.generic import CreateView
@@ -26,7 +26,8 @@ def index(request):
 
 # Not implemented yet
 def profile(request, id):
-    return render(request, "blog/index.html", {"articles": Article.objects.all()})
+    profile = get_object_or_404(BlogUser, id=id)
+    return render(request, "blog/profile.html", {"profile": profile})
 
 
 def get_article(request, link: str):  # TODO: Добавить проверку на method ендпоинта