diff --git a/diagnostic-ui/src/app/app.module.ts b/diagnostic-ui/src/app/app.module.ts index 877394061..9c5bf012e 100644 --- a/diagnostic-ui/src/app/app.module.ts +++ b/diagnostic-ui/src/app/app.module.ts @@ -19,7 +19,9 @@ const useMocks = require('../../config.json').useMocks imports: [ HttpClientModule, BrowserModule, - IonicModule.forRoot(), + IonicModule.forRoot({ + mode: 'md', + }), AppRoutingModule, ], providers: [ diff --git a/setup-wizard/src/app/app.module.ts b/setup-wizard/src/app/app.module.ts index f7fcc5af3..cd0e42e10 100644 --- a/setup-wizard/src/app/app.module.ts +++ b/setup-wizard/src/app/app.module.ts @@ -26,6 +26,7 @@ const useMocks = require('../../config.json').useMocks as boolean imports: [ BrowserModule, IonicModule.forRoot({ + mode: 'md', navAnimation: iosTransitionAnimation, }), AppRoutingModule, diff --git a/ui/src/app/app.module.ts b/ui/src/app/app.module.ts index 3712a1eb1..7d25a6e1c 100644 --- a/ui/src/app/app.module.ts +++ b/ui/src/app/app.module.ts @@ -29,7 +29,9 @@ import { GlobalErrorHandler } from './services/global-error-handler.service' imports: [ HttpClientModule, BrowserModule, - IonicModule.forRoot(), + IonicModule.forRoot({ + mode: 'md', + }), AppRoutingModule, IonicStorageModule.forRoot({ storeName: '_embassykv', diff --git a/ui/src/app/pages/apps-routes/app-show/app-show.page.html b/ui/src/app/pages/apps-routes/app-show/app-show.page.html index 881b96505..8404262ba 100644 --- a/ui/src/app/pages/apps-routes/app-show/app-show.page.html +++ b/ui/src/app/pages/apps-routes/app-show/app-show.page.html @@ -3,7 +3,7 @@ - + diff --git a/ui/src/global.scss b/ui/src/global.scss index e84b92fd2..77798c7aa 100644 --- a/ui/src/global.scss +++ b/ui/src/global.scss @@ -159,7 +159,7 @@ ion-icon { ion-toolbar { --min-height: 72px; - --ion-background-color: var(--ion-color-light); + --background: var(--ion-color-light); } ion-infinite-scroll ion-infinite-scroll-content { @@ -255,10 +255,16 @@ ion-slides { } } +ion-back-button { + --background: var(--ion-color-light); + --color: var(--ion-color-dark); +} + ion-item-divider { text-transform: uppercase; --padding-top: 24px; font-weight: 600; + --background: transparent; --color: var(--ion-color-dark); font-size: medium; border-bottom: none;