Merge branch 'main' into za/3025-add-new-suborgs

This commit is contained in:
zandercymatics 2025-01-02 09:35:23 -07:00
commit b7b9f96f7a
No known key found for this signature in database
GPG key ID: FF4636ABEC9682B7
43 changed files with 673 additions and 731 deletions

View file

@ -176,16 +176,7 @@ html[data-theme="dark"] {
color: var(--primary-fg);
}
// Reset the USWDS styles for alerts
@include at-media(desktop) {
.dashboard .usa-alert__body--widescreen {
padding-left: 4rem !important;
}
.dashboard .usa-alert__body--widescreen::before {
left: 1.5rem !important;
}
}
#branding h1,
h1, h2, h3,

View file

@ -1,18 +1,21 @@
@use "uswds-core" as *;
@use "base" as *;
// Fixes some font size disparities with the Figma
// for usa-alert alert elements
.usa-alert {
.usa-alert__heading.larger-font-sizing {
font-size: units(3);
}
}
/*----------------
Alert Layout
-----------------*/
.usa-alert__text.measure-none {
max-width: measure(none);
}
// The icon was off center for some reason
// Fixes that issue
@include at-media(desktop) {
// NOTE: !important is used because _font.scss overrides this
.usa-alert__body--widescreen {
max-width: $widescreen-max-width !important;
}
@media (min-width: 64em){
.usa-alert--warning{
.usa-alert__body::before {
left: 1rem !important;
@ -21,29 +24,13 @@
.usa-alert__body.margin-left-1 {
margin-left: 0.5rem!important;
}
.usa-alert__body--widescreen::before {
left: 4rem !important;
}
.usa-alert__body--widescreen {
padding-left: 7rem!important;
}
}
/*----------------
Alert Fonts
-----------------*/
// Fixes some font size disparities with the Figma
// for usa-alert alert elements
.usa-alert {
.usa-alert__heading.larger-font-sizing {
font-size: 1.5rem;
}
// NOTE: !important is used because _font.scss overrides this
.usa-alert__body--widescreen {
max-width: $widescreen-max-width !important;
}
/*----------------
Alert Coloring
-----------------*/
.usa-site-alert--hot-pink {
.usa-alert {
background-color: $hot-pink;
@ -60,4 +47,3 @@
background-color: color('base-darkest');
}
}

View file

@ -2,8 +2,6 @@
@use "cisa_colors" as *;
$widescreen-max-width: 1920px;
$widescreen-x-padding: 4.5rem;
$hot-pink: #FFC3F9;
/* Styles for making visible to screen reader / AT users only. */
@ -254,15 +252,6 @@ abbr[title] {
max-width: $widescreen-max-width;
}
// This is used in cases where we want to align content to widescreen margins
// but we don't want the content itself to have widescreen widths
@include at-media(desktop) {
.padding-x--widescreen {
padding-left: $widescreen-x-padding !important;
padding-right: $widescreen-x-padding !important;
}
}
.margin-right-neg-4px {
margin-right: -4px;
}
@ -277,7 +266,3 @@ abbr[title] {
height: 1.5em;
width: 1.5em;
}
.maxw-fit-content {
max-width: fit-content;
}

View file

@ -6,21 +6,3 @@
.usa-identifier__container--widescreen {
max-width: $widescreen-max-width !important;
}
// NOTE: !important is used because we are overriding default
// USWDS paddings in a few locations
@include at-media(desktop) {
.grid-container--widescreen {
padding-left: $widescreen-x-padding !important;
padding-right: $widescreen-x-padding !important;
}
}
// 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_centered is used in the html).
.max-width--grid-container {
max-width: 960px;
}

View file

@ -110,8 +110,8 @@
}
}
.usa-nav__secondary {
right: 1rem;
padding-right: $widescreen-x-padding;
// I don't know why USWDS has this at 2 rem, which puts it out of alignment
right: 3rem;
color: color('white');
bottom: 4.3rem;
.usa-nav-link,

View file

@ -251,7 +251,7 @@ TEMPLATES = [
"registrar.context_processors.org_user_status",
"registrar.context_processors.add_path_to_context",
"registrar.context_processors.portfolio_permissions",
"registrar.context_processors.is_widescreen_centered",
"registrar.context_processors.is_widescreen_mode",
],
},
},

View file

@ -109,21 +109,31 @@ def portfolio_permissions(request):
return portfolio_context
def is_widescreen_centered(request):
include_paths = [
def is_widescreen_mode(request):
widescreen_paths = [] # If this list is meant to include specific paths, populate it.
portfolio_widescreen_paths = [
"/domains/",
"/requests/",
"/members/",
"/request/",
"/no-organization-requests/",
"/no-organization-domains/",
"/domain-request/",
]
# widescreen_paths can be a bear as it trickles down sub-urls. exclude_paths gives us a way out.
exclude_paths = [
"/domains/edit",
"members/new-member/",
]
is_excluded = any(exclude_path in request.path for exclude_path in exclude_paths)
# 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 current path matches a path in included_paths or the root path.
is_widescreen_centered = any(path in request.path for path in include_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)
and not any(exclude_path in request.path for exclude_path in exclude_paths)
)
# Return a dictionary with the widescreen mode status.
return {"is_widescreen_centered": is_widescreen_centered and not is_excluded}
return {"is_widescreen_mode": is_widescreen or is_portfolio_widescreen}

View file

@ -5,8 +5,8 @@
{% block title %}{% translate "Unauthorized | " %}{% endblock %}
{% block content %}
<main id="main-content" class="grid-container grid-container--widescreen">
<div class="grid-row grow-gap {% if not is_widescreen_centered %}max-width--grid-container{% endif %}">
<main id="main-content" class="grid-container {% if is_widescreen_mode %} grid-container--widescreen{% endif %}">
<div class="grid-row grow-gap">
<div class="tablet:grid-col-6 usa-prose margin-bottom-3">
<h1>
{% translate "You are not authorized to view this page" %}

View file

@ -5,8 +5,8 @@
{% block title %}{% translate "Forbidden | " %}{% endblock %}
{% block content %}
<main id="main-content" class="grid-container grid-container--widescreen">
<div class="grid-row grow-gap {% if not is_widescreen_centered %}max-width--grid-container{% endif %}">
<main id="main-content" class="grid-container {% if is_widescreen_mode %} grid-container--widescreen{% endif %}">
<div class="grid-row grow-gap">
<div class="tablet:grid-col-6 usa-prose margin-bottom-3">
<h1>
{% translate "You're not authorized to view this page." %}

View file

@ -5,8 +5,8 @@
{% block title %}{% translate "Page not found | " %}{% endblock %}
{% block content %}
<main id="main-content" class="grid-container grid-container--widescreen">
<div class="grid-row grid-gap {% if not is_widescreen_centered %}max-width--grid-container{% endif %}">
<main id="main-content" class="grid-container {% if is_widescreen_mode %} grid-container--widescreen{% endif %}">
<div class="grid-row grid-gap">
<div class="tablet:grid-col-6 usa-prose margin-bottom-3">
<h1>
{% translate "We couldnt find that page" %}

View file

@ -5,8 +5,8 @@
{% block title %}{% translate "Server error | " %}{% endblock %}
{% block content %}
<main id="main-content" class="grid-container grid-container--widescreen">
<div class="grid-row grid-gap {% if not is_widescreen_centered %}max-width--grid-container{% endif %}">
<main id="main-content" class="grid-container {% if is_widescreen_mode %} grid-container--widescreen{% endif %}">
<div class="grid-row grid-gap">
<div class="tablet:grid-col-6 usa-prose margin-bottom-3">
<h1>
{% translate "We're having some trouble." %}

View file

@ -39,7 +39,7 @@
{% for model in app.models %}
<tr class="model-{{ model.object_name|lower }}{% if model.admin_url in request.path|urlencode %} current-model{% endif %}">
{% if model.admin_url %}
<th scope="row"><a href="{{ model.admin_url }}"{% if model.admin_url in request.path|urlencode %} aria-current="page"{% endif %}">{{ model.name }}</a></th>
<th scope="row"><a href="{{ model.admin_url }}"{% if model.admin_url in request.path|urlencode %} aria-current="page"{% endif %}>{{ model.name }}</a></th>
{% else %}
<th scope="row">{{ model.name }}</th>
{% endif %}

View file

@ -61,7 +61,7 @@ https://github.com/django/django/blob/main/django/contrib/admin/templates/admin/
{% if field.field.help_text %}
{# .gov override #}
{% block help_text %}
<div class="help"{% if field.field.id_for_label %} id="{{ field.field.id_for_label }}_helptext"{% endif %}">
<div class="help"{% if field.field.id_for_label %} id="{{ field.field.id_for_label }}_helptext"{% endif %}>
<div>{{ field.field.help_text|safe }}</div>
</div>
{% endblock help_text %}

View file

@ -43,7 +43,7 @@
<select name="selected_user" id="selected_user" class="admin-combobox margin-top-0" onchange="this.form.submit()">
<option value="">Select a user</option>
{% for user in other_users %}
<option value="{{ user.pk }}" {% if selected_user and user.pk == selected_user.pk %}selected{% endif %}">
<option value="{{ user.pk }}" {% if selected_user and user.pk == selected_user.pk %}selected{% endif %}>
{{ user.first_name }} {{ user.last_name }}
</option>
{% endfor %}

View file

@ -97,7 +97,7 @@
<section class="usa-banner" aria-label="Official website of the United States government">
<div class="usa-accordion">
<header class="usa-banner__header">
<div class="usa-banner__inner usa-banner__inner--widescreen padding-x--widescreen">
<div class="usa-banner__inner {% if is_widescreen_mode %} usa-banner__inner--widescreen {% endif %}">
<div class="grid-col-auto">
<img class="usa-banner__header-flag" src="{% static 'img/us_flag_small.png' %}" alt="U.S. flag" />
</div>
@ -113,7 +113,7 @@
</button>
</div>
</header>
<div class="usa-banner__content usa-accordion__content padding-x--widescreen margin-x-0" id="gov-banner-default">
<div class="usa-banner__content usa-accordion__content" id="gov-banner-default">
<div class="grid-row grid-gap-lg">
<div class="usa-banner__guidance tablet:grid-col-6">
<img class="usa-banner__icon usa-media-block__img" src="{% static 'img/icon-dot-gov.svg' %}" role="img"
@ -159,14 +159,14 @@
{% block wrapper %}
{% block wrapperdiv %}
<div id="wrapper" class="wrapper--padding-top-6">
<div id="wrapper">
{% endblock wrapperdiv %}
{% block messages %}
{% if messages %}
<ul class="messages">
{% for message in messages %}
{% if 'base' in message.extra_tags %}
<li{% if message.tags %} class="{{ message.tags }}" {% endif %}">
<li{% if message.tags %} class="{{ message.tags }}" {% endif %}>
{{ message }}
</li>
{% endif %}

View file

@ -11,7 +11,7 @@
{% if messages %}
<ul class="messages">
{% for message in messages %}
<li {% if message.tags %} class="{{ message.tags }}" {% endif %}">
<li {% if message.tags %} class="{{ message.tags }}" {% endif %}>
{{ message }}
</li>
{% endfor %}

View file

@ -1,6 +1,6 @@
{% comment %} This view provides a detail button that can be used to show/hide content {% endcomment %}
<details class="margin-top-1 dja-detail-table" aria-role="button" {% if start_open %}open{% else %}closed{% endif %}">
<details class="margin-top-1 dja-detail-table" aria-role="button" {% if start_open %}open{% else %}closed{% endif %}>
<summary class="padding-1 padding-left-0 dja-details-summary">Details</summary>
<div class="grid-container margin-left-0 padding-left-0 padding-right-0 dja-details-contents">
{% block detail_content %}

View file

@ -11,7 +11,7 @@
{% endblock %}
{% block help_text %}
<div class="help margin-bottom-1" {% if field.field.id_for_label %} id="{{ field.field.id_for_label }}_helptext"{% endif %}">
<div class="help margin-bottom-1" {% if field.field.id_for_label %} id="{{ field.field.id_for_label }}_helptext"{% endif %}>
{% if field.field.name == "state" %}
<div>{{ state_help_message }}</div>
{% else %}

View file

@ -6,14 +6,14 @@
<ul class="mulitple-choice">
{% for choice in choices %}
{% if choice.reset %}
<li{% if choice.selected %} class="selected"{% endif %}">
<li{% if choice.selected %} class="selected"{% endif %}>
<a href="{{ choice.query_string|iriencode }}" title="{{ choice.display }}">{{ choice.display }}</a>
</li>
{% endif %}
{% endfor %}
{% for choice in choices %}
{% if not choice.reset %}
<li{% if choice.selected %} class="selected"{% endif %}">
<li{% if choice.selected %} class="selected"{% endif %}>
{% if choice.selected and choice.exclude_query_string %}
<a class="choice-filter choice-filter--checked" href="{{ choice.exclude_query_string|iriencode }}">{{ choice.display }}
<svg class="usa-icon position-absolute z-0 left-0" aria-hidden="true" focusable="false" role="img" width="24" height="24">

View file

@ -4,10 +4,10 @@
{% block title %}{{ domain.name }} | {% endblock %}
{% block content %}
<div class="grid-container grid-container--widescreen">
<div class="grid-container">
<div class="grid-row grid-gap {% if not is_widescreen_centered %}max-width--grid-container{% endif %}">
<div class="tablet:grid-col-3 ">
<div class="grid-row grid-gap">
<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"
>

View file

@ -3,13 +3,13 @@
{% block title %}{{form_titles|get_item:steps.current}} | Request a .gov | {% endblock %}
{% block content %}
<div class="grid-container grid-container--widescreen">
<div class="grid-row grid-gap {% if not is_widescreen_centered %}max-width--grid-container{% endif %}">
<div class="grid-container">
<div class="grid-row grid-gap">
<div class="tablet:grid-col-3">
{% include 'domain_request_sidebar.html' %}
</div>
<div class="tablet:grid-col-9">
<main id="main-content" class="register-form-step">
<main id="main-content" class="grid-container register-form-step">
<input type="hidden" class="display-none" id="wizard-domain-request-id" value="{{domain_request_id}}"/>
{% if steps.current == steps.first %}
{% if portfolio %}

View file

@ -4,9 +4,8 @@
{% block title %} Start a request | {% endblock %}
{% block content %}
<main id="main-content" class="grid-container grid-container--widescreen">
<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">
<main id="main-content" class="grid-container">
<div class="grid-col desktop:grid-offset-2 desktop:grid-col-8">
<form class="usa-form usa-form--extra-large" method="post" novalidate>
{% csrf_token %}
@ -26,7 +25,7 @@
{% include "includes/profile_information.html" with user=user%}
{% block form_buttons %}
{% block form_buttons %}
<div class="stepnav">
<button
type="submit"
@ -35,7 +34,7 @@
class="usa-button"
>Continue</button>
</div>
{% endblock %}
{% endblock %}
</form>

View file

@ -8,20 +8,18 @@
{% endblock wrapperdiv %}
{% block content %}
<div class="grid-container grid-container--widescreen">
<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">
<div class="grid-container">
<div class="grid-col desktop:grid-offset-2 desktop:grid-col-8">
<h1>Withdraw request for {{ DomainRequest.requested_domain.name }}?</h1>
<h1>Withdraw request for {{ DomainRequest.requested_domain.name }}?</h1>
<p>If you withdraw your request, we won't review it. Once you withdraw your request, you can edit it and submit it again. </p>
<p>If you withdraw your request, we won't review it. Once you withdraw your request, you can edit it and submit it again. </p>
<p><a href="{% url 'domain-request-withdrawn' DomainRequest.id %}" class="usa-button withdraw">Withdraw request</a>
<p><a href="{% url 'domain-request-withdrawn' DomainRequest.id %}" class="usa-button withdraw">Withdraw request</a>
<a href="{% url 'domain-request-status' DomainRequest.id %}">Cancel</a></p>
</div>
</div>
</div>
</div>
{% endblock %}

View file

@ -18,7 +18,7 @@
<li class="usa-sidenav__item">
{% url 'domain-dns' pk=domain.id as url %}
<a href="{{ url }}" {% if request.path|startswith:url %}class="usa-current"{% endif %}">
<a href="{{ url }}" {% if request.path|startswith:url %}class="usa-current"{% endif %}>
DNS
</a>
{% if request.path|startswith:url %}

View file

@ -5,12 +5,12 @@
{% block title %} Home | {% endblock %}
{% block content %}
<main id="main-content" class="grid-container grid-container--widescreen">
<main id="main-content" class="grid-container {% if is_widescreen_mode %} grid-container--widescreen{% endif %}">
{% if user.is_authenticated %}
{# the entire logged in page goes here #}
{% block homepage_content %}
<div class="tablet:grid-col-11 desktop:grid-col-10 {% if is_widescreen_centered %}tablet:grid-offset-1{% endif %}">
<div class="tablet:grid-col-11 desktop:grid-col-10 tablet:grid-offset-1">
{% block messages %}
{% include "includes/form_messages.html" %}
{% endblock %}

View file

@ -1,6 +1,6 @@
<div class="margin-y-0 {% if add_class %}{{ add_class }}{% endif %}" aria-label="Site alert">
<div class="usa-alert usa-alert--error">
<div class="usa-alert__body usa-alert__body--widescreen">
<div class="usa-alert__body {% if is_widescreen_mode %}usa-alert__body--widescreen{% endif %}">
<h4 class="usa-alert__heading">
Header
</h4>

View file

@ -1,6 +1,6 @@
<section class="usa-site-alert usa-site-alert--info margin-y-0 {% if add_class %}{{ add_class }}{% endif %}" aria-label="Site alert">
<div class="usa-alert">
<div class="usa-alert__body usa-alert__body--widescreen">
<div class="usa-alert__body {% if is_widescreen_mode %}usa-alert__body--widescreen{% endif %}">
<h4 class="usa-alert__heading">
Header
</h4>

View file

@ -1,6 +1,6 @@
<section class="usa-site-alert usa-site-alert--emergency usa-site-alert--hot-pink margin-y-0 {% if add_class %}{{ add_class }}{% endif %}" aria-label="Site alert">
<div class="usa-alert">
<div class="usa-alert__body {% if add_body_class %}{{ add_body_class }}{% endif %} usa-alert__body--widescreen">
<div class="usa-alert__body {% if add_body_class %}{{ add_body_class }}{% endif %} {% if is_widescreen_mode %}usa-alert__body--widescreen{% endif %}">
<p class="usa-alert__text maxw-none">
<strong>Attention:</strong> You are on a test site.
</p>

View file

@ -1,6 +1,6 @@
<section class="usa-site-alert usa-site-alert--emergency margin-y-0 {% if add_class %}{{ add_class }}{% endif %}" aria-label="Site alert">
<div class="usa-alert">
<div class="usa-alert__body usa-alert__body--widescreen">
<div class="usa-alert__body {% if is_widescreen_mode %}usa-alert__body--widescreen{% endif %}">
<h3 class="usa-alert__heading">
Service disruption
</h3>

View file

@ -1,6 +1,6 @@
<section class="usa-site-alert usa-site-alert--emergency margin-y-0 {% if add_class %}{{ add_class }}{% endif %}" aria-label="Site alert">
<div class="usa-alert">
<div class="usa-alert__body usa-alert__body--widescreen">
<div class="usa-alert__body {% if is_widescreen_mode %}usa-alert__body--widescreen{% endif %}">
<h3 class="usa-alert__heading">
Header here
</h3>

View file

@ -1,6 +1,6 @@
<section class="usa-site-alert usa-site-alert--emergency margin-y-0 {% if add_class %}{{ add_class }}{% endif %}" aria-label="Site alert">
<div class="usa-alert">
<div class="usa-alert__body usa-alert__body--widescreen">
<div class="usa-alert__body {% if is_widescreen_mode %}usa-alert__body--widescreen{% endif %}">
<h3 class="usa-alert__heading">
System outage
</h3>

View file

@ -1,6 +1,6 @@
<div class="margin-y-0 {% if add_class %}{{ add_class }}{% endif %}" aria-label="Site alert">
<div class="usa-alert usa-alert--warning">
<div class="usa-alert__body usa-alert__body--widescreen">
<div class="usa-alert__body {% if is_widescreen_mode %}usa-alert__body--widescreen{% endif %}">
<h4 class="usa-alert__heading">
Header
</h4>

View file

@ -1,8 +1,7 @@
{% load custom_filters %}
{% load static url_helpers %}
<main id="main-content" class="grid-container grid-container--widescreen">
<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">
<main id="main-content" class="grid-container">
<div class="grid-col desktop:grid-offset-2 desktop:grid-col-8">
{% block breadcrumb %}
{% if portfolio %}
{% url 'domain-requests' as url %}
@ -140,7 +139,7 @@
{% endblock modify_request %}
</div>
<div class="grid-col {% if is_widescreen_centered %}desktop:grid-offset-2 maxw-tablet{% endif %}">
<div class="grid-col desktop:grid-offset-2 maxw-tablet">
{% block request_summary_header %}
<h2 class="text-primary-darker"> Summary of your domain request </h2>
{% endblock request_summary_header%}
@ -234,5 +233,4 @@
{% endwith %}
{% endblock request_summary%}
</div>
</div>
</main>

View file

@ -4,8 +4,8 @@
{% url 'get_domain_requests_json' as url %}
<span id="get_domain_requests_json_url" class="display-none">{{url}}</span>
<section class="section-outlined domain-requests {% if portfolio %}section-outlined--border-base-light{% endif %}" id="domain-requests">
<div class="section-outlined__header margin-bottom-3 {% if not portfolio %}section-outlined__header--no-portfolio justify-content-space-between{% else %} grid-row{% endif %}">
<section class="section-outlined domain-requests{% if portfolio %} section-outlined--border-base-light{% endif %}" id="domain-requests">
<div class="section-outlined__header margin-bottom-3 {% if not portfolio %} section-outlined__header--no-portfolio justify-content-space-between{% else %} grid-row{% endif %}">
{% if not portfolio %}
<h2 id="domain-requests-header" class="display-inline-block">Domain requests</h2>
{% else %}
@ -13,7 +13,7 @@
<span id="portfolio-js-value" data-portfolio="{{ portfolio.id }}"></span>
{% endif %}
<div class="section-outlined__search section-outlined__search--widescreen {% if portfolio %}mobile:grid-col-12 desktop:grid-col-6{% endif %}">
<div class="section-outlined__search {% if portfolio %} mobile:grid-col-12 desktop:grid-col-6{% endif %} {% if is_widescreen_mode %} section-outlined__search--widescreen {% endif %}">
<section aria-label="Domain requests search component" class="margin-top-2">
<form class="usa-search usa-search--small" method="POST" role="search">
{% csrf_token %}

View file

@ -12,7 +12,7 @@
{% if has_domain_renewal_flag and num_expiring_domains > 0 and has_any_domains_portfolio_permission %}
<section class="usa-site-alert usa-site-alert--info margin-bottom-2 {% if add_class %}{{ add_class }}{% endif %}" aria-label="Site alert">
<div class="usa-alert">
<div class="usa-alert__body usa-alert__body--widescreen">
<div class="usa-alert__body {% if is_widescreen_mode %}usa-alert__body--widescreen{% endif %}">
<p class="usa-alert__text maxw-none">
{% if num_expiring_domains == 1%}
One domain will expire soon. Go to "Manage" to renew the domain. <a href="#" id="link-expiring-domains" class="usa-link">Show expiring domain.</a>
@ -33,7 +33,7 @@
<!-- Embedding the portfolio value in a data attribute -->
<span id="portfolio-js-value" data-portfolio="{{ portfolio.id }}"></span>
{% endif %}
<div class="section-outlined__search section-outlined__search--widescreen {% if portfolio %}mobile:grid-col-12 desktop:grid-col-6{% endif %}">
<div class="section-outlined__search {% if portfolio %} mobile:grid-col-12 desktop:grid-col-6{% endif %} {% if is_widescreen_mode %} section-outlined__search--widescreen {% endif %}">
<section aria-label="Domains search component" class="margin-top-2">
<form class="usa-search usa-search--small" method="POST" role="search">
{% csrf_token %}
@ -78,7 +78,7 @@
{% if has_domain_renewal_flag and num_expiring_domains > 0 and not portfolio %}
<section class="usa-site-alert usa-site-alert--info margin-bottom-2 {% if add_class %}{{ add_class }}{% endif %}" aria-label="Site alert">
<div class="usa-alert">
<div class="usa-alert__body usa-alert__body--widescreen">
<div class="usa-alert__body {% if is_widescreen_mode %}usa-alert__body--widescreen{% endif %}">
<p class="usa-alert__text maxw-none">
{% if num_expiring_domains == 1%}
One domain will expire soon. Go to "Manage" to renew the domain. <a href="#" id="link-expiring-domains" class="usa-link">Show expiring domain.</a>

View file

@ -3,7 +3,7 @@
<footer class="usa-footer">
<div class="usa-footer__secondary-section">
<div class="grid-container grid-container--widescreen">
<div class="grid-container {% if is_widescreen_mode %} grid-container--widescreen{% endif %}">
<div class="grid-row grid-gap">
<div
class="
@ -24,7 +24,7 @@
<div class="usa-footer__contact-links
mobile-lg:grid-col-6 flex-align-self-center"
>
<address class="usa-footer__address maxw-none">
<address class="usa-footer__address">
<div class="usa-footer__contact-info grid-row grid-gap-md">
{% if show_manage_your_domains %}
<div class="grid-col-auto">
@ -51,7 +51,7 @@
class="usa-identifier__section usa-identifier__section--masthead"
aria-label="Agency identifier"
>
<div class="usa-identifier__container usa-identifier__container--widescreen padding-x--widescreen">
<div class="usa-identifier__container {% if is_widescreen_mode %} usa-identifier__container--widescreen {% endif %}">
<div class="usa-identifier__logos">
<a rel="noopener noreferrer" target="_blank" href="https://www.cisa.gov" class="usa-identifier__logo"
><img
@ -77,7 +77,7 @@
class="usa-identifier__section usa-identifier__section--required-links"
aria-label="Important links"
>
<div class="usa-identifier__container usa-identifier__container--widescreen padding-x--widescreen">
<div class="usa-identifier__container {% if is_widescreen_mode %} usa-identifier__container--widescreen {% endif %}">
<ul class="usa-identifier__required-links-list">
<li class="usa-identifier__required-links-item">
<a rel="noopener noreferrer" target="_blank" href="{% public_site_url 'about/' %}"
@ -119,7 +119,7 @@
class="usa-identifier__section usa-identifier__section--usagov"
aria-label="U.S. government information and services"
>
<div class="usa-identifier__container usa-identifier__container--widescreen padding-x--widescreen">
<div class="usa-identifier__container {% if is_widescreen_mode %} usa-identifier__container--widescreen {% endif %}">
<div class="usa-identifier__usagov-description">
Looking for U.S. government information and services?
</div>

View file

@ -1,7 +1,7 @@
{% load static %}
<header class="usa-header usa-header--basic">
<div class="usa-nav-container usa-nav-container--widescreen padding-x--widescreen">
<div class="usa-nav-container {% if is_widescreen_mode %} usa-nav-container--widescreen {% endif %}">
<div class="usa-navbar">
{% include "includes/gov_extended_logo.html" with logo_clickable=logo_clickable %}
<button type="button" class="usa-menu-btn">Menu</button>

View file

@ -2,13 +2,13 @@
{% load custom_filters %}
<header class="usa-header usa-header--extended">
<div class="usa-navbar usa-navbar--widescreen padding-x--widescreen">
<div class="usa-navbar {% if is_widescreen_mode %} usa-navbar--widescreen {% endif %}">
{% include "includes/gov_extended_logo.html" with logo_clickable=logo_clickable %}
<button type="button" class="usa-menu-btn">Menu</button>
</div>
{% block usa_nav %}
<nav class="usa-nav" aria-label="Primary navigation">
<div class="usa-nav__inner usa-nav__inner--widescreen padding-x--widescreen">
<div class="usa-nav__inner {% if is_widescreen_mode %} usa-nav__inner--widescreen {% endif %}">
<button type="button" class="usa-nav__close">
<img src="{%static 'img/usa-icons/close.svg'%}" role="img" alt="Close" />
</button>

View file

@ -8,7 +8,7 @@
<section class="section-outlined members margin-top-0 section-outlined--border-base-light" id="members">
<div class="section-outlined__header margin-bottom-3 grid-row">
<!-- ---------- SEARCH ---------- -->
<div class="section-outlined__search mobile:grid-col-12 desktop:grid-col-6 section-outlined__search--widescreen">
<div class="section-outlined__search mobile:grid-col-12 desktop:grid-col-6 {% if is_widescreen_mode %} section-outlined__search--widescreen {% endif %}">
<section aria-label="Members search component" class="margin-top-2">
<form class="usa-search usa-search--small" method="POST" role="search">
{% csrf_token %}

View file

@ -1,8 +1,7 @@
{% load custom_filters %}
{% load static url_helpers %}
<main id="main-content" class="grid-container grid-container--widescreen">
<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 %}">
<main id="main-content" class="grid-container">
<div class="grid-col desktop:grid-offset-2 desktop:grid-col-8">
{% block breadcrumb %}
{% if portfolio %}
{% url 'domain-requests' as url %}
@ -140,7 +139,7 @@
{% endblock modify_request %}
</div>
<div class="grid-col {% if is_widescreen_centered %}desktop:grid-offset-2 maxw-tablet{% endif %}">
<div class="grid-col desktop:grid-offset-2 maxw-tablet">
{% block request_summary_header %}
<h2 class="text-primary-darker"> Summary of your domain request </h2>
{% endblock request_summary_header%}
@ -238,5 +237,4 @@
{% endif %}
{% endblock request_summary%}
</div>
</div>
</main>

View file

@ -1,3 +1,3 @@
<p class="{% if not remove_margin_top %}margin-top-3{% endif %}">
<p class="{% if not remove_margin_top %}margin-top-3 {% endif %}">
<em>Required fields are marked with an asterisk (<abbr class="usa-hint usa-hint--required" title="required">*</abbr>).</em>
</p>

View file

@ -4,12 +4,11 @@
<div id="wrapper" class="{% block wrapper_class %}wrapper--padding-top-6{% endblock %}">
{% block content %}
<main class="grid-container grid-container--widescreen">
<main class="grid-container {% if is_widescreen_mode %} grid-container--widescreen{% endif %}">
{% if user.is_authenticated %}
{# the entire logged in page goes here #}
<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 %}">
<div class="tablet:grid-col-11 desktop:grid-col-10 tablet:grid-offset-1">
{% block messages %}
{% include "includes/form_messages.html" %}
{% endblock %}
@ -25,8 +24,6 @@
</a></p>
{% endif %}
</div>
</main>
{% endblock content%}

View file

@ -11,9 +11,8 @@ Edit your User Profile |
{% endblock %}
{% block content %}
<main id="main-content" class="grid-container grid-container--widescreen">
<div class="grid-row {% if not is_widescreen_centered %}max-width--grid-container{% endif %}">
<div class="desktop:grid-col-8">
<main id="main-content" class="grid-container">
<div class="grid-col desktop:grid-offset-2 desktop:grid-col-8">
{% if messages %}
{% for message in messages %}
<div class="usa-alert usa-alert--{{ message.tags }} usa-alert--slim margin-bottom-3">
@ -91,12 +90,11 @@ Edit your User Profile |
{% endblock content %}
{% endblock content %}
{% block content_bottom %}
{% block content_bottom %}
{% include "includes/profile_form.html" with form=form %}
</div>
</div>
</main>
{% endblock content_bottom %}