From 6ede600cefd9ff249e0a087a96b8e0fde50a5657 Mon Sep 17 00:00:00 2001 From: Leon Sandøy Date: Thu, 11 Apr 2019 23:51:02 +0200 Subject: New landing page. Not quite done yet. This probably should've been more than one commit. --- pydis_site/static/css/base/base.css | 20 ++++++++++++++++++++ pydis_site/static/css/home/index.css | 31 +++++++++++++++++++++++++++++++ 2 files changed, 51 insertions(+) create mode 100644 pydis_site/static/css/base/base.css (limited to 'pydis_site/static/css') diff --git a/pydis_site/static/css/base/base.css b/pydis_site/static/css/base/base.css new file mode 100644 index 00000000..5949725d --- /dev/null +++ b/pydis_site/static/css/base/base.css @@ -0,0 +1,20 @@ +#django-logo { + height: 20px; + background: url(https://static.djangoproject.com/img/logos/django-logo-negative.png) no-repeat center; + filter: grayscale(1) invert(0.04); + background-size: 50px; + background-position: 0 0; + color: #00000000; +} + +#bulma-logo { + padding-left: 18px; + height: 20px; + background: url(https://bulma.io/images/bulma-logo-white.png) no-repeat center; + background-size: 60px; + color: #00000000; +} + +#pydis-text { + font-weight: bold; +} diff --git a/pydis_site/static/css/home/index.css b/pydis_site/static/css/home/index.css index 2d744915..2ead1a12 100644 --- a/pydis_site/static/css/home/index.css +++ b/pydis_site/static/css/home/index.css @@ -16,3 +16,34 @@ height: 5rem; margin-right: 2rem; } + + +.navbar-item.is-large img { + max-height: 3rem; +} + +.navbar-item.is-fullsize { + padding:0; +} + +.navbar-item.is-fullsize img { + max-height: 4.75rem; +} + +.navbar-item.has-no-highlight:hover { + background-color: transparent; +} + +.navbar-item.has-left-margin-1 { + margin-left: 1rem; +} + +.navbar-item.has-left-margin-2 { + margin-left: 2rem; +} + +.navbar-item.has-left-margin-3 { + margin-left: 3rem; +} + + -- cgit v1.2.3 From 7affc403fc1a0e3ca823cb188f1bce08f221dd8a Mon Sep 17 00:00:00 2001 From: Leon Sandøy Date: Fri, 12 Apr 2019 00:14:39 +0200 Subject: Implemented a sticky footer system --- pydis_site/settings.py | 1 + pydis_site/static/css/base/base.css | 11 +++++++++++ pydis_site/templates/base/base.html | 12 ++++++++---- pydis_site/templates/home/index.html | 1 - 4 files changed, 20 insertions(+), 5 deletions(-) (limited to 'pydis_site/static/css') diff --git a/pydis_site/settings.py b/pydis_site/settings.py index 7eb552cd..03ad6bc5 100644 --- a/pydis_site/settings.py +++ b/pydis_site/settings.py @@ -256,5 +256,6 @@ BULMA_SETTINGS = { "primary": "#7289DA", "link": "$primary", "navbar-height": "4.75rem", + "footer-padding": "1rem 1.5rem 1rem", } } diff --git a/pydis_site/static/css/base/base.css b/pydis_site/static/css/base/base.css index 5949725d..02ccba84 100644 --- a/pydis_site/static/css/base/base.css +++ b/pydis_site/static/css/base/base.css @@ -18,3 +18,14 @@ #pydis-text { font-weight: bold; } + + +body.site { + display: flex; + min-height: 100vh; + flex-direction: column; +} + +main.site-content { + flex: 1; +} diff --git a/pydis_site/templates/base/base.html b/pydis_site/templates/base/base.html index fecf60cc..5d5fe7ec 100644 --- a/pydis_site/templates/base/base.html +++ b/pydis_site/templates/base/base.html @@ -24,11 +24,15 @@ {% block head %}{% endblock %} - + -{% block content %} - {{ block.super }} -{% endblock %} +
+ {% block content %} + {{ block.super }} + {% endblock %} +
+ +{% include "base/footer.html" %} diff --git a/pydis_site/templates/home/index.html b/pydis_site/templates/home/index.html index 1f4da8e3..511e05e5 100644 --- a/pydis_site/templates/home/index.html +++ b/pydis_site/templates/home/index.html @@ -49,5 +49,4 @@ - {% include "base/footer.html" %} {% endblock %} -- cgit v1.2.3 From 72154be25a2b413612a8df2125c0892161fc974e Mon Sep 17 00:00:00 2001 From: Leon Sandøy Date: Fri, 12 Apr 2019 00:47:40 +0200 Subject: Fixing the footer. Django logo no longer clips, and matches the rest of the font size better. Footer size reduced and padding made symmetrical. --- pydis_site/static/css/base/base.css | 8 ++++---- 1 file changed, 4 insertions(+), 4 deletions(-) (limited to 'pydis_site/static/css') diff --git a/pydis_site/static/css/base/base.css b/pydis_site/static/css/base/base.css index 02ccba84..e9b40758 100644 --- a/pydis_site/static/css/base/base.css +++ b/pydis_site/static/css/base/base.css @@ -1,9 +1,9 @@ #django-logo { - height: 20px; + padding-bottom: 2px; background: url(https://static.djangoproject.com/img/logos/django-logo-negative.png) no-repeat center; - filter: grayscale(1) invert(0.04); - background-size: 50px; - background-position: 0 0; + filter: grayscale(1) invert(0.02); + background-size: 52px 25.5px; + background-position: -1px -2px; color: #00000000; } -- cgit v1.2.3 From 4c47d99f707d9d74c85fa6df204b26b600ec140f Mon Sep 17 00:00:00 2001 From: Leon Sandøy Date: Fri, 12 Apr 2019 08:58:32 +0200 Subject: responsive video container --- pydis_site/static/css/base/base.css | 25 ++++++++++++++----------- pydis_site/static/css/home/index.css | 18 ++++++++++++++++++ pydis_site/templates/home/index.html | 2 +- 3 files changed, 33 insertions(+), 12 deletions(-) (limited to 'pydis_site/static/css') diff --git a/pydis_site/static/css/base/base.css b/pydis_site/static/css/base/base.css index e9b40758..f9c557d5 100644 --- a/pydis_site/static/css/base/base.css +++ b/pydis_site/static/css/base/base.css @@ -1,3 +1,17 @@ +html { + overflow:auto; +} + +body.site { + display: flex; + min-height: 100vh; + flex-direction: column; +} + +main.site-content { + flex: 1; +} + #django-logo { padding-bottom: 2px; background: url(https://static.djangoproject.com/img/logos/django-logo-negative.png) no-repeat center; @@ -18,14 +32,3 @@ #pydis-text { font-weight: bold; } - - -body.site { - display: flex; - min-height: 100vh; - flex-direction: column; -} - -main.site-content { - flex: 1; -} diff --git a/pydis_site/static/css/home/index.css b/pydis_site/static/css/home/index.css index 2ead1a12..3516c6a5 100644 --- a/pydis_site/static/css/home/index.css +++ b/pydis_site/static/css/home/index.css @@ -46,4 +46,22 @@ margin-left: 3rem; } +.video-container { + position: relative; + padding-bottom: 56.25%; + padding-top: 30px; + height: 0; + overflow: hidden; +} +.video-container iframe, +.video-container object, +.video-container embed { + position: absolute; + top: 0; + left: 0; + width: 100%; + height: 100%; + max-width: 560px; + max-height: 315px; +} diff --git a/pydis_site/templates/home/index.html b/pydis_site/templates/home/index.html index 511e05e5..6eb444d2 100644 --- a/pydis_site/templates/home/index.html +++ b/pydis_site/templates/home/index.html @@ -29,7 +29,7 @@ we've got someone who can help you if you get stuck.

