darkmode fix

apps/demo/src/app/app.component.html

@@ -7,5 +7,6 @@
   tabMobilePosition="bottom"
   color="primary"
 >
-<sio-darkmode-toggle slot="left_content"></sio-darkmode-toggle>
+  <sio-darkmode-toggle slot="left_footer"></sio-darkmode-toggle>
+
 </sio-app>

apps/demo/src/app/home/home.page.html

@@ -1,5 +1,3 @@
-<sio-page title="Home"> 
-
-        <sio-input name="app_title"></sio-input>
-
+<sio-page title="Home">
+
 </sio-page>   

apps/demo/src/app/home/home.page.ts

@@ -9,6 +9,9 @@ import { SioCommonModule } from '@silicia/core';
   imports: [SioCommonModule],
 })
 export class HomePageComponent {
+  public html: string;
   // eslint-disable-next-line @typescript-eslint/no-empty-function
-  constructor() {}
+  constructor() {
+    this.html =  '<sio-app></sio-app>';
+  }
 }

apps/demo/src/theme/variables.scss

@@ -232,7 +232,7 @@
     --ion-tab-bar-background: #1f1f1f;
 
     --ion-card-background: #1e1e1e;
-  }
+  }}
 
   body.dark {
     --ion-color-primary: #428cff;
@@ -384,4 +384,4 @@
 
     --ion-card-background: #1e1e1e;
   }
-}
+

libs/core/src/lib/components/app/app.component.html

@@ -58,10 +58,10 @@
           </ng-container>
         </ion-content>
         <ion-footer class="ion-no-border">
-          <div #side_footer>
-            <ng-content select="[slot='side_footer']"></ng-content>
+          <div #left_footer>
+            <ng-content select="[slot='left_footer']"></ng-content>
           </div>
-          <ng-container *ngIf="!side_footer.hasChildNodes()">
+          <ng-container *ngIf="!left_footer.hasChildNodes()">
             <ion-toolbar class="ion-no-border" [color]="this.color">
               <ion-item lines="none" [color]="this.color"
                 ><ion-label>powered by Sio</ion-label></ion-item

libs/core/src/lib/components/app/app.component.scss

@@ -22,7 +22,7 @@
     --side-width: 300px;
     --side-max-width: 300px;
     --border: 0px 0px 0px 0px;
-
+    
     ion-menu[side='start'] {
       --background: var(--sio-left-menu-content-color);
       ion-header {
@@ -31,6 +31,7 @@
           --background: var(--sio-left-menu-header-color);
         }
       }
+
       ion-content {
         --background: var(--sio-left-menu-content-color);
       }

libs/core/src/lib/components/menu/menu.component.scss

@@ -1,5 +1,5 @@
 :host {
-    ion-list {
-        background-color: transparent;
-}
+  ion-list {
+    background-color: transparent;
+  }
 }

libs/core/src/lib/components/page/page.component.html

@@ -36,7 +36,7 @@
   </div>
   <ng-container *ngIf="!content.hasChildNodes()">
     <div id="container">
-      <h1>{{ 'PAGE_COMPONENT_DEFAULT_1' | translate }}</h1>
+      <h1>{{ 'PAGE_COMPONENT_DEFAULT_1' | translate }} {{ this.title | translate }}</h1>
       <strong>{{ 'PAGE_COMPONENT_DEFAULT_2' | translate }}</strong>
       <p>
         {{ 'PAGE_COMPONENT_LINK' | translate }}