[Maps] fix attribution overflow with exit full screen button (#62699)

nreese · elasticmachine · nreese · commit bbaf56cd344b · 2020-04-08T11:24:39.000-06:00
* [Maps] fix attribution overflow with exit full screen button

* use margin-left instead of padding-left

Co-authored-by: Elastic Machine &lt;elasticmachine@users.noreply.github.com&gt;
diff --git a/x-pack/legacy/plugins/maps/public/connected_components/widget_overlay/attribution_control/_attribution_control.scss b/x-pack/legacy/plugins/maps/public/connected_components/widget_overlay/attribution_control/_attribution_control.scss
@@ -4,3 +4,7 @@
   pointer-events: all;
   padding-left: $euiSizeM;
 }
+
+.mapAttributionControl__fullScreen {
+  margin-left: $euiSizeXXL * 4;
+}
diff --git a/x-pack/legacy/plugins/maps/public/connected_components/widget_overlay/attribution_control/index.js b/x-pack/legacy/plugins/maps/public/connected_components/widget_overlay/attribution_control/index.js
@@ -7,10 +7,12 @@
 import { connect } from 'react-redux';
 import { AttributionControl } from './view';
 import { getLayerList } from '../../../selectors/map_selectors';
+import { getIsFullScreen } from '../../../selectors/ui_selectors';
 
 function mapStateToProps(state = {}) {
   return {
     layerList: getLayerList(state),
+    isFullScreen: getIsFullScreen(state),
   };
 }
 
diff --git a/x-pack/legacy/plugins/maps/public/connected_components/widget_overlay/attribution_control/view.js b/x-pack/legacy/plugins/maps/public/connected_components/widget_overlay/attribution_control/view.js
@@ -7,6 +7,7 @@
 import React, { Fragment } from 'react';
 import _ from 'lodash';
 import { EuiText, EuiLink } from '@elastic/eui';
+import classNames from 'classnames';
 
 export class AttributionControl extends React.Component {
   state = {
@@ -86,7 +87,11 @@ export class AttributionControl extends React.Component {
       return null;
     }
     return (
-      <div className="mapAttributionControl">
+      <div
+        className={classNames('mapAttributionControl', {
+          mapAttributionControl__fullScreen: this.props.isFullScreen,
+        })}
+      >
         <EuiText size="xs">
           <small>
             <strong>{this._renderAttributions()}</strong>

Original file line number	Diff line number	Diff line change
`@@ -4,3 +4,7 @@`
`4`	`4`	`pointer-events: all;`
`5`	`5`	`padding-left: $euiSizeM;`
`6`	`6`	`}`
	`7`	`+`
	`8`	`+.mapAttributionControl__fullScreen {`
	`9`	`+ margin-left: $euiSizeXXL * 4;`
	`10`	`+}`