From e139abf15a4b71d8bc9a4b8c842105a6f9d0736c Mon Sep 17 00:00:00 2001
From: Robert Kaussow <mail@thegeeklab.de>
Date: Mon, 28 Aug 2023 00:36:48 +0200
Subject: [PATCH] Add min height to mobile pipeline view and fix overflow
 (#2335)

The mobile pipeline view in landscape view is not really usable. The
idea is to add a min-height to use the screen a bit better for the main
content. Before:


[before.webm](https://github.com/woodpecker-ci/woodpecker/assets/3391958/c4f38da6-c0f2-4549-9f80-90a4b02ddc94)

After:


[after.webm](https://github.com/woodpecker-ci/woodpecker/assets/3391958/a0397d52-aeda-4edf-9200-953ca4738daa)
---
 web/src/components/repo/pipeline/PipelineStepList.vue | 2 +-
 web/src/views/repo/pipeline/Pipeline.vue              | 2 +-
 2 files changed, 2 insertions(+), 2 deletions(-)

diff --git a/web/src/components/repo/pipeline/PipelineStepList.vue b/web/src/components/repo/pipeline/PipelineStepList.vue
index af82272c4..d66095d30 100644
--- a/web/src/components/repo/pipeline/PipelineStepList.vue
+++ b/web/src/components/repo/pipeline/PipelineStepList.vue
@@ -48,7 +48,7 @@
     </div>
 
     <div class="flex-grow min-h-0 w-full relative">
-      <div class="absolute top-0 left-0 right-0 h-full flex flex-col md:overflow-y-scroll gap-y-2">
+      <div class="absolute top-0 left-0 right-0 h-full flex flex-col md:overflow-y-auto gap-y-2">
         <div
           v-for="workflow in pipeline.workflows"
           :key="workflow.id"
diff --git a/web/src/views/repo/pipeline/Pipeline.vue b/web/src/views/repo/pipeline/Pipeline.vue
index eef79560e..0f92948d6 100644
--- a/web/src/views/repo/pipeline/Pipeline.vue
+++ b/web/src/views/repo/pipeline/Pipeline.vue
@@ -1,5 +1,5 @@
 <template>
-  <FluidContainer full-width class="flex flex-col flex-grow">
+  <FluidContainer full-width class="flex flex-col flex-grow md:min-h-xs">
     <div class="flex w-full min-h-0 flex-grow">
       <PipelineStepList
         v-if="pipeline?.workflows?.length || 0 > 0"