-
+
-- cgit v1.2.3 From 14ab71db5524f5b34a0ee144a198c88f7681c685 Mon Sep 17 00:00:00 2001 From: Leon Sandøy Date: Fri, 12 Apr 2019 11:51:56 +0200 Subject: Better JetBrains sponsor logo, fixed a bug with responsive video containers, set up some placeholder cards for projects on the landing page. --- pydis_site/static/css/home/index.css | 2 +- pydis_site/static/images/sponsors/jetbrains.png | Bin 167813 -> 53742 bytes pydis_site/static/images/sponsors/jetbrains.svg | 66 --------------- .../static/images/sponsors/linode-diagonal.png | Bin 29104 -> 0 bytes pydis_site/templates/home/index.html | 89 +++++++++++++++++++-- 5 files changed, 83 insertions(+), 74 deletions(-) delete mode 100644 pydis_site/static/images/sponsors/jetbrains.svg delete mode 100644 pydis_site/static/images/sponsors/linode-diagonal.png (limited to 'pydis_site/static/css') diff --git a/pydis_site/static/css/home/index.css b/pydis_site/static/css/home/index.css index 3516c6a5..9f060562 100644 --- a/pydis_site/static/css/home/index.css +++ b/pydis_site/static/css/home/index.css @@ -48,7 +48,7 @@ .video-container { position: relative; - padding-bottom: 56.25%; + padding-bottom: 285px; padding-top: 30px; height: 0; overflow: hidden; diff --git a/pydis_site/static/images/sponsors/jetbrains.png b/pydis_site/static/images/sponsors/jetbrains.png index ccceb958..0b21c2c8 100644 Binary files a/pydis_site/static/images/sponsors/jetbrains.png and b/pydis_site/static/images/sponsors/jetbrains.png differ diff --git a/pydis_site/static/images/sponsors/jetbrains.svg b/pydis_site/static/images/sponsors/jetbrains.svg deleted file mode 100644 index 75d4d217..00000000 --- a/pydis_site/static/images/sponsors/jetbrains.svg +++ /dev/null @@ -1,66 +0,0 @@ - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - diff --git a/pydis_site/static/images/sponsors/linode-diagonal.png b/pydis_site/static/images/sponsors/linode-diagonal.png deleted file mode 100644 index 4b38003b..00000000 Binary files a/pydis_site/static/images/sponsors/linode-diagonal.png and /dev/null differ diff --git a/pydis_site/templates/home/index.html b/pydis_site/templates/home/index.html index 6eb444d2..c0d72d72 100644 --- a/pydis_site/templates/home/index.html +++ b/pydis_site/templates/home/index.html @@ -7,9 +7,10 @@ {% endblock %} {% block content %} - {% include "base/navbar.html" %} + {% include "base/navbar.html" %}
+
@@ -18,33 +19,107 @@ language, open to those who wish to learn the language or improve their skills, as well as those looking to help others. -

+

We organise regular community events and have a dedicated staff of talented Python developers available to assist around the clock. -

+

Whether you're looking to learn the language or working on a complex project, we've got someone who can help you if you get stuck.

- +
+ + +

Projects

+

+
+ + +
+
+
+

+ pythondiscord/site +

+
+
+
+ Some stuff goes in here. tags? dynamic info? +
+
+
+
+ + +
+
+
+

+ pythondiscord/seasonalbot +

+
+
+
+ Some stuff goes in here. tags? dynamic info? github stars? +
+
+
+
+ + +
+
+
+

+ pythondiscord/seasonalbot +

+
+
+
+ Some stuff goes in here. tags? dynamic info? github stars? +
+
+
+
+ + +
+
+
+

+ pythondiscord/seasonalbot +

+
+
+
+ Some stuff goes in here. tags? dynamic info? github stars? +
+
+
+
+ +
+

Sponsors

- - - + Linode + +
-- cgit v1.2.3 From ab18c0d88ad7f11073a49c097ff20c5510cb2e7d Mon Sep 17 00:00:00 2001 From: Leon Sandøy Date: Fri, 12 Apr 2019 14:06:47 +0200 Subject: Responsive video container not quite working the way it should. --- pydis_site/static/css/base/base.css | 6 ++ pydis_site/static/css/home/index.css | 37 +++++++++-- pydis_site/templates/home/index.html | 121 +++++++++++++++++++++-------------- 3 files changed, 113 insertions(+), 51 deletions(-) (limited to 'pydis_site/static/css') diff --git a/pydis_site/static/css/base/base.css b/pydis_site/static/css/base/base.css index f9c557d5..969511f4 100644 --- a/pydis_site/static/css/base/base.css +++ b/pydis_site/static/css/base/base.css @@ -12,6 +12,12 @@ main.site-content { flex: 1; } +div.card.has-equal-height { + height: 100%; + display: flex; + flex-direction: column; +} + #django-logo { padding-bottom: 2px; background: url(https://static.djangoproject.com/img/logos/django-logo-negative.png) no-repeat center; diff --git a/pydis_site/static/css/home/index.css b/pydis_site/static/css/home/index.css index 9f060562..4f1a25ab 100644 --- a/pydis_site/static/css/home/index.css +++ b/pydis_site/static/css/home/index.css @@ -48,9 +48,9 @@ .video-container { position: relative; - padding-bottom: 285px; - padding-top: 30px; - height: 0; + padding-top: 56.25%; + margin-left: 10px; + margin-right: 10px; overflow: hidden; } @@ -60,8 +60,37 @@ position: absolute; top: 0; left: 0; + right: 0; width: 100%; height: 100%; - max-width: 560px; + border: 0; max-height: 315px; + max-width: 560px; +} + +span.repo-language-dot { + border-radius: 50%; + height: 12px; + width: 12px; + top: 1px; + display: inline-block; + position: relative; +} + +span.repo-language-dot.python { + background-color: #3572A5; +} + +span.repo-language-dot.html { + background-color: #e34c26; +} + +span.repo-language-dot.css { + background-color: #563d7c; +} + + + +#repo-footer-item { + margin-left: 1.2rem; } diff --git a/pydis_site/templates/home/index.html b/pydis_site/templates/home/index.html index 88d557e1..9f9fe93e 100644 --- a/pydis_site/templates/home/index.html +++ b/pydis_site/templates/home/index.html @@ -11,9 +11,8 @@
- +
-

Who are we?


@@ -39,8 +38,10 @@ complex project, we've got someone who can help you if you get stuck.

-
-
@@ -49,68 +50,94 @@

Projects


-
+
-
-
-
-

- pythondiscord/site -

-
+
+
-
- Some stuff goes in here. tags? dynamic info? -
+ python-discord/site +

+ Source code for our website +

+ Python + 566 + 27
- -
-
-
-

- pythondiscord/seasonalbot -

-
+ +
+
-
- Some stuff goes in here. tags? dynamic info? github stars? -
+ python-discord/bot +

+ Source code for our Discord bot +

+ Python + 566 + 27
- -
-
-
-

- pythondiscord/seasonalbot -

-
+ +
+
-
- Some stuff goes in here. tags? dynamic info? github stars? -
+ python-discord/snekbox +

+ Easy, safe evaluation of arbitrary Python code +

+ Python + 566 + 27
-
-
-
-

- pythondiscord/seasonalbot -

-
+
+
+
+ python-discord/seasonalbot +

+ A Discord bot that changes with the seasons. Meant as a beginner-friendly learning project. +

+ Python + 566 + 27 +
+
+
+ + +
+
+
+ python-discord/django-simple-bulma +

+ Django application to add the Bulma CSS framework and its extensions +

+ CSS + 566 + 27 +
+
+
+ + +
+
-
- Some stuff goes in here. tags? dynamic info? github stars? -
+ python-discord/django-crispy-bulma +

+ Django application to add 'django-crispy-forms' layout objects for Bulma.io +

+ HTML + 566 + 27
-- cgit v1.2.3 From 62e543147cc5b8c2a9062af7314c32bf9d8b5618 Mon Sep 17 00:00:00 2001 From: Scragly <29337040+scragly@users.noreply.github.com> Date: Sat, 13 Apr 2019 00:42:57 +1000 Subject: Adjust dynamic video sizing to try keep aspect. --- pydis_site/static/css/home/index.css | 51 ++++++++++++++++++++++-------------- 1 file changed, 32 insertions(+), 19 deletions(-) (limited to 'pydis_site/static/css') diff --git a/pydis_site/static/css/home/index.css b/pydis_site/static/css/home/index.css index 4f1a25ab..2e201441 100644 --- a/pydis_site/static/css/home/index.css +++ b/pydis_site/static/css/home/index.css @@ -17,7 +17,6 @@ margin-right: 2rem; } - .navbar-item.is-large img { max-height: 3rem; } @@ -46,26 +45,12 @@ margin-left: 3rem; } -.video-container { - position: relative; - padding-top: 56.25%; - margin-left: 10px; - margin-right: 10px; - overflow: hidden; -} - .video-container iframe, .video-container object, .video-container embed { - position: absolute; - top: 0; - left: 0; - right: 0; width: 100%; - height: 100%; - border: 0; - max-height: 315px; - max-width: 560px; + height: calc(92vw*0.5625); + margin: 8px auto auto auto; } span.repo-language-dot { @@ -89,8 +74,36 @@ span.repo-language-dot.css { background-color: #563d7c; } - - #repo-footer-item { margin-left: 1.2rem; } + +@media screen and (min-width: 1088px) { + .column.is-half, .column.is-half-tablet { + flex: none; + width: 50%; + } + .columns:not(.is-desktop) { + display: flex; + } + .video-container iframe { + height: calc(42vw*0.5625); + max-height: 371px; + max-width: 660px; + } +} + +@media screen and (max-width: 1087px) { + .column.is-half, .column.is-half-tablet { + flex: none; + width: 100%; + } + .columns:not(.is-desktop) { + display: block; + } + .video-container iframe { + height: calc(92vw*0.5625); + max-height: none; + max-width: none; + } +} -- cgit v1.2.3 From cf1fc2870326c431d0c4dc3fe46f2ae41c2fd5aa Mon Sep 17 00:00:00 2001 From: Leon Sandøy Date: Wed, 17 Apr 2019 23:57:14 +0200 Subject: The GitHub API stuff is done now, including data caching. Just a couple of minor bugfixes left before this is PR-ready. --- pydis_site/apps/main/models.py | 3 - pydis_site/apps/main/views/home.py | 119 ++++++++++++++++++++++------------ pydis_site/settings.py | 10 +++ pydis_site/static/css/home/index.css | 11 ++++ pydis_site/templates/base/navbar.html | 24 +++---- pydis_site/templates/home/index.html | 105 +++++------------------------- 6 files changed, 129 insertions(+), 143 deletions(-) delete mode 100644 pydis_site/apps/main/models.py (limited to 'pydis_site/static/css') diff --git a/pydis_site/apps/main/models.py b/pydis_site/apps/main/models.py deleted file mode 100644 index 0b4331b3..00000000 --- a/pydis_site/apps/main/models.py +++ /dev/null @@ -1,3 +0,0 @@ -# from django.db import models - -# Create your models here. diff --git a/pydis_site/apps/main/views/home.py b/pydis_site/apps/main/views/home.py index 883177bb..f3f9d726 100644 --- a/pydis_site/apps/main/views/home.py +++ b/pydis_site/apps/main/views/home.py @@ -3,67 +3,104 @@ import requests from django.shortcuts import render from django.utils import timezone from django.views import View +from django.conf import settings from pydis_site.apps.main.models import RepoData -GITHUB_API = "https://api.github.com/repos" -REPOS = [ - "python-discord/site", - "python-discord/bot", - "python-discord/snekbox", - "python-discord/seasonalbot", - "python-discord/django-simple-bulma", - "python-discord/django-crispy-bulma", -] - -# https://api.github.com/users/python-discord/repos gets all the data in one query. +GITHUB_API = "https://api.github.com/users/python-discord/repos" class Home(View): - def _get_repo_data(self, repo_name): - """This will get language, stars and forks for the requested GitHub repo.""" - # Try to get the data from the cache + def _get_api_data(self): + """Call the GitHub API and get information about our repos.""" + repo_dict = {repo_name: {} for repo_name in settings.HOMEPAGE_REPOS} + + # Fetch the data from the GitHub API + api_data = requests.get(GITHUB_API) + api_data = api_data.json() + + # Process the API data into our dict + print(f"repo_dict = {repo_dict}") + for repo in api_data: + full_name = repo["full_name"] + + if full_name in settings.HOMEPAGE_REPOS: + repo_dict[full_name] = { + "full_name": repo["full_name"], + "description": repo["description"], + "language": repo["language"], + "forks_count": repo["forks_count"], + "stargazers_count": repo["stargazers_count"], + } + print(f"repo_dict after processing = {repo_dict}") + return repo_dict + + def _get_repo_data(self): + """Build a list of RepoData objects that we can use to populate the front page.""" + + # Try to get site data from the cache try: - repo_data = RepoData.objects.get(repo_name=repo_name) + repo_data = RepoData.objects.get(repo_name="python-discord/site") - # If the data is older than 2 minutes, we should refresh it + # If the data is older than 2 minutes, we should refresh it. THIS PROBABLY ALWAYS FAILS? if (timezone.now() - repo_data.last_updated).seconds > 120: - # Fetch the data from the GitHub API - api_data = requests.get(f"{GITHUB_API}/{repo_name}") - api_data = api_data.json() + diff = (timezone.now() - repo_data.last_updated).seconds + print(f"okay baby, it's old! the seconds difference comes to: {diff}") - # Update the current object, and save it. - repo_data.description = api_data["description"] - repo_data.language = api_data["language"] - repo_data.forks = api_data["forks_count"] - repo_data.stargazers = api_data["stargazers_count"] - repo_data.save() - return repo_data + # Get new data from API + api_data_container = self._get_api_data() + repo_data_container = [] + + # Update or create all RepoData objects in settings.HOMEPAGE_REPOS + for repo_name, api_data in api_data_container.items(): + try: + repo_data = RepoData.objects.get(repo_name=repo_name) + repo_data.description = api_data["description"] + repo_data.language = api_data["language"] + repo_data.forks = api_data["forks_count"] + repo_data.stargazers = api_data["stargazers_count"] + except RepoData.DoesNotExist: + repo_data = RepoData( + repo_name=api_data["full_name"], + description=api_data["description"], + forks=api_data["forks_count"], + stargazers=api_data["stargazers_count"], + language=api_data["language"], + ) + repo_data.save() + repo_data_container.append(repo_data) + return repo_data_container # Otherwise, if the data is fresher than 2 minutes old, we should just return it. else: - return repo_data + return list(RepoData.objects.all()) - # If this is raised, the data isn't there at all, so we'll need to create it. + # If this is raised, the database has no repodata at all, we will create them all. except RepoData.DoesNotExist: - api_data = requests.get(f"{GITHUB_API}/{repo_name}") - api_data = api_data.json() - repo_data = RepoData( - description=api_data["description"], - forks=api_data["forks_count"], - stargazers=api_data["stargazers_count"], - language=api_data["language"], - ) - repo_data.save() - return repo_data + + # Get new data from API + api_data_container = self._get_api_data() + repo_data_container = [] + + # Create all the repodata records in the database. + for repo_name, api_data in api_data_container.items(): + repo_data = RepoData( + repo_name=api_data["full_name"], + description=api_data["description"], + forks=api_data["forks_count"], + stargazers=api_data["stargazers_count"], + language=api_data["language"], + ) + repo_data.save() + repo_data_container.append(repo_data) + + return repo_data_container def get(self, request): # Collect the repo data - repo_data = [] - for repo in REPOS: - repo_data.append(self._get_repo_data(repo)) + repo_data = self._get_repo_data() # Call the GitHub API and ask it for some data return render(request, "home/index.html", {"repo_data": repo_data}) diff --git a/pydis_site/settings.py b/pydis_site/settings.py index 4a5b0523..eb21de10 100644 --- a/pydis_site/settings.py +++ b/pydis_site/settings.py @@ -258,3 +258,13 @@ BULMA_SETTINGS = { "footer-padding": "1rem 1.5rem 1rem", } } + +# Which of our GitHub repos should be displayed on the front page, and in which order? +HOMEPAGE_REPOS = [ + "python-discord/site", + "python-discord/bot", + "python-discord/snekbox", + "python-discord/seasonalbot", + "python-discord/django-simple-bulma", + "python-discord/django-crispy-bulma", +] diff --git a/pydis_site/static/css/home/index.css b/pydis_site/static/css/home/index.css index 2e201441..d1d1c01e 100644 --- a/pydis_site/static/css/home/index.css +++ b/pydis_site/static/css/home/index.css @@ -53,6 +53,17 @@ margin: 8px auto auto auto; } +div.card.github-card { + box-shadow: none; + border: #d1d5da 1px solid; + border-radius: 3px; +} + +div.repo-headline { + font-size: 1.25rem; + margin-bottom: 8px; +} + span.repo-language-dot { border-radius: 50%; height: 12px; diff --git a/pydis_site/templates/base/navbar.html b/pydis_site/templates/base/navbar.html index f9f576df..842d29d5 100644 --- a/pydis_site/templates/base/navbar.html +++ b/pydis_site/templates/base/navbar.html @@ -19,10 +19,10 @@ {# Content on the right side of the navbar #}