mirror of
https://github.com/cisagov/manage.get.gov.git
synced 2025-07-31 06:56:33 +02:00
Refactored to check for centered pages instead of left-justified pages. Simplified global application of widescreen in context processor. Fixed unformatted pages.
This commit is contained in:
CocoByte
parent
f8d7cfdb6a
commit
fde44c246c
16 changed files with 507 additions and 538 deletions
|
|
@ -19,7 +19,7 @@
|
|||
// matches max-width to equal the max-width of .grid-container
|
||||
// used to trick the eye into thinking we have left-aligned a
|
||||
// regular grid-container within a widescreen (see instances
|
||||
// where is_widescreen_left_justified is used in the html).
|
||||
// where is_widescreen_centered is used in the html).
|
||||
.max-width--grid-container {
|
||||
max-width: 64rem;
|
||||
}
|
||||
|
|
@ -252,7 +252,7 @@ TEMPLATES = [
|
|||
"registrar.context_processors.add_path_to_context",
|
||||
"registrar.context_processors.portfolio_permissions",
|
||||
"registrar.context_processors.is_widescreen_mode",
|
||||
"registrar.context_processors.is_widescreen_left_justified",
|
||||
"registrar.context_processors.is_widescreen_centered",
|
||||
],
|
||||
},
|
||||
},
|
||||
|
|
|
|||
|
|
@ -99,68 +99,30 @@ def portfolio_permissions(request):
|
|||
|
||||
|
||||
def is_widescreen_mode(request):
|
||||
widescreen_paths = [
|
||||
"/domain-request/",
|
||||
] # If this list is meant to include specific paths, populate it.
|
||||
portfolio_widescreen_paths = [
|
||||
"/domains/",
|
||||
"/requests/",
|
||||
"/no-organization-requests/",
|
||||
"/no-organization-domains/",
|
||||
"/members/",
|
||||
]
|
||||
# widescreen_paths can be a bear as it trickles down sub-urls. exclude_paths gives us a way out.
|
||||
exclude_paths = ["/domains/edit", "/admin/"]
|
||||
|
||||
# Check if the current path matches a widescreen path or the root path.
|
||||
is_widescreen = any(path in request.path for path in widescreen_paths) or request.path == "/"
|
||||
|
||||
# Check if the user is an organization user and the path matches portfolio paths.
|
||||
is_portfolio_widescreen = (
|
||||
hasattr(request.user, "is_org_user")
|
||||
and request.user.is_org_user(request)
|
||||
and any(path in request.path for path in portfolio_widescreen_paths)
|
||||
)
|
||||
exclude_paths = ["/admin/"]
|
||||
|
||||
# Widescreen is now global for all pages EXCEPT admin
|
||||
is_excluded = any(exclude_path in request.path for exclude_path in exclude_paths)
|
||||
|
||||
# Return a dictionary with the widescreen mode status.
|
||||
return {
|
||||
"is_widescreen_mode": (is_widescreen or is_portfolio_widescreen or get_is_widescreen_left_justified(request))
|
||||
and not is_excluded
|
||||
"is_widescreen_mode": not is_excluded
|
||||
}
|
||||
|
||||
|
||||
def get_is_widescreen_left_justified(request):
|
||||
def is_widescreen_centered(request):
|
||||
include_paths = [
|
||||
"/user-profile",
|
||||
"/request/",
|
||||
"/domain/",
|
||||
"/domains/",
|
||||
"/requests/",
|
||||
"/members/",
|
||||
]
|
||||
portfolio_include_paths = [
|
||||
"/organization/",
|
||||
"/senior-official/",
|
||||
"/member/",
|
||||
"/members/new-member",
|
||||
exclude_paths = [
|
||||
"/domains/edit",
|
||||
]
|
||||
exclude_paths = []
|
||||
|
||||
is_excluded = any(exclude_path in request.path for exclude_path in exclude_paths)
|
||||
|
||||
# Check if the current path matches a path in included_paths or the root path.
|
||||
is_widescreen_left_justified = any(path in request.path for path in include_paths)
|
||||
|
||||
# Check if the user is an organization user and the path matches portfolio_only paths.
|
||||
is_portfolio_widescreen_left_justified = (
|
||||
hasattr(request.user, "is_org_user")
|
||||
and request.user.is_org_user(request)
|
||||
and any(path in request.path for path in portfolio_include_paths)
|
||||
)
|
||||
|
||||
return (is_widescreen_left_justified or is_portfolio_widescreen_left_justified) and not is_excluded
|
||||
|
||||
|
||||
def is_widescreen_left_justified(request):
|
||||
is_widescreen_centered = any(path in request.path for path in include_paths) or request.path=="/"
|
||||
|
||||
# Return a dictionary with the widescreen mode status.
|
||||
return {"is_widescreen_left_justified": get_is_widescreen_left_justified(request)}
|
||||
return {"is_widescreen_centered": is_widescreen_centered and not is_excluded}
|
||||
|
|
|
|||
|
|
@ -6,7 +6,7 @@
|
|||
|
||||
{% block content %}
|
||||
<main id="main-content" class="grid-container {% if is_widescreen_mode %} grid-container--widescreen {% endif %}">
|
||||
<div class="grid-row grow-gap {% if is_widescreen_left_justified %} max-width--grid-container {% endif %}">
|
||||
<div class="grid-row grow-gap {% if not is_widescreen_centered %} max-width--grid-container {% endif %}">
|
||||
<div class="tablet:grid-col-6 usa-prose margin-bottom-3">
|
||||
<h1>
|
||||
{% translate "You are not authorized to view this page" %}
|
||||
|
|
|
|||
|
|
@ -6,7 +6,7 @@
|
|||
|
||||
{% block content %}
|
||||
<main id="main-content" class="grid-container {% if is_widescreen_mode %} grid-container--widescreen {% endif %}">
|
||||
<div class="grid-row grow-gap {% if is_widescreen_left_justified %} max-width--grid-container {% endif %}">
|
||||
<div class="grid-row grow-gap {% if not is_widescreen_centered %} max-width--grid-container {% endif %}">
|
||||
<div class="tablet:grid-col-6 usa-prose margin-bottom-3">
|
||||
<h1>
|
||||
{% translate "You're not authorized to view this page." %}
|
||||
|
|
|
|||
|
|
@ -6,7 +6,7 @@
|
|||
|
||||
{% block content %}
|
||||
<main id="main-content" class="grid-container {% if is_widescreen_mode %} grid-container--widescreen {% endif %}">
|
||||
<div class="grid-row grid-gap {% if is_widescreen_left_justified %} max-width--grid-container {% endif %}">
|
||||
<div class="grid-row grid-gap {% if not is_widescreen_centered %} max-width--grid-container {% endif %}">
|
||||
<div class="tablet:grid-col-6 usa-prose margin-bottom-3">
|
||||
<h1>
|
||||
{% translate "We couldn’t find that page" %}
|
||||
|
|
|
|||
|
|
@ -6,7 +6,7 @@
|
|||
|
||||
{% block content %}
|
||||
<main id="main-content" class="grid-container {% if is_widescreen_mode %} grid-container--widescreen {% endif %}">
|
||||
<div class="grid-row grid-gap {% if is_widescreen_left_justified %} max-width--grid-container {% endif %}">
|
||||
<div class="grid-row grid-gap {% if not is_widescreen_centered %} max-width--grid-container {% endif %}">
|
||||
<div class="tablet:grid-col-6 usa-prose margin-bottom-3">
|
||||
<h1>
|
||||
{% translate "We're having some trouble." %}
|
||||
|
|
|
|||
|
|
@ -6,7 +6,7 @@
|
|||
{% block content %}
|
||||
<div class="grid-container {% if is_widescreen_mode %} grid-container--widescreen {% endif %}">
|
||||
|
||||
<div class="grid-row grid-gap {% if is_widescreen_left_justified %} max-width--grid-container {% endif %}">
|
||||
<div class="grid-row grid-gap {% if not is_widescreen_centered %} max-width--grid-container {% endif %}">
|
||||
<div class="tablet:grid-col-3 ">
|
||||
<p class="font-body-md margin-top-0 margin-bottom-2
|
||||
text-primary-darker text-semibold domain-name-wrap"
|
||||
|
|
|
|||
|
|
@ -4,7 +4,7 @@
|
|||
{% block title %}{{form_titles|get_item:steps.current}} | Request a .gov | {% endblock %}
|
||||
{% block content %}
|
||||
<div class="grid-container {% if is_widescreen_mode %} grid-container--widescreen {% endif %}">
|
||||
<div class="grid-row grid-gap {% if is_widescreen_left_justified %} max-width--grid-container {% endif %}">
|
||||
<div class="grid-row grid-gap {% if not is_widescreen_centered %} max-width--grid-container {% endif %}">
|
||||
<div class="tablet:grid-col-3">
|
||||
{% include 'domain_request_sidebar.html' %}
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -4,8 +4,9 @@
|
|||
{% block title %} Start a request | {% endblock %}
|
||||
|
||||
{% block content %}
|
||||
<main id="main-content" class="grid-container">
|
||||
<div class="grid-col desktop:grid-offset-2 desktop:grid-col-8">
|
||||
<main id="main-content" class="grid-container {% if is_widescreen_mode %} grid-container--widescreen {% endif %}">
|
||||
<div class="grid-row {% if not is_widescreen_centered %} max-width--grid-container {% endif %}">
|
||||
<div class="grid-col {% if is_widescreen_centered %} desktop:grid-offset-2 {% endif %} desktop:grid-col-8">
|
||||
|
||||
<form class="usa-form usa-form--extra-large" method="post" novalidate>
|
||||
{% csrf_token %}
|
||||
|
|
|
|||
|
|
@ -8,8 +8,9 @@
|
|||
{% endblock wrapperdiv %}
|
||||
|
||||
{% block content %}
|
||||
<div class="grid-container">
|
||||
<div class="grid-col desktop:grid-offset-2 desktop:grid-col-8">
|
||||
<div class="grid-container {% if is_widescreen_mode %} grid-container--widescreen {% endif %}">
|
||||
<div class="grid-row {% if not is_widescreen_centered %} max-width--grid-container {% endif %}">
|
||||
<div class="grid-col {% if is_widescreen_centered %} desktop:grid-offset-2 {% endif %} desktop:grid-col-8">
|
||||
|
||||
|
||||
<h1>Withdraw request for {{ DomainRequest.requested_domain.name }}?</h1>
|
||||
|
|
@ -20,6 +21,7 @@
|
|||
<a href="{% url 'domain-request-status' DomainRequest.id %}">Cancel</a></p>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
{% endblock %}
|
||||
|
|
|
|||
|
|
@ -10,7 +10,7 @@
|
|||
{# the entire logged in page goes here #}
|
||||
|
||||
{% block homepage_content %}
|
||||
<div class="tablet:grid-col-11 desktop:grid-col-10 tablet:grid-offset-1">
|
||||
<div class="tablet:grid-col-11 desktop:grid-col-10 {% if is_widescreen_centered %} tablet:grid-offset-1 {% endif %}">
|
||||
{% block messages %}
|
||||
{% include "includes/form_messages.html" %}
|
||||
{% endblock %}
|
||||
|
|
|
|||
|
|
@ -1,7 +1,8 @@
|
|||
{% load custom_filters %}
|
||||
{% load static url_helpers %}
|
||||
<main id="main-content" class="grid-container">
|
||||
<div class="grid-col desktop:grid-offset-2 desktop:grid-col-8">
|
||||
<main id="main-content" class="grid-container {% if is_widescreen_mode %} grid-container--widescreen {% endif %}">
|
||||
<div class="grid-row {% if not is_widescreen_centered %} max-width--grid-container {% endif %}">
|
||||
<div class="grid-col {% if is_widescreen_centered %} desktop:grid-offset-2 {% endif %} desktop:grid-col-8">
|
||||
{% block breadcrumb %}
|
||||
{% if portfolio %}
|
||||
{% url 'domain-requests' as url %}
|
||||
|
|
@ -139,7 +140,7 @@
|
|||
{% endblock modify_request %}
|
||||
</div>
|
||||
|
||||
<div class="grid-col desktop:grid-offset-2 maxw-tablet">
|
||||
<div class="grid-col {% if is_widescreen_centered %} desktop:grid-offset-2 maxw-tablet{% endif %}">
|
||||
{% block request_summary_header %}
|
||||
<h2 class="text-primary-darker"> Summary of your domain request </h2>
|
||||
{% endblock request_summary_header%}
|
||||
|
|
@ -233,4 +234,5 @@
|
|||
{% endwith %}
|
||||
{% endblock request_summary%}
|
||||
</div>
|
||||
</div>
|
||||
</main>
|
||||
|
|
@ -1,7 +1,8 @@
|
|||
{% load custom_filters %}
|
||||
{% load static url_helpers %}
|
||||
<main id="main-content" class="grid-container">
|
||||
<div class="grid-col desktop:grid-offset-2 desktop:grid-col-8">
|
||||
<main id="main-content" class="grid-container {% if is_widescreen_mode %} grid-container--widescreen {% endif %}">
|
||||
<div class="grid-row {% if not is_widescreen_centered %} max-width--grid-container {% endif %}">
|
||||
<div class="grid-col desktop:grid-col-8 {% if is_widescreen_centered %} desktop:grid-offset-2 {% endif %}">
|
||||
{% block breadcrumb %}
|
||||
{% if portfolio %}
|
||||
{% url 'domain-requests' as url %}
|
||||
|
|
@ -139,7 +140,7 @@
|
|||
{% endblock modify_request %}
|
||||
</div>
|
||||
|
||||
<div class="grid-col desktop:grid-offset-2 maxw-tablet">
|
||||
<div class="grid-col {% if is_widescreen_centered %} desktop:grid-offset-2 maxw-tablet{% endif %}">
|
||||
{% block request_summary_header %}
|
||||
<h2 class="text-primary-darker"> Summary of your domain request </h2>
|
||||
{% endblock request_summary_header%}
|
||||
|
|
@ -237,4 +238,5 @@
|
|||
{% endif %}
|
||||
{% endblock request_summary%}
|
||||
</div>
|
||||
</div>
|
||||
</main>
|
||||
|
|
@ -8,8 +8,8 @@
|
|||
{% if user.is_authenticated %}
|
||||
{# the entire logged in page goes here #}
|
||||
|
||||
<div class="grid-row {% if is_widescreen_left_justified %} max-width--grid-container {% endif %}">
|
||||
<div class="tablet:grid-col-11 desktop:grid-col-10 {% if not is_widescreen_left_justified %} tablet:grid-offset-1 {% endif %}">
|
||||
<div class="grid-row {% if not is_widescreen_centered %} max-width--grid-container {% endif %}">
|
||||
<div class="tablet:grid-col-11 desktop:grid-col-10 {% if is_widescreen_centered %} tablet:grid-offset-1 {% endif %}">
|
||||
{% block messages %}
|
||||
{% include "includes/form_messages.html" %}
|
||||
{% endblock %}
|
||||
|
|
|
|||
|
|
@ -12,7 +12,7 @@ Edit your User Profile |
|
|||
|
||||
{% block content %}
|
||||
<main id="main-content" class="grid-container {% if is_widescreen_mode %} grid-container--widescreen {% endif %}">
|
||||
<div class="grid-row {% if is_widescreen_left_justified %} max-width--grid-container {% endif %}">
|
||||
<div class="grid-row {% if not is_widescreen_centered %} max-width--grid-container {% endif %}">
|
||||
<div class="desktop:grid-col-8">
|
||||
{% if messages %}
|
||||
{% for message in messages %}
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue