Skip to content
Snippets Groups Projects
Commit 23124686 authored by Jérémie BRISON's avatar Jérémie BRISON
Browse files

fix(structureDetails) : Add new button to close details

parent 885c85b9
No related branches found
No related tags found
2 merge requests!31Recette,!25Change close btn details and add 'autres' section to 'Démarche'
<div class="structrue-details-container" *ngIf="structure"> <div class="structrue-details-container" *ngIf="structure">
<!-- Header info --> <!-- Header info -->
<div fxLayout="row" fxLayoutAlign="end center">
<div (click)="close()" class="ico-close-details"></div>
</div>
<div fxLayout="row" class="structrue-details-block" fxLayoutAlign="baseline baseline" fxLayoutGap="20px"> <div fxLayout="row" class="structrue-details-block" fxLayoutAlign="baseline baseline" fxLayoutGap="20px">
<em class="ic-arrow-left clickable hide-on-print" (click)="close()"></em>
<div fxLayout="column" fxLayoutGap="10px" fxFlex="100%"> <div fxLayout="column" fxLayoutGap="10px" fxFlex="100%">
<div fxLayout="row" fxLayoutAlign="space-between"> <div fxLayout="row" fxLayoutAlign="space-between start">
<div fxLayout="column center"> <div fxLayout="column">
<h2 class="bold">{{ structure.nomDeVotreStructure }}</h2> <h2 class="bold">{{ structure.nomDeVotreStructure }}</h2>
<h3>{{ structure.typeDeStructure }}</h3> <h3>{{ structure.typeDeStructure }}</h3>
</div> </div>
......
...@@ -13,13 +13,14 @@ ...@@ -13,13 +13,14 @@
max-width: 980px; max-width: 980px;
width: 100%; width: 100%;
height: calc(100vh - #{$header-height} - #{$footer-height}); height: calc(100vh - #{$header-height} - #{$footer-height});
padding: 18px 24px; padding: 10px 24px;
overflow: auto; overflow: auto;
} }
.structrue-details-block { .structrue-details-block {
border-bottom: 1px dashed $grey-2; border-bottom: 1px dashed $grey-2;
padding-bottom: 24px; padding-bottom: 24px;
padding-right: 68px;
.subtitle { .subtitle {
text-transform: uppercase; text-transform: uppercase;
@include cn-bold-16; @include cn-bold-16;
...@@ -37,6 +38,7 @@ ...@@ -37,6 +38,7 @@
} }
h2 { h2 {
margin-top: 0;
margin-bottom: 5px; margin-bottom: 5px;
@include cn-regular-24; @include cn-regular-24;
} }
......
...@@ -575,3 +575,34 @@ ...@@ -575,3 +575,34 @@
border-top-right-radius: 3px; border-top-right-radius: 3px;
top: 9px; top: 9px;
} }
.ico-close-details {
width: 40px;
height: 40px;
border-radius: 40px;
background-color: $black;
display: flex;
justify-content: center;
align-items: center;
cursor: pointer;
&:active {
opacity: 0.8;
}
&:before,
&:after {
content: '';
width: 23px;
height: 2px;
background-color: $white;
position: absolute;
border-radius: 1px;
}
&:before {
transform: rotate(45deg);
}
&:after {
transform: rotate(-45deg);
}
}
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