Commit 343217a8 authored by Rachel TORCHET's avatar Rachel TORCHET
Browse files

Compound_card - Fix compound header when scrolling

parent a4239a83
Pipeline #21720 passed with stages
in 10 minutes and 31 seconds
......@@ -223,21 +223,15 @@ Description: IPPI-DB Theme
}
.compound_header_title {
overflow: auto;
position: relative;
}
.compound_2D {
position: fixed;
display: flex;
}
.fix-compound_2D {
background-color: #eee;
position: fixed;
top: 15px;
position: sticky;
top:0;
background-color: #ffffff;
margin-bottom: 18px;
border-radius: 3px;
box-shadow: 0 3px 11px 0 rgba(0, 0, 0, 0.2);
z-index: 1;
}
.bg_warning{
background-color: #fbbf839e;
}
\ No newline at end of file
}
......@@ -31,9 +31,9 @@
{{ compound.id }}{% endblock %}
</div>
</nav>
<div class="container-fluid inner-wrap compound_header_title" id="compound_header_title" style="margin-bottom: 18px; border-radius: 3px; box-shadow: 0 3px 11px 0 rgba(0, 0, 0, 0.2);">
<div class="container-fluid inner-wrap compound_header_title" id="compound_header_title">
<div class="row">
{% include "compound_smiles_draw.html" with id=compound.id smile=compound.canonical_smile width=150 height=150%}
{% include "compound_smiles_draw.html" with id=compound.id smile=compound.canonical_smile width=250 height=250%}
<div class="{% if compound.is_validated is False %}bg_warning{% endif %}" style="display: flex;
align-items: center;">
<h1 class="page-title" style="margin: 0;">Compound {{ compound.id }}</h1>
......@@ -47,7 +47,7 @@
<div class="top">
</div>
<div class="row" style="display: inline-block;height:auto;">
<div class="row" style="display: inline-block;height:auto; margin-right: 15px; margin-left: 15px;">
<div class="tab-content" id="tabContent">
<div class="tab-pane fade show active" id="compound" role="tabpanel" aria-labelledby="compound-tab">
<div class="card">
......@@ -308,16 +308,4 @@
$('[href="' + tabHash + '"]').tab('show');
});
</script>
<script>
$("#compound_header_title").on("scroll", function (e) {
console.log("scroll");
if (this.scrollTop > 300) {
$("#compound_header_title").addClass("fix-compound_2D");
} else {
$("#compound_header_title").removeClass("fix-compound_2D");
}
});
</script>
{% endblock %}
\ No newline at end of file
Supports Markdown
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment