diff --git a/src/app/components/floating-column/add-new-account/add-new-account.component.html b/src/app/components/floating-column/add-new-account/add-new-account.component.html
index e536d26f..76cee452 100644
--- a/src/app/components/floating-column/add-new-account/add-new-account.component.html
+++ b/src/app/components/floating-column/add-new-account/add-new-account.component.html
@@ -1,3 +1,12 @@
-<p>
-  add-new-account works!
-</p>
+<div class="panel">
+    <h3 class="panel__title">Add new account</h3>
+
+    <form (ngSubmit)="onSubmit()">
+        <label>Please provide your account:</label>
+        <input type="text" class="form-control form-control-sm" [(ngModel)]="mastodonFullHandle" name="mastodonFullHandle"
+            placeholder="@nickname@mastodon.social" />
+        <br />
+        <button type="submit" class="btn btn-success btn-sm">Submit</button>
+    </form>
+
+</div>
\ No newline at end of file
diff --git a/src/app/components/floating-column/add-new-account/add-new-account.component.scss b/src/app/components/floating-column/add-new-account/add-new-account.component.scss
index e69de29b..aca3ffd8 100644
--- a/src/app/components/floating-column/add-new-account/add-new-account.component.scss
+++ b/src/app/components/floating-column/add-new-account/add-new-account.component.scss
@@ -0,0 +1,2 @@
+@import "variables";
+@import "panel";
\ No newline at end of file
diff --git a/src/app/components/floating-column/add-new-account/add-new-account.component.ts b/src/app/components/floating-column/add-new-account/add-new-account.component.ts
index 390d36b5..6ba64280 100644
--- a/src/app/components/floating-column/add-new-account/add-new-account.component.ts
+++ b/src/app/components/floating-column/add-new-account/add-new-account.component.ts
@@ -1,15 +1,82 @@
-import { Component, OnInit } from '@angular/core';
+import { Component, OnInit, Input } from '@angular/core';
+import { RegisteredAppsStateModel, AppInfo, AddRegisteredApp } from '../../../states/registered-apps.state';
+import { AuthService, CurrentAuthProcess } from '../../../services/auth.service';
+import { Store } from '@ngxs/store';
+import { AppData } from '../../../services/models/mastodon.interfaces';
 
 @Component({
-  selector: 'app-add-new-account',
-  templateUrl: './add-new-account.component.html',
-  styleUrls: ['./add-new-account.component.scss']
+    selector: 'app-add-new-account',
+    templateUrl: './add-new-account.component.html',
+    styleUrls: ['./add-new-account.component.scss']
 })
 export class AddNewAccountComponent implements OnInit {
+    @Input() mastodonFullHandle: string;
 
-  constructor() { }
+    constructor(
+        private readonly authService: AuthService,
+        private readonly store: Store) { }
 
-  ngOnInit() {
-  }
+    ngOnInit() {
+    }
 
+    onSubmit(): boolean {
+        let fullHandle = this.mastodonFullHandle.split('@').filter(x => x != null && x !== '');
+
+        const username = fullHandle[0];
+        const instance = fullHandle[1];
+
+        this.checkAndCreateApplication(instance)
+            .then((appData: AppData) => {
+                this.redirectToInstanceAuthPage(username, instance, appData);
+            });
+
+        return false;
+    }
+
+    private checkAndCreateApplication(instance: string): Promise<AppData> {
+        const alreadyRegisteredApps = this.getAllSavedApps();
+        const instanceApps = alreadyRegisteredApps.filter(x => x.instance === instance);
+
+        if (instanceApps.length !== 0) {
+            console.log('instance already registered');
+            return Promise.resolve(instanceApps[0].app);
+        } else {
+            console.log('instance not registered');
+            const redirect_uri = this.getLocalHostname() + '/register';
+            return this.authService.createNewApplication(instance, 'Sengi', redirect_uri, 'read write follow', 'https://github.com/NicolasConstant/sengi')
+                .then((appData: AppData) => {
+                    return this.saveNewApp(instance, appData)
+                        .then(() => { return appData; });
+                })
+        }
+    }
+
+    private getAllSavedApps(): AppInfo[] {
+        const snapshot = <RegisteredAppsStateModel>this.store.snapshot().registeredapps;
+        return snapshot.apps;
+    }
+    
+    private redirectToInstanceAuthPage(username: string, instance: string, app: AppData) {
+        const appDataTemp = new CurrentAuthProcess(username, instance);
+        localStorage.setItem('tempAuth', JSON.stringify(appDataTemp));
+
+        let instanceUrl = this.authService.getInstanceLoginUrl(instance, app.client_id, app.redirect_uri);
+
+        window.location.href = instanceUrl;
+    }
+    
+    private getLocalHostname(): string {
+        let localHostname = location.protocol + '//' + location.hostname + (location.port ? ':' + location.port : '');
+        return localHostname;
+    }   
+
+    private saveNewApp(instance: string, app: AppData): Promise<any> {
+        const appInfo = new AppInfo();
+        appInfo.instance = instance;
+        appInfo.app = app;
+
+        return this.store.dispatch([
+            new AddRegisteredApp(appInfo)
+        ]).toPromise();
+    }
 }
