diff --git a/src/registrar/assets/src/sass/_theme/_alerts.scss b/src/registrar/assets/src/sass/_theme/_alerts.scss index 8c9a1f8c5..41bead00e 100644 --- a/src/registrar/assets/src/sass/_theme/_alerts.scss +++ b/src/registrar/assets/src/sass/_theme/_alerts.scss @@ -12,14 +12,24 @@ } } + // The icon was off center for some reason // Fixes that issue @media (min-width: 64em){ - .usa-alert__body::before { - left: 2.5rem !important; + .usa-alert--warning{ + .usa-alert__body::before { + left: 1rem !important; + } + } + .usa-alert__body.margin-left-1 { + margin-left: 0.5rem!important; } - .usa-alert__body { - padding-left: 5rem!important; + + .usa-alert__body--widescreen::before { + left: 4rem !important; + } + .usa-alert__body--widescreen { + padding-left: 7rem!important; } } diff --git a/src/registrar/assets/src/sass/_theme/_base.scss b/src/registrar/assets/src/sass/_theme/_base.scss index 2e8de1957..1a5ffe907 100644 --- a/src/registrar/assets/src/sass/_theme/_base.scss +++ b/src/registrar/assets/src/sass/_theme/_base.scss @@ -2,8 +2,8 @@ @use "cisa_colors" as *; $widescreen-max-width: 1920px; -$widescreen-left-padding: 48px; -$widescreen-right-padding: 48px; +$widescreen-left-padding: 4.5rem; +$widescreen-right-padding: 4.5rem; $hot-pink: #FFC3F9; @@ -252,11 +252,13 @@ abbr[title] { // 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 -.padding-left--widescreen { - padding-left: $widescreen-left-padding !important; -} -.padding-right--widescreen { - padding-left: $widescreen-right-padding !important; +@media (min-width: 64em) { + .padding-left--widescreen { + padding-left: $widescreen-left-padding !important; + } + .padding-right--widescreen { + padding-right: $widescreen-right-padding !important; + } } .margin-right-neg-4px { diff --git a/src/registrar/assets/src/sass/_theme/_containers.scss b/src/registrar/assets/src/sass/_theme/_containers.scss index 7e63dae8e..740c0f998 100644 --- a/src/registrar/assets/src/sass/_theme/_containers.scss +++ b/src/registrar/assets/src/sass/_theme/_containers.scss @@ -10,8 +10,16 @@ // NOTE: !important is used because _font.scss overrides this @media (min-width: 64em) { - .usa-footer__secondary-section .grid-container--widescreen { + .grid-container--widescreen { padding-left: $widescreen-left-padding !important; padding-right: $widescreen-right-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_left_justified is used in the html). +.max-width--grid-container { + max-width: 64rem; +} \ No newline at end of file diff --git a/src/registrar/assets/src/sass/_theme/_header.scss b/src/registrar/assets/src/sass/_theme/_header.scss index 53eab90d8..573413d4e 100644 --- a/src/registrar/assets/src/sass/_theme/_header.scss +++ b/src/registrar/assets/src/sass/_theme/_header.scss @@ -110,8 +110,8 @@ } } .usa-nav__secondary { - // I don't know why USWDS has this at 2 rem, which puts it out of alignment - right: 3rem; + right: 1rem; + padding-right: $widescreen-right-padding; color: color('white'); bottom: 4.3rem; .usa-nav-link, diff --git a/src/registrar/config/settings.py b/src/registrar/config/settings.py index 050950c9b..a3c55126d 100644 --- a/src/registrar/config/settings.py +++ b/src/registrar/config/settings.py @@ -252,6 +252,7 @@ "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" ], }, }, diff --git a/src/registrar/context_processors.py b/src/registrar/context_processors.py index 9f5d0162f..047cfcfa5 100644 --- a/src/registrar/context_processors.py +++ b/src/registrar/context_processors.py @@ -99,30 +99,69 @@ def portfolio_permissions(request): def is_widescreen_mode(request): - widescreen_paths = [] # If this list is meant to include specific paths, populate it. + widescreen_paths = [ + "/domain-request/", + ] # If this list is meant to include specific paths, populate it. portfolio_widescreen_paths = [ "/domains/", "/requests/", - "/request/", "/no-organization-requests/", "/no-organization-domains/", - "/domain-request/", + "/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 == "/" + 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) - and not any(exclude_path in request.path for exclude_path in exclude_paths) ) + 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} + +def get_is_widescreen_left_justified(request): + include_paths = [ + "/user-profile", + "/request/", + "/domain/", + ] + portfolio_include_paths = [ + "/organization/", + "/senior-official/", + "/member/", + "/members/new-member", + ] + 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): + # Return a dictionary with the widescreen mode status. - return {"is_widescreen_mode": is_widescreen or is_portfolio_widescreen} + return {"is_widescreen_left_justified": get_is_widescreen_left_justified(request)} \ No newline at end of file diff --git a/src/registrar/templates/401.html b/src/registrar/templates/401.html index 20ca0420e..23e40f649 100644 --- a/src/registrar/templates/401.html +++ b/src/registrar/templates/401.html @@ -6,7 +6,7 @@ {% block content %}
-
+

{% translate "You are not authorized to view this page" %} diff --git a/src/registrar/templates/403.html b/src/registrar/templates/403.html index ef910a191..524e51c94 100644 --- a/src/registrar/templates/403.html +++ b/src/registrar/templates/403.html @@ -6,7 +6,7 @@ {% block content %}
-
+

