hw-2 fix

- На лого слева вверху добавлена ссылка на главную
- Добавлен механизм отображения вопросов по тегу
- Теперь теги берутся из списка в контроллере
- Теперь при нажатии на тег открывается страница вопросов по тегу
- Добавлена страница hot questions
- При нажатии на название вопроса теперь открывается страница вопроса
- Улучшена пагинация

questions/static/core/css/style.css

@@ -204,6 +204,10 @@ a:hover {
     box-shadow: 0.25rem 0.25rem 0 rgba(31, 45, 58, 0.08);
 }
 
+.not-underlined {
+  text-decoration: none;
+}
+
 .sidebar h2 {
     margin: 0 0 0.5rem;
     font-size: 1.25rem;
@@ -307,6 +311,21 @@ a:hover {
     margin-top: 0.4rem;
 }
 
+.current-tag {
+    display: inline-block;
+    border: 0.125rem solid #1f2d3a;
+    background: #f2f7f7;
+    padding: 0.25rem 0.6rem;
+    margin-bottom: 0.6rem;
+    font-size: 0.85rem;
+    box-shadow: 0.2rem 0.2rem 0 rgba(31, 45, 58, 0.08);
+}
+
+.current-tag span {
+    color: #1d57d4;
+    font-weight: 700;
+}
+
 .footer {
     border-top: 0.125rem solid #1f2d3a;
     padding: 0.6rem 1.1rem;

questions/templates/core/base.html

@@ -1,140 +0,0 @@
-<!DOCTYPE html>
-<html>
-<head>
-    <meta charset="utf-8">
-    <title>VkDesk | Fresh Questions</title>
-    <meta name="description" content="VkDesk Q&A">
-    <link rel="stylesheet" href="../../static/core/css/style.css">
-</head>
-<body>
-    <header class="site-header">
-        <div class="logo">VkDesk</div>
-        <form class="search">
-            <input type="text" placeholder="Search">
-            <a class="button button--ask" href="index">ASK IT</a>
-        </form>
-        <div class="user-block">
-            <div class="avatar-box small">avatar</div>
-            <div class="user-links">
-                <div class="user-name">Dr. Pepper</div>
-                <div>
-                    <a href="profile">settings</a>
-                    <a href="login">log out</a>
-                </div>
-            </div>
-        </div>
-    </header>
-
-    <div class="content">
-        <main>
-            <div class="main-title">
-                <h1>Fresh Questions</h1>
-                <a href="#">Top Today</a>
-            </div>
-
-            <article class="card">
-                <div>
-                    <div class="avatar-box">avatar</div>
-                    <div class="vote-box">
-                        <span>5</span>
-                        <span class="vote-arrows">^<span>'</span></span>
-                    </div>
-                </div>
-                <div>
-                    <a class="question-title" href="question.html">How to build a moon park ?</a>
-                    <p>Guys, i have trouble with a moon park. Cant find the black-jack...</p>
-                    <div class="meta">
-                        <a href="question.html">answer (3)</a>
-                        <span>Tags:</span>
-                        <a class="tag" href="#">black-jack</a>
-                        <a class="tag" href="#">bender</a>
-                    </div>
-                </div>
-            </article>
-
-            <article class="card">
-                <div>
-                    <div class="avatar-box">avatar</div>
-                    <div class="vote-box">
-                        <span>5</span>
-                        <span class="vote-arrows">^<span>'</span></span>
-                    </div>
-                </div>
-                <div>
-                    <a class="question-title" href="question">How to build a moon park ?</a>
-                    <p>Guys, i have trouble with a moon park. Can't find the black-jack...</p>
-                    <div class="meta">
-                        <a href="question">answer (3)</a>
-                        <span>Tags:</span>
-                        <a class="tag" href="#">black-jack</a>
-                        <a class="tag" href="#">bender</a>
-                    </div>
-                </div>
-            </article>
-
-            <article class="card">
-                <div>
-                    <div class="avatar-box">avatar</div>
-                    <div class="vote-box">
-                        <span>5</span>
-                        <span class="vote-arrows">^<span>'</span></span>
-                    </div>
-                </div>
-                <div>
-                    <a class="question-title" href="question.html">How to build a moon park ?</a>
-                    <p>Guys, i have trouble with a moon park. Can't find the black-jack...</p>
-                    <div class="meta">
-                        <a href="question.html">answer (3)</a>
-                        <span>Tags:</span>
-                        <a class="tag" href="#">black-jack</a>
-                        <a class="tag" href="#">bender</a>
-                    </div>
-                </div>
-            </article>
-
-            <nav class="pagination">
-                <a class="page-link" href="#">1</a>
-                <a class="page-link" href="#">2</a>
-                <a class="page-link" href="#">3</a>
-                <span class="page-link">...</span>
-                <a class="page-link" href="#">53</a>
-            </nav>
-        </main>
-
-        <aside class="sidebar">
-            <div class="sidebar-section">
-                <h2>Trending Tags</h2>
-                <div class="tag-cloud">
-                    <span>perl</span>
-                    <span class="tag-red">c++</span>
-                    <span>TechnoPark</span>
-                    <span class="tag-red">RUST</span>
-                    <span class="tag-green">django</span>
-                    <span>Mail.Ru</span>
-                    <span>Java</span>
-                    <span class="tag-orange">TS</span>
-                </div>
-            </div>
-
-            <div class="sidebar-section">
-                <h2>Top Members</h2>
-                <div class="member-list">
-                    <a href="#">Mr. Freeman</a>
-                    <a href="#">Dr. House</a>
-                    <a href="#">Bender</a>
-                    <a href="#">Queen Victoria</a>
-                    <a href="#">V. Pupkin</a>
-                </div>
-            </div>
-        </aside>
-    </div>
-
-    <footer class="footer">2026</footer>
-</body>
-</html>
-
-
-
-
-
-

questions/templates/core/hot.html

@@ -0,0 +1,16 @@
+{% extends 'core/layout/base.html' %}
+{% load static %}
+
+{% block content %}
+<div class="main-title">
+    <h1>Hot Questions</h1>
+    <a href="/">All questions</a>
+</div>
+
+{% for question in hot_questions %}
+{% include 'core/partials/question.html' %}
+{% endfor %}
+{% include 'core/partials/pagination.html' %}
+
+
+{% endblock %}

questions/templates/core/index.html

@@ -3,10 +3,15 @@
 
 {% block content %}
 <div class="main-title">
-    <h1>Fresh Questions</h1>
+    <h1>All Questions</h1>
-    <a href="#">Top Today</a>
+    <a href="/hot">Hot questions</a>
 </div>
 
+{% if tag %}
+<div class="current-tag">
+    Текущий тег: <span>#{{ tag }}</span>
+</div>
+{% endif %}
 {% for question in questions %}
 {% include 'core/partials/question.html' %}
 {% endfor %}

questions/templates/core/layout/base.html

@@ -9,7 +9,7 @@
 </head>
 <body>
     <header class="site-header">
-        <div class="logo">VkDesk</div>
+        <a href="/" class="logo not-underlined">VkDesk</a>
         <form class="search">
             <input type="text" placeholder="Search">
             <a class="button button--ask" href="ask">ASK IT</a>
@@ -34,14 +34,9 @@
             <div class="sidebar-section">
                 <h2>Trending Tags</h2>
                 <div class="tag-cloud">
-                    <span>perl</span>
+                    {% for tag in tags %}
-                    <span class="tag-red">python</span>
+                    <a href="/?tag={{ tag }}" class="not-underlined">{{tag}}</a>
-                    <span>TechnoPark</span>
+                    {% endfor %}
-                    <span class="tag-red">MySQL</span>
-                    <span class="tag-green">django</span>
-                    <span>Mail.Ru</span>
-                    <span>Voloshin</span>
-                    <span class="tag-orange">Firefox</span>
                 </div>
             </div>
 

questions/templates/core/partials/pagination.html

@@ -1,9 +1,13 @@
 <nav class="pagination">
+{% if page_obj.paginator.num_pages > 1 %}
     {% if page_obj.has_previous %}
     <a class="page-link" href="?page={{ page_obj.previous_page_number }}">Previous</a>
     {% endif %}
+
     <a class="page-link" href="#">{{ page_obj.number }}</a>
+
     {% if page_obj.has_next %}
         <a class="page-link" href="?page={{ page_obj.next_page_number }}">Next</a>
     {% endif %}
+{% endif %}
 </nav>

questions/templates/core/partials/question.html

@@ -8,13 +8,14 @@
         </div>
     </div>
     <div>
-        <p class="question-title" href="question">{{ question.title }}</p>
+        <a class="question-title" href="question">{{ question.title }}</a>
         <p>{{ question.text }}</p>
         <div class="meta">
             <a href="question">answer (3)</a>
             <span>Tags:</span>
-            <a class="tag" href="#">black-jack</a>
+            {% for tag in question.tags %}
-            <a class="tag" href="#">bender</a>
+            <a class="tag" href="/?tag={{ tag }}">{{ tag }}</a>
+            {% endfor %}
         </div>
     </div>
 </article>

questions/urls.py

@@ -9,4 +9,5 @@ urlpatterns = [
     path('profile', views.profile, name='profile'),
     path('question', views.question, name='question'),
     path('signup', views.signup, name='signup'),
+    path('hot', views.hot, name='hot'),
 ]

questions/views.py

@@ -7,32 +7,43 @@ QUESTIONS = [
         "id": i,
         "title": f'Question number {i}',
         "text": f'Some text {i}',
+        "tags": ["python"],
     }
     for i in range(10)
 ]
 
+HOT_QUESTIONS = QUESTIONS[:4]
+
+TAGS = {tag for q in QUESTIONS for tag in q["tags"]}
+
 def index(request):
+    tag = request.GET.get('tag', '')
     try:
         page_number = int(request.GET.get('page', 1))
     except ValueError:
         page_number = 1
-    page = Paginator(QUESTIONS, 4)
+    page = Paginator(QUESTIONS if tag == ''
+                     else [ cur_question for cur_question in QUESTIONS if tag in cur_question['tags']], 4)
     page_obj = page.page(page_number)
-    return render(request, 'core/index.html', context={'questions': page_obj.object_list, 'page_obj': page_obj})
 
+    return render(request, 'core/index.html', context={'questions': page_obj.object_list,
+                                                       'hot_questions': HOT_QUESTIONS, 'page_obj': page_obj, 'tags': TAGS,
+                                                       'tag': tag})
 
 def ask(request):
-    return render(request, 'core/ask.html', context={'questions': QUESTIONS})
+    return render(request, 'core/ask.html', context={'questions': QUESTIONS, 'tags': TAGS})
-
+def hot(request):
+    return render(request, 'core/hot.html', context={'questions': QUESTIONS, 'tags': TAGS,
+                                                     'hot_questions': HOT_QUESTIONS,})
 
 def login(request):
-    return render(request, 'core/login.html', context={'questions': QUESTIONS})
+    return render(request, 'core/login.html', context={'questions': QUESTIONS, 'tags': TAGS})
 
 def profile(request):
-    return render(request, 'core/profile.html', context={'questions': QUESTIONS})
+    return render(request, 'core/profile.html', context={'questions': QUESTIONS, 'tags': TAGS})
 
 def question(request):
-    return render(request, 'core/question.html', context={'questions': QUESTIONS})
+    return render(request, 'core/question.html', context={'questions': QUESTIONS, 'tags': TAGS})
 
 def signup(request):
-    return render(request, 'core/signup.html', context={'questions': QUESTIONS})
+    return render(request, 'core/signup.html', context={'questions': QUESTIONS, 'tags': TAGS})