[Glitch] Fix logged-out web UI on smaller screens

Port e2b561e3a521ff893943c0e9e32952e35934ca54 to glitch-soc

Signed-off-by: Claire <claire.github-309c@sitedethib.com>

1 files changed, 7 insertions, 2 deletions

diff --git a/app/javascript/flavours/glitch/features/ui/components/navigation_panel.js b/app/javascript/flavours/glitch/features/ui/components/navigation_panel.js
index 57fbfb285..cb884ec75 100644
--- a/app/javascript/flavours/glitch/features/ui/components/navigation_panel.js
+++ b/app/javascript/flavours/glitch/features/ui/components/navigation_panel.js
@@ -42,10 +42,10 @@ export default class NavigationPanel extends React.Component {
         <NavLink className='column-link column-link--transparent' exact to='/public' data-preview-title-id='column.public' data-preview-icon='globe' ><Icon className='column-link__icon' id='globe' fixedWidth /><FormattedMessage id='tabs_bar.federated_timeline' defaultMessage='Federated' /></NavLink>
 
         {!signedIn && (
-          <React.Fragment>
+          <div className='navigation-panel__sign-in-banner'>
             <hr />
             <SignInBanner />
-          </React.Fragment>
+          </div>
         )}
 
         {signedIn && (
@@ -64,6 +64,11 @@ export default class NavigationPanel extends React.Component {
           </React.Fragment>
         )}
 
+        <div className='navigation-panel__legal'>
+          <hr />
+          <NavLink className='column-link column-link--transparent' to='/about'><Icon className='column-link__icon' id='ellipsis-h' fixedWidth /><FormattedMessage id='navigation_bar.about' defaultMessage='About' /></NavLink>
+        </div>
+
         {showTrends && (
           <React.Fragment>
             <div className='flex-spacer' />