Skip to content
Snippets Groups Projects
Commit 6ddb95d2 authored by Marlène SIMONDANT's avatar Marlène SIMONDANT
Browse files

feat(stucture-details): sticky close button and structure name

parent b5c68a01
No related branches found
No related tags found
2 merge requests!197v1.12.0,!192feat/US24-close-structure-details
<div class="structrue-details-container" *ngIf="structure && !isLoading">
<!-- Header info -->
<div fxLayout="row" fxLayoutAlign="end center">
<div (click)="close()" class="ico-close-details"></div>
<div fxLayout="space-between wrap-reverse" class="sticky-title">
<div fxLayout="column" class="no-margin" fxLayoutAlign="end end">
<h2 class="bold">{{ structure.structureName }}</h2>
</div>
<div fxLayout="column" fxLayoutAlign="start start" class="ico-close">
<div (click)="close()" class="ico-close-details"></div>
</div>
</div>
<div fxLayout="row" class="structure-details-block" fxLayoutAlign="baseline baseline" fxLayoutGap="8px">
<div fxLayout="column" fxLayoutGap="10px" fxFlex="100%">
<div fxLayout="column" class="no-margin" fxLayoutAlign="space-between start">
<h2 class="bold">{{ structure.structureName }}</h2>
</div>
<div fxLayout="row" fxLayoutAlign="space-between center">
<div class="typeInformationHeader" fxLayout="column">
<h3>{{ structure.getLabelTypeStructure() }}</h3>
......
......@@ -18,13 +18,14 @@ a {
left: 0;
max-width: 980px;
width: 100%;
height: calc(100vh - #{$header-height} - #{$footer-height} - 20px);
padding: 10px 24px;
height: calc(100vh - #{$header-height} - #{$footer-height});
padding: 0px 24px;
overflow: auto;
@media #{$tablet} {
width: calc(100% - 2 * 24px);
position: inherit;
height: 100%;
overflow: unset;
.printButton {
display: none !important;
}
......@@ -131,3 +132,23 @@ p,
gap: 20px 30px;
grid-template-columns: 1fr 1fr;
}
.ico-close {
margin-left: auto;
padding-top: 10px;
}
.sticky-title {
position: sticky;
top: 0px;
max-width: 980px;
width: 100%;
background-color: $white;
height: 80px;
z-index: 1;
@media #{$tablet} {
height: auto;
}
@media #{$small-phone} {
width: 111%;
padding-right: 20px;
}
}
0% Loading or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment