Mag2024

article/models.py

@@ -699,8 +699,10 @@ def get_template(self, request):
         elif self.layout == 'magazine-2023':
             return "article/article_page_magazine_2023.html"
         elif self.layout == 'guide-2023':
-            return "article/article_page_guide_2023.html"        
-
+            return "article/article_page_guide_2023.html"
+        elif self.layout == 'magazine-2024':
+            return "article/article_page_magazine_2024.html"
+
         return "article/article_page.html"
 
     #-----For Wagtail's user interface-----
@@ -817,6 +819,7 @@ def get_template(self, request):
                             ('guide-2022', 'Guide (2022 style)'),
                             ('magazine-2023', 'Magazine (2023 style)'),
                             ('guide-2023', 'Guide (2023 style)'),
+                            ('magazine-2024', 'Magazine (2024 style)'),
                         ],
                     ),
                 ),

article/templates/article/article_page_magazine_2024.html

@@ -0,0 +1,160 @@
+{% extends 'ubyssey/base.html' %}
+
+{% comment %} {% extends 'specialfeaturelanding/guide/base.html' %} {% endcomment %}
+{% load static %}
+{% load wagtailcore_tags %}
+{% load wagtailimages_tags %}
+{% load wagtailuserbar %}
+{% load ubyssey_ad_filters %}
+{% load ubyssey_ad_tags %}
+{% load menu_tags %}
+
+{% block root %}{%endblock%}
+{% block darkmode %}{%endblock%}
+
+{% block stylesheet %}
+<!-- Adobe fonts from sports email account -->
+<link rel="stylesheet" href="https://use.typekit.net/jvd7txm.css">
+
+<link rel="stylesheet" href="{% static 'ubyssey/css/magazine-2024.css' %}" type="text/css" />
+{% endblock %}
+
+{% block head_scripts %}
+<!-- Needed for Bootstrap-->
+<meta charset="utf-8">
+
+<!-- Bootstrap 5 for Guide stuff -->
+<link href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css" rel="stylesheet">
+<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.bundle.min.js"></script>
+{% endblock %}
+
+{% block header %}
+	{% comment %} {% flat_menu 'guide2021' template="navigation/headers/guide/2021/header.html"  show_menu_heading=False  fall_back_to_default_site_menus=True %} {% endcomment %}
+	{% if page.menu %}
+		<!-- Manually selected menu: {{ page.menu.handle }} -->
+		{% flat_menu page.menu.handle template="navigation/bootstrap/topbar_with_dropdowns_hover.html" show_menu_heading=False fall_back_to_default_site_menus=True %}
+	{% elif create_menu_from_parent %}
+		<!-- Menu created from parent page -->	 
+		{% children_menu parent_page_for_menu_generation template="navigation/bootstrap/topbar_with_dropdowns_hover.html" show_menu_heading=False fall_back_to_default_site_menus=True %}
+	{% endif %}
+{% endblock %}
+
+{% block pre_main_content %}
+{% endblock %}
+
+{% block content %}
+<main class="{{ self.main_class_name }} o-site-wrapper">
+    {% block banner_ad %}
+    <!-- Article Page header ads go here -->
+        {% for orderable in settings.ads.AdTagSettings.article_header_placements.all %}
+            {% gpt_define_tag orderable.ad_slot is_mobile %}
+        {% endfor %}
+    {% endblock %}
+
+
+    <main class="c-article">
+        <div class="o-container">
+            {% block banner %}
+
+                <div class="u-container u-container--content u-container--padded">
+                    <p class="c-article__title">{{ self.title }}</p>
+                    <div class="c-article__info">
+                        {% comment %}
+                            {% include 'objects/social-icons.html' with article=article layout='top' %}
+                        {% endcomment %}
+                        <div class="c-authors_info">
+                            {% for author in self.authors_in_order %}
+                                <div>
+                                    <p>{%if author.author_role == 'author'%}Words{% elif author.author_role == 'illustrator'%}Illustration{% elif author.author_role == 'photographer' %}Photo{% elif author.author_role == 'videographer' %}Video{% else %}{{author.author_role}}{% endif %}
+                                        <b><a href="{{author.author.full_url}}">{{author.author.full_name}}</a></b></p>
+                                </div>
+                            {% endfor %}
+                        </div>
+                    </div>
+                    {% comment %}
+                    <div class="c-article__info">
+                        {% include 'article/objects/share_bar.html' %}
+                    </div>
+                    {% endcomment %}
+                    {% if self.featured_media.first.image %}
+                        {% with self.featured_media.first as featured_image_object %}
+                            <div class="featured-media">
+                                {% image featured_image_object.image original as original_image %}
+                                {% image featured_image_object.image width-1000 as featured_image %}
+                                <img class="article-attachment" 
+                                    data-id="{{ featured_image_object.id }}"
+                                    data-caption="{% if featured_image_object.caption %}{{ featured_image_object.caption }}{% endif %}"
+                                    data-credit="{% if featured_image_object.credit %}{{ featured_image_object.credit }}{% endif %}"
+                                    {% comment %}
+                                        Differences between line data-url and arc attributes represent the difference between
+                                        the obselete Dispatch equivalent of the URL for the "original image" ("data-url" attribute)
+                                        the "rendition" ("src" attribute). "data-url" is included for backward compatibility,
+                                        but "src" secures the primary functionality of this img element.
+                                    {% endcomment %}
+                                    data-url="{{ original_image.url }}"
+                                    src="{{ featured_image.url }}"
+                                    alt=""
+                                />
+                                {% if featured_image_object.caption or featured_image_object.credit %}
+                                    <div class="caption">
+                                        {% if featured_image_object.caption %}
+                                            {{ featured_image_object.caption }}
+                                        {% endif %}
+                                        {% if featured_image_object.credit %}
+                                            <span class="credit">
+                                                {{ featured_image_object.credit }}
+                                            </span>
+                                        {% endif %}
+                                    </div>
+                                {% endif %}
+                            </div>
+                        {% endwith %}
+                    {% endif %}
+                </div>
+            {% endblock %}
+
+            <div class="c-article__content">
+                {% comment %} <div class="advertisement box sidebar">
+                    {% include 'objects/advertisement.html' with size='box' name='Box_A' id=3 article=article.id %}
+                </div> {% endcomment %}
+                {% for block in self.content %}
+                    {% include_block block with id=block.id %}
+                {% endfor %}
+            </div>
+        </div>
+    </main>
+</main>
+
+{% endblock %}
+
+{% block post_main_content %}
+{% wagtailuserbar %}
+{% endblock %}
+
+
+{% block footer %}
+<footer class="c-nav-footer{% if subsection %} __{{ subsection }}{% else %} __home{% endif %} {{section}}">
+	<div class="o-container">
+		<div class="o-wrapper">
+			<a class="c-footer__self-link" href="/magazine/unlimited"><img src="{% static "ubyssey/images/magazine/2024/unlimited-logo-footer.svg" %}"></a>
+			<h2 class="c-footer__magazine">The Ubyssey’s Magazine 2024</h2>
+			<div class="c-footer__land-ack">
+				<h3 class="c-footer__land-ack__title">LAND ACKNOWLEDGEMENT</h3>
+				<p class="c-footer__land-ack__content">The Ubyssey would like to acknowledge that our office resides and our production takes place on the ancestral, unceded territories of the xʷməθkʷəy̓əm (Musqueam), sḵwx̱wú7mesh (Squamish) and sel̓íl̓witulh (Tsleil-Waututh) nations. We make this acknowledgement to pay respect to the keepers of the land, and to help fulfill our responsibility to view our own colonial history and their present-day implications through a critical lens.</p>
+			</div>
+			<div class="c-footer__legal">
+				<h3 class="c-footer__legal__title">LEGAL</h3>
+				<p class="c-footer__legal__content">The Ubyssey is the official student newspaper of the University of British Columbia (UBC). It is published every second Tuesday by the Ubyssey Publications Society (UPS). We are an autonomous, democratically-run student organization and all students are encouraged to participate. Editorials are written by The Ubyssey’s editorial board and they do not necessarily reflect the views of the UPS or UBC. All editorial content appearing in The Ubyssey is the property of the UPS. Stories, opinions, photographs and artwork contained herein cannot be reproduced without the expressed, written permission of the Ubyssey Publications Society. The Ubyssey is a founding member of Canadian University Press (CUP) and adheres to CUP’s guiding principles. The Ubyssey accepts opinion articles on any topic related to UBC and/or topics relevant to students attending UBC. Submissions must be written by UBC students, professors, alumni or those in a suitable position (as determined by the opinion editor) to speak on UBC-related matters. Submissions must not contain racism, sexism, homophobia, transphobia, harassment or discrimination. Authors and/or submissions will not be precluded from publication based solely on association with particular ideologies or subject matter that some may find objectionable. Approval for publication is, however, dependent on the quality of the argument and The Ubyssey editorial board’s judgment of appropriate content. Submissions may be sent by email to [email protected]. Please include your student number or other proof of identification. Anonymous submissions will be accepted on extremely rare occasions. Requests for anonymity will be granted upon agreement from four-fifths of the editorial board. Full opinions policy may be found at ubyssey.ca/pages/submit-an-opinion. It is agreed by all persons placing display or classified advertising that if the UPS fails to publish an advertisement or if an error in the ad occurs the liability of the UPS will not be greater than the price paid for the ad. The UPS shall not be responsible for slight changes or typographical errors that do not lessen the value or the impact of the ads.</p>
+			</div>
+			<a class="c-footer__ubyssey-link" href="{% url 'wagtail_serve' '' %}"><img class="logo" src="{% static 'ubyssey/images/magazine/2024/ubyssey-logo-mag2024.svg' %}" alt="" viewBox="0 0 100 100"/></a>
+			<p class="c-footer__address">2208-6133 University Boulevard</p>
+			<p class="c-footer__email">[email protected]</p>
+			<div class="c-footer__copyright">&copy; {% now "Y" %} The Ubyssey</div>
+		</div>
+	</div>
+</footer>
+{% endblock %}
+
+{% block scripts %}
+<script src="{% static 'ubyssey/js/guide-2021.js' %}" type="text/javascript"></script>
+{% endblock %}