diff --git a/src/app/components/floating-column/add-new-status/add-new-status.component.html b/src/app/components/floating-column/add-new-status/add-new-status.component.html
index 6c6679ec..e5f5227f 100644
--- a/src/app/components/floating-column/add-new-status/add-new-status.component.html
+++ b/src/app/components/floating-column/add-new-status/add-new-status.component.html
@@ -1,3 +1,6 @@
-<p>
-  message-editor works!
-</p>
+<div class="panel">
+    <h3 class="panel__title">new message</h3>
+
+
+
+</div>
diff --git a/src/app/components/floating-column/add-new-status/add-new-status.component.scss b/src/app/components/floating-column/add-new-status/add-new-status.component.scss
index e69de29b..aca3ffd8 100644
--- a/src/app/components/floating-column/add-new-status/add-new-status.component.scss
+++ b/src/app/components/floating-column/add-new-status/add-new-status.component.scss
@@ -0,0 +1,2 @@
+@import "variables";
+@import "panel";
\ No newline at end of file
diff --git a/src/app/components/floating-column/manage-account/manage-account.component.html b/src/app/components/floating-column/manage-account/manage-account.component.html
index 1a3942af..ccc5fc35 100644
--- a/src/app/components/floating-column/manage-account/manage-account.component.html
+++ b/src/app/components/floating-column/manage-account/manage-account.component.html
@@ -1,5 +1,5 @@
-<div class="account-editor">
-  <h3 class="account-editor__title">Manage Account</h3>
+<div class="panel">
+  <h3 class="panel__title">Manage Account</h3>
 
   <div class="account-editor__display-avatar">
     <img class="account-editor__avatar" src="{{account.avatar}}" title="{{ account.username }} " />
diff --git a/src/app/components/floating-column/manage-account/manage-account.component.scss b/src/app/components/floating-column/manage-account/manage-account.component.scss
index c3aaca0a..2ce018d1 100644
--- a/src/app/components/floating-column/manage-account/manage-account.component.scss
+++ b/src/app/components/floating-column/manage-account/manage-account.component.scss
@@ -1,12 +1,13 @@
 @import "variables";
