Skip to content

Commit

Permalink
Enable dark mode system pref, update settings layout, remove POI header
Browse files Browse the repository at this point in the history
  • Loading branch information
webprofusion-chrisc committed Jan 30, 2024
1 parent 722034c commit ab1468d
Show file tree
Hide file tree
Showing 9 changed files with 216 additions and 277 deletions.
Original file line number Diff line number Diff line change
Expand Up @@ -5,7 +5,7 @@
<ion-row>
<ion-col size="3">

<img [src]="getConnectorTypeIcon(i.ConnectionTypeID)" style="max-width: 64px">
<img [src]="getConnectorTypeIcon(i.ConnectionTypeID)" style="max-width: 64px;background-color:#ffffffad">
<ion-badge color="primary" *ngIf="i.Quantity">{{i.Quantity}} x</ion-badge>
<div class="info">{{i.StatusType?.Title}}</div>
</ion-col>
Expand Down
7 changes: 6 additions & 1 deletion src/app/components/poi-details/poi-details.html
Original file line number Diff line number Diff line change
Expand Up @@ -21,8 +21,13 @@ <h2>

<ion-badge color="primary" title="Average User Rating">{{avgRating | number:'1.1-1'}}</ion-badge>
</div>
<ion-fab vertical="top" horizontal="start" slot="fixed">
<ion-fab-button size="small" color="medium" (click)="close()">
<ion-icon name="close"></ion-icon>
</ion-fab-button>
</ion-fab>
<ion-fab vertical="top" horizontal="end" slot="fixed">
<ion-fab-button>
<ion-fab-button size="small" color="success">
<ion-icon name="add"></ion-icon>
</ion-fab-button>
<ion-fab-list side="bottom">
Expand Down
22 changes: 1 addition & 21 deletions src/app/components/poi-details/poi-details.scss
Original file line number Diff line number Diff line change
@@ -1,7 +1,7 @@
.banner {
background-color: #4f712f;
color: rgba(255, 255, 255, 0.925);
padding: 1em;
padding: 1em 3em 1em 6em;
text-shadow: #000 1px 1px 1px;
min-height: 180px;
background-size: cover;
Expand All @@ -14,26 +14,6 @@
padding-right: 48px;
}

h3 {
font-weight: bold;
}

.label {
color: black;
font-weight: bold;
font-size: 12px;
}

.details {
color: #707d61;
margin-left: 1em;
font-size: 12px;
}

.details-minor {
color: #707d61;
font-size: 12px;
}

p {
display: block;
Expand Down
4 changes: 4 additions & 0 deletions src/app/components/poi-details/poi-details.ts
Original file line number Diff line number Diff line change
Expand Up @@ -318,4 +318,8 @@ export class PoiDetails implements OnInit {

}
}

close(){
this.modalController.dismiss();
}
}
13 changes: 0 additions & 13 deletions src/app/pages/poi-details/poi-details.html
Original file line number Diff line number Diff line change
@@ -1,17 +1,4 @@
<ion-header>
<ion-toolbar color="primary">
<ion-title>
{{poi.AddressInfo.Title}}
<small>OCM-{{poi.ID}}</small>
</ion-title>
<ion-buttons slot="start">
<ion-button (click)="close()">
<ion-icon name="close" slot="icon-only"></ion-icon>

</ion-button>
</ion-buttons>
</ion-toolbar>
</ion-header>

<ion-content class="poi-details">
<poi-details [poi]="poi"></poi-details>
Expand Down
37 changes: 1 addition & 36 deletions src/app/pages/poi-details/poi-details.scss
Original file line number Diff line number Diff line change
@@ -1,39 +1,4 @@
.left-col {
float: left;
width: 50%;
overflow: auto;
}
.right-col {
float: right;
width: 50%;
overflow: auto;
}

.row:after {
content: "";
display: table;
clear: both;
overflow: auto;
}
.row {
margin-bottom: 1em;
}

.subtle {
color: #c0c0c0;
}

