swapped str/seq

package.json

@@ -1,6 +1,6 @@
 {
   "name": "@rcsb/rcsb-saguaro-3d",
-  "version": "0.0.23",
+  "version": "0.0.24",
   "description": "RCSB Molstar/Saguaro Web App",
   "main": "build/dist/RcsbFv3DBuilder.js",
   "files": [

src/RcsbFv3D/RcsbFv3DAbstract.tsx

@@ -71,6 +71,7 @@ export abstract class RcsbFv3DAbstract {
                 element.remove();
                 document.body.style.overflow = "visible";
             }
+            window.history.back();
         }
     }
 

src/RcsbFv3D/RcsbFv3DAssembly.tsx

@@ -35,7 +35,7 @@ export class RcsbFv3DAssembly extends RcsbFv3DAbstract{
             config:{
                 entryId:assemblyData.config.entryId
             },
-            title:assemblyData.config.title,
+            title:"3D Protein Features View: "+assemblyData.config.title,
             subtitle: assemblyData.config.subtitle
         };
         this.cssConfig = assemblyData.cssConfig;

src/RcsbFv3D/RcsbFv3DComponent.tsx

@@ -71,8 +71,8 @@ export class RcsbFv3DComponent extends React.Component <RcsbFv3DComponentInterfa
                             title={this.state.sequencePanelConfig.title}
                             subtitle={this.state.sequencePanelConfig.subtitle}
                             unmount={this.props.unmount}
-                    />
-                </div>
+                        />
+                    </div>
                 </div>
             </div>
         );
@@ -87,7 +87,7 @@ export class RcsbFv3DComponent extends React.Component <RcsbFv3DComponentInterfa
     }
 
     private structureCssConfig(css: CSSProperties | undefined): CSSProperties{
-        return {...{width:Math.round((1-this.pfvScreenFraction)*100).toString()+"%", height:"100%", zIndex:1}, ...css };
+        return {...{width:Math.round((1-this.pfvScreenFraction)*100).toString()+"%", height:"100%", zIndex:100}, ...css };
     }
 
     private sequenceCssConfig(css: CSSProperties | undefined): CSSProperties{

src/RcsbFvSequence/SequenceViews/AbstractView.tsx

@@ -31,10 +31,10 @@ export abstract class AbstractView<P,S> extends React.Component <P & AbstractVie
     render():JSX.Element {
         return (
                 <div id={this.componentDivId} >
-                    <div style={{paddingLeft:10}}>
-                    {this.createTitle()}
-                    {this.createSubtitle()}
-                    {this.additionalContent()}
+                    <div style={{paddingLeft:10, position:"relative"}}>
+                        {this.createTitle()}
+                        {this.createSubtitle()}
+                        {this.additionalContent()}
                     </div>
                     <div id ={this.pfvDivId} />
                 </div>

src/RcsbFvSequence/SequenceViews/AssemblyView/AssemblyView.tsx

@@ -53,7 +53,7 @@ export class AssemblyView extends AbstractView<AssemblyViewInterface & AbstractV
         return (
             <div style={{marginTop:10}}>
                 <div id={RcsbFvDOMConstants.SELECT_INSTANCE_PFV_ID} style={{display:"inline-block"}}/>
-                <div style={{position:"absolute", top:5, right:24}} >
+                <div style={{position:"absolute", top:5, right:5}} >
                     <a style={{textDecoration:"none", color:"#337ab7", cursor:"pointer", marginRight:15}} target={"_blank"} href={"/docs/sequence-viewers/3d-protein-feature-view"}>
                         Help
                     </a>

src/styles/RcsbFvStyle.module.scss

@@ -12,7 +12,7 @@
   width: 100%;
   height: 100%;
   background-color: #fff;
-  z-index: 1000000;
+  z-index: 10;
 }
 
 .rcsbFvMain > div {
@@ -20,7 +20,7 @@
   display: flex;
   flex-wrap: wrap;
   flex-direction: row;
-  flex-flow: row wrap;
+  flex-flow: row-reverse wrap;
 }
 
 .rcsbFvMain * {
@@ -32,18 +32,17 @@
 }
 
 .rcsbFvSubtitle {
-  font-size: 18px;
+  font-size: 16px;
   font-family: inherit;
-  font-weight: 500;
   line-height: 1.1;
   color: inherit;
   margin-bottom: 15px;
 }
 
 .rcsbFvTitle{
-  font-size: 36px;
+  font-size: 24px;
   font-family: inherit;
-  font-weight: 500;
+  font-weight: bold;
   line-height: 1.1;
   color: inherit;
   margin-bottom: 15px;