Remove inline show more

This commit is contained in:
zandercymatics 2024-04-25 13:45:47 -06:00
parent 0bcc9ca43a
commit 309b403925
No known key found for this signature in database
GPG key ID: FF4636ABEC9682B7
3 changed files with 173 additions and 185 deletions

View file

@ -562,6 +562,7 @@ function enableRelatedWidgetButtons(changeLink, deleteLink, viewLink, elementPk,
let descriptionDiv = document.querySelector('.dja__model-description'); let descriptionDiv = document.querySelector('.dja__model-description');
if (toggleButton && descriptionDiv) { if (toggleButton && descriptionDiv) {
toggleButton.addEventListener('click', function() { toggleButton.addEventListener('click', function() {
// Toggle the class on the description div // Toggle the class on the description div
descriptionDiv.classList.toggle('dja__model-description--no-overflow'); descriptionDiv.classList.toggle('dja__model-description--no-overflow');
@ -569,12 +570,8 @@ function enableRelatedWidgetButtons(changeLink, deleteLink, viewLink, elementPk,
// Change the button text based on the presence of the class // Change the button text based on the presence of the class
if (descriptionDiv.classList.contains('dja__model-description--no-overflow')) { if (descriptionDiv.classList.contains('dja__model-description--no-overflow')) {
toggleButton.textContent = 'Show less'; toggleButton.textContent = 'Show less';
// Move the div to where it was when the page first loaded
descriptionDiv.appendChild(toggleButton);
} else { } else {
toggleButton.textContent = 'Show more'; toggleButton.textContent = 'Show more';
descriptionDiv.insertAdjacentElement('afterend', toggleButton);
} }
}); });
} }

View file

@ -636,15 +636,7 @@ div.dja__model-description{
} }
.dja__model-description + button {
margin-top: 25px !important;
height: 10px !important;
}
div.dja__model-description.dja__model-description--no-overflow { div.dja__model-description.dja__model-description--no-overflow {
display: block; display: block;
overflow: unset; overflow: unset;
button {
margin-top: unset;
}
} }

View file

@ -1,5 +1,5 @@
<span class="display-inline-flex">
<div class="dja__model-description text-normal"> <div class="dja__model-description text-normal">
{% if opts.model_name == 'domainrequest' %} {% if opts.model_name == 'domainrequest' %}
<p> <p>
This table contains all domain requests that have been started within the registrar and the status of those requests. This table contains all domain requests that have been started within the registrar and the status of those requests.
@ -183,6 +183,5 @@
{% else %} {% else %}
<p>This table does not have a description yet.</p> <p>This table does not have a description yet.</p>
{% endif %} {% endif %}
</div> </div>
<button id="dja-show-more-model-description" class="usa-button usa-button--unstyled text-no-underline" type="button">Show more</button> <button id="dja-show-more-model-description" class="usa-button usa-button--unstyled text-no-underline margin-top-1" type="button">Show more</button>
</span>