Commit 12306e53 authored by Emma's avatar Emma 🏳🌈

refactor nav to use layout/fix in tor hisec mode

parent d38c8f65
Pipeline #57525917 passed with stage
in 52 seconds
......@@ -263,6 +263,7 @@ final class UserController extends AbstractController {
public function blockList(User $user, int $page) {
return $this->render('user/block_list.html.twig', [
'blocks' => $user->getPaginatedBlocks($page),
'user' => $user,
]);
}
......
{% from '_macros/icon.html.twig' import icon %}
{% set route = app.request.attributes.get('_route') %}
{% set notification_count = is_granted('ROLE_USER') ? app.user.notifications|length : 0 %}
{% set search_query = app.request.query.get('q') %}
{% if route != 'search' or search_query is iterable %}
{% set search_query = null %}
{% endif %}
{# TODO: make the templates of these routes responsible for setting the active
items themselves #}
{% set active = null %}
{% if route in ['front', 'featured', 'subscribed', 'all', 'moderated', 'comment_list'] %}
{% set active = 'home' %}
{% elseif route in ['forum_list', 'forums_by_category'] %}
{% set active = 'forums' %}
{% elseif route starts with 'wiki' %}
{% set active = 'wiki' %}
{% elseif route in ['user_bans', 'ip_bans', 'ban_ip', 'create_forum_category', 'manage_forum_categories', 'users'] %}
{% set active = 'admin' %}
{% elseif route in ['message_threads', 'notifications', 'message'] %}
{% set active = 'messages' %}
{% elseif route == 'submit' %}
{% set active = 'submit' %}
{% elseif is_granted('ROLE_USER') and app.request.pathInfo starts with '/user/%s'|format(app.user.username) %}
{% set active = 'user' %}
{% endif -%}
<nav class="site-nav">
<div class="site-nav__container">
<header class="site-nav__header">
<a href="{{ path('front') }}"
class="no-underline site-nav__link {{ active == 'home' ? 'site-nav__link--active' }}">
<span class="no-desktop">{{ icon('home', '', 'icon--no-align') }}</span>
<b class="no-mobile no-underline__exempt">{{ site_name() }}</b>
</a>
</header>
<div class="site-nav__main-menu-container site-nav__mobile-hidden dropdown dropdown--mobile-only">
<button type="button" class="site-nav__link site-nav__mobile-toggle no-desktop dropdown__toggle unbuttonize">
{{- icon('menu', '', 'icon--no-align') -}}
</button>
{# left portion of site nav #}
<ul class="site-nav__menu site-nav__main-menu unlistify dropdown__menu">
<li>
<a href="{{ path('forum_list') }}"
class="site-nav__link {{ active == 'forums' ? 'site-nav__link--active' }}">
{{- 'nav.forums'|trans -}}
</a>
</li>
<li>
<a href="{{ path('wiki') }}"
class="site-nav__link {{ active == 'wiki' ? 'site-nav__link--active' }}">
{{- 'nav.wiki'|trans -}}
</a>
</li>
{% if is_granted('ROLE_ADMIN') %}
<li class="dropdown">
<button type="button"
class="dropdown__toggle no-underline no-wrap site-nav__link unbuttonize {{ active == 'admin' ? 'site-nav__link--active' }}">
<span class="no-underline__exempt">{{ 'label.admin'|trans }}</span>
<span class="dropdown__arrow" aria-hidden="true"></span>
</button>
<ul class="card dropdown__menu no-wrap unlistify">
<li>
<a href="{{ path('user_bans') }}" class="menu-link">
{{ icon('hammer') }}
{{ 'label.bans'|trans }}
</a>
</li>
<li>
<a href="{{ path('manage_forum_categories') }}" class="menu-link">
{{ icon('sitemap') }}
{{ 'nav.forum_categories'|trans }}
</a>
</li>
<li>
<a href="{{ path('users') }}" class="menu-link">
{{ icon('user') }}
{{ 'nav.users'|trans }}
</a>
</li>
</ul>
</li>
{% endif %}
</ul>
</div>
<form action="{{ path('search') }}" class="site-nav__mobile-hidden site-nav__search dropdown dropdown--mobile-only">
<button type="button" class="site-nav__link site-nav__mobile-toggle no-desktop dropdown__toggle unbuttonize">
{{- icon('search', '', 'icon--no-align') -}}
</button>
<div class="site-nav__search-row dropdown__menu">
<label class="site-nav__search-label" for="site-nav-search" aria-hidden="true">
{{ icon('search', '', 'icon--no-align') }}
</label>
<input name="q"
type="search"
class="form-control site-nav__search-input"
id="site-nav-search"
value="{{ search_query }}"
aria-label="{{ 'label.search_query'|trans }}">
</div>
</form>
<ul class="site-nav__menu site-nav__user-menu unlistify">
{% if not is_granted('ROLE_USER') %}
<li>
<a href="{{ path('login') }}" class="site-nav__link">{{ 'nav.log_in'|trans }}</a>
</li>
<li>
<a href="{{ path('registration') }}" class="site-nav__link">{{ 'nav.register'|trans }}</a>
</li>
{% else %}
<li>
<a href="{{ path('notifications') }}"
class="no-underline no-wrap site-nav__link
{{ notification_count > 0 ? 'site-nav__has-notifications' }}
{{ active == 'messages' ? 'site-nav__link--active' }}"
title="{{ 'nav.notifications_count'|trans({'%count%': notification_count|localizednumber}) }}">
{% if notification_count > 0 %}
{{ icon('envelope-open', '', 'icon--no-align') }}
<small class="no-underline__exempt" aria-hidden="true">{{ notification_count|localizednumber }}</small>
{% else %}
{{ icon('envelope', '', 'icon--no-align') }}
{% endif %}
</a>
</li>
<li>
<a href="{{ path('submit', { forum_name: forum.name ?? null }) }}"
class="no-underline no-wrap site-nav__link {{ route == 'submit' ? 'site-nav__link--active' }}">
{{ icon('plus', '', 'icon--no-align') }}
<span class="no-underline__exempt no-mobile">{{ 'nav.submit'|trans }}</span>
</a>
</li>
{# user menu #}
<li class="dropdown dropdown--right">
<button type="button" class="dropdown__toggle no-underline site-nav__link no-wrap unbuttonize {{ active == 'user' ? 'site-nav__link--active' }}">
{{ icon('user', '', 'icon--no-align') }}
<strong class="no-underline__exempt no-mobile">{{ app.user.username }}</strong>
<span class="dropdown__arrow no-mobile" aria-hidden="true"></span>
</button>
<ul class="card dropdown__menu unlistify no-wrap">
<li>
<a href="{{ path('user', {username: app.user.username}) }}"
class="menu-link">
{{ icon('user') }}
{{ 'nav.profile'|trans }}
</a>
</li>
<li>
<a href="{{ path('edit_user', {username: app.user.username}) }}"
class="menu-link">
{{ icon('lock') }}
{{ 'nav.my_account'|trans }}
</a>
</li>
<li>
<a href="{{ path('user_settings', {username: app.user.username}) }}"
class="menu-link">
{{ icon('settings') }}
{{ 'nav.user_settings'|trans }}
</a>
</li>
<li>
<a href="{{ path('user_block_list', {username: app.user.username}) }}"
class="menu-link">
{{ icon('block') }}
{{ 'nav.block_list'|trans }}
</a>
</li>
<li>
<form action="{{ logout_path() }}" method="POST">
<button class="menu-link unbuttonize">
{{ icon('logout') }}
{{ 'nav.log_out'|trans }}
</button>
</form>
</li>
</ul>
</li>
{% endif %}
</ul>
</div>
</nav>
{% block site_nav %}
{% set active %}{% block site_nav_active '' %}{% endset %}
<nav class="site-nav">
<div class="site-nav__container">
{{ block('site_nav_header') }}
{{ block('site_nav_main_menu') }}
{{ block('site_nav_search') }}
{{ block('site_nav_user_menu') }}
</div>
</nav>
{% endblock site_nav %}
{% block site_nav_header %}
{% from '_macros/icon.html.twig' import icon %}
<header class="site-nav__header">
<a href="{{ path('front') }}"
class="no-underline site-nav__link {{ active == 'front' ? 'site-nav__link--active' }}"
aria-label="{{ 'nav.home'|trans }}">
{{ icon('home', 'nav.home'|trans, 'icon--no-align no-desktop') }}
<b class="no-mobile no-underline__exempt">{{ site_name() }}</b>
</a>
</header>
{% endblock site_nav_header %}
{% block site_nav_main_menu %}
{% from '_macros/icon.html.twig' import icon %}
{% set active_menu_item %}{% block site_nav_main_menu_active '' %}{% endset %}
<div class="site-nav__main-menu-container site-nav__mobile-hidden dropdown dropdown--mobile-only">
<button type="button"
class="site-nav__link {{ (active == 'places' or active == 'admin') ? 'site-nav__link--active' }} site-nav__mobile-toggle no-desktop dropdown__toggle unbuttonize"
aria-label="{{ 'nav.places'|trans }}">
{{- icon('menu', 'nav.places'|trans, 'icon--no-align') -}}
</button>
<ul class="site-nav__menu site-nav__main-menu unlistify dropdown__menu">
{{ block('site_nav_main_menu_items') }}
</ul>
</div>
{% endblock site_nav_main_menu %}
{% block site_nav_main_menu_items %}
{% from '_macros/icon.html.twig' import icon %}
<li>
<a href="{{ path('forum_list') }}"
class="site-nav__link {{ active_menu_item == 'forums' ? 'site-nav__link--active' }}">
{{- 'nav.forums'|trans -}}
</a>
</li>
<li>
<a href="{{ path('wiki') }}"
class="site-nav__link {{ active_menu_item == 'wiki' ? 'site-nav__link--active' }}">
{{- 'nav.wiki'|trans -}}
</a>
</li>
{% if is_granted('ROLE_ADMIN') %}
<li class="dropdown">
<button type="button"
class="dropdown__toggle no-underline no-wrap site-nav__link unbuttonize {{ active == 'admin' ? 'site-nav__link--active' }}">
<span class="no-underline__exempt">{{ 'label.admin'|trans }}</span>
<span class="dropdown__arrow" aria-hidden="true"></span>
</button>
<ul class="card dropdown__menu no-wrap unlistify">
{{ block('site_nav_main_menu_admin_items') }}
</ul>
</li>
{% endif %}
{% endblock site_nav_main_menu_items %}
{% block site_nav_main_menu_admin_items %}
{% from '_macros/icon.html.twig' import icon %}
<li>
<a href="{{ path('user_bans') }}" class="menu-link {{ active_menu_item == 'bans' ? 'menu-link--active' }}">
{{ icon('hammer') }}
{{ 'label.bans'|trans }}
</a>
</li>
<li>
<a href="{{ path('manage_forum_categories') }}" class="menu-link {{ active_menu_item == 'forum_categories' ? 'menu-link--active' }}">
{{ icon('sitemap') }}
{{ 'nav.forum_categories'|trans }}
</a>
</li>
<li>
<a href="{{ path('users') }}" class="menu-link {{ active_menu_item == 'users' ? 'menu-link--active' }}">
{{ icon('user') }}
{{ 'nav.users'|trans }}
</a>
</li>
{% endblock site_nav_main_menu_admin_items %}
{% block site_nav_search %}
{% from '_macros/icon.html.twig' import icon %}
{% set search_query = app.request.query.get('q') %}
{% if active != 'search' or search_query is iterable %}
{% set search_query = null %}
{% endif %}
<form action="{{ path('search') }}" class="site-nav__mobile-hidden site-nav__search dropdown dropdown--mobile-only">
<button type="button"
class="site-nav__link {{ active == 'search' ? 'site-nav__link--active' }} site-nav__mobile-toggle no-desktop dropdown__toggle unbuttonize"
aria-label="{{ 'nav.search'|trans }}">
{{- icon('search', 'nav.search'|trans, 'icon--no-align') -}}
</button>
<div class="site-nav__search-row dropdown__menu">
<label class="site-nav__search-label" for="site-nav-search" aria-hidden="true">
{{ icon('search', '', 'icon--no-align') }}
</label>
<input name="q"
type="search"
class="form-control site-nav__search-input"
id="site-nav-search"
value="{{ search_query }}"
aria-label="{{ 'label.search_query'|trans }}">
</div>
</form>
{% endblock site_nav_search %}
{% block site_nav_user_menu %}
<ul class="site-nav__menu site-nav__user-menu unlistify">
{% if not is_granted('ROLE_USER') %}
{{ block('site_nav_user_menu_logged_out') }}
{% else %}
{{ block('site_nav_user_menu_logged_in') }}
{% endif %}
</ul>
{% endblock site_nav_user_menu %}
{% block site_nav_user_menu_logged_out %}
<li>
<a href="{{ path('login') }}" class="site-nav__link {{ active == 'login' ? 'site-nav__link--active' }}">
{{- 'nav.log_in'|trans -}}
</a>
</li>
<li>
<a href="{{ path('registration') }}" class="site-nav__link {{ active == 'registration' ? 'site-nav__link--active' }}">
{{- 'nav.register'|trans -}}
</a>
</li>
{% endblock site_nav_user_menu_logged_out %}
{% block site_nav_user_menu_logged_in %}
{% from '_macros/icon.html.twig' import icon %}
{% set notification_count = is_granted('ROLE_USER') ? app.user.notifications|length : 0 %}
{% set active_menu_item %}{% if active == 'user' %}{% block site_nav_user_menu_active '' %}{% endif %}{% endset %}
<li>
<a href="{{ path('notifications') }}"
class="no-underline no-wrap site-nav__link
{{ notification_count > 0 ? 'site-nav__has-notifications' }}
{{ active == 'notifications' ? 'site-nav__link--active' }}"
title="{{ 'nav.notifications_count'|trans({'%count%': notification_count|localizednumber}) }}"
aria-label="{{ 'nav.notifications_count'|trans({'%count%': notification_count|localizednumber}) }}">
{% if notification_count > 0 %}
{{ icon('envelope-open', 'nav.notifications'|trans, 'icon--no-align') }}
<small class="no-underline__exempt" aria-hidden="true">{{ notification_count|localizednumber }}</small>
{% else %}
{{ icon('envelope', 'nav.notifications'|trans, 'icon--no-align') }}
{% endif %}
</a>
</li>
<li>
<a href="{{ path('submit', { forum_name: forum.name ?? null }) }}"
class="no-underline no-wrap site-nav__link {{ active == 'submit' ? 'site-nav__link--active' }}"
aria-label="{{ 'nav.submit'|trans }}">
{{ icon('plus', 'nav.submit'|trans, 'icon--no-align', 'no-desktop') }}
<span class="no-underline__exempt no-mobile">{{ 'nav.submit'|trans }}</span>
</a>
</li>
<li class="dropdown dropdown--right">
<button type="button" class="dropdown__toggle no-underline site-nav__link no-wrap unbuttonize {{ active == 'user' ? 'site-nav__link--active' }}">
{{ icon('user', 'nav.user'|trans, 'icon--no-align', 'no-desktop') }}
<strong class="no-underline__exempt no-mobile">{{ app.user.username }}</strong>
<span class="dropdown__arrow no-mobile" aria-hidden="true"></span>
</button>
<ul class="card dropdown__menu unlistify no-wrap">
{{ block('site_nav_user_menu_dropdown_items') }}
</ul>
</li>
{% endblock site_nav_user_menu_logged_in %}
{% block site_nav_user_menu_dropdown_items %}
{% from '_macros/icon.html.twig' import icon %}
<li>
<a href="{{ path('user', {username: app.user.username}) }}"
class="menu-link {{ active_menu_item == 'profile' ? 'menu-link--active' }}">
{{ icon('user') }}
{{ 'nav.profile'|trans }}
</a>
</li>
<li>
<a href="{{ path('edit_user', {username: app.user.username}) }}"
class="menu-link {{ active_menu_item == 'account' ? 'menu-link--active' }}">
{{ icon('lock') }}
{{ 'nav.my_account'|trans }}
</a>
</li>
<li>
<a href="{{ path('user_settings', {username: app.user.username}) }}"
class="menu-link {{ active_menu_item == 'preferences' ? 'menu-link--active' }}">
{{ icon('settings') }}
{{ 'nav.user_settings'|trans }}
</a>
</li>
<li>
<a href="{{ path('user_block_list', {username: app.user.username}) }}"
class="menu-link {{ active_menu_item == 'block_list' ? 'menu-link--active' }}">
{{ icon('block') }}
{{ 'nav.block_list'|trans }}
</a>
</li>
<li>
<form action="{{ logout_path() }}" method="POST">
<button class="menu-link unbuttonize">
{{ icon('logout') }}
{{ 'nav.log_out'|trans }}
</button>
</form>
</li>
{% endblock site_nav_user_menu_dropdown_items %}
{% macro icon(name, alt_text = '', extra_classes='') %}
{% macro icon(name, alt_text = '', extra_classes='', alt_text_extra_classes='') %}
{#- prevent preloading sprite sheet more than once -#}
{%- set icon_asset = asset('build/images/icons.svg') -%}
{%- if not app.request.attributes.get('icons_are_linked') -%}
......@@ -17,7 +17,7 @@
SVG icons are disabled. -#}
<img src="data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%2F%3E"
alt="{{ alt_text }}"
class="icon__alt"
class="icon__alt {{ alt_text_extra_classes }}"
aria-hidden="true"
width="0"
height="0">
......
{% extends 'base.html.twig' %}
{% block page_classes 'add-ban-page' %}
{% block site_nav_active 'places' %}
{% block site_nav_main_menu_active 'admin' %}
{% block site_nav_admin_menu_active 'bans' %}
{% block title 'ban_add.title'|trans %}
{% block body %}
......
{% extends 'base.html.twig' %}
{% block title 'title.ip_bans'|trans %}
{% block site_nav_active 'admin' %}
{% block site_nav_main_menu_active 'bans' %}
{% block page_classes 'ban-list-page' %}
{% block head %}
......
{% extends 'base.html.twig' %}
{% block title 'title.active_global_user_bans'|trans %}
{% block site_nav_active 'admin' %}
{% block site_nav_main_menu_active 'bans' %}
{% block page_classes 'user-bans-page' %}
{% block head %}
......
{% use '_layouts/site_nav.html.twig' %}
<!DOCTYPE html>
<html class="no-js" lang="{{ app.request.locale }}" prefix="og: http://ogp.me/ns#">
<head>
......@@ -39,9 +40,7 @@
</div>
{% endblock %}
{% block site_nav %}
{{ include('_includes/site_nav.html.twig', {forum: forum ?? null}, with_context=false) }}
{% endblock %}
{{ block('site_nav') }}
{% block site_main %}
<div class="content-wrapper">
......
......@@ -4,6 +4,7 @@
{% block page_classes 'comment-list-page' %}
{% block title 'title.recent_comments'|trans %}
{% block site_nav_active 'front' %}
{% block head %}
{{ include('_includes/meta_pagination.html.twig', {pager: comments}, with_context=false) }}
......
......@@ -4,6 +4,9 @@
{% block page_classes 'forum-list-page' %}
{% block site_nav_active 'places' %}
{% block site_nav_main_menu_active 'forums' %}
{% block title 'forum_list.page_title'|trans %}
{% block head %}
......
......@@ -5,6 +5,9 @@
forums-by-category-page
{% endblock %}
{% block site_nav_active 'places' %}
{% block site_nav_main_menu_active 'forums' %}
{% block title %}
{{ 'forum_list.page_title'|trans }}
{% endblock %}
......
{% extends 'base.html.twig' %}
{% block page_classes 'forum-category-manage-page' %}
{% block site_nav_active 'admin' %}
{% block site_nav_main_menu_active 'forum_categories' %}
{% block title 'title.manage_forum_categories'|trans %}
{% block head %}
......
......@@ -6,6 +6,8 @@
submission_sort,
submission_time %}
{% block site_nav_active 'front' %}
{% block head %}
<link rel="canonical" href="{{ url('front') }}">
......
......@@ -2,6 +2,7 @@
{% from 'message/_macros.html.twig' import message %}
{% block page_classes 'message-page' %}
{% block site_nav_active 'notifications' %}
{% block title thread.title %}
{% block body %}
......
......@@ -8,6 +8,7 @@
{{ include('_includes/meta_pagination.html.twig', {pager: threads}, with_context=false) }}
{% endblock %}
{% block site_nav_active 'notifications' %}
{% block title 'title.messages'|trans %}
{% block body %}
......
......@@ -3,6 +3,7 @@
{% from 'submission/_macros.html.twig' import submission %}
{% from 'comment/_macros.html.twig' import comment %}
{% block site_nav_active 'search' %}
{% block title 'heading.search'|trans %}
{% block body %}
......
{% extends 'base.html.twig' %}
{% block page_classes 'login-page' %}
{% block site_nav_active 'login' %}
{% block title 'title.log_in'|trans %}
{% block body %}
......
{% extends forum is defined and forum ? 'forum/base.html.twig' : 'base.html.twig' %}
{% block page_classes 'create-submission-page' %}
{% block site_nav_active 'submit' %}
{% block title 'title.create_submission'|trans %}
{% block body %}
......
......@@ -2,6 +2,8 @@
{% from _self import timestamp %}
{% block site_nav_active app.user is same as(user) ? 'user' %}
{% block sidebar %}
<section class="sidebar__section">
<h1 class="sidebar__title no-margin break-text">
......
{% extends 'base.html.twig' %}
{% extends 'user/base.html.twig' %}
{% block site_nav_user_menu_active 'block_list' %}
{% block page_classes 'user-block-list-page' %}
{% block title 'title.block_list'|trans %}
......
......@@ -6,6 +6,7 @@
{{ include('_includes/meta_pagination.html.twig', {pager: comments}) }}
{% endblock %}
{% block site_nav_user_menu_active 'profile' %}
{% block page_classes 'user-comments-page' %}
{% block title 'user.comments'|trans %}
......
{% extends 'base.html.twig' %}
{% extends 'user/base.html.twig' %}
{% from '_macros/icon.html.twig' import icon %}
{% block title 'edit_user.title'|trans({'%username%': user.username}) %}
{% block page_classes %}edit-user-page{% endblock %}
{% block site_nav_user_menu_active 'account' %}
{% block body %}
<h1 class="page-heading break-text">{{ block('title') }}</h1>
......
{% extends 'base.html.twig' %}
{% block page_classes 'user-list-page' %}
{% block site_nav_active 'admin' %}
{% block site_nav_main_menu_active 'users' %}
{% block title 'title.list_of_users'|trans({'%page%': page|localizednumber}) %}
{% block head %}
......
......@@ -5,6 +5,8 @@
{% include '_includes/meta_pagination.html.twig' with {pager: notifications} %}
{% endblock head %}
{% block site_nav_active 'notifications' %}
{% block title 'title.notifications'|trans %}
{% block body %}
......
{% extends 'base.html.twig' %}
{% block site_nav_active 'registration' %}
{% block page_classes %}registration-page{% endblock %}
{% block title 'title.sign_up'|trans %}
......
{% extends 'base.html.twig' %}
{% extends 'user/base.html.twig' %}
{% block title 'user_settings.title'|trans({'%username%': user.username}) %}
{% block site_nav_user_menu_active 'preferences' %}
{% block page_classes 'user-settings-page' %}
{% form_theme form '_forms/aligned_form_theme.html.twig' %}
......
......@@ -6,6 +6,7 @@
{{ include('_includes/meta_pagination.html.twig', {pager: submissions}) }}
{% endblock %}
{% block site_nav_user_menu_active 'profile' %}
{% block page_classes 'user-submissions-page' %}
{% block title 'user.submissions'|trans %}
......
......@@ -5,6 +5,7 @@
{% block title user.username %}
{% block page_classes 'user-page' %}
{% block site_nav_user_menu_active 'profile' %}
{% block head %}
{{ include('_includes/meta_pagination.html.twig', {pager: contributions}, with_context=false) }}
......
......@@ -4,6 +4,9 @@
wiki-not-found-page
{% endblock %}
{% block site_nav_active 'places' %}
{% block site_nav_main_menu_active 'wiki' %}
{% block title %}
{{ 'wiki.not_found_title'|trans }}
{% endblock %}
......
......@@ -4,6 +4,9 @@
wiki-all-page
{% endblock %}
{% block site_nav_active 'places' %}
{% block site_nav_main_menu_active 'wiki' %}
{% block title %}
{{ 'wiki.all_pages'|trans }}
{% endblock %}
......
......@@ -4,6 +4,9 @@
wiki-create-page