styling changes, feature structure transfer

src/app/core/substance-form/structure/substance-form-structure-card.component.html

@@ -2,7 +2,7 @@
   <div>
     <div *ngIf = "featuresOnly">
       <h4>Draw or import a structure using Ketcher. Then, if any features are detected a table will be automatically displayed under the editor.</h4>
-      <button mat-button color="primary" (click) = "loadForm()">Load Structure in Registration Form</button>
+      <button mat-button class = "registration-button" color="primary" (click) = "loadForm()">Load Structure in Registration Form</button>
     </div>
     <div>
       <app-structure-editor (loadedMolfile)="molvecUpdate($event)" (editorOnLoad)="editorOnLoad($event)" (editorSwitched) = "changeEditor($event)" style="z-index: 9999">

src/app/core/substance-form/structure/substance-form-structure-card.component.scss

@@ -20,6 +20,13 @@
   margin-top: -50px;
 }
 
+
+.registration-button {
+  margin-top: -10px;
+    margin-left: 25px;
+    float: right;
+}
+
 .button-row {
     display: flex;
     justify-content: space-between;

src/app/core/substance-form/structure/substance-form-structure-card.component.ts

@@ -367,6 +367,19 @@ export class SubstanceFormStructureCardComponent extends SubstanceFormBase imple
     }, () => { });
   }
 
+  loadForm():void {
+    this.structureEditor.getSmiles().pipe(take(1)).subscribe(smiles => {
+
+    const navigationExtras: NavigationExtras = {
+      queryParams: {
+        importStructure: encodeURIComponent(smiles)
+      }
+    };
+    this.router.navigate(['/substances/register/chemical'], navigationExtras);
+  });
+
+  }
+
   openStructureImageModal(): void {
 
     const dialogRef = this.dialog.open(StructureImageModalComponent, {