@media screen and (max-width: 768px) {
.left-col {
float: none;
width: 100%;
}
.right-col {
margin-top: 1em;
float: none;
width: 100%;
}
}
.address-details ion-card img {
max-height: 200px;
width: auto;
Expand All @@ -45,5 +10,5 @@ ion-label {
}

ion-title > small {
color: rgba(255, 255, 255, 0.75);
color: var(--ion-color-favorite)
}
2 changes: 1 addition & 1 deletion src/app/pages/search/search.scss
Original file line number Diff line number Diff line change
Expand Up @@ -6,7 +6,7 @@
}
#place-search {
min-height: 300px;
background-color: #f0f0f0;

position: absolute;
z-index: 100;
width: 100%;
Expand Down
95 changes: 46 additions & 49 deletions src/app/pages/settings/settings.html
Original file line number Diff line number Diff line change
Expand Up @@ -21,7 +21,7 @@ <h2>Search Filters</h2>
<ion-item *ngIf="isCountryFilterFeatureEnabled">

<ion-select [label]="'ocm.search.countries' | translate" [(ngModel)]="searchSettings.FilterOptionsByCountryId"
multiple="false" cancelText="Cancel" okText="OK" (ionChange)="onCountryChange()">
multiple="false" cancelText="Cancel" okText="OK" (ionChange)="onCountryChange()" placeholder="All">
<ion-select value="">(All Countries)</ion-select>
<ion-select-option *ngFor="let item of countries" [value]="item.ID">{{item.Title}}</ion-select-option>

Expand All @@ -34,7 +34,7 @@ <h2>Search Filters</h2>
<ion-item>

<ion-select [label]="'ocm.search.usageTypes' | translate" [(ngModel)]="searchSettings.UsageTypeList"
multiple="true" cancelText="Cancel" okText="OK">
multiple="true" cancelText="Cancel" okText="OK" placeholder="All">
<ion-select-option *ngFor="let item of usageTypes" [value]="item.ID">{{'ocm.reference.usageType.value_'+item.ID
| nullableTranslate:item}}</ion-select-option>

Expand All @@ -43,7 +43,7 @@ <h2>Search Filters</h2>

<ion-item>
<ion-select [label]="'ocm.search.operationalStatusTypes' | translate" [(ngModel)]="searchSettings.StatusTypeList"
multiple="true" cancelText="Cancel" okText="OK">
multiple="true" cancelText="Cancel" okText="OK" placeholder="All">
<ion-select-option *ngFor="let item of statusTypes"
[value]="item.ID">{{'ocm.reference.statusType.value_'+item.ID | nullableTranslate:item }}</ion-select-option>

Expand All @@ -52,71 +52,68 @@ <h2>Search Filters</h2>

<ion-item>
<ion-select [label]="'ocm.search.connectionTypes'| translate" [(ngModel)]="searchSettings.ConnectionTypeList"
multiple="true" cancelText="Cancel" okText="OK">
multiple="true" cancelText="Cancel" okText="OK" placeholder="All">
<ion-select-option *ngFor="let item of connectionTypes"
[value]="item.ID">{{'ocm.reference.connectionType.value_'+item.ID | nullableTranslate:item
}}</ion-select-option>
</ion-select>
</ion-item>

<ion-item lines="none">

<ion-range dualKnobs="true" min="0" max="650" pin="true" [(ngModel)]="powerRange" [ticks]="true" [snaps]="true" [min]="powerRange.lower" [max]="powerRange.upper">
<ion-item>
<ion-range labelPlacement="start" label="Power (kW)" dualKnobs="true" pin="true" [(ngModel)]="powerRange" [ticks]="false" [snaps]="false" [min]="0" [max]="maxPower">
<ion-icon slot="start" size="small" name="flash">0</ion-icon>
<ion-icon slot="end" name="flash"></ion-icon>
</ion-range>

</ion-item>

