Fix button styling

This commit is contained in:
zandercymatics 2024-04-05 15:21:45 -06:00
parent 5535b9178e
commit e9332edc8b
No known key found for this signature in database
GPG key ID: FF4636ABEC9682B7
3 changed files with 15 additions and 4 deletions

View file

@ -164,11 +164,18 @@ function openInNewTab(el, removeAttribute = false){
// Change the button text // Change the button text
nearestSpan = button.querySelector("span") nearestSpan = button.querySelector("span")
if (button.classList.contains('usa-button')) {
nearestSpan.innerText = "Copy email";
} else {
nearestSpan.innerText = "Copy";
}
nearestSpan.innerText = "Copied to clipboard" nearestSpan.innerText = "Copied to clipboard"
setTimeout(function() { setTimeout(function() {
// Change back to the copy icon // Change back to the copy icon
buttonIcon.setAttribute('xlink:href', currentHref); buttonIcon.setAttribute('xlink:href', currentHref);
usa-button__small
if (button.classList.)
nearestSpan.innerText = "Copy" nearestSpan.innerText = "Copy"
}, 2000); }, 2000);

View file

@ -597,3 +597,7 @@ address.dja-address-contact-list {
.no-outline-on-click:focus { .no-outline-on-click:focus {
outline: none !important; outline: none !important;
} }
.usa-button__small-text {
font-size: small;
}

View file

@ -84,7 +84,7 @@ This is using a custom implementation fieldset.html (see admin/fieldset.html)
<table> <table>
<thead> <thead>
<tr> <tr>
<th colspan="5">Other contact information</th> <th colspan="4">Other contact information</th>
<tr> <tr>
</thead> </thead>
<tbody> <tbody>
@ -97,10 +97,10 @@ This is using a custom implementation fieldset.html (see admin/fieldset.html)
</td> </td>
<td class="padding-left-1">{{ contact.phone }}</td> <td class="padding-left-1">{{ contact.phone }}</td>
<td class="padding-left-1 font-size-small"> <td class="padding-left-1 text-size-small">
<input aria-hidden="true" class="display-none" value="{{ contact.email }}" /> <input aria-hidden="true" class="display-none" value="{{ contact.email }}" />
<button <button
class="usa-button usa-button--unstyled padding-right-1 usa-button__icon usa-button__clipboard text-no-underline" class="usa-button usa-button--unstyled padding-right-1 usa-button__icon usa-button__clipboard usa-button__small-text text-no-underline"
type="button" type="button"
> >
<svg <svg
@ -108,7 +108,7 @@ This is using a custom implementation fieldset.html (see admin/fieldset.html)
> >
<use aria-hidden="true" xlink:href="{%static 'img/sprite.svg'%}#content_copy"></use> <use aria-hidden="true" xlink:href="{%static 'img/sprite.svg'%}#content_copy"></use>
</svg> </svg>
<span>Copy</span> <span>Copy email</span>
</button> </button>
</td> </td>
</tr> </tr>