mirror of
https://github.com/cisagov/manage.get.gov.git
synced 2025-08-04 17:01:56 +02:00
Banner boilerplates
This commit is contained in:
parent
37da20f621
commit
c4bd5bab13
11 changed files with 89 additions and 9 deletions
|
@ -16,6 +16,8 @@ The following set of rules should be followed while an incident is in progress.
|
|||
- If downtime occurs outside of working hours, team members who are off for the day may still be pinged and called but are not required to join if unavailable to do so.
|
||||
- Uncomment the [banner on get.gov](https://github.com/cisagov/get.gov/blob/0365d3d34b041cc9353497b2b5f81b6ab7fe75a9/_includes/header.html#L9), so it is transparent to users that we know about the issue on manage.get.gov.
|
||||
- Designers or Developers should be able to make this change; if designers are online and can help with this task, that will allow developers to focus on fixing the bug.
|
||||
- Uncomment the [banner on manage.get.gov's base template](https://github.com/cisagov/manage.get.gov/blob/main/src/registrar/templates/base.html#L78).
|
||||
- Designers or Developers should be able to make this change; if designers are online and can help with this task, that will allow developers to focus on fixing the bug.
|
||||
- If the issue persists for three hours or more, follow the [instructions for enabling/disabling a redirect to get.gov](https://docs.google.com/document/d/1PiWXpjBzbiKsSYqEo9Rkl72HMytMp7zTte9CI-vvwYw/edit).
|
||||
|
||||
## Post Incident
|
||||
|
|
|
@ -45,7 +45,7 @@
|
|||
{% block header %}
|
||||
{% if not IS_PRODUCTION %}
|
||||
{% with add_body_class="margin-left-1" %}
|
||||
{% include "includes/non-production-alert.html" %}
|
||||
{% include "includes/banner-non-production-alert.html" %}
|
||||
{% endwith %}
|
||||
{% endif %}
|
||||
|
||||
|
|
|
@ -72,9 +72,19 @@
|
|||
<a class="usa-skipnav" href="#main-content">Skip to main content</a>
|
||||
|
||||
{% if not IS_PRODUCTION %}
|
||||
{% include "includes/non-production-alert.html" %}
|
||||
{% include "includes/banner-non-production-alert.html" %}
|
||||
{% endif %}
|
||||
|
||||
{% comment %}
|
||||
Site banner / red alert banner / emergency banner / incident banner - Remove one of those includes and place outside the comment block to activate the banner.
|
||||
{% include "includes/banner-error.html" %}
|
||||
{% include "includes/banner-info.html" %}
|
||||
{% include "includes/banner-service-disruption.html" %}
|
||||
{% include "includes/banner-site-alert.html" %}
|
||||
{% include "includes/banner-system-outage.html" %}
|
||||
{% include "includes/banner-warning.html" %}
|
||||
{% endcomment %}
|
||||
|
||||
<section class="usa-banner" aria-label="Official website of the United States government">
|
||||
<div class="usa-accordion">
|
||||
<header class="usa-banner__header">
|
||||
|
|
10
src/registrar/templates/includes/banner-error.html
Normal file
10
src/registrar/templates/includes/banner-error.html
Normal file
|
@ -0,0 +1,10 @@
|
|||
<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 {% if is_widescreen_mode %}usa-alert__body--widescreen{% endif %}">
|
||||
<h4 class="usa-alert__heading">Header</h4>
|
||||
<p class="usa-alert__text maxw-none">
|
||||
Text here
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
10
src/registrar/templates/includes/banner-info.html
Normal file
10
src/registrar/templates/includes/banner-info.html
Normal file
|
@ -0,0 +1,10 @@
|
|||
<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 {% if is_widescreen_mode %}usa-alert__body--widescreen{% endif %}">
|
||||
<h4 class="usa-alert__heading">Header</h4>
|
||||
<p class="usa-alert__text maxw-none">
|
||||
Text here
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
|
@ -0,0 +1,9 @@
|
|||
<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 {% 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>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
|
@ -0,0 +1,12 @@
|
|||
<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 {% if is_widescreen_mode %}usa-alert__body--widescreen{% endif %}">
|
||||
<h3 class="usa-alert__heading">
|
||||
Service disruption
|
||||
</h3>
|
||||
<p class="usa-alert__text maxw-none">
|
||||
Month day, time-in-24-hour-notation UTC: We're investigating a service disruption on the .gov registrar. The .gov zone and individual domains remain online. However, the registrar is running slower than usual.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
12
src/registrar/templates/includes/banner-site-alert.html
Normal file
12
src/registrar/templates/includes/banner-site-alert.html
Normal file
|
@ -0,0 +1,12 @@
|
|||
<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 {% if is_widescreen_mode %}usa-alert__body--widescreen{% endif %}">
|
||||
<h3 class="usa-alert__heading">
|
||||
Header here
|
||||
</h3>
|
||||
<p class="usa-alert__tex maxw-none">
|
||||
Text here
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
12
src/registrar/templates/includes/banner-system-outage.html
Normal file
12
src/registrar/templates/includes/banner-system-outage.html
Normal file
|
@ -0,0 +1,12 @@
|
|||
<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 {% if is_widescreen_mode %}usa-alert__body--widescreen{% endif %}">
|
||||
<h3 class="usa-alert__heading">
|
||||
System outage
|
||||
</h3>
|
||||
<p class="usa-alert__text maxw-none">
|
||||
Oct 16, 24:00 UTC: We're investigating an outage on the .gov registrar. The .gov zone and individual domains remain online. However, you can't request a new domain or manage an existing one at this time.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
10
src/registrar/templates/includes/banner-warning.html
Normal file
10
src/registrar/templates/includes/banner-warning.html
Normal file
|
@ -0,0 +1,10 @@
|
|||
<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 {% if is_widescreen_mode %}usa-alert__body--widescreen{% endif %}">
|
||||
<h4 class="usa-alert__heading">Header</h4>
|
||||
<p class="usa-alert__text maxw-none">
|
||||
Text here
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
|
@ -1,7 +0,0 @@
|
|||
<div class="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 {% if add_body_class %}{{ add_body_class }}{% endif %} {% if is_widescreen_mode %}usa-alert__body--widescreen{% endif %}">
|
||||
<b>Attention:</b> You are on a test site.
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
Loading…
Add table
Add a link
Reference in a new issue