{% translate "You're not authorized to view this page." %} diff --git a/src/registrar/templates/404.html b/src/registrar/templates/404.html index 024c2803b..bd8604a3a 100644 --- a/src/registrar/templates/404.html +++ b/src/registrar/templates/404.html @@ -6,7 +6,7 @@ {% block content %}
-
+

{% translate "We couldn’t find that page" %} diff --git a/src/registrar/templates/500.html b/src/registrar/templates/500.html index 95c17e069..465e3a637 100644 --- a/src/registrar/templates/500.html +++ b/src/registrar/templates/500.html @@ -6,7 +6,7 @@ {% block content %}
-
+

{% translate "We're having some trouble." %} diff --git a/src/registrar/templates/base.html b/src/registrar/templates/base.html index 1af42e8db..18e8c0e78 100644 --- a/src/registrar/templates/base.html +++ b/src/registrar/templates/base.html @@ -97,7 +97,7 @@
-
+
U.S. flag
diff --git a/src/registrar/templates/domain_base.html b/src/registrar/templates/domain_base.html index 4f14928e1..3769bf08f 100644 --- a/src/registrar/templates/domain_base.html +++ b/src/registrar/templates/domain_base.html @@ -4,10 +4,10 @@ {% block title %}{{ domain.name }} | {% endblock %} {% block content %} -
+
-
-
+
+

diff --git a/src/registrar/templates/domain_request_form.html b/src/registrar/templates/domain_request_form.html index 64e541c59..aa01d2a15 100644 --- a/src/registrar/templates/domain_request_form.html +++ b/src/registrar/templates/domain_request_form.html @@ -3,8 +3,8 @@ {% block title %}{{form_titles|get_item:steps.current}} | Request a .gov | {% endblock %} {% block content %} -

-
+
+
{% include 'domain_request_sidebar.html' %}
diff --git a/src/registrar/templates/includes/banner-error.html b/src/registrar/templates/includes/banner-error.html index 10582e268..00aaee219 100644 --- a/src/registrar/templates/includes/banner-error.html +++ b/src/registrar/templates/includes/banner-error.html @@ -1,6 +1,6 @@
-
+

Header

diff --git a/src/registrar/templates/includes/banner-info.html b/src/registrar/templates/includes/banner-info.html index cf379c50d..494aa40e7 100644 --- a/src/registrar/templates/includes/banner-info.html +++ b/src/registrar/templates/includes/banner-info.html @@ -1,6 +1,6 @@
-
+

Header

diff --git a/src/registrar/templates/includes/banner-non-production-alert.html b/src/registrar/templates/includes/banner-non-production-alert.html index 7b66d543b..cbf7a0c13 100644 --- a/src/registrar/templates/includes/banner-non-production-alert.html +++ b/src/registrar/templates/includes/banner-non-production-alert.html @@ -1,6 +1,6 @@
-
+

Attention: You are on a test site.

diff --git a/src/registrar/templates/includes/banner-service-disruption.html b/src/registrar/templates/includes/banner-service-disruption.html index 6ee4b976b..022978144 100644 --- a/src/registrar/templates/includes/banner-service-disruption.html +++ b/src/registrar/templates/includes/banner-service-disruption.html @@ -1,6 +1,6 @@
-
+

Service disruption

diff --git a/src/registrar/templates/includes/banner-site-alert.html b/src/registrar/templates/includes/banner-site-alert.html index 8dd657267..d3854b034 100644 --- a/src/registrar/templates/includes/banner-site-alert.html +++ b/src/registrar/templates/includes/banner-site-alert.html @@ -1,6 +1,6 @@
-
+

Header here

diff --git a/src/registrar/templates/includes/banner-system-outage.html b/src/registrar/templates/includes/banner-system-outage.html index 60fc4eb03..7cb31bbf4 100644 --- a/src/registrar/templates/includes/banner-system-outage.html +++ b/src/registrar/templates/includes/banner-system-outage.html @@ -1,6 +1,6 @@
-
+

System outage

diff --git a/src/registrar/templates/includes/banner-warning.html b/src/registrar/templates/includes/banner-warning.html index 762d0b47c..ae1b01138 100644 --- a/src/registrar/templates/includes/banner-warning.html +++ b/src/registrar/templates/includes/banner-warning.html @@ -1,6 +1,6 @@
-
+

Header

diff --git a/src/registrar/templates/includes/footer.html b/src/registrar/templates/includes/footer.html index 5fa576ccc..b948bd49b 100644 --- a/src/registrar/templates/includes/footer.html +++ b/src/registrar/templates/includes/footer.html @@ -3,7 +3,7 @@

{% endblock content%} diff --git a/src/registrar/templates/portfolio_members.html b/src/registrar/templates/portfolio_members.html index 332d1c16c..324645b61 100644 --- a/src/registrar/templates/portfolio_members.html +++ b/src/registrar/templates/portfolio_members.html @@ -12,7 +12,7 @@

+
+

+ .Gov domain registrants must maintain accurate contact information in the .gov registrar. + Before you can manage your domain, we need you to add your contact information. +

+
+
+
    +
  • + +
    • +
+
+
+
- -

-
- {% endif %} + {% endif %} - + -{% endblock content %} + {% endblock content %} -{% block content_bottom %} - {% include "includes/profile_form.html" with form=form %} -
+ {% block content_bottom %} + {% include "includes/profile_form.html" with form=form %} +

+
{% endblock content_bottom %}