navigation/templates/navigation/bootstrap/topbar_with_dropdowns_hover.html

@@ -0,0 +1,43 @@
+{% comment %}
+context inputs:
+background_color - hex color
+
+{% endcomment %}
+
+{% load static %}
+{% load menu_tags %}
+
+<nav class="navbar navbar-expand-sm navbar-dark">
+    <div class="container-fluid">
+        {% comment %} Link below is a funny combination of Bootstrap convention and some weird existing Ubyssey
+        conventions. Takes first item in menu to serve as link.
+        {% endcomment %}
+        <a class="navbar-brand o-logo--small" href="{{ menu_items.0.href }}"></a>
+        {% comment %} Strictly from Bootstrap. Allows button for navbar to appear on mobile. See
+        https://www.w3schools.com/bootstrap5/bootstrap_navbar.php
+        {% endcomment %}
+        <button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#collapsibleNavbar">
+            <span class="navbar-toggler-icon"></span>
+        </button>
+        <div class="collapse navbar-collapse" id="collapsibleNavbar">
+            <ul class="navbar-nav">
+                {% for item in menu_items %}
+                    {% comment %} We ignore the first item in the menu, because that's used for the home page
+                    {% endcomment %}
+                    {% if forloop.counter0 > 0 %}
+                        {% if item.has_children_in_menu %} 
+                        <li class="nav-item dropdown">
+                            <a class="nav-link {% if item.text == page.get_parent.title %}current{% endif %}" href="{{ item.href }}" role="button">{{ item.text }}</a>
+                            {% sub_menu item template="navigation/bootstrap/topbar_with_dropdowns_submenu.html"%}
+                        </li>
+                        {% else %}
+                        <li class="nav-item">
+                            <a class="nav-link" href="{{ item.href}}">{{ item.text }}</a>
+                        </li>
+                        {% endif %}
+                    {% endif %}
+                {% endfor %}
+            </ul>
+        </div>
+    </div>
+</nav>

