zydronium/manage.get.gov
1
0
Fork 0
mirror of https://github.com/cisagov/manage.get.gov.git synced 2025-08-03 00:12:16 +02:00
Code Issues Projects Releases Packages Wiki Activity

action kebobs ob left on desktop

Browse source
This commit is contained in:
Rachid Mrad 2025-02-19 20:06:23 -05:00
parent e52f6f308b
commit 80bf86ab7c
No known key found for this signature in database
5 changed files with 25 additions and 12 deletions
Download patch file Download diff file Expand all files Collapse all files

19
src/registrar/assets/src/sass/_theme/_accordions.scss
View file

@ -15,7 +15,6 @@
// Note, width is determined by a custom width class on one of the children
position: absolute;
z-index: 1;
left: 0;
border-radius: 4px;
border: solid 1px color('base-lighter');
padding: units(2) units(2) units(3) units(2);
@ -32,6 +31,14 @@
}
}
// This will work in responsive tables IF we overwrite the overflow value on the table container
// Works with styles in _tables
@include at-media(desktop) {
.usa-accordion--more-actions .usa-accordion__content {
left: 0;
}
}
.usa-accordion--select .usa-accordion__content {
top: 33.88px;
}
@ -44,10 +51,12 @@
// This won't work on the Members table rows because that table has show-more rows
// Currently, that's not an issue since that Members table is not wrapped in the
// reponsive wrapper.
tr:last-of-type .usa-accordion--more-actions .usa-accordion__content {
top: auto;
bottom: -10px;
right: 30px;
@media screen and (max-width: 1023px) {
tr:last-of-type .usa-accordion--more-actions .usa-accordion__content {
top: auto;
bottom: -10px;
right: 30px;
}
}
// A CSS only show-more/show-less based on usa-accordion

5
src/registrar/assets/src/sass/_theme/_base.scss
View file

@ -226,11 +226,6 @@ abbr[title] {
}
}
// Boost this USWDS utility class for the accordions in the portfolio requests table
.left-auto {
left: auto!important;
}
.usa-banner__inner--widescreen {
max-width: $widescreen-max-width;
}

9
src/registrar/assets/src/sass/_theme/_tables.scss
View file

@ -152,3 +152,12 @@ th {
.usa-table--full-borderless th {
border: none !important;
}
// This is an override to overflow on certain tables (note the custom class)
// so that a popup menu can appear and starddle the edge of the table on large
// screen sizes. Works with styles in _accordions
@include at-media(desktop) {
.usa-table-container--scrollable.usa-table-container--override-overflow {
overflow-y: visible;
}
}

2
src/registrar/templates/includes/domain_requests_table.html
View file

@ -163,7 +163,7 @@
</div>
{% endif %}
<div class="display-none usa-table-container--scrollable margin-top-0" tabindex="0" id="domain-requests__table-wrapper">
<div class="display-none usa-table-container--scrollable usa-table-container--override-overflow margin-top-0" tabindex="0" id="domain-requests__table-wrapper">
<table class="usa-table usa-table--borderless usa-table--stacked dotgov-table dotgov-table--stacked">
<caption class="sr-only">Your domain requests</caption>
<thead>

2
src/registrar/templates/includes/domains_table.html
View file

@ -198,7 +198,7 @@
</svg>
</button>
</div>
<div class="display-none usa-table-container--scrollable margin-top-0" tabindex="0" id="domains__table-wrapper">
<div class="display-none usa-table-container--scrollable usa-table-container--override-overflow margin-top-0" tabindex="0" id="domains__table-wrapper">
<table class="usa-table usa-table--borderless usa-table--stacked dotgov-table dotgov-table--stacked">
<caption class="sr-only">Your registered domains</caption>
<thead>