First functional version

src/app/app-content.component.ts

@@ -1,8 +0,0 @@
-import { Component } from '@angular/core';
-
-@Component({
-  selector: 'app-content',
-  template: '<div style="display:block;width:100%;height:200px;" >Hello daar<input type="file" [uploadx]="{chunkSize:2097152}" /> </div><fm-resumable-file-upload></fm-resumable-file-upload>'  
-})
-export class AppContentComponent {
-}

src/app/app-routing.module.ts

@@ -3,8 +3,6 @@ import { RouterModule } from '@angular/router';
 
 import { AuthGuard,FullScreenGuard } from '@farmmaps/common';
 import { MapComponent} from '@farmmaps/common-map';
-import { AppContentComponent} from './app-content.component';
-import { AppSidePanelTestComponent } from './app-side-panel-test.component';
 
 const routes = [
   {
@@ -12,7 +10,6 @@ const routes = [
     redirectTo: 'map',
     pathMatch: 'full'
   },
-  { path: 'sidepanel', canLoad: [AuthGuard], component: AppSidePanelTestComponent},
   { path: 'map', canActivateChild: [AuthGuard],canActivate:[FullScreenGuard], children: [
     {
         path: '',

src/app/app-side-panel-test.component.ts

@@ -1,29 +0,0 @@
-import { Component ,ChangeDetectorRef } from '@angular/core';
-
-
-
-@Component({
-  selector: 'app-side-panel-test',
-  template: '<div><a (click)="handleOpen($event)" href="#">open</a> <fm-side-panel [resizeable]="true" [visible]="show"><a (click)="handleClose($event)" href="#">close</a></fm-side-panel></div>'  
-})
-export class AppSidePanelTestComponent {
-
-  public show:boolean = false;
-
-  constructor(public cr:ChangeDetectorRef ) {
-
-  }
-
-  handleClose(event:MouseEvent) {
-    event.preventDefault();
-    this.show=false;
-    //this.cr.detectChanges();
-  }
-
-  handleOpen(event:MouseEvent)
-  {
-    event.preventDefault();
-    this.show=true;
-    //this.cr.detectChanges();
-  }
-}

src/app/app.component.html

@@ -1,3 +1,3 @@
-<div style="position:absolute;display: block;width:100%;height:100%;overflow: hidden;"><router-outlet></router-outlet></div>
+<fm-app></fm-app>
 
 

src/app/app.component.scss

@@ -1,27 +0,0 @@
-@import "theme.scss";
-
-$fa-font-path: "~font-awesome/fonts";
-@import "~bootstrap/scss/bootstrap.scss";
-@import "~font-awesome/scss/font-awesome.scss";
-
-:host ::ng-deep .btn:focus {
-  box-shadow:none;
-}
-
-:host ::ng-deep .input-group > .form-control:focus {
-  z-index: auto;
-}
-
-:host ::ng-deep .form-control:focus {
-  box-shadow: none;
-  border-color: $input-border-color;
-}
-
-:host ::ng-deep body { 
-    background: #f1f1f1;
-    line-height: 18px; 
-    user-select:none;
-}
-
-
-

src/app/app.component.ts

@@ -5,6 +5,6 @@ import { Component } from '@angular/core';
   templateUrl: './app.component.html',
   styleUrls: ['./app.component.scss']
 })
-export class AppComponent {
+export class AppRootComponent {
   title = 'farmmaps-lib-app';
 }

src/app/app.module.ts

@@ -6,12 +6,11 @@ import {
 } from '@angular/core';
 import { BrowserModule } from '@angular/platform-browser';
 
-import { AppComponent } from './app.component';
-import { AppContentComponent } from './app-content.component';
-import { AppSidePanelTestComponent } from './app-side-panel-test.component';
-import { AppCommonModule } from '@farmmaps/common';
+import { AppCommonModule,  } from '@farmmaps/common';
 import { AppCommonMapModule} from '@farmmaps/common-map';
 
+import {AppRootComponent} from './app.component';
+
 import {StoreModule, Store} from '@ngrx/store';
 import {EffectsModule, EffectSources} from '@ngrx/effects';
 import { StoreRouterConnectingModule} from '@ngrx/router-store';
@@ -45,9 +44,7 @@ export function provideBootstrapEffects(effects: Type<any>[]) {
 
 @NgModule({
   declarations: [
-    AppComponent,
-    AppContentComponent,
-    AppSidePanelTestComponent
+    AppRootComponent
   ],
   imports: [
     AppRoutingModule,
@@ -58,6 +55,6 @@ export function provideBootstrapEffects(effects: Type<any>[]) {
     EffectsModule.forRoot([])
   ],
   providers: [],
-  bootstrap: [AppComponent]
+  bootstrap: [AppRootComponent]
 })
 export class AppModule { }