Render allies in template

Author: sdelquin

apps/about/models.py

@@ -10,3 +10,9 @@ class Ally(models.Model):
     url = models.URLField(blank=True)
     twitter = models.URLField(blank=True)
     email = models.EmailField(blank=True)
+
+    def __str__(self):
+        return self.name
+
+    class Meta:
+        ordering = ['name']

apps/about/static/about/css/allies.scss

@@ -0,0 +1,21 @@
+.ally-block {
+  margin-bottom: 2rem;
+  img {
+    width: 5rem;
+    vertical-align: middle;
+  }
+  p.description {
+    i.quote {
+      color: gray;
+    }
+  }
+  ul {
+    list-style-type: none;
+    margin-left: 1rem;
+    padding-left: 1rem;
+    border-left: 2px solid lightgray;
+    i {
+      width: 1.5rem;
+    }
+  }
+}

apps/about/static/about/css/main.scss

@@ -1,9 +1,11 @@
 @import 'apps/commons/static/commons/css/base';
 
+@import './allies';
+
 .about-index {
   p {
-    padding-top: .5rem;
-    padding-bottom: .5rem;
+    padding-top: 0.5rem;
+    padding-bottom: 0.5rem;
   }
 
   .message a.headerlink {

apps/about/templates/about/allies.html

@@ -0,0 +1,37 @@
+{% extends "about/base.html" %}
+{% load utils %}
+{% load static %}
+
+{% block title %}Aliados - {{ block.super }}{% endblock %}
+
+{% block content %}
+
+<div class="content box">
+
+<h1>Aliados</h1>
+
+<p>
+Canarias es un territorio muy prolífico en el campo de las nuevas tecnologías. Las organizaciones y asociaciones de este sector constituyen un punto de entrada para muchos usuarios y usuarias. Aquello de que la unión hace la fuerza es un principio que seguimos desde Python Canarias. Si bien apostamos, como era de esperar, por nuestro lenguaje de programación favorito, somos una comunidad abierta y nos encanta construir sinergias con otros grupos. Aquí les dejamos un listado de nuestros <b>aliados</b>:
+</p>
+
+{% for ally in allies %}
+  <div class="ally-block">
+    <h2><img src="{{ ally.logo.url }}"> {{ ally.name }}</h2>
+    <p class="description"><i class="fas fa-quote-left quote"></i> {{ ally.description }} <i class="fas fa-quote-right quote"></i></p>
+    <ul>
+      {% if ally.url %}
+        <li><i class="fas fa-home"></i> <a href="{{ ally.url }}">{{ ally.url }}</a></li>
+      {% endif %}
+      {% if ally.twitter %}
+        <li><i class="fab fa-twitter"></i> <a href="{{ ally.twitter }}">{{ ally.twitter }}</a></li>
+      {% endif %}
+      {% if ally.email %}
+        <li><i class="far fa-envelope"></i> <a href="mailto:{{ ally.email }}">{{ ally.email }}</a></li>
+      {% endif %}
+    </ul>
+  </div>
+{% endfor %}
+
+</div>
+
+{% endblock content %}

apps/about/urls.py

@@ -9,4 +9,5 @@
     path('us/', views.us, name='us'),
     path('join/', views.join, name='join'),
     path('history/', views.history, name='history'),
+    path('allies/', views.allies, name='allies'),
 ]

apps/about/views.py

@@ -4,6 +4,8 @@
 
 from apps.members.models import Position
 
+from .models import Ally
+
 logger = logging.getLogger(__name__)
 
 
@@ -28,3 +30,8 @@ def join(request):
 
 def history(request):
     return render(request, 'about/history.html', {})
+
+
+def allies(request):
+    allies = Ally.objects.all()
+    return render(request, 'about/allies.html', {'allies': allies})

apps/commons/templates/header.html

@@ -24,6 +24,7 @@
               <a class="navbar-item {% is_active 'about:us' %}" href="{% url 'about:us' %}">Información</a>
               <a class="navbar-item {% is_active 'about:history' %}" href="{% url 'about:history' %}">Historia</a>
               <a class="navbar-item {% is_active 'about:join' %}" href="{% url 'about:join' %}">¡Únete!</a>
+              <a class="navbar-item {% is_active 'about:allies' %}" href="{% url 'about:allies' %}">Aliados</a>
           </div>
       </div>
       <div class="navbar-item has-dropdown is-hoverable">