Skip to content

Commit

Permalink
Merge pull request #1554 from ubyssey/main-nav-restyling
Browse files Browse the repository at this point in the history 
Main nav restyling
  • Loading branch information
@SamuelmdLow
SamuelmdLow authored Oct 18, 2024
2 parents 8da480a + a5fae2a commit b2198ea
Show file tree
Hide file tree
Showing 9 changed files with 289 additions and 215 deletions.
28 changes: 28 additions & 0 deletions article/templatetags/articletags.py
View file
Original file line number Diff line number Diff line change
Expand Up @@ -70,6 +70,34 @@ def display_pubdate(value):
return "1 second ago"
return str(seconds) + " seconds ago"

@register.filter(name='time_ago')
def time_ago(value):

if value == None:
return "Unknown"

pubdate = value.astimezone(timezone.get_current_timezone())
today = timezone.now().astimezone(timezone.get_current_timezone())
delta = today - pubdate

if delta.total_seconds() > datetime.timedelta(days=7).total_seconds():
delta = round(delta.total_seconds()/(3600*24*7))
unit = "w"
elif delta.total_seconds() > datetime.timedelta(days=1).total_seconds():
delta = round(delta.total_seconds()/(3600*24))
unit = "d"
elif delta.total_seconds() > datetime.timedelta(hours=1).total_seconds():
delta = round(delta.total_seconds()/3600)
unit = "h"
elif delta.total_seconds() > datetime.timedelta(minutes=1).total_seconds():
delta = round(delta.total_seconds()/60)
unit = "m"
else:
delta = round(delta.total_seconds())
unit = "s"

return str(delta) + unit + " ago"

@register.filter(name="get_id")
def get_id(value):
from wagtail.models import Page, PageManager, SiteRootPath
Expand Down
5 changes: 2 additions & 3 deletions home/templates/home/home_page.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -4,6 +4,7 @@
{% load wagtailimages_tags %}
{% load ubyssey_ad_tags %}
{% load ubyssey_ad_filters %}
{% load articletags %}

{% block stylesheet %}
<link rel="stylesheet" href="{% static 'ubyssey/css/home.css' %}" type="text/css" />
Expand Down Expand Up @@ -52,9 +53,7 @@ <h3>BREAKING: {{ article.title|safe }}</h3>
{% include "article/objects/cover_story.html" with article=coverstory%}
{% endif %}
<div class="home-top-article-list">
{% now "d N Y" as date %}
{% now "l" as dayOfWeek %}
{% include 'home/objects/home_heading-box.html' with styling='lightmode' title="Top Stories" text=date textBold=dayOfWeek %}
{% include 'home/objects/home_heading-box.html' with styling='lightmode' title="Top Stories" text="Updated" textBold=self.last_published_at|time_ago %}

{% for article in self.top_articles_list %}
{% include "article/objects/top_article.html" with article=article.article count=forloop.counter %}
Expand Down
2 changes: 1 addition & 1 deletion infinitefeed/templates/infinitefeed/sidebar/sidebar_latest_block.html
View file
Original file line number Diff line number Diff line change
@@ -1,7 +1,7 @@
{% load articletags %}

<div class="article-list blog sidebar-block">
{% include 'home/objects/home_heading-box.html' with styling='boxLabel-highlight' title=title text='Last updated:' textBold=articles.0.first_published_at|display_pubdate %}
{% include 'home/objects/home_heading-box.html' with styling='boxLabel-highlight' title=title text='Updated' textBold=articles.0.first_published_at|time_ago %}
<ul class="article-list">
{% for article in articles %}
<li>
Expand Down
71 changes: 43 additions & 28 deletions navigation/templates/navigation/footer.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -6,38 +6,53 @@

<div class="about">
<div class="footer-branding">
<img class="logo" src="{% static 'ubyssey/images/ubyssey-logo-blue.svg' %}" alt="The Ubyssey Logo"/>
<img class="funding" src="{% static 'ubyssey/images/canada-funding-dark.png' %}" loading="lazy" alt="Funded by the Government of Canada"/>
</div>

