| 
				
			 | 
			
			
				@@ -106,15 +106,6 @@ const Explorer = () => { 
			 | 
		
	
		
			
			| 
				106
			 | 
			
				106
			 | 
			
			
				   const [heightSize, setHeightSize] = useState({height: 0, width: 0}); 
			 | 
		
	
		
			
			| 
				107
			 | 
			
				107
			 | 
			
			
				   const [widthSize, setWidthSize] = useState({height: 0, width: 0}); 
			 | 
		
	
		
			
			| 
				108
			 | 
			
				108
			 | 
			
			
				  
			 | 
		
	
		
			
			| 
				109
			 | 
			
				
			 | 
			
			
				-  // set spacing on left/right 
			 | 
		
	
		
			
			| 
				110
			 | 
			
				
			 | 
			
			
				-  const spacing = 30; 
			 | 
		
	
		
			
			| 
				111
			 | 
			
				
			 | 
			
			
				- 
			 | 
		
	
		
			
			| 
				112
			 | 
			
				
			 | 
			
			
				-  // calculate new width of *real* content 
			 | 
		
	
		
			
			| 
				113
			 | 
			
				
			 | 
			
			
				-  const screenWidth = Math.round(Dimensions.get('window').width) - 2 * spacing; 
			 | 
		
	
		
			
			| 
				114
			 | 
			
				
			 | 
			
			
				-  // For example on iPhone 8, screenWidth will be 315 
			 | 
		
	
		
			
			| 
				115
			 | 
			
				
			 | 
			
			
				- 
			 | 
		
	
		
			
			| 
				116
			 | 
			
				
			 | 
			
			
				-  // I temporarily hard-coded the width into the newsletter.js its viewport tag 
			 | 
		
	
		
			
			| 
				117
			 | 
			
				
			 | 
			
			
				- 
			 | 
		
	
		
			
			| 
				118
			 | 
			
				109
			 | 
			
			
				   return ( 
			 | 
		
	
		
			
			| 
				119
			 | 
			
				110
			 | 
			
			
				     <ScrollView 
			 | 
		
	
		
			
			| 
				120
			 | 
			
				111
			 | 
			
			
				       style={{ 
			 | 
		
	
	
		
			
			| 
				
			 | 
			
			
				@@ -130,11 +121,17 @@ const Explorer = () => { 
			 | 
		
	
		
			
			| 
				130
			 | 
			
				121
			 | 
			
			
				         scrollEnabled={false} 
			 | 
		
	
		
			
			| 
				131
			 | 
			
				122
			 | 
			
			
				         scrollEnabledWithZoomedin={true} 
			 | 
		
	
		
			
			| 
				132
			 | 
			
				123
			 | 
			
			
				         customStyle={` 
			 | 
		
	
		
			
			| 
				133
			 | 
			
				
			 | 
			
			
				-          ${heightStyle} 
			 | 
		
	
		
			
			| 
				
			 | 
			
				124
			 | 
			
			
				+          body { 
			 | 
		
	
		
			
			| 
				
			 | 
			
				125
			 | 
			
			
				+            background-color: lightyellow !important; 
			 | 
		
	
		
			
			| 
				
			 | 
			
				126
			 | 
			
			
				+          } 
			 | 
		
	
		
			
			| 
				134
			 | 
			
				127
			 | 
			
			
				           #rnahw-wrapper { 
			 | 
		
	
		
			
			| 
				135
			 | 
			
				
			 | 
			
			
				-            padding: 0 ${spacing}px; 
			 | 
		
	
		
			
			| 
				136
			 | 
			
				
			 | 
			
			
				-            width: ${screenWidth}; 
			 | 
		
	
		
			
			| 
				
			 | 
			
				128
			 | 
			
			
				+            padding: 0 30px; 
			 | 
		
	
		
			
			| 
				
			 | 
			
				129
			 | 
			
			
				+            width: 100vw; 
			 | 
		
	
		
			
			| 
				137
			 | 
			
				130
			 | 
			
			
				             box-sizing: border-box; 
			 | 
		
	
		
			
			| 
				
			 | 
			
				131
			 | 
			
			
				+            background-color: lightyellow; 
			 | 
		
	
		
			
			| 
				
			 | 
			
				132
			 | 
			
			
				+          }      
			 | 
		
	
		
			
			| 
				
			 | 
			
				133
			 | 
			
			
				+          #doc { 
			 | 
		
	
		
			
			| 
				
			 | 
			
				134
			 | 
			
			
				+            min-width: unset !important; 
			 | 
		
	
		
			
			| 
				138
			 | 
			
				135
			 | 
			
			
				           } 
			 | 
		
	
		
			
			| 
				139
			 | 
			
				136
			 | 
			
			
				         `} 
			 | 
		
	
		
			
			| 
				140
			 | 
			
				137
			 | 
			
			
				         onError={onError} 
			 | 
		
	
	
		
			
			| 
				
			 | 
			
			
				@@ -143,7 +140,7 @@ const Explorer = () => { 
			 | 
		
	
		
			
			| 
				143
			 | 
			
				140
			 | 
			
			
				         onLoadEnd={onHeightLoadEnd} 
			 | 
		
	
		
			
			| 
				144
			 | 
			
				141
			 | 
			
			
				         onShouldStartLoadWithRequest={onShouldStartLoadWithRequest} 
			 | 
		
	
		
			
			| 
				145
			 | 
			
				142
			 | 
			
			
				         onSizeUpdated={setHeightSize} 
			 | 
		
	
		
			
			| 
				146
			 | 
			
				
			 | 
			
			
				-        source={{html: heightHtml}} 
			 | 
		
	
		
			
			| 
				
			 | 
			
				143
			 | 
			
			
				+        source={{html: autoHeightHtml1}} 
			 | 
		
	
		
			
			| 
				147
			 | 
			
				144
			 | 
			
			
				         customScript={heightScript} 
			 | 
		
	
		
			
			| 
				148
			 | 
			
				145
			 | 
			
			
				         onMessage={onMessage} 
			 | 
		
	
		
			
			| 
				149
			 | 
			
				146
			 | 
			
			
				       /> 
			 |