Browse Source

cc styles

master
rdrew 3 months ago
parent
commit
1f95b4dd33
  1. 18
      css/components/islandora_mods.css
  2. 3
      js/pwc_custom.js

18
css/components/islandora_mods.css

@ -50,22 +50,22 @@
}
/*collapsable text on collections pages*/
.text-container {
max-width: 600px; /* Adjust as needed */
max-width: 600px; /* Adjust as needed */
}
.truncated-text {
max-height: 2.1em; /* Initial truncation height (~3 lines) */
overflow: hidden;
transition: max-height 0.3s ease;
max-height: 3em; /* Initial truncation height (~3 lines) */
overflow: hidden;
transition: max-height 0.3s ease;
}
.truncated-text.full {
max-height: none; /* Show full text */
max-height: none; /* Show full text */
}
.more-link {
color: #007bff;
cursor: pointer;
display: inline-block;
margin-top: 5px;
color: #007bff;
cursor: pointer;
display: inline-block;
margin-top: 5px;
}

3
js/pwc_custom.js

@ -1,7 +1,8 @@
document.querySelectorAll('.more-link').forEach(link => {
link.addEventListener('click', (e) => {
e.preventDefault();
const container = link.previousElementSibling;
// Find the parent text-container and then the truncated-text div
const container = link.closest('.text-container').querySelector('.truncated-text');
container.classList.toggle('full');
link.textContent = container.classList.contains('full') ? 'Less' : 'More';
link.setAttribute('aria-expanded', container.classList.contains('full'));

Loading…
Cancel
Save