From dddcf1c3cd08c5468a0b7e8d60e3285ed13390a8 Mon Sep 17 00:00:00 2001
From: Inga Mai <inga.mai@outlook.de>
Date: Fri, 6 Dec 2019 18:49:11 +0100
Subject: [PATCH] Show toolbar icons on mobile

---
 app/assets/stylesheets/layout/_toolbar_mobile.sass       | 9 +++++++--
 .../wp-buttons/wp-create-button/wp-create-button.html    | 4 ++--
 .../wp-buttons/wp-filter-button/wp-filter-button.html    | 2 +-
 .../work_packages/routing/wp-list/wp.list.component.html | 4 ++--
 4 files changed, 12 insertions(+), 7 deletions(-)

diff --git a/app/assets/stylesheets/layout/_toolbar_mobile.sass b/app/assets/stylesheets/layout/_toolbar_mobile.sass
index f01572af75..c542b9b4cc 100644
--- a/app/assets/stylesheets/layout/_toolbar_mobile.sass
+++ b/app/assets/stylesheets/layout/_toolbar_mobile.sass
@@ -31,14 +31,19 @@
     .toolbar-container
       margin-top: 10px
 
+      .toolbar
+        flex-wrap: nowrap
+
       .title-container
         margin-right: 10px
 
       .toolbar-items
         display: flex
-        flex-wrap: wrap
+        flex-wrap: nowrap
         justify-content: flex-end
-        width: calc(100% + 10px)
+
+        .op-icon--wrapper
+          margin: 0
 
         > li
           .button
diff --git a/frontend/src/app/components/wp-buttons/wp-create-button/wp-create-button.html b/frontend/src/app/components/wp-buttons/wp-create-button/wp-create-button.html
index abc5307e9a..e925f3a7dd 100644
--- a/frontend/src/app/components/wp-buttons/wp-create-button/wp-create-button.html
+++ b/frontend/src/app/components/wp-buttons/wp-create-button/wp-create-button.html
@@ -7,9 +7,9 @@
           [stateName]="stateName"
           [dropdownActive]="allowed">
     <op-icon icon-classes="button--icon icon-add"></op-icon>
-    <span class="button--text"
+    <span class="button--text hidden-for-mobile"
           [textContent]="text.createWithDropdown"
           aria-hidden="true"></span>
-    <op-icon icon-classes="button--icon icon-small icon-pulldown"></op-icon>
+    <op-icon icon-classes="button--icon icon-small icon-pulldown hidden-for-mobile"></op-icon>
   </button>
 </div>
diff --git a/frontend/src/app/components/wp-buttons/wp-filter-button/wp-filter-button.html b/frontend/src/app/components/wp-buttons/wp-filter-button/wp-filter-button.html
index c6616a2b73..2ea838f142 100644
--- a/frontend/src/app/components/wp-buttons/wp-filter-button/wp-filter-button.html
+++ b/frontend/src/app/components/wp-buttons/wp-filter-button/wp-filter-button.html
@@ -7,7 +7,7 @@
         (click)="performAction($event)"
         [ngClass]="{ '-active': isActive }">
   <op-icon icon-classes="{{ iconClass }} button--icon"></op-icon>
-  <span class="button--text">
+  <span class="button--text hidden-for-mobile">
     {{ buttonText }}
     <span class="badge -secondary" *ngIf="initialized" [textContent]="filterCount"></span>
   </span>
diff --git a/frontend/src/app/modules/work_packages/routing/wp-list/wp.list.component.html b/frontend/src/app/modules/work_packages/routing/wp-list/wp.list.component.html
index a1f9bcfec6..663f7c0c86 100644
--- a/frontend/src/app/modules/work_packages/routing/wp-list/wp.list.component.html
+++ b/frontend/src/app/modules/work_packages/routing/wp-list/wp.list.component.html
@@ -25,7 +25,7 @@
             *ngIf="bcfActivated()">
           <bcf-export-button></bcf-export-button>
         </li>
-        <li class="toolbar-item hidden-for-mobile">
+        <li class="toolbar-item">
           <wp-filter-button>
           </wp-filter-button>
         </li>
@@ -45,7 +45,7 @@
           <zen-mode-toggle-button>
           </zen-mode-toggle-button>
         </li>
-        <li class="toolbar-item hidden-for-mobile">
+        <li class="toolbar-item">
           <button id="work-packages-settings-button"
                   title="{{ text.button_settings }}"
                   class="button last work-packages-settings-button toolbar-icon"