specialfeaturelanding/blocks.py

@@ -201,7 +201,8 @@ class EditorCreditBlock(TemplateSelectStructBlock):
     template = blocks.ChoiceBlock(
         choices=[
             ('', 'Wagtail default'),
-            ('guide-2021-editor-credit.html', 'guide-2021-editor-credit.html'),
+            ('guide-2021-editor-credit.html', 'Guide 2021 Style'),
+            ('magazine-2024-editor-credit.html', 'Magazine 2024 Style'),
         ],
         required=False,
     )
@@ -219,7 +220,8 @@ class EditorialBlock(TemplateSelectStructBlock):
     template = blocks.ChoiceBlock(
         choices=[
             ('', 'Wagtail default'),
-            ('guide-2021-editorial-stream.html', 'guide-2021-editorial-stream.html'),
+            ('guide-2021-editorial-stream.html', 'Guide 2021 Style'),
+            ('magazine-2024-editorial-stream.html', 'Magazine 2024 Style'),
         ],
         required=False,
     )
@@ -229,7 +231,7 @@ class BannerBlock(TemplateSelectStructBlock):
         required=False,
     )
     image = ImageChooserBlock(
-        required=True,
+        required=False,
     )
     title1 = blocks.CharBlock(
         required=False,
@@ -246,6 +248,7 @@ class BannerBlock(TemplateSelectStructBlock):
             ('', 'Wagtail default'),
             ('guide-2021-banner.html', 'guide-2021-banner.html'),
             ('textless_banner_block.html','textless_banner_block.html'),
+            ('magazine-2024-banner.html','magazine-2024-banner.html'),
         ],
         required=False,
     )
@@ -305,10 +308,15 @@ class GraphicalMenuBlock(TemplateSelectStructBlock):
         required=False,
     )
 
-class ChildArticlesBlock(blocks.StructBlock):
-
-    class Meta:
-        template = TEMPLATE_DIRECTORY + 'guide-2021-child-articles.html'
+class ChildArticlesBlock(TemplateSelectStructBlock):
+    template = blocks.ChoiceBlock(
+        choices=[
+            ('guide-2021-child-articles.html', 'Guide 2021 Style'),
+            ('magazine-2024-child-articles.html', 'Magazine 2024 Style'),
+            ('magazine-2024-table-of-contents.html', 'Magazine 2024 Table of Contents Style'),
+        ],
+        required=True,
+    )
 
 class RenditionBlock(TemplateSelectStructBlock):
     image = ImageChooserBlock()