<div class="about-text">
<h2><span>The Ubyssey</span> has been UBC’s student newspaper since 1918, independent since 1995.</h2>
<p>Published bi-weekly in print and daily online, we cover what matters most to UBC students.
<img class="logo mobile" src="{% static 'ubyssey/images/ubyssey-logo-blue.svg' %}" alt="The Ubyssey"/>
<img class="logo desktop" src="{% static 'ubyssey/images/ubyssey_logo_dark_classic.svg' %}" alt="The Ubyssey"/>
<img class="funding mobile" src="{% static 'ubyssey/images/canada-funding-dark.png' %}" loading="lazy" alt="Funded by the Government of Canada"/>
<p>
<b><i>The Ubyssey</i></b> has been the definitive source of news on campus since 1918. Published by an independent non-profit society, written and
edited by students and funded by a combination
of student fees and advertising, we cover what
matters most to the UBC community.
</p>
<h3>Stay in the loop</h3>
<ul>
<li><a href="/rss" target="_blank" title="Rss feed">Rss feed</a>,</li>
<li><a href="/newsletter" target="_blank" title="Newsletter">Newsletter</a>,</li>
<li><a href="https://discord.gg/aTkCjyAvxh" target="_blank" title="Discord link">Join the Discord</a></li>
</ul>
<h3>Keep up with us on social media</h3>
<ul>
<li><a href="https://www.instagram.com/ubyssey/" target="_blank" title="The Ubyssey on Instagram">Instagram</a>,</li>
<li><a href="https://www.tiktok.com/@ubyssey" target="_blank" title="The Ubyssey on Tiktok">TikTok</a>,</li>
<li><a href="https://twitter.com/Ubyssey" target="_blank" title="The Ubyssey on Twitter">Twitter</a>,</li>
<li><a href="https://www.facebook.com/ubyssey" target="_blank" title="The Ubyssey on Facebook">Facebook</a></li>
</ul>
<img class="funding desktop" src="{% static 'ubyssey/images/canada-funding-dark.png' %}" loading="lazy" alt="Funded by the Government of Canada"/>
<p>Have feedback? Email <a href="mailto:feedback@ubyssey.ca" title="Email address for feedback">feedback@ubyssey.ca</a>.</p>
</div>
</div>
<nav>
<div class="top-row">
{% main_menu show_multiple_levels=False apply_active_classes=False %}
</div>
<div class="bottom-row">
{% flat_menu 'second_footer_menu' max_levels=1 show_menu_heading=False fall_back_to_default_site_menus=True %}

<div class="footer-links">
<div class="footer-links-section">
<h3>Sections</h3>
{% main_menu show_multiple_levels=False apply_active_classes=False %}
</div>
<div class="footer-links-section">
<h3>Stay in the loop</h3>
<ul>
<li><a href="/rss" target="_blank" title="Rss feed">Rss feed</a></li>
<li><a href="/newsletter" target="_blank" title="Newsletter">Newsletter</a></li>
<li><a href="https://discord.gg/aTkCjyAvxh" target="_blank" title="Discord link">Join the Discord</a></li>
</ul>
</div>
<div class="footer-links-section">
<h3>Social media</h3>
<ul>
<li><a href="https://www.instagram.com/ubyssey/" target="_blank" title="The Ubyssey on Instagram">Instagram</a></li>
<li><a href="https://www.tiktok.com/@ubyssey" target="_blank" title="The Ubyssey on Tiktok">TikTok</a></li>
<li><a href="https://twitter.com/Ubyssey" target="_blank" title="The Ubyssey on Twitter">Twitter</a></li>
<li><a href="https://www.facebook.com/ubyssey" target="_blank" title="The Ubyssey on Facebook">Facebook</a></li>
</ul>
</div>
<div class="footer-links-section">
<h3>Explore</h3>
{% flat_menu 'second_footer_menu' max_levels=1 show_menu_heading=False fall_back_to_default_site_menus=True %}
</div>
</div>
</nav>
</div>
<div class="land-acknowledgement">
<h3>Land Acknowledgement</h3>
<p>
<i>The Ubyssey</i> 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. <a href="https://ubyssey.ca/pages/about/">Read More</a>.
</p>
</div>
<div class="copyright">&copy; {% now "Y" %} The Ubyssey</div>
</div>
</footer>
72 changes: 36 additions & 36 deletions navigation/templates/navigation/headers/main.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -4,55 +4,55 @@
<header class="main">
<div class="u-container u-container--mid">
<div class="branding row">
<div class="left"><span class="since-line">
{% if tagline_url %}
<a href="{{tagline_url}}">{% if tagline %}{{tagline}}{% else %}!{% endif %}</a>
{% else %}
{% if tagline %}{{tagline}}{% endif %}
{% endif %}
</span></div>
<div class="middle">
<img class="top-logo light-logo" src="{% static 'ubyssey/images/ubyssey-logo-small.svg' %}" alt="The Ubyssey logo"/>
<img class="top-logo dark-logo" src="{% static 'ubyssey/images/ubyssey-logo 1.svg' %}" alt="The Ubyssey logo"/>
</div>
<div class="right">
<!-- <a class="store-link" href="https://store.ubyssey.ca/">
<i class="fa fa-shopping-bag"></i><span>Store</span>
</a> -->
{% comment %} <a class="o-snapchat-icon"><i class="fa fa-snapchat"></i><div class="o-snapchat-icon__code"></div></a> {% endcomment %}
<a class = "rss-icon" href="/rss" target="_blank" title="The Ubyssey rss feed"><ion-icon name="logo-rss"></ion-icon></a>
<a class = "instagram-icon" href="https://www.instagram.com/ubyssey/" target="_blank" title="The Ubyssey on Instagram"><ion-icon name="logo-instagram"></ion-icon></a>
<a class = "tiktok-icon" href="https://www.tiktok.com/@ubyssey" target="_blank" title="The Ubyssey on Tiktok"><ion-icon name="logo-tiktok"></ion-icon></a>
<a class = "twitter-icon" href="https://twitter.com/Ubyssey" target="_blank" title="The Ubyssey on Twitter"><ion-icon name="logo-twitter"></ion-icon></a>
<a class = "facebook-icon" href="https://www.facebook.com/ubyssey" target="_blank" title="The Ubyssey on Facebook"><ion-icon name="logo-facebook"></ion-icon></a>

