fix: mobile view fix

app/component/ItineraryLegs.js

@@ -42,6 +42,8 @@ class ItineraryLegs extends React.Component {
     toggleCanceledLegsBanner: PropTypes.func.isRequired,
     waitThreshold: PropTypes.number.isRequired,
     focusToLeg: PropTypes.func,
+    changeHash: PropTypes.func,
+    tabIndex: PropTypes.number,
   };
 
   static defaultProps = {
@@ -230,6 +232,8 @@ class ItineraryLegs extends React.Component {
             leg={leg}
             interliningLegs={interliningLegs}
             focusAction={this.focus(leg.from)}
+            changeHash={this.props.changeHash}
+            tabIndex={this.props.tabIndex}
           />,
         );
       } else if (leg.mode === 'TRAM' && !leg.interlineWithPreviousLeg) {
@@ -239,6 +243,8 @@ class ItineraryLegs extends React.Component {
             leg={leg}
             interliningLegs={interliningLegs}
             focusAction={this.focus(leg.from)}
+            changeHash={this.props.changeHash}
+            tabIndex={this.props.tabIndex}
           />,
         );
       } else if (leg.mode === 'FERRY' && !leg.interlineWithPreviousLeg) {
@@ -248,6 +254,8 @@ class ItineraryLegs extends React.Component {
             leg={leg}
             interliningLegs={interliningLegs}
             focusAction={this.focus(leg.from)}
+            changeHash={this.props.changeHash}
+            tabIndex={this.props.tabIndex}
           />,
         );
       } else if (leg.mode === 'FUNICULAR' && !leg.interlineWithPreviousLeg) {
@@ -257,6 +265,8 @@ class ItineraryLegs extends React.Component {
             leg={leg}
             interliningLegs={interliningLegs}
             focusAction={this.focus(leg.from)}
+            changeHash={this.props.changeHash}
+            tabIndex={this.props.tabIndex}
           />,
         );
       } else if (leg.mode === 'RAIL' && !leg.interlineWithPreviousLeg) {
@@ -266,6 +276,8 @@ class ItineraryLegs extends React.Component {
             leg={leg}
             interliningLegs={interliningLegs}
             focusAction={this.focus(leg.from)}
+            changeHash={this.props.changeHash}
+            tabIndex={this.props.tabIndex}
           />,
         );
       } else if (leg.mode === 'SUBWAY' && !leg.interlineWithPreviousLeg) {
@@ -275,6 +287,8 @@ class ItineraryLegs extends React.Component {
             leg={leg}
             interliningLegs={interliningLegs}
             focusAction={this.focus(leg.from)}
+            changeHash={this.props.changeHash}
+            tabIndex={this.props.tabIndex}
           />,
         );
       } else if (leg.mode === 'AIRPLANE') {

app/component/ItineraryTab.js

@@ -82,6 +82,7 @@ class ItineraryTab extends React.Component {
     currentTime: PropTypes.number.isRequired,
     hideTitle: PropTypes.bool,
     currentLanguage: PropTypes.string,
+    changeHash: PropTypes.func,
   };
 
   static defaultProps = {
@@ -348,6 +349,8 @@ class ItineraryTab extends React.Component {
                   itinerary={itinerary}
                   focusToPoint={this.handleFocus}
                   focusToLeg={this.props.focusToLeg}
+                  changeHash={this.props.changeHash}
+                  tabIndex={suggestionIndex - 1}
                 />
                 {config.showRouteInformation && <RouteInformation />}
               </div>

app/component/LegInfo.js

@@ -21,6 +21,8 @@ const LegInfo = (
     alertSeverityLevel,
     isAlternativeLeg,
     displayTime,
+    changeHash,
+    tabIndex,
   },
   { config, intl },
 ) => {
@@ -113,7 +115,14 @@ const LegInfo = (
         closeButtonLabel="Close"
         variant="small"
         isOpen={capacityModalOpen}
-        onCrossClick={() => setCapacityModalOpen(false)}
+        onCrossClick={() => {
+          setCapacityModalOpen(false);
+          if (changeHash) {
+            setTimeout(() => {
+              changeHash(tabIndex);
+            }, 500);
+          }
+        }}
       >
         <CapacityModal config={config} />
       </Modal>
@@ -129,6 +138,8 @@ LegInfo.propTypes = {
   alertSeverityLevel: PropTypes.string,
   isAlternativeLeg: PropTypes.bool.isRequired,
   displayTime: PropTypes.bool.isRequired,
+  changeHash: PropTypes.func,
+  tabIndex: PropTypes.number,
 };
 
 LegInfo.contextTypes = {

app/component/MobileItineraryWrapper.js

@@ -39,6 +39,7 @@ const MobileItineraryWrapper = (props, context) => {
           params={context.match.params}
           focusToPoint={props.focusToPoint}
           focusToLeg={props.focusToLeg}
+          changeHash={props.changeHash}
           isMobile
         />
       </div>
@@ -72,6 +73,7 @@ MobileItineraryWrapper.propTypes = {
   plan: PropTypes.object,
   serviceTimeRange: PropTypes.object.isRequired,
   onSwipe: PropTypes.func,
+  changeHash: PropTypes.func,
 };
 
 MobileItineraryWrapper.contextTypes = {

app/component/SummaryPage.js

@@ -2732,6 +2732,7 @@ class SummaryPage extends React.Component {
           serviceTimeRange={this.props.serviceTimeRange}
           focusToLeg={this.focusToLeg}
           onSwipe={this.changeHash}
+          changeHash={this.changeHash}
         >
           {this.props.content &&
             combinedItineraries.map((itinerary, i) =>

app/component/TransitLeg.js

@@ -456,6 +456,8 @@ class TransitLeg extends React.Component {
             alertSeverityLevel={alertSeverityLevel}
             isAlternativeLeg={false}
             displayTime={this.displayAlternativeLegs()}
+            changeHash={this.props.changeHash}
+            tabIndex={this.props.tabIndex}
           />
 
           {this.state.showAlternativeLegs &&
@@ -695,6 +697,8 @@ TransitLeg.propTypes = {
   children: PropTypes.node.isRequired,
   lang: PropTypes.string.isRequired,
   omitDivider: PropTypes.bool,
+  changeHash: PropTypes.func,
+  tabIndex: PropTypes.number,
 };
 
 TransitLeg.defaultProps = {

app/component/departure.scss

@@ -290,12 +290,10 @@
     .capacity-icon-container {
       padding-left: 7px;
       margin-top: 15px;
+      cursor: pointer;
       svg {
         margin-top: 4px;
       }
-      &:hover {
-        cursor: pointer;
-      }
     }
   }