mirror of
https://github.com/bugsink/bugsink.git
synced 2026-01-06 05:10:15 -06:00
Show borders on 2 sides of the frame header when expanded too
the trick was: do it by having this border at the bottom of the framedetails. and: to be able to collapse the border too: make div-in-div. This gets rid of the remove-flex-when-collapsing code too
This commit is contained in:
@@ -49,8 +49,10 @@
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="js-frame-details {% if frame.in_app %}js-in-app{% endif %} {% if forloop.parentloop.last and forloop.last %}xl:flex{% endif %} overflow-hidden transition-all"
|
||||
<div class="js-frame-details {% if frame.in_app %}js-in-app{% endif %}{% if frame.in_app %}bg-slate-300{% else %}border-slate-300{% endif %} overflow-hidden transition-all"
|
||||
{% if not forloop.parentloop.last or not forloop.last %}data-collapsed="true" style="height: 0px"{% endif %}>
|
||||
<div class="border-b-2 xl:flex border-slate-300">
|
||||
|
||||
<div class="xl:w-1/2">
|
||||
<ol class="list-decimal ml-16 mt-6 mb-6" start="100">
|
||||
{% for line in frame.pre_context %}<li><div class="whitespace-pre w-full">{{ line }} {# leave space to avoid collapse #}</div></li>{% endfor %}
|
||||
@@ -71,6 +73,8 @@
|
||||
</div>
|
||||
{% endfor %}
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
@@ -34,8 +34,6 @@ function collapseSection(element) {
|
||||
|
||||
setBodyMinHeight();
|
||||
|
||||
element.classList.remove("xl:flex"); // this appears to be necessary, not sure why
|
||||
|
||||
// temporarily disable all css transitions
|
||||
const elementTransition = element.style.transition;
|
||||
element.style.transition = '';
|
||||
@@ -65,8 +63,6 @@ function expandSection(element) {
|
||||
|
||||
setBodyMinHeight();
|
||||
|
||||
element.classList.add("xl:flex"); // add back
|
||||
|
||||
// get the height of the element's inner content, regardless of its actual size
|
||||
const sectionHeight = element.scrollHeight;
|
||||
|
||||
|
||||
Reference in New Issue
Block a user