Légende
+{{"legend.title" | translate}}
+
+
+
+
+
+
+
+
+
\ No newline at end of file
diff --git a/src/app/pages/portal/panels/bottompanel/bottompanel.component.scss b/src/app/pages/portal/panels/bottompanel/bottompanel.component.scss
new file mode 100644
index 00000000..72789213
--- /dev/null
+++ b/src/app/pages/portal/panels/bottompanel/bottompanel.component.scss
@@ -0,0 +1,144 @@
+@import '../../portal.variables.scss';
+
+:host {
+ background-color: rgb(255, 255, 255);
+ width: 100%;
+}
+
+
+::ng-deep igo-search-results {
+ position: relative;
+ left: $portal-left!important;
+ width: calc($search-bar-width - 2 * $igo-margin);
+ display: contents;
+ height: calc(100% - $igo-icon-size - $igo-margin);
+}
+
+igo-search-results-tool {
+ display: block;
+ position: relative;
+ margin: 0 calc(4 * $igo-margin);
+ top: calc(2 * $igo-margin);
+ height: 100%;
+ width: 100%;
+}
+
+::ng-deep app-search-results-tool > div > section > h4 > strong {
+ font-size: 21px!important;
+}
+
+//// MOBILE
+
+igo-search-bar {
+ margin: auto;
+ width: 100%;
+ padding: 8px;
+}
+
+::ng-deep app-bottompanel .mat-expansion-panel-content {
+ overflow-y: scroll!important;
+ overflow-x: clip;
+ height: 264px; // expanded panel height
+ max-width: 100%;
+ scrollbar-color: #095797 #fff; //firefox
+ scrollbar-width: thin; //firefox
+}
+
+::ng-deep app-bottompanel .mat-expansion-panel-content::-webkit-scrollbar {
+ width: 6px;
+}
+
+::ng-deep app-bottompanel .mat-expansion-panel-content::-webkit-scrollbar-track {
+ box-shadow: inset 0 0 5px #DAE6F0;
+ border-radius: 10px;
+}
+
+::ng-deep app-bottompanel .mat-expansion-panel-content::-webkit-scrollbar-thumb {
+ background: #095797;
+ border-radius: 10px;
+}
+
+::ng-deep .igo-search-bar-container .mat-icon {
+ fill: #FFFFFF;
+}
+
+#bottomPanelMobile {
+ position: relative;
+ display: block;
+ bottom: 0;
+}
+
+app-feature-info {
+ overflow-x: clip;
+}
+
+:host ::ng-deep .mat-expansion-panel {
+ .mat-expansion-indicator {
+
+ &::after {
+ transform: rotate(-135deg) !important;
+ }
+ }
+
+ &.mat-expanded {
+ .mat-expansion-indicator {
+ transform: rotate(180deg) !important;
+ }
+ }
+}
+
+// Legend
+
+.mat-icon, mat-button-wrapper, .mat-icon-button .mat-icon, .mat-icon-button {
+ line-height: 26px;
+ height: 24px;
+ width: 24px;
+ float: right;
+}
+.mat-icon svg {
+ height: 20px;
+ width: 20px;
+}
+
+::ng-deep .legend.button:focus-visible {
+ display: none;
+}
+
+// angular material
+
+::ng-deep .tooltip-above{
+ position: relative!important;
+ top: 30%;
+ z-index: 5000!important;
+ background-color:white!important;
+ color: #223654!important;
+ margin: 0 8px!important;
+ padding: 8px 12px!important;
+ font-size: 14px!important;
+ line-height: 24px!important;
+ border: 1px solid #c5cad2;
+ border-radius: 0!important;
+ overflow: visible !important;
+ box-shadow: 0px 1px 7px #22365450!important;
+ white-space: pre-line;
+}
+
+::ng-deep .tooltip-above::after {
+ content: ''!important;
+ position: absolute!important;
+ top: 18%!important;
+ right: 100%!important;
+ margin-top: -5px!important;
+ border-width: 10px!important;
+ border-style: solid!important;
+ border-color: transparent transparent transparent white!important;
+ transform: rotate(180deg);
+}
+
+:host ::ng-deep .mat-expansion-indicator{
+padding: 10px;
+}
+
+:host ::ng-deep .mat-expansion-panel-header {
+ padding: 0 8px!important;
+}
\ No newline at end of file
diff --git a/src/app/pages/portal/panels/bottompanel/bottompanel.component.ts b/src/app/pages/portal/panels/bottompanel/bottompanel.component.ts
new file mode 100644
index 00000000..d3cec9eb
--- /dev/null
+++ b/src/app/pages/portal/panels/bottompanel/bottompanel.component.ts
@@ -0,0 +1,558 @@
+import {
+ Component,
+ Input,
+ OnInit,
+ Output,
+ OnDestroy,
+ EventEmitter,
+ ChangeDetectionStrategy,
+ ChangeDetectorRef,
+ ElementRef
+} from '@angular/core';
+
+import olFeature from 'ol/Feature';
+import olPoint from 'ol/geom/Point';
+
+import { StorageService } from '@igo2/core';
+import { EntityStore, ActionStore } from '@igo2/common';
+import { BehaviorSubject, Subscription, combineLatest, tap} from 'rxjs';
+
+import {
+ IgoMap,
+ FEATURE,
+ Feature,
+ FeatureMotion,
+ MapService,
+ Research,
+ SearchResult,
+ SearchService,
+ Layer,
+ featureToOl,
+ featuresAreTooDeepInView,
+ featureFromOl,
+ getCommonVectorSelectedStyle,
+ getCommonVectorStyle
+} from '@igo2/geo';
+import { MapState, QueryState, StorageState } from '@igo2/integration';
+import { SearchState } from '../search-results-tool/search.state';
+import { ConfigService } from '@igo2/core';
+
+import type { default as OlGeometry } from 'ol/geom/Geometry';
+@Component({
+ selector: 'app-bottompanel',
+ templateUrl: './bottompanel.component.html',
+ styleUrls: ['./bottompanel.component.scss'],
+ changeDetection: ChangeDetectionStrategy.OnPush
+})
+export class BottomPanelComponent implements OnInit, OnDestroy {
+
+ title$: BehaviorSubject
+
+
+
+
+
+ {{ 'legend.title' | translate }}
+
+
+
+
+
+ {{ 'igo.integration.searchResultsTool.noResults' | translate }}
+{{ 'igo.integration.searchResultsTool.doSearch' | translate }}
+ +
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ Custom feature details template
+
+
+
+
\ No newline at end of file
diff --git a/src/app/pages/portal/panels/feature/feature-details/feature-details-custom.component.scss b/src/app/pages/portal/panels/feature/feature-details/feature-details-custom.component.scss
new file mode 100644
index 00000000..de57d594
--- /dev/null
+++ b/src/app/pages/portal/panels/feature/feature-details/feature-details-custom.component.scss
@@ -0,0 +1,87 @@
+@import '@igo2/core/style/partial/core.variables';
+
+div {
+ box-sizing: border-box;
+}
+
+.table-container {
+ display: block;
+ margin: 2em auto;
+ width: 100%;
+}
+
+.table-row {
+ display: flex;
+ flex-flow: row nowrap;
+ border-bottom: 1px solid #DAE6F0;
+}
+
+.table-row:hover {
+ cursor: pointer;
+ background-color: #DAE6F0;
+}
+
+.table-row .key {
+ width: 38%;
+ font: bold 16px/24px 'Open Sans', sans-serif;
+ color: #223654;
+ margin-top: 4px;
+ margin-bottom: 4px;
+ text-align: left;
+}
+
+.table-row .value {
+ width: 62%;
+ font: normal 16px/24px 'Open Sans', sans-serif;
+ color: #223654;
+ text-align: left;
+ margin-top: 4px;
+ margin-bottom: 8px;
+}
+
+.flex-row {
+ text-align: center;
+ padding: 0.5em;
+}
+
+.info {
+ vertical-align: bottom;
+ transform: scale(0.9);
+}
+
+.link:hover {
+ color: #3374CC;
+}
+
+::ng-deep .tooltip-right, ::ng-deep .tooltip-above{
+ position: relative!important;
+ top: 30%;
+ z-index: 5000!important;
+ background-color:white!important;
+ color: #223654!important;
+ margin: 0 8px!important;
+ padding: 8px 12px!important;
+ font-size: 14px!important;
+ line-height: 24px!important;
+ border: 1px solid #c5cad2;
+ border-radius: 0!important;
+ overflow: visible !important;
+ box-shadow: 0px 1px 7px #22365450!important;
+ white-space: pre-line;
+}
+
+::ng-deep .tooltip-right::after{
+ content: ''!important;
+ position: absolute!important;
+ top: 18%!important;
+ right: 100%!important;
+ margin-top: -5px!important;
+ border-width: 10px!important;
+ border-style: solid!important;
+ border-color: transparent transparent transparent white!important;
+ transform: rotate(180deg);
+}
+
+::ng-deep .tooltip-above::after {
+ display: none;
+}
\ No newline at end of file
diff --git a/src/app/pages/portal/panels/feature/feature-details/feature-details-custom.component.ts b/src/app/pages/portal/panels/feature/feature-details/feature-details-custom.component.ts
new file mode 100644
index 00000000..e053b9a7
--- /dev/null
+++ b/src/app/pages/portal/panels/feature/feature-details/feature-details-custom.component.ts
@@ -0,0 +1,237 @@
+import {
+ Component,
+ Input,
+ ChangeDetectionStrategy,
+ ChangeDetectorRef,
+ Output,
+ EventEmitter,
+ OnDestroy,
+ OnInit,
+} from '@angular/core';
+
+import { Subject } from 'rxjs';
+import { takeUntil } from 'rxjs/operators';
+import { NetworkService, ConnectionState, LanguageService, MessageService } from '@igo2/core';
+import { ConfigService } from '@igo2/core';
+import { SearchSource, IgoMap, Feature } from '@igo2/geo';
+import { HttpClient } from '@angular/common/http';
+import { TooltipPosition } from '@angular/material/tooltip';
+import { getEntityTitle } from '@igo2/common';
+
+@Component({
+ selector: 'app-feature-details-custom',
+ templateUrl: './feature-details-custom.component.html',
+ styleUrls: ['./feature-details-custom.component.scss'],
+ changeDetection: ChangeDetectionStrategy.OnPush
+})
+
+export class FeatureDetailsCustomComponent implements OnDestroy, OnInit {
+ private state: ConnectionState;
+ private unsubscribe$ = new Subject
+
+
+
+
+
+
+
+
+
+
+
+ {{property.key}}
+
+
+
+
+
+
+ {{ getEmbeddedLinkText(property.value) }}
+
+
+
+ {{ 'igo.geo.targetHtmlUrl' | translate }}
+
+
+
+
+
+  | async}})
+
+
+
+
+
+
+
+
+
\ No newline at end of file
diff --git a/src/app/pages/portal/panels/feature/feature-details/feature-details.component.scss b/src/app/pages/portal/panels/feature/feature-details/feature-details.component.scss
new file mode 100644
index 00000000..de57d594
--- /dev/null
+++ b/src/app/pages/portal/panels/feature/feature-details/feature-details.component.scss
@@ -0,0 +1,87 @@
+@import '@igo2/core/style/partial/core.variables';
+
+div {
+ box-sizing: border-box;
+}
+
+.table-container {
+ display: block;
+ margin: 2em auto;
+ width: 100%;
+}
+
+.table-row {
+ display: flex;
+ flex-flow: row nowrap;
+ border-bottom: 1px solid #DAE6F0;
+}
+
+.table-row:hover {
+ cursor: pointer;
+ background-color: #DAE6F0;
+}
+
+.table-row .key {
+ width: 38%;
+ font: bold 16px/24px 'Open Sans', sans-serif;
+ color: #223654;
+ margin-top: 4px;
+ margin-bottom: 4px;
+ text-align: left;
+}
+
+.table-row .value {
+ width: 62%;
+ font: normal 16px/24px 'Open Sans', sans-serif;
+ color: #223654;
+ text-align: left;
+ margin-top: 4px;
+ margin-bottom: 8px;
+}
+
+.flex-row {
+ text-align: center;
+ padding: 0.5em;
+}
+
+.info {
+ vertical-align: bottom;
+ transform: scale(0.9);
+}
+
+.link:hover {
+ color: #3374CC;
+}
+
+::ng-deep .tooltip-right, ::ng-deep .tooltip-above{
+ position: relative!important;
+ top: 30%;
+ z-index: 5000!important;
+ background-color:white!important;
+ color: #223654!important;
+ margin: 0 8px!important;
+ padding: 8px 12px!important;
+ font-size: 14px!important;
+ line-height: 24px!important;
+ border: 1px solid #c5cad2;
+ border-radius: 0!important;
+ overflow: visible !important;
+ box-shadow: 0px 1px 7px #22365450!important;
+ white-space: pre-line;
+}
+
+::ng-deep .tooltip-right::after{
+ content: ''!important;
+ position: absolute!important;
+ top: 18%!important;
+ right: 100%!important;
+ margin-top: -5px!important;
+ border-width: 10px!important;
+ border-style: solid!important;
+ border-color: transparent transparent transparent white!important;
+ transform: rotate(180deg);
+}
+
+::ng-deep .tooltip-above::after {
+ display: none;
+}
\ No newline at end of file
diff --git a/src/app/pages/portal/panels/feature/feature-details/feature-details.component.ts b/src/app/pages/portal/panels/feature/feature-details/feature-details.component.ts
new file mode 100644
index 00000000..9676da64
--- /dev/null
+++ b/src/app/pages/portal/panels/feature/feature-details/feature-details.component.ts
@@ -0,0 +1,243 @@
+import {
+ Component,
+ Input,
+ ChangeDetectionStrategy,
+ ChangeDetectorRef,
+ Output,
+ EventEmitter,
+ OnDestroy,
+ OnInit,
+} from '@angular/core';
+
+import { Subject } from 'rxjs';
+import { takeUntil } from 'rxjs/operators';
+import { NetworkService, ConnectionState, MessageService } from '@igo2/core';
+import { ConfigService } from '@igo2/core';
+import { SearchSource, IgoMap, Feature } from '@igo2/geo';
+import { HttpClient } from '@angular/common/http';
+import { Clipboard } from '@igo2/utils';
+
+@Component({
+ selector: 'app-feature-details',
+ templateUrl: './feature-details.component.html',
+ styleUrls: ['./feature-details.component.scss'],
+ changeDetection: ChangeDetectionStrategy.OnPush
+})
+
+export class FeatureDetailsComponent implements OnDestroy, OnInit {
+ private state: ConnectionState;
+ private unsubscribe$ = new Subject
+
+
+
+
+
+
+
+
+ {{property.key}}
+
+
+
+
+
+
+ {{ getEmbeddedLinkText(property.value) }}
+
+
+
+ {{ 'igo.geo.targetHtmlUrl' | translate }}
+
+
+
+
+
+
+
+
+
+
+
+ {{title}}
+ + + + + + +
+
+
+
+
+
+
+
+
+
+
+
+
+
+
\ No newline at end of file
diff --git a/src/app/pages/portal/panels/sidepanel/sidepanel.component.scss b/src/app/pages/portal/panels/sidepanel/sidepanel.component.scss
new file mode 100644
index 00000000..05bd7707
--- /dev/null
+++ b/src/app/pages/portal/panels/sidepanel/sidepanel.component.scss
@@ -0,0 +1,161 @@
+@import '../../portal.variables';
+
+:host {
+ background-color: rgb(255, 255, 255);
+}
+
+mat-sidenav {
+ @extend %box-shadowed-bottom-right;
+
+ height: $app-sidenav-height;
+ width: $app-sidenav-width;
+
+ @include mobile {
+ width: $app-sidenav-width-mobile;
+ max-width: 400px;
+ }
+ overflow: visible;
+}
+
+.app-sidenav-content {
+ padding: 0 16px 0 16px!important;
+}
+
+.app-content, igo-panel {
+ height: 100%;
+}
+
+/*
+.app-sidepanel-content { // no reference to it, to delete ?
+ height: 100%;
+ display: block;
+ position: relative;
+ overflow: hidden;
+}*/
+
+app-sidepanel {
+ width: $app-sidenav-width;
+}
+
+::ng-deep igo-search-results {
+ position: relative;
+ left: $portal-left!important;
+ width: 100%;
+ display: contents;
+ height: 100%;
+}
+
+igo-search-results-tool {
+ display: block;
+ position: relative;
+ margin: 0 calc(4 * $igo-margin);
+ top: calc(2 * $igo-margin);
+ height: 100%;
+}
+
+#sidepanel-button {
+ position: absolute;
+ top: 50%;
+ left: calc($app-sidenav-width + 1px);
+ z-index: 1;
+ padding: 0;
+ min-width: 12px!important;
+ width: 24px;
+ border-radius: 0;
+}
+
+#sidepanel-button:hover {
+ background-color: #156BB2;
+}
+
+.sidepanel-closed {
+ left: 0!important;
+ position: absolute;
+}
+
+::ng-deep .icon svg {
+ fill: #FFFFFF;
+}
+
+@keyframes fadeIn {
+ from { opacity: 0; }
+ to { opacity: 1; }
+}
+
+/*mat-sidenav::backdrop {
+ z-index: 999;
+}*/
+
+app-search-results-tool, app-feature-info {
+ width: 100%;
+ height: 100%;
+ display: flex;
+ flex-direction: column;
+ padding: 16px 16px 0 16px;
+}
+
+::ng-deep app-search-results-tool > div > section > h4 > strong {
+ font-size: 21px!important;
+}
+
+app-feature-info {
+ position: relative;
+}
+
+::ng-deep .mat-drawer-inner-container {
+ top: $search-bar-height;
+ position: relative;
+ height: calc(100% - $search-bar-height);
+}
+
+:host {
+ scrollbar-color: #095797 #fff; //firefox
+ scrollbar-width: thin; //firefox
+}
+
+::ng-deep app-sidepanel .mat-drawer-inner-container::-webkit-scrollbar {
+ width: 6px;
+}
+
+::ng-deep app-sidepanel .mat-drawer-inner-container::-webkit-scrollbar-track {
+ box-shadow: inset 0 0 5px #DAE6F0;
+ border-radius: 10px;
+}
+
+::ng-deep app-sidepanel .mat-drawer-inner-container::-webkit-scrollbar-thumb {
+ background: #095797;
+ border-radius: 10px;
+ cursor: pointer; // I wish it worked out
+}
+
+// Legend
+
+.mat-icon, mat-button-wrapper, .mat-icon-button .mat-icon, .mat-icon-button {
+ line-height: 26px;
+ height: 24px;
+ width: 24px;
+ float: right;
+}
+.mat-icon svg {
+ height: 20px;
+ width: 20px;
+}
+
+.legend-items img {
+ width: 18px;
+ vertical-align: middle;
+ padding: 0 5px 0 0;
+}
+
+// info-bulle arrows from panels
+::ng-deep .tooltip-chart::after {
+ content: ''!important;
+ position: absolute!important;
+ top: 18%!important;
+ right: 100%!important;
+ margin-top: -5px!important;
+ border-width: 10px!important;
+ border-style: solid!important;
+ border-color: transparent transparent transparent white!important;
+ transform: rotate(180deg);
+}
\ No newline at end of file
diff --git a/src/app/pages/portal/panels/sidepanel/sidepanel.component.ts b/src/app/pages/portal/panels/sidepanel/sidepanel.component.ts
new file mode 100644
index 00000000..4a279d18
--- /dev/null
+++ b/src/app/pages/portal/panels/sidepanel/sidepanel.component.ts
@@ -0,0 +1,260 @@
+import {
+ Component,
+ Input,
+ Output,
+ OnInit,
+ OnDestroy,
+ EventEmitter,
+ ChangeDetectionStrategy,
+ HostListener,
+ ChangeDetectorRef
+} from '@angular/core';
+
+import { EntityStore, ActionStore } from '@igo2/common';
+
+import { BehaviorSubject } from 'rxjs';
+
+import {
+ IgoMap,
+ FEATURE,
+ Feature,
+ FeatureMotion,
+ SearchResult,
+ Layer
+} from '@igo2/geo';
+import { QueryState } from '@igo2/integration';
+import { ConfigService } from '@igo2/core';
+import { SearchState } from '../search-results-tool/search.state';
+
+@Component({
+ selector: 'app-sidepanel',
+ templateUrl: './sidepanel.component.html',
+ styleUrls: ['./sidepanel.component.scss'],
+ changeDetection: ChangeDetectionStrategy.OnPush
+})
+export class SidePanelComponent implements OnInit, OnDestroy {
+ title$: BehaviorSubject
+
+
+
+
+
+
+
+
+
+ {{ 'legend.title' | translate }}
+
+
+
+
+
+ {{ 'igo.integration.searchResultsTool.noResults' | translate }}
+{{ 'igo.integration.searchResultsTool.doSearch' | translate }}
+ +
+
+
+
+
+
+
+
+
+
+
-
-
+ (clearFeature)="clearSearch()">
-
+
-
-
+ [mobile]="mobile"
+ [(opened)]="panelOpenState"
+ [searchInit]="searchInit"
+ [store]="queryStore"
+ [legendPanelOpened]="legendPanelOpened"
+ [mapQueryClick]="mapQueryClick"
+ [panelOpenState]="panelOpenState"
+ (panelOpened)="panelOpened($event)"
+ (toggleLegend)="togglePanelLegend()"
+ (closeLegend)="closePanelLegend()"
+ (closeQuery)="closePanelOnCloseQuery()"
+ (openLegend)="openPanelLegend()"
+ [layers]="mapLayersShownInLegend">
+
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
\ No newline at end of file
diff --git a/src/app/pages/portal/sideresult/bottomresult.component.scss b/src/app/pages/portal/sideresult/bottomresult.component.scss
deleted file mode 100644
index 93cf3d91..00000000
--- a/src/app/pages/portal/sideresult/bottomresult.component.scss
+++ /dev/null
@@ -1,48 +0,0 @@
-@import '../portal.variables';
-
-:host {
- background-color: rgb(255, 255, 255);
- width: 100%;
-}
-
-
-::ng-deep igo-search-results {
- position: relative;
- left: $portal-left!important;
- width: calc(#{$search-bar-width} - (2 * #{$igo-margin}));
- display: contents;
- height: calc(100% - #{$igo-icon-size} - #{$igo-margin});
-}
-
-igo-search-results-tool {
- display: block;
- position: relative;
- margin: 0 calc(4 * #{$igo-margin});
- top: calc(2 * #{$igo-margin});
- height: 100%;
- width: 100%;
-}
-
-::ng-deep app-search-results-tool > div > section > h4 > strong {
- font-size: 21px!important;
-}
-
-//// MOBILE
-
-igo-search-bar {
- margin: auto;
- width: 100%;
- padding: 1rem;
-}
-
-::ng-deep app-bottomresult .mat-expansion-panel-content {
- overflow-y: scroll!important;
- height: 250px;
- width: 100%;
-}
-
-#bottomResultMobile {
- position: relative;
- display: block;
- bottom: 0;
-}
diff --git a/src/app/pages/portal/sideresult/bottomresult.component.ts b/src/app/pages/portal/sideresult/bottomresult.component.ts
deleted file mode 100644
index ddae8fda..00000000
--- a/src/app/pages/portal/sideresult/bottomresult.component.ts
+++ /dev/null
@@ -1,276 +0,0 @@
-import {
- Component,
- Input,
- Output,
- OnInit,
- OnDestroy,
- EventEmitter,
- ChangeDetectionStrategy,
- ElementRef,
- ViewChild
-} from '@angular/core';
-
-import * as proj from 'ol/proj';
-import { LanguageService, MediaService } from '@igo2/core';
-import { EntityStore, ActionStore } from '@igo2/common';
-import { BehaviorSubject } from 'rxjs';
-
-import {
- IgoMap,
- FEATURE,
- Feature,
- FeatureMotion,
- GoogleLinks,
- LayerService,
- MapService,
- Layer,
- ProjectionService,
- Research,
- SearchResult,
- SearchService
-} from '@igo2/geo';
-import { CatalogState, SearchState } from '@igo2/integration';
-import { ConfigService } from '@igo2/core';
-
-@Component({
- selector: 'app-bottomresult',
- templateUrl: './bottomresult.component.html',
- styleUrls: ['./bottomresult.component.scss'],
- changeDetection: ChangeDetectionStrategy.OnPush
-})
-export class BottomResultComponent implements OnInit, OnDestroy {
- title$: BehaviorSubject
-
-
-
-
-{{ 'igo.integration.searchResultsTool.noResults' | translate }}
-{{ 'igo.integration.searchResultsTool.doSearch' | translate }}
- -
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
\ No newline at end of file
diff --git a/src/app/pages/portal/sideresult/sideresult.component.scss b/src/app/pages/portal/sideresult/sideresult.component.scss
deleted file mode 100644
index bd688d55..00000000
--- a/src/app/pages/portal/sideresult/sideresult.component.scss
+++ /dev/null
@@ -1,93 +0,0 @@
-@import '../portal.variables';
-
-:host {
- background-color: rgb(255, 255, 255);
-}
-
-mat-sidenav {
- @extend %box-shadowed-bottom-right;
-
- height: $app-sidenav-height;
- width: $app-sidenav-width;
-
- @include mobile {
- width: $app-sidenav-width-mobile;
- max-width: 400px;
- }
- overflow: visible;
-}
-
-.app-content, igo-panel {
- height: 100%;
-}
-
-.app-sideresult-content {
- height: 100%;
- display: block;
- position: relative;
- overflow: hidden;
-}
-
-app-sideresult {
- width: $app-sidenav-width;
-}
-
-::ng-deep igo-search-results {
- position: relative;
- left: $portal-left!important;
- width: 100%;
- display: contents;
- height: 100%;
-}
-
-igo-search-results-tool {
- display: block;
- position: relative;
- margin: 0 calc(4 * #{$igo-margin});
- top: calc(2 * #{$igo-margin});
- height: 100%;
-}
-
-#sideresult-button {
- display: block;
- position: absolute;
- top: 50%;
- left:calc(#{$app-sidenav-width} + 1px);
- z-index: 1;
- padding: 0;
- min-width: 12px!important;
- animation-duration: 3s;
- visibility: visible;
- opacity: 1;
- opacity: 0;
- animation: fadeIn 0.9s;
- animation-delay: 0.5s;
- animation-fill-mode: forwards;
- width: 24px;
-}
-
-.sideresult-closed {
-left: 0!important;
-position: absolute;
-}
-
-@keyframes fadeIn {
- from { opacity: 0; }
- to { opacity: 1; }
-}
-
-/*mat-sidenav::backdrop {
- z-index: 999;
-}*/
-
-app-search-results-tool {
- width: 100%;
- height: 100%;
- padding: 0 16px;
- display: flex;
- padding-top: 60px;
-}
-
-::ng-deep app-search-results-tool > div > section > h4 > strong {
- font-size: 21px!important;
-}
\ No newline at end of file
diff --git a/src/app/pages/portal/sideresult/sideresult.component.ts b/src/app/pages/portal/sideresult/sideresult.component.ts
deleted file mode 100644
index 075f07f1..00000000
--- a/src/app/pages/portal/sideresult/sideresult.component.ts
+++ /dev/null
@@ -1,268 +0,0 @@
-import {
- Component,
- Input,
- Output,
- OnInit,
- OnDestroy,
- EventEmitter,
- ChangeDetectionStrategy,
- ElementRef,
- ViewChild
-} from '@angular/core';
-
-import * as proj from 'ol/proj';
-import { MediaService } from '@igo2/core';
-import { EntityStore, ActionStore } from '@igo2/common';
-
-import { BehaviorSubject } from 'rxjs';
-
-import {
- IgoMap,
- FEATURE,
- Feature,
- FeatureMotion,
- GoogleLinks,
- LayerService,
- MapService,
- Layer,
- Research,
- SearchResult,
- SearchService
-} from '@igo2/geo';
-import { SearchState } from '@igo2/integration';
-import { ConfigService } from '@igo2/core';
-
-@Component({
- selector: 'app-sideresult',
- templateUrl: './sideresult.component.html',
- styleUrls: ['./sideresult.component.scss'],
- changeDetection: ChangeDetectionStrategy.OnPush
-})
-export class SideResultComponent implements OnInit, OnDestroy {
- title$: BehaviorSubject
-
-
-
-
-
- You can search for adresses, locations, businesses or coordinates.
Address searches can be done combining :
- civic number
- street name
- city
- postal code
Coordinates search example :
- Decimal degree:
-68.165547, 48.644546 - Degrees, Minutes, Seconds:
-68 9 56, 48 38 40
Permet de rechercher des adresses, des lieux, des entreprises ou des coordonnées.
Les recherches d'adresses peuvent être effectuées selon une combinaison :
- du no. immeuble
- du nom de la rue
- de la ville
- du code postal
Exemple de coordonnées :
- Degré décimal:
-68.165547, 48.644546 - Degré minute seconde:
-68 9 56, 48 38 40
Permet de rechercher des adresses, des lieux, des entreprises ou des coordonnées.
Les recherches d'adresses peuvent être effectuées selon une combinaison :
- du no. immeuble
- du nom de la rue
- de la ville
- du code postal
Exemple de coordonnées :
- Degré décimal:
-68.165547, 48.644546 - Degré minute seconde:
-68 9 56, 48 38 40
Permet de rechercher des adresses, des lieux, des entreprises ou des coordonnées.
Les recherches d'adresses peuvent être effectuées selon une combinaison :
- du no. immeuble
- du nom de la rue
- de la ville
- du code postal
Exemple de coordonnées :
- Degré décimal:
-68.165547, 48.644546 - Degré minute seconde:
-68 9 56, 48 38 40
@@ -328,8 +356,8 @@ text-decoration: underline;
background-color: transparent;
}
-p, ul, li, u {
- font-family: 'Open Sans',sans-serif;
+p, ul, li, u, .text {
+ font-family: 'Open Sans', sans-serif;
color: #223654;
font-size: 16px;
line-height: 24px;
@@ -354,10 +382,10 @@ h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6 { // removed h3 for conflic
h1 {
font-size: 48px;
- line-height: 40px;
+ line-height: 56px;
font-weight: bold;
- margin-top: 48px;
- margin-bottom: 16px;
+ margin-top: 72px;
+ margin-bottom: 32px;
}
@media (max-width: 1200px) {
@@ -373,9 +401,9 @@ h1:after {
content: "";
display: block;
margin: 0;
- width: 4.8rem;
- padding-top: 0.4rem;
- border-bottom: 4px solid #f09686;
+ width: 48px;
+ padding-top: 4px;
+ border-bottom: 4px solid #e58271;
}
h2 {
@@ -388,7 +416,7 @@ h2 {
@media (max-width: 1200px) {
h2 {
- font-size: 29px;
+ font-size: 28px;
line-height: 32px;
font-weight: bold;
margin-top: 48px;
@@ -432,12 +460,17 @@ h5 {
h6 {
font-size: 16px!important;
- line-height: 24px!important;
+ line-height: 20px!important;
font-weight: bold;
margin-top: 16px;
margin-bottom: 0px;
}
+// class to capitalize the first letter
+.cap-first::first-letter {
+ text-transform: capitalize;
+}
+
.headline {
background-color: #223654!important;
}
@@ -465,7 +498,7 @@ border-radius: 0 !important;
.qcca-theme input.mat-input-element {
color: #647287;
- font-family: 'open sans';
+ font-family: 'Open Sans', sans-serif;
}
@@ -474,10 +507,105 @@ igo-list [igolistitem][color=accent].igo-list-item-selected > mat-list-item {
color: white!important;
}
+.qcca-theme igo-list [igolistitem][color=accent].igo-list-item-selected > mat-list-item {
+ background-color: #4A98D9;
+
+ h4, small {
+ color: white!important;
+ }
+}
+
::ng-deep igo-search-results-item small {
color: white!important;
}
+// Exemple de template d'AVIS:
+
+// Structure html :
+//
+//
+//
+// Title
+// Label
+//
+//