diff --git a/src/assets/stylesheets/info-dialog.scss b/src/assets/stylesheets/info-dialog.scss index eebc5bf5491165f2e9ec02bcb08a0e6f912c6216..6e82b74501cd5c142262a90dae6d5900fc6b4dd6 100644 --- a/src/assets/stylesheets/info-dialog.scss +++ b/src/assets/stylesheets/info-dialog.scss @@ -14,6 +14,7 @@ grid-template-rows: 1fr 20px minmax(200px, max-content) 20px 1fr; width: 100%; height: 100%; + background-color: rgba(0,0,0,.2); &__box { grid-column: 3; @@ -61,7 +62,7 @@ &__close { position: absolute; - left: 12px; + right: 12px; top: 6px; color: white; font-size: 1.4em; diff --git a/src/react-components/ui-root.js b/src/react-components/ui-root.js index 2b382f353030c1385f8f43c485707cb0c3182f64..df6effcb34ed76dc9d7113bd6cb03d99dd5d1d6b 100644 --- a/src/react-components/ui-root.js +++ b/src/react-components/ui-root.js @@ -929,17 +929,6 @@ class UIRoot extends Component { <div className={styles.ui}> {this.state.dialog} - <button onClick={() => this.showHelpDialog()} className={styles.helpIcon}> - <i> - <FontAwesomeIcon icon={faQuestion} /> - </i> - </button> - - <div className={styles.presenceInfo}> - <FontAwesomeIcon icon={faUsers} /> - <span className={styles.occupantCount}>{this.props.occupantCount || "-"}</span> - </div> - {this.state.showProfileEntry && ( <ProfileEntryPanel finished={this.onProfileFinished} store={this.props.store} /> )} @@ -971,6 +960,18 @@ class UIRoot extends Component { )} </div> )} + + <button onClick={() => this.showHelpDialog()} className={styles.helpIcon}> + <i> + <FontAwesomeIcon icon={faQuestion} /> + </i> + </button> + + <div className={styles.presenceInfo}> + <FontAwesomeIcon icon={faUsers} /> + <span className={styles.occupantCount}>{this.props.occupantCount || "-"}</span> + </div> + {this.state.entryStep === ENTRY_STEPS.finished ? ( <div> <TwoDHUD.TopHUD