From e7d5f83100f43564b55249909a6658e583e3a9b2 Mon Sep 17 00:00:00 2001
From: Rainer Killinger <killinger@hrz.uni-frankfurt.de>
Date: Mon, 31 Jan 2022 11:59:23 +0100
Subject: [PATCH] fix: schedule navigation bar layout

---
 .../page/modal/modal-event-creator.html       | 18 ++++++-----
 .../page/modal/modal-event-creator.scss       |  8 ++---
 .../modules/schedule/page/schedule-page.html  | 32 +++++++++++--------
 .../modules/schedule/page/schedule-page.scss  |  5 ---
 .../modules/schedule/page/schedule-view.scss  |  8 +++++
 5 files changed, 39 insertions(+), 32 deletions(-)

diff --git a/src/app/modules/schedule/page/modal/modal-event-creator.html b/src/app/modules/schedule/page/modal/modal-event-creator.html
index fadb8a84..4fe290fc 100644
--- a/src/app/modules/schedule/page/modal/modal-event-creator.html
+++ b/src/app/modules/schedule/page/modal/modal-event-creator.html
@@ -13,14 +13,16 @@
   ~ this program. If not, see <https://www.gnu.org/licenses/>.
   -->
 
-<ion-card-header>
-  <ion-card-title>{{
-    'schedule.addEventModal.addEvent' | translate
-  }}</ion-card-title>
-  <ion-button fill="clear" (click)="dismissAction()">
-    <ion-label>{{ 'modal.DISMISS' | translate }}</ion-label>
-  </ion-button>
-</ion-card-header>
+<ion-toolbar>
+  <ion-title>{{
+    'schedule.addEventModal.addEvent' | translate | titlecase
+  }}</ion-title>
+  <ion-buttons slot="end">
+    <ion-button fill="clear" (click)="dismissAction()">
+      <ion-label>{{ 'modal.DISMISS' | translate }}</ion-label>
+    </ion-button>
+  </ion-buttons>
+</ion-toolbar>
 
 <ion-card-content>
   <stapps-search-page
diff --git a/src/app/modules/schedule/page/modal/modal-event-creator.scss b/src/app/modules/schedule/page/modal/modal-event-creator.scss
index 9bfd914c..efa05721 100644
--- a/src/app/modules/schedule/page/modal/modal-event-creator.scss
+++ b/src/app/modules/schedule/page/modal/modal-event-creator.scss
@@ -1,8 +1,6 @@
-ion-card-header {
-  ion-button {
-    position: absolute;
-    right: 0;
-    top: 0;
+ion-button {
+    ion-label {
+      color: var(--ion-color-primary);
   }
 }
 
diff --git a/src/app/modules/schedule/page/schedule-page.html b/src/app/modules/schedule/page/schedule-page.html
index 8400bbc7..1604f015 100644
--- a/src/app/modules/schedule/page/schedule-page.html
+++ b/src/app/modules/schedule/page/schedule-page.html
@@ -14,20 +14,24 @@
   -->
 
 <ion-header>
-  <ion-buttons>
-    <ion-menu-button></ion-menu-button>
-  </ion-buttons>
-  <ion-segment #segment value="calendar" (ionChange)="onSegmentChange()">
-    <ion-segment-button value="calendar">
-      <ion-label>{{ 'schedule.calendar' | translate }}</ion-label>
-    </ion-segment-button>
-    <ion-segment-button value="recurring">
-      <ion-label>{{ 'schedule.recurring' | translate }}</ion-label>
-    </ion-segment-button>
-    <ion-segment-button value="single">
-      <ion-label>{{ 'schedule.single' | translate }}</ion-label>
-    </ion-segment-button>
-  </ion-segment>
+  <ion-toolbar>
+    <ion-buttons slot="start">
+      <ion-back-button></ion-back-button>
+      <ion-menu-button></ion-menu-button>
+    </ion-buttons>
+
+    <ion-segment #segment value="calendar" (ionChange)="onSegmentChange()">
+      <ion-segment-button value="calendar">
+        <ion-label>{{ 'schedule.calendar' | translate }}</ion-label>
+      </ion-segment-button>
+      <ion-segment-button value="recurring">
+        <ion-label>{{ 'schedule.recurring' | translate }}</ion-label>
+      </ion-segment-button>
+      <ion-segment-button value="single">
+        <ion-label>{{ 'schedule.single' | translate }}</ion-label>
+      </ion-segment-button>
+    </ion-segment>
+  </ion-toolbar>
 </ion-header>
 
 <div
diff --git a/src/app/modules/schedule/page/schedule-page.scss b/src/app/modules/schedule/page/schedule-page.scss
index 231bb026..1b6fefb8 100644
--- a/src/app/modules/schedule/page/schedule-page.scss
+++ b/src/app/modules/schedule/page/schedule-page.scss
@@ -14,11 +14,6 @@
  */
 
 
-ion-header {
-  display: flex;
-  padding: 8px;
-}
-
 div {
   height: 100%;
 }
diff --git a/src/app/modules/schedule/page/schedule-view.scss b/src/app/modules/schedule/page/schedule-view.scss
index 1d8830d2..d70a5ef0 100644
--- a/src/app/modules/schedule/page/schedule-view.scss
+++ b/src/app/modules/schedule/page/schedule-view.scss
@@ -16,3 +16,11 @@
 .full-height {
   height: 100%;
 }
+
+.day-labels > ion-button[disabled] {
+  opacity: 1;
+}
+
+ion-button > ion-label {
+  overflow: visible !important
+}