From 02570136cee386b082c5896552a767592d098273 Mon Sep 17 00:00:00 2001
From: Michel Weststrate <mweststrate@fb.com>
Date: Tue, 6 Oct 2020 04:56:24 -0700
Subject: [PATCH] Fix ANT line-height leaking into legacy design

Summary:
Fixes layout issue that was caused by ANT line-heights leaking into the old design.

Introduced a `.flipperlegacy_design ` class at the `root` element of Flipper, so that it is easier in the future to bail out / add overrides for certain features in the old design.

Reviewed By: priteshrnandgaonkar

Differential Revision: D24135482

fbshipit-source-id: 40091ebbde71662f2ebea66577f7b727009ca9c6
---
 desktop/app/src/init.tsx       | 15 ++++++++++-----
 desktop/themes/typography.less |  5 +++++
 2 files changed, 15 insertions(+), 5 deletions(-)

diff --git a/desktop/app/src/init.tsx b/desktop/app/src/init.tsx
index e0da6e1da..853a45b33 100644
--- a/desktop/app/src/init.tsx
+++ b/desktop/app/src/init.tsx
@@ -105,14 +105,19 @@ function init() {
   sideEffect(
     store,
     {name: 'loadTheme', fireImmediately: true, throttleMs: 500},
-    (state) =>
-      state.settingsState.enableSandy && state.settingsState.darkMode
-        ? 'themes/dark'
-        : 'themes/light',
+    (state) => ({
+      sandy: state.settingsState.enableSandy,
+      dark: state.settingsState.darkMode,
+    }),
     (theme) => {
       (document.getElementById(
         'flipper-theme-import',
-      ) as HTMLLinkElement).href = `${theme}.css`;
+      ) as HTMLLinkElement).href = `themes/${
+        theme.sandy && theme.dark ? 'dark' : 'light'
+      }.css`;
+      document
+        .getElementById('root')
+        ?.classList.toggle('flipperlegacy_design', !theme.sandy);
     },
   );
 }
diff --git a/desktop/themes/typography.less b/desktop/themes/typography.less
index 76911801f..90d671ace 100644
--- a/desktop/themes/typography.less
+++ b/desktop/themes/typography.less
@@ -72,3 +72,8 @@
 @link-color: @primary-color;
 @link-hover: @primary-color;
 @link-hover-decoration: underline;
+
+.flipperlegacy_design {
+  // Prevents ANT breaking global styles implicitly used by old Flipper design
+  line-height: 1;
+}