Import space selector styles (#64656)

x-pack/plugins/spaces/public/index.scss

@@ -11,6 +11,4 @@
 //   spcChart__legend-isLoading
 
 @import './management/index';
-@import './nav_control/index';
-@import './space_selector/index';
 @import './copy_saved_objects_to_space/index';

x-pack/plugins/spaces/public/nav_control/_index.scss

@@ -1,2 +0,0 @@
-@import './components/index';
-@import './nav_control';

x-pack/plugins/spaces/public/nav_control/_nav_control.scss

@@ -1,3 +0,0 @@
-.kbnGlobalNavLink__icon .spaceNavGraphic {
-    margin-top: 0.5em;
-}

x-pack/plugins/spaces/public/nav_control/components/_index.scss

@@ -1,2 +0,0 @@
-@import './spaces_description';
-@import './spaces_menu';

x-pack/plugins/spaces/public/nav_control/components/spaces_description.tsx

@@ -4,6 +4,7 @@
  * you may not use this file except in compliance with the Elastic License.
  */
 
+import './spaces_description.scss';
 import { EuiContextMenuPanel, EuiText } from '@elastic/eui';
 import React, { FC } from 'react';
 import { Capabilities, ApplicationStart } from 'src/core/public';

x-pack/plugins/spaces/public/nav_control/components/spaces_menu.tsx

@@ -4,6 +4,7 @@
  * you may not use this file except in compliance with the Elastic License.
  */
 
+import './spaces_menu.scss';
 import {
   EuiContextMenuItem,
   EuiContextMenuPanel,

x-pack/plugins/spaces/public/nav_control/nav_control_popover.tsx

@@ -140,7 +140,7 @@ export class NavControlPopover extends Component<Props, State> {
     }
 
     return this.getButton(
-      <SpaceAvatar space={activeSpace} size={'s'} className={'spaceNavGraphic'} />,
+      <SpaceAvatar space={activeSpace} size={'s'} />,
       (activeSpace as Space).name
     );
   };

x-pack/plugins/spaces/public/space_selector/_index.scss

@@ -1,2 +0,0 @@
-@import './space_selector';
-@import './components/index';

x-pack/plugins/spaces/public/space_selector/components/_index.scss

@@ -1,2 +0,0 @@
-@import './space_card';
-@import './space_cards';

x-pack/plugins/spaces/public/space_selector/components/_space_card.scss

@@ -1,8 +0,0 @@
-.euiCard.euiCard--isClickable.spaceCard {
-  width: $euiSizeL * 10;
-  min-height: 200px;
-}
-
-.spaceCard .euiCard__content{
-  overflow: hidden;
-}

x-pack/plugins/spaces/public/space_selector/components/space_card.scss

@@ -0,0 +1,9 @@
+.spaceCard {
+  width: $euiSizeL * 10 !important;
+  min-height: $euiSize * 12.5; // 200px
+
+  // SASSTODO: Fix EuiCard to truncate or forcewrap long text
+  .euiCard__content{
+    overflow: hidden;
+  }
+}

x-pack/plugins/spaces/public/space_selector/components/space_card.tsx

@@ -4,6 +4,7 @@
  * you may not use this file except in compliance with the Elastic License.
  */
 
+import './space_card.scss';
 import { EuiCard } from '@elastic/eui';
 import React from 'react';
 import { addSpaceIdToPath, ENTER_SPACE_PATH } from '../../../common';

x-pack/plugins/spaces/public/space_selector/components/space_cards.tsx

@@ -4,6 +4,7 @@
  * you may not use this file except in compliance with the Elastic License.
  */
 
+import './space_cards.scss';
 import { EuiFlexGroup, EuiFlexItem } from '@elastic/eui';
 import React, { Component } from 'react';
 import { Space } from '../../../common/model/space';

x-pack/plugins/spaces/public/space_selector/space_selector.tsx

@@ -4,6 +4,8 @@
  * you may not use this file except in compliance with the Elastic License.
  */
 
+import './space_selector.scss';
+
 import {
   EuiFieldSearch,
   EuiFlexGroup,