<ion-item lines="none">
<ion-note slot="start" style="padding-top:0;">Min. Power (kW)<br><input type="number"
[(ngModel)]="powerRange.lower" min="0" [max]="powerRange.upper" style="width: 3em;border:none;"></ion-note>
<ion-note slot="end" style="padding-top:0;">Max. Power (kW)<br><input type="number" [(ngModel)]="powerRange.upper"
[max]="maxPower" [min]="powerRange.lower" style="width: 3em;border:none;"></ion-note>
</ion-item>

</ion-list>
<h2>
General Settings
</h2>
<ion-input slot="start" type="number" labelPlacement="stacked"
label="Min. kW" [(ngModel)]="powerRange.lower" min="0" [max]="powerRange.upper"></ion-input>
<ion-input slot="end" type="number" labelPlacement="stacked"
label="Max. kW" [(ngModel)]="powerRange.upper" [min]="powerRange.lower" [max]="maxPower" ></ion-input>

<ion-item>
<ion-select label="Language" [(ngModel)]="searchSettings.Language" (ionChange)="onLanguageChange()"
multiple="false">
<ion-select-option *ngFor="let item of languages" [value]="item.code">{{item.title}}</ion-select-option>
</ion-select>
</ion-item>

<ion-item>

<ion-select [label]="'ocm.details.location.map'| translate" [(ngModel)]="searchSettings.MapType"
(ionChange)="onMapTypeChange()" multiple="false" cancelText="Cancel" okText="OK">
<ion-select-option value="ROADMAP">Road Map</ion-select-option>
<ion-select-option value="SATELLITE">Satellite</ion-select-option>
</ion-select>
</ion-item>

<ion-item>
<ion-toggle [(ngModel)]="searchSettings.EnableAdvancedEditorFeatures">Enable Advanced Editor Options</ion-toggle>
</ion-item>
<ion-item>
<ion-toggle [(ngModel)]="searchSettings.EnablePOIPendingApproval">Show POIs Pending Approval</ion-toggle>
</ion-item>
</ion-list>
<h2>
General Settings
</h2>

<ion-item>
<ion-input label="Max Results" type="number" placeholder="500" [(ngModel)]="searchSettings.MaxResults" min="100"
<ion-item>
<ion-select label="Language" [(ngModel)]="searchSettings.Language" (ionChange)="onLanguageChange()"
multiple="false" placeholder="Select">
<ion-select-option *ngFor="let item of languages" [value]="item.code">{{item.title}}</ion-select-option>
</ion-select>
</ion-item>

<ion-item>

<ion-select [label]="'ocm.details.location.map'| translate" [(ngModel)]="searchSettings.MapType"
(ionChange)="onMapTypeChange()" multiple="false" cancelText="Cancel" okText="OK" placeholder="Select">
<ion-select-option value="ROADMAP">Road Map</ion-select-option>
<ion-select-option value="SATELLITE">Satellite</ion-select-option>
</ion-select>
</ion-item>

<ion-item>
<ion-toggle [(ngModel)]="searchSettings.EnableAdvancedEditorFeatures">Enable Advanced Editor Options</ion-toggle>
</ion-item>
<ion-item>
<ion-toggle [(ngModel)]="searchSettings.EnablePOIPendingApproval">Show POIs Pending Approval</ion-toggle>
</ion-item>

<ion-item>
<ion-input label="Max Results" type="number" placeholder="500" [(ngModel)]="searchSettings.MaxResults" min="100"
max="10000"></ion-input>
</ion-item>
</ion-item>

</ion-content>
<ion-footer>
<ion-toolbar>
<ion-buttons slot="end">
<ion-button (click)="close()">
<ion-icon name="close" slot="start"></ion-icon>
<ion-toolbar>
<ion-buttons slot="end">
<ion-button (click)="close()">
<ion-icon name="close" slot="start"></ion-icon>
Close
</ion-button>
</ion-buttons>
</ion-buttons>

</ion-toolbar>
</ion-toolbar>
</ion-footer>
Loading

0 comments on commit ab1468d

Please sign in to comment.