{% include 'article/objects/darkmode_button.html' with id="main"%}
<p class="since-line">
{% if tagline_url %}
<a href="{{tagline_url}}">{% if tagline %}{{tagline}}{% else %}!{% endif %}</a>
{% else %}
{% if tagline %}{{tagline}}{% endif %}
{% endif %}
</p>

<p>
{% now "F d, Y" as date %}
{% now "l" as dayOfWeek %}
{{date}} <b>{{dayOfWeek}}</b>
</p>

<div>
<a class = "rss-icon" href="/rss" target="_blank" title="The Ubyssey rss feed"><ion-icon name="logo-rss"></ion-icon></a>

<a class = "instagram-icon" href="https://www.instagram.com/ubyssey/" target="_blank" title="The Ubyssey on Instagram"><ion-icon name="logo-instagram"></ion-icon></a>
<a class = "tiktok-icon" href="https://www.tiktok.com/@ubyssey" target="_blank" title="The Ubyssey on Tiktok"><ion-icon name="logo-tiktok"></ion-icon></a>
<a class = "twitter-icon" href="https://twitter.com/Ubyssey" target="_blank" title="The Ubyssey on Twitter"><ion-icon name="logo-twitter"></ion-icon></a>
<a class = "facebook-icon" href="https://www.facebook.com/ubyssey" target="_blank" title="The Ubyssey on Facebook"><ion-icon name="logo-facebook"></ion-icon></a>

{% include 'article/objects/darkmode_button.html' with id="main"%}
</div>
{% comment %} <a class="search" href="{% url 'search' %}"><i class="fa fa-search"></i></a> {% endcomment %}
</div>
</div>
<nav class="main row">
<div class="left">
<ul class="meta">
<div class="left meta">
{% flat_menu 'left_header_menu' max_levels=1 show_menu_heading=False fall_back_to_default_site_menus=True %}
</ul>
</div>
<div class="middle">
<ul class="sections">
{% main_menu %}
<li class="dropdown">
<a class="more-dropdown preventDefault" href="#">MORE <ion-icon name="caret-down" class="dropdown-hidden"></ion-icon><ion-icon class="dropdown-show" name="caret-up"></ion-icon></a>
<div class="more-list dropdown-content">
<ul>
{% flat_menu 'dropdown_menu' max_levels=1 show_menu_heading=False fall_back_to_default_site_menus=True %}
</ul>
</div>
</li>
</ul>
<div class="middle sections">
{% main_menu %}
<div class="dropdown">
<a class="more-dropdown preventDefault" href="#">MORE <ion-icon name="caret-down" class="dropdown-hidden"></ion-icon><ion-icon class="dropdown-show" name="caret-up"></ion-icon></a>
<div class="more-list dropdown-content">
<ul>
{% flat_menu 'dropdown_menu' max_levels=1 show_menu_heading=False fall_back_to_default_site_menus=True %}
</ul>
</div>
</div>
</div>
<div class="right">
<ul class="meta">
<div class="right meta">
{% flat_menu 'right_header_menu' max_levels=1 show_menu_heading=False fall_back_to_default_site_menus=True %}
</ul>
</div>
</nav>
</div>
Expand Down
Loading

0 comments on commit b2198ea

Please sign in to comment.