remove duplicated header set background to event pages

src/app/pages/events/events.module.ts

@@ -4,7 +4,6 @@ import { FormsModule } from '@angular/forms';
 import { IonicModule } from '@ionic/angular';
 import { EventsPageRoutingModule } from './events-routing.module';
 import { EventsPage } from './events.page';
-import { HeaderPageModule } from 'src/app/shared/header/header.module';
 
 @NgModule({
   imports: [
@@ -12,7 +11,6 @@ import { HeaderPageModule } from 'src/app/shared/header/header.module';
     FormsModule,
     IonicModule,
     EventsPageRoutingModule,
-    HeaderPageModule,
     //
   ],
   declarations: [EventsPage],

src/app/pages/events/events.page.html

@@ -1,7 +1,3 @@
-<ion-header class="ion-no-border">
-  <app-header></app-header>
-</ion-header>
-
 <!-- <ion-header class="ion-no-border init-event-header"> -->
 <ion-header class="ion-no-border">
   <ion-label>

src/app/pages/events/events.page.scss

@@ -1,5 +1,21 @@
 @import '~src/function.scss';
 
+:host {
+  // mobile
+  background: var(--background-mobile);
+}
+
+
+// desktop
+@media only screen and (min-width: 1365px) {
+  // set color to body
+  :host {
+    // mobile
+    background: var(--background-desktop) !important  ;
+
+  }
+}
+
 /* HEADER */
 .bg-blue{
   --background:#0782c9;