Avoid that the bottom bar has a line break on mobile which breaks the…

… layout as it pushes the content to the top and thus behind the app header

app/components/work_packages/split_view_component.sass

@@ -7,3 +7,7 @@
   @media screen and (max-width: $breakpoint-lg)
     // Unfortunately, we have to enforce this style via !important as the resizer writes the width directly on the element as inline style
     min-width: unset !important
+
+  @media screen and (max-width: $breakpoint-sm)
+    .work-packages--details-toolbar-container
+      @include hide-button-texts

frontend/src/app/features/work-packages/components/wp-details/wp-details-toolbar.html

@@ -19,7 +19,7 @@
 
           wpSingleContextMenu
           [wpSingleContextMenu-workPackage]="workPackage">
-    <span class="button--text" [textContent]="text.button_more"></span>
+    <span class="button--text button--text_without_icon" [textContent]="text.button_more"></span>
     <op-icon icon-classes="button--dropdown-indicator"></op-icon>
   </button>
 </div>

frontend/src/global_styles/layout/_toolbar_mobile.sass

@@ -41,7 +41,7 @@
         margin: 0 0 0 10px
 
       // Hide toolbar button texts on mobile
-      .button--text:not(.button--text_without_icon),
+      @include hide-button-texts
       .icon-pulldown,
       .spot-icon_dropdown
         display: none

frontend/src/global_styles/openproject/_mixins.sass

@@ -274,6 +274,9 @@ $scrollbar-size: 10px
   font: inherit
   text-align: inherit
 
+@mixin hide-button-texts
+  .button--text:not(.button--text_without_icon)
+    display: none
 
 @mixin board-header-editable-toolbar-title
   line-height: normal !important