From c95bc4641789bdfe28bd915688d4722d4c1ed173 Mon Sep 17 00:00:00 2001
From: Ara Pehlivanian <ara.pehlivanian@gmail.com>
Date: Thu, 3 Oct 2019 13:59:29 -0400
Subject: [PATCH] Ensuring tabs collapse in small screens on <iOS 13

---
 UNRELEASED.md                 | 1 +
 src/components/Tabs/Tabs.scss | 3 +++
 2 files changed, 4 insertions(+)

diff --git a/UNRELEASED.md b/UNRELEASED.md
index d558bae75a1..c9497d31f21 100644
--- a/UNRELEASED.md
+++ b/UNRELEASED.md
@@ -12,6 +12,7 @@ Use [the changelog guidelines](https://git.io/polaris-changelog-guidelines) to f
 
 ### Bug fixes
 
+- Fixed tabs that don't wrap correctly on small screens in pre-iOS 13 Safari ([#2232](https://github.com/Shopify/polaris-react/pull/2232))
 - Fixed `BulkActions` checkbox losing on selection focus ([#2138](https://github.com/Shopify/polaris-react/pull/2138))
 - Moved rendering of the portal component’s node within the node created by the theme provider component to enable theming through CSS Custom Properties ([#2224](https://github.com/Shopify/polaris-react/pull/2224))
 
diff --git a/src/components/Tabs/Tabs.scss b/src/components/Tabs/Tabs.scss
index 6137bfc30f5..d17841805c5 100644
--- a/src/components/Tabs/Tabs.scss
+++ b/src/components/Tabs/Tabs.scss
@@ -7,6 +7,7 @@ $focus-state-box-shadow-color: rgba(92, 106, 196, 0.8);
 
 .Tabs {
   display: flex;
+  flex-wrap: wrap;
   margin: 0;
   padding: 0;
   border-bottom: border();
@@ -14,6 +15,8 @@ $focus-state-box-shadow-color: rgba(92, 106, 196, 0.8);
 }
 
 .fitted {
+  flex-wrap: nowrap;
+
   .TabContainer {
     flex: 1 1 100%;
   }