From 8ea9356399f0716874a6d97b0949a7930a612522 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E5=81=8F=E5=8F=B3?= <afc163@gmail.com>
Date: Mon, 30 Dec 2019 20:13:24 +0800
Subject: [PATCH] :lipstick: Improve Step `type="navigation"` UI in small
 screen (#20545)

close #19877
---
 components/steps/style/nav.less | 33 +++++++++++++++++++++++++++++++++
 1 file changed, 33 insertions(+)

diff --git a/components/steps/style/nav.less b/components/steps/style/nav.less
index 77cf177822..b4bc366a7b 100644
--- a/components/steps/style/nav.less
+++ b/components/steps/style/nav.less
@@ -89,3 +89,36 @@
     width: 100%;
   }
 }
+
+@media (max-width: @screen-xs) {
+  .@{steps-prefix-cls}-navigation {
+    > .@{steps-prefix-cls}-item {
+      margin-right: 0 !important;
+      &::before {
+        display: none;
+      }
+      &.@{steps-prefix-cls}-item-active::before {
+        top: 0;
+        right: 0;
+        left: unset;
+        display: block;
+        width: 3px;
+        height: calc(100% - 24px);
+      }
+      &::after {
+        position: relative;
+        top: -2px;
+        left: 50%;
+        display: block;
+        width: 8px;
+        height: 8px;
+        margin-bottom: 8px;
+        text-align: center;
+        transform: rotate(135deg);
+      }
+      > .@{steps-prefix-cls}-item-container > .@{steps-prefix-cls}-item-tail {
+        visibility: hidden;
+      }
+    }
+  }
+}