Styling fixes.

frontend/app/app.module.ts

@@ -57,7 +57,7 @@ export function configTranslations() {
     if (process.env.NODE_ENV === 'production') {
         return new LocalizerService(window['texts']);
     } else {
-        return new LocalizerService(require('./../backend/i18n/frontend_en.json')).logMissingKeys();
+        return new LocalizerService(require('./../../backend/i18n/frontend_en.json')).logMissingKeys();
     }
 }
 

frontend/app/features/apps/pages/apps-page.component.html

@@ -1,14 +1,15 @@
 <sqx-title message="i18n:apps.listPageTitle"></sqx-title>
 
-<div class="apps-section">
+<div class="panel-container page">  
+    <div class="apps-section">
         <h1 class="apps-title">{{ 'apps.welcomeTitle' | sqxTranslate: { user: authState.user?.displayName } }}</h1>
 
         <div class="subtext">
             {{ 'apps.welcomeSubtitle' | sqxTranslate }}
         </div>
-</div>
+    </div>
 
-<ng-container *ngIf="appsState.apps | async; let apps">
+    <ng-container *ngIf="appsState.apps | async; let apps">
         <div class="apps-section">
             <div class="empty" *ngIf="apps.length === 0">
                 <h3 class="empty-headline">{{ 'apps.empty' | sqxTranslate }}</h3>
@@ -42,9 +43,9 @@
                 </div>
             </div>
         </div>
-</ng-container>
+    </ng-container>
 
-<div class="apps-section" *ngIf="(uiState.settings | async).canCreateApps">
+    <div class="apps-section" *ngIf="(uiState.settings | async).canCreateApps">
         <div class="card card-template card-href" (click)="createNewApp('')">
             <div class="card-body">
                 <div class="card-image">
@@ -126,10 +127,11 @@
                 </div>
             </div>
         </div>
-</div>
+    </div>
 
-<div *ngIf="info" class="apps-section">
+    <div *ngIf="info" class="apps-section">
         <small class="info">{{info}}</small>
+    </div>
 </div>
 
 <ng-container *sqxModal="addAppDialog">

frontend/app/features/apps/pages/apps-page.component.scss

@@ -9,6 +9,11 @@
     }
 }
 
+.page {
+    overflow-x: hidden;
+    overflow-y: auto;
+}
+
 .card {
     & {
         @include hover-visible('.deeplinks', inline-block);

frontend/app/shared/components/assets/asset-uploader.component.html

@@ -1,6 +1,6 @@
 <ng-container *ngIf="appsState.selectedAppOrNull | async; let app">
     <ng-container *ngIf="app.canUploadAssets">
-        <ul class="nav navbar-nav" *ngIf="assetUploader.uploads | async; let uploads" (sqxDropFile)="addFiles($event)">
+        <ul class="nav navbar-nav align-items-center" *ngIf="assetUploader.uploads | async; let uploads" (sqxDropFile)="addFiles($event)">
             <li class="nav-item nav-icon dropdown">
                 <span class="nav-link dropdown-toggle" (click)="modalMenu.toggle()">
                     <i class="icon-upload-3"></i>

frontend/app/shell/pages/internal/apps-menu.component.html

@@ -1,4 +1,4 @@
-<ul class="nav navbar-nav">
+<ul class="nav navbar-nav align-items-center">
     <li class="nav-item dropdown">
         <span class="nav-link dropdown-toggle" id="app-name" (click)="appsMenu.toggle()" #button>
             <ng-container *ngIf="appsState.selectedAppOrNull | async; let app; else noApp">

frontend/app/shell/pages/internal/internal-area.component.html

@@ -7,7 +7,7 @@
         <sqx-apps-menu></sqx-apps-menu>
     </div>
 
-    <div class="navbar-nav ml-auto">
+    <div class="navbar-nav align-items-center ml-auto">
         <sqx-search-menu></sqx-search-menu>
 
         <sqx-asset-uploader></sqx-asset-uploader>

frontend/app/shell/pages/internal/notifications-menu.component.html

@@ -1,3 +1,3 @@
-<ul class="nav navbar-nav">
+<ul class="nav navbar-nav align-items-center">
     <sqx-notifo></sqx-notifo>
 </ul>

frontend/app/shell/pages/internal/profile-menu.component.html

@@ -1,4 +1,4 @@
-<ul class="nav navbar-nav">
+<ul class="nav navbar-nav align-items-center">
     <li class="nav-item nav-icon nav-item-help">
         <a class="nav-link" href="https://squidex.io/help" sqxExternalLink="noicon">
             <i class="icon-help2"></i>