darkhelm/notifications-admin
1
0
Fork 0
mirror of https://github.com/GSA/notifications-admin.git synced 2026-08-12 18:08:57 -04:00
Code Issues Packages Projects Releases Wiki Activity

2568 - Clean up CSS

Browse Source
This commit is contained in:
Jonathan Bobel
2025-05-13 16:20:30 -04:00
parent f64a9a0072
commit ecfde62648
7 changed files with 117 additions and 74 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
app/assets/sass/uswds/_main.scss
View File

@@ -351,6 +351,10 @@ h2.recipient-list {
margin-top: units(1);
}
.usa-search .search-form__button {
height: 40px;
}
// Button ellipses loading
.dot-anim::after {
content: '.';

12
app/assets/sass/uswds/_uswds-theme-custom-styles.scss
View File

@@ -179,10 +179,19 @@ td.table-empty-message {
display: flex;
flex-wrap: wrap;
justify-content: space-between;
padding: 1rem;
padding: 1rem 0;
}
.user-list-item {
border: 2px solid color('gray-5');
padding: units(2);
button, .usa-accordion__content {
background-color: white;
border: 2px solid color('gray-5');
}
button:hover, button[aria-expanded="true"] {
background-color: color('gray-5');
}
@include at-media(desktop) {
width: calc(50% - units(1));
margin-bottom: 1rem;
@@ -199,7 +208,6 @@ td.table-empty-message {
}
.hint {
display: block;
font-size: size('body', 'sm');
font-weight: normal;
}

2
app/templates/base.html
View File

@@ -65,7 +65,7 @@
{% endblock %}
{% block main %}
<div class="grid-container">
<div class="grid-container minh-mobile">
{% block beforeContent %}
{% block backLink %}{% endblock %}
{% endblock %}

29
app/templates/views/find-services/find-services-by-name.html
View File

@@ -14,19 +14,22 @@
</h1>
{% call form_wrapper(
action=url_for('.find_services_by_name'),
class='usa-search margin-bottom-4'
) %}
{{ form.search(param_extensions={
"label": {"text": "Find services by name, partial name, or service ID"}
}) }}
<input type="hidden" name="csrf_token" value="{{ csrf_token() }}">
{{ usaButton({
"text": "Search",
"classes": "usa-button search-form__button"
}) }}
{% endcall %}
{% call form_wrapper(
action=url_for('.find_services_by_name'),
class='usa-search margin-bottom-4'
) %}
<div class="display-flex flex-justify-start flex-align-end gap-1 width-full">
{{ form.search(param_extensions={
"label": {"text": "Find services by name, partial name, or service ID"},
"classes": "width-full"
}) }}
<input type="hidden" name="csrf_token" value="{{ csrf_token() }}">
{{ usaButton({
"text": "Search",
"classes": "usa-button search-form__button"
}) }}
</div>
{% endcall %}
{% call form_wrapper(id='search-form' ) %}
<input type="hidden" name="csrf_token" value="{{ csrf_token() }}">

11
app/templates/views/find-users/find-users-by-email.html
View File

@@ -15,17 +15,20 @@
{% call form_wrapper(
action=url_for('.find_users_by_email'),
class='usa-search margin-bottom-4'
action=url_for('.find_users_by_email'),
class='usa-search margin-bottom-4'
) %}
<div class="display-flex flex-align-end gap-1 width-full">
{{ form.search(param_extensions={
"label": {"text": "Find users by email, or by partial email"}
"label": {"text": "Find users by email, or by partial email"},
"classes": "width-full"
}) }}
<input type="hidden" name="csrf_token" value="{{ csrf_token() }}">
{{ usaButton({
"text": "Search",
"classes": "search-form__button"
"classes": "usa-button search-form__button"
}) }}
</div>
{% endcall %}
{% call form_wrapper(id='search-form' ) %}

130
app/templates/views/manage-users.html
View File

@@ -35,73 +35,95 @@
</div>
{% endif %}
<div class="user-list">
{% for user in users %}
<div class="user-list">
{% if user.status != 'cancelled' %}
<div class="user-list-item">
<h2 class="user-list-item-heading font-body-lg margin-top-0" title="{{ user.email_address }}">
<div class="user-list-item width-full">
<h2 class="user-list-item-heading font-body-lg margin-y-0" title="{{ user.email_address }}">
{%- if user.name -%}
<span class="heading-small live-search-relevant">{{ user.name }}</span>
<span class="heading-small live-search-relevant">{{ user.name }}</span>
{%- endif -%}
{%- if user.status == 'pending' -%}
<span class="live-search-relevant">{{ user.email_address }}</span><span class="hint">(invited)</span>
{%- elif user.status == 'cancelled' -%}
<span class="live-search-relevant">{{ user.email_address }}</span><span class="hint">(cancelled invite)</span>
</h2>
<p class="margin-top-0">
{%- if user.status == 'pending' -%}
<span class="live-search-relevant">{{ user.email_address }}</span>
<span class="hint">(invited)</span>
{%- elif user.status == 'expired' -%}
<span class="live-search-relevant">{{ user.email_address }}</span><span class="hint">(expired invite)</span>
<span class="live-search-relevant">{{ user.email_address }}</span>
<span class="hint">(expired invite)</span>
{%- elif user.id == current_user.id -%}
<span class="live-search-relevant"></span><span class="hint">(you)</span>
{% else %}
<span class="live-search-relevant">{{ user.email_address }}</span>
<span class="hint">(you)</span>
{%- else -%}
<span class="live-search-relevant">{{ user.email_address }}</span>
{% endif %}
</h2>
<h3 class="margin-bottom-0">Permissions</h3>
<ul class="tick-cross-list-permissions">
{% for permission, label in permissions %}
{{ tick_cross(
user.has_permission_for_service(current_service.id, permission),
label
) }}
{% endfor %}
</ul>
{# only show if the service has folders #}
{% if current_service.all_template_folders %}
<p class="usa-body tick-cross-list-hint">
{% set folder_count = user.template_folders_for_service(current_service) | length %}
{% if folder_count == 0 %}
Cannot see any folders
{% elif folder_count != current_service.all_template_folders | length %}
Can see {{ folder_count }} folder{% if folder_count > 1 %}s{% endif %}
{% else %}
Can see all folders
{% endif%}
</p>
{% endif %}
{% if current_service.has_permission('email_auth') %}
<p class="usa-body tick-cross-list-hint">
Signs in with
{{ user.auth_type | format_auth_type(with_indefinite_article=True) }}
</p>
{% endif %}
{% if current_service.has_permission('email_auth') %}
<p class="usa-body tick-cross-list-hint">
Signs in with
{{ user.auth_type | format_auth_type(with_indefinite_article=True) }}
</p>
{% endif %}
{% if current_user.has_permissions('manage_service') %}
{% if user.status == 'pending' or user.status == 'expired' %}
<a class="user-list-edit-link usa-link" href="{{ url_for('.cancel_invited_user', service_id=current_service.id, invited_user_id=user.id)}}">Cancel invitation<span class="usa-sr-only"> for {{ user.email_address }}</span></a>
</p>
<div class="usa-accordion usa-accordion--bordered margin-bottom-2">
<h3 class="margin-bottom-0 usa-accordion__heading">
<button
type="button"
class="usa-accordion__button"
aria-expanded="false"
aria-controls="permissions_{{user.id}}"
>
Permissions
</button>
</h3>
<div id="permissions_{{user.id}}" class="usa-accordion__content usa-prose" hidden>
<ul class="tick-cross-list-permissions">
{% for permission, label in permissions %}
{{ tick_cross(
user.has_permission_for_service(current_service.id, permission),
label
) }}
{% endfor %}
</ul>
{% if current_service.all_template_folders %}
<p class="usa-body tick-cross-list-hint">
{% set folder_count = user.template_folders_for_service(current_service) | length %}
{% if folder_count == 0 %}
Cannot see any folders
{% elif folder_count != current_service.all_template_folders | length %}
Can see {{ folder_count }} folder{% if folder_count > 1 %}s{% endif %}
{% else %}
Can see all folders
{% endif %}
</p>
{% endif %}
{% if user.status == 'expired' %}
<a class="user-list-edit-link usa-link" href="{{ url_for('.resend_invite', service_id=current_service.id, invited_user_id=user.id)}}">Resend invite<span class="usa-sr-only"> for {{ user.email_address }}</span></a>
{% elif user.is_editable_by(current_user) %}
<a class="user-list-edit-link usa-link" href="{{ url_for('.edit_user_permissions', service_id=current_service.id, user_id=user.id)}}">Change details<span class="usa-sr-only"> for {{ user.name }} {{ user.email_address }}</span></a>
{% if current_service.has_permission('email_auth') %}
<p class="usa-body tick-cross-list-hint">
Signs in with
{{ user.auth_type | format_auth_type(with_indefinite_article=True) }}
</p>
{% endif %}
</div>
</div>
{% if current_user.has_permissions('manage_service') %}
{% if user.status == 'pending' or user.status == 'expired' %}
<a class="user-list-edit-link usa-link" href="{{ url_for('.cancel_invited_user', service_id=current_service.id, invited_user_id=user.id) }}">
Cancel invitation<span class="usa-sr-only"> for {{ user.email_address }}</span>
</a>
{% endif %}
{% if user.status == 'expired' %}
<a class="user-list-edit-link usa-link" href="{{ url_for('.resend_invite', service_id=current_service.id, invited_user_id=user.id) }}">
Resend invite<span class="usa-sr-only"> for {{ user.email_address }}</span>
</a>
{% elif user.is_editable_by(current_user) %}
<a class="user-list-edit-link usa-link" href="{{ url_for('.edit_user_permissions', service_id=current_service.id, user_id=user.id) }}">
Change details<span class="usa-sr-only"> for {{ user.name }} {{ user.email_address }}</span>
</a>
{% endif %}
{% endif %}
</div>
{% endif %}
</div>
{% endfor %}
</div>
{% endblock %}

3
poetry.lock generated
View File

@@ -1673,8 +1673,11 @@ files = [
{file = "lxml-5.4.0-cp36-cp36m-win_amd64.whl", hash = "sha256:7ce1a171ec325192c6a636b64c94418e71a1964f56d002cc28122fceff0b6121"},
{file = "lxml-5.4.0-cp37-cp37m-macosx_10_9_x86_64.whl", hash = "sha256:795f61bcaf8770e1b37eec24edf9771b307df3af74d1d6f27d812e15a9ff3872"},
{file = "lxml-5.4.0-cp37-cp37m-manylinux_2_12_i686.manylinux2010_i686.manylinux_2_17_i686.manylinux2014_i686.whl", hash = "sha256:29f451a4b614a7b5b6c2e043d7b64a15bd8304d7e767055e8ab68387a8cacf4e"},
{file = "lxml-5.4.0-cp37-cp37m-manylinux_2_17_aarch64.manylinux2014_aarch64.whl", hash = "sha256:891f7f991a68d20c75cb13c5c9142b2a3f9eb161f1f12a9489c82172d1f133c0"},
{file = "lxml-5.4.0-cp37-cp37m-manylinux_2_17_x86_64.manylinux2014_x86_64.whl", hash = "sha256:4aa412a82e460571fad592d0f93ce9935a20090029ba08eca05c614f99b0cc92"},
{file = "lxml-5.4.0-cp37-cp37m-manylinux_2_28_aarch64.whl", hash = "sha256:ac7ba71f9561cd7d7b55e1ea5511543c0282e2b6450f122672a2694621d63b7e"},
{file = "lxml-5.4.0-cp37-cp37m-manylinux_2_28_x86_64.whl", hash = "sha256:c5d32f5284012deaccd37da1e2cd42f081feaa76981f0eaa474351b68df813c5"},
{file = "lxml-5.4.0-cp37-cp37m-musllinux_1_2_aarch64.whl", hash = "sha256:ce31158630a6ac85bddd6b830cffd46085ff90498b397bd0a259f59d27a12188"},
{file = "lxml-5.4.0-cp37-cp37m-musllinux_1_2_x86_64.whl", hash = "sha256:31e63621e073e04697c1b2d23fcb89991790eef370ec37ce4d5d469f40924ed6"},
{file = "lxml-5.4.0-cp37-cp37m-win32.whl", hash = "sha256:be2ba4c3c5b7900246a8f866580700ef0d538f2ca32535e991027bdaba944063"},
{file = "lxml-5.4.0-cp37-cp37m-win_amd64.whl", hash = "sha256:09846782b1ef650b321484ad429217f5154da4d6e786636c38e434fa32e94e49"},