diff --git a/onlylegs/static/sass/components/image-view/info-tab.sass b/onlylegs/static/sass/components/image-view/info-tab.sass index 82f56eb..968ef13 100644 --- a/onlylegs/static/sass/components/image-view/info-tab.sass +++ b/onlylegs/static/sass/components/image-view/info-tab.sass @@ -132,6 +132,14 @@ &:hover text-decoration: underline + .pfp + width: 1.1rem + height: 1.1rem + + border-radius: $rad-inner + + object-fit: cover + table margin: 0 padding: 0 @@ -154,6 +162,9 @@ vertical-align: top + > * + vertical-align: top + td:first-child padding-right: 0.5rem diff --git a/onlylegs/templates/image.html b/onlylegs/templates/image.html index 4fe6729..36790fa 100644 --- a/onlylegs/templates/image.html +++ b/onlylegs/templates/image.html @@ -129,7 +129,16 @@ - + @@ -206,9 +215,30 @@ let infoTab = document.querySelectorAll('.info-tab'); for (let i = 0; i < infoTab.length; i++) { - infoTab[i].querySelector('.collapse-indicator').addEventListener('click', function() { - infoTab[i].classList.toggle('collapsed'); + const tab = infoTab[i]; + + tab.querySelector('.collapse-indicator').addEventListener('click', function() { + tab.classList.toggle('collapsed'); }); + + /* + const tabHeader = tab.querySelector('.info-header'); + const tabContent = tab.querySelector('.info-table'); + + const tabHeight = tabHeader.offsetHeight + tabContent.offsetHeight; + + tab.style.height = tabHeight + 'px'; + + tab.querySelector('.collapse-indicator').addEventListener('click', function() { + if (tab.classList.contains('collapsed')) { + tab.style.height = tabHeight + 'px'; + tab.classList.remove('collapsed'); + } else { + tab.style.height = tabHeader.offsetHeight + 'px'; + tab.classList.add('collapsed'); + } + }); + */ } {% endblock %} \ No newline at end of file
Author{{ image.author.username }} + Profile Picture + {{ image.author.username }} +
Upload date