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

@@ -105,14 +105,19 @@ function init() {
   sideEffect(
     store,
     {name: 'loadTheme', fireImmediately: true, throttleMs: 500},
-    (state) =>
+    (state) => ({
-      state.settingsState.enableSandy && state.settingsState.darkMode
+      sandy: state.settingsState.enableSandy,
-        ? 'themes/dark'
+      dark: state.settingsState.darkMode,
-        : 'themes/light',
+    }),
     (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);
     },
   );
 }

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;
+}