+@import "panel";
 .account-editor {
-    padding: 10px 10px 0 7px;
-    font-size: $small-font-size;
-    &__title {
-        font-size: 13px;
-        text-transform: uppercase;
-        margin: 6px 0 12px 0;
-    }
+    // padding: 10px 10px 0 7px;
+    // font-size: $small-font-size;
+    // &__title {
+    //     font-size: 13px;
+    //     text-transform: uppercase;
+    //     margin: 6px 0 12px 0;
+    // }
     &__display-avatar {
         text-align: center;
         margin-bottom: 30px;
diff --git a/src/app/components/floating-column/search/search.component.html b/src/app/components/floating-column/search/search.component.html
index 25363490..5b7e5a37 100644
--- a/src/app/components/floating-column/search/search.component.html
+++ b/src/app/components/floating-column/search/search.component.html
@@ -1,3 +1,6 @@
-<p>
-  search works!
-</p>
+<div class="panel">
+    <h3 class="panel__title">search</h3>
+
+
+
+</div>
\ No newline at end of file
diff --git a/src/app/components/floating-column/search/search.component.scss b/src/app/components/floating-column/search/search.component.scss
index e69de29b..aca3ffd8 100644
--- a/src/app/components/floating-column/search/search.component.scss
+++ b/src/app/components/floating-column/search/search.component.scss
@@ -0,0 +1,2 @@
+@import "variables";
+@import "panel";
\ No newline at end of file
diff --git a/src/app/components/floating-column/settings/settings.component.html b/src/app/components/floating-column/settings/settings.component.html
index f0e6c44f..95e448df 100644
--- a/src/app/components/floating-column/settings/settings.component.html
+++ b/src/app/components/floating-column/settings/settings.component.html
@@ -1,3 +1,6 @@
-<p>
-  settings works!
-</p>
+<div class="panel">
+    <h3 class="panel__title">settings</h3>
+
+
+
+</div>
\ No newline at end of file
diff --git a/src/app/components/floating-column/settings/settings.component.scss b/src/app/components/floating-column/settings/settings.component.scss
index e69de29b..aca3ffd8 100644
--- a/src/app/components/floating-column/settings/settings.component.scss
+++ b/src/app/components/floating-column/settings/settings.component.scss
@@ -0,0 +1,2 @@
+@import "variables";
+@import "panel";
\ No newline at end of file
diff --git a/src/app/pages/register-new-account/register-new-account.component.html b/src/app/pages/register-new-account/register-new-account.component.html
index 038782f2..3f4febae 100644
--- a/src/app/pages/register-new-account/register-new-account.component.html
+++ b/src/app/pages/register-new-account/register-new-account.component.html
@@ -3,18 +3,12 @@
   <a class="btn btn-info btn-sm" href title="close" [routerLink]="['/home']" role="button" style="float: right;">close</a>
   <h3>Add new account</h3>
   <br/>
-  <form (ngSubmit)="onSubmit()">
+  <!-- <form (ngSubmit)="onSubmit()">
     <label>Mastodon account</label>
     <input type="text" class="form-control form-control-sm" [(ngModel)]="mastodonFullHandle" name="mastodonFullHandle" placeholder="@nickname@mastodon.social"/>
-    <!-- <br />
-    <label>Email</label>
-    <input type="text" class="form-control form-control-sm" [(ngModel)]="email" name="email" />
-    <br />
-    <label>Password</label>
-    <input type="password" class="form-control form-control-sm" [(ngModel)]="password" name="password" />-->
     <br/>
     <button type="submit" class="btn btn-success btn-sm">Submit</button>
-  </form>
+  </form> -->
 
   <!-- <p>
     <br/>
diff --git a/src/app/pages/register-new-account/register-new-account.component.ts b/src/app/pages/register-new-account/register-new-account.component.ts
index 432b0b2c..a5701818 100644
--- a/src/app/pages/register-new-account/register-new-account.component.ts
+++ b/src/app/pages/register-new-account/register-new-account.component.ts
@@ -3,7 +3,7 @@ import { Store, Select } from '@ngxs/store';
 import { ActivatedRoute } from "@angular/router";
 import { Observable } from "rxjs";
 
-import { AuthService } from "../../services/auth.service";
+import { AuthService, CurrentAuthProcess } from "../../services/auth.service";
 import { TokenData, AppData } from "../../services/models/mastodon.interfaces";
 import { AddRegisteredApp, RegisteredAppsState, RegisteredAppsStateModel, AppInfo } from "../../states/registered-apps.state";
 import { AccountInfo, AddAccount } from "../../states/accounts.state";
@@ -17,7 +17,6 @@ import { MastodonService } from "../../services/mastodon.service";
 export class RegisterNewAccountComponent implements OnInit {
     @Input() mastodonFullHandle: string;
     result: string;
-    // registeredApps$: Observable<RegisteredAppsStateModel>;
 
     private authStorageKey: string = 'tempAuth';
 
@@ -26,8 +25,6 @@ export class RegisterNewAccountComponent implements OnInit {
         private readonly store: Store,
         private readonly activatedRoute: ActivatedRoute) {
 
-        // this.registeredApps$ = this.store.select(state => state.registeredapps.registeredApps);
-
         this.activatedRoute.queryParams.subscribe(params => {
             const code = params['code'];
             if (!code) return;
@@ -51,81 +48,14 @@ export class RegisterNewAccountComponent implements OnInit {
                             localStorage.removeItem(this.authStorageKey);
                         });
                 });
-
         });
-
     }
 
     ngOnInit() {
-        // this.registeredApps$.subscribe(x => {
-        //   console.error('registeredApps$')
-        //   console.warn(x);
-        // });
-    }
-
-    onSubmit(): boolean {
-        let fullHandle = this.mastodonFullHandle.split('@').filter(x => x != null && x !== '');
-
-        const username = fullHandle[0];
-        const instance = fullHandle[1];
-
-        this.checkAndCreateApplication(instance)
-            .then((appData: AppData) => {
-                this.redirectToInstanceAuthPage(username, instance, appData);
-            });
-
-        return false;
-    }
-
-    private checkAndCreateApplication(instance: string): Promise<AppData> {
-        const alreadyRegisteredApps = this.getAllSavedApps();
-        const instanceApps = alreadyRegisteredApps.filter(x => x.instance === instance);
-
-        if (instanceApps.length !== 0) {
-            console.log('instance already registered');
-            return Promise.resolve(instanceApps[0].app);
-        } else {
-            console.log('instance not registered');
-            const redirect_uri = this.getLocalHostname() + '/register';
-            return this.authService.createNewApplication(instance, 'Sengi', redirect_uri, 'read write follow', 'https://github.com/NicolasConstant/sengi')
-                .then((appData: AppData) => {
-                    return this.saveNewApp(instance, appData)
-                        .then(() => { return appData; });
-                })
-        }
-    }
-
-    private getLocalHostname(): string {
-        let localHostname = location.protocol + '//' + location.hostname + (location.port ? ':' + location.port : '');
-        return localHostname;
     }
 
     private getAllSavedApps(): AppInfo[] {
         const snapshot = <RegisteredAppsStateModel>this.store.snapshot().registeredapps;
         return snapshot.apps;
     }
-
-    private saveNewApp(instance: string, app: AppData): Promise<any> {
-        const appInfo = new AppInfo();
-        appInfo.instance = instance;
-        appInfo.app = app;
-
-        return this.store.dispatch([
-            new AddRegisteredApp(appInfo)
-        ]).toPromise();
-    }
-
-    private redirectToInstanceAuthPage(username: string, instance: string, app: AppData) {
-        const appDataTemp = new CurrentAuthProcess(username, instance);
-        localStorage.setItem('tempAuth', JSON.stringify(appDataTemp));
-
-        let instanceUrl = this.authService.getInstanceLoginUrl(instance, app.client_id, app.redirect_uri);
-        // let instanceUrl = `https://${instance}/oauth/authorize?scope=${encodeURIComponent('read write follow')}&response_type=code&redirect_uri=${encodeURIComponent(app.redirect_uri)}&client_id=${app.client_id}`;
-
-        window.location.href = instanceUrl;
-    }
 }
-
-class CurrentAuthProcess {
-    constructor(public username: string, public instance: string) { }
-}
\ No newline at end of file
diff --git a/src/app/services/auth.service.ts b/src/app/services/auth.service.ts
index 6f2bcf83..490c8bdb 100644
--- a/src/app/services/auth.service.ts
+++ b/src/app/services/auth.service.ts
@@ -34,3 +34,7 @@ export class AuthService {
         return this.httpClient.post<AppData>(url, formData).toPromise();
     }
 }
+
+export class CurrentAuthProcess {
+    constructor(public username: string, public instance: string) { }
+}
\ No newline at end of file
diff --git a/src/sass/_panel.scss b/src/sass/_panel.scss
new file mode 100644
index 00000000..aefae37a
--- /dev/null
+++ b/src/sass/_panel.scss
@@ -0,0 +1,9 @@
+.panel{
+    padding: 10px 10px 0 7px;
+    font-size: $small-font-size;
+    &__title {
+        font-size: 13px;
+        text-transform: uppercase;
+        margin: 6px 0 12px 0;
+    }
+}
\ No newline at end of file