github-mirrors/kibana
1
0
Fork 0
mirror of https://github.com/elastic/kibana.git synced 2025-04-23 17:28:26 -04:00
Code Issues Projects Releases Packages Wiki Activity

fix recently accessed overflow problems (#18726) (#18928)

Browse source
This commit is contained in:
Nathan Reese 2018-05-08 15:07:41 -06:00 • committed by GitHub
parent e5d08a38c7
commit 3e96a57d81
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
3 changed files with 42 additions and 21 deletions
Download patch file Download diff file Expand all files Collapse all files

40
src/core_plugins/kibana/public/home/components/__snapshots__/recently_accessed.test.js.snap
View file

@ -24,7 +24,7 @@ exports[`render 1`] = `
gutterSize="l"
justifyContent="spaceBetween"
responsive={true}
wrap={false}
wrap={true}
>
<EuiFlexItem
className="recentlyAccessedFlexItem"
@ -52,14 +52,19 @@ exports[`render 1`] = `
}
}
>
<EuiLink
className="recentlyAccessedLongLink"
color="primary"
href="link0"
type="button"
<EuiToolTip
content="label0"
position="bottom"
>
label0
</EuiLink>
<EuiLink
className="recentlyAccessedLongLink"
color="primary"
href="link0"
type="button"
>
label0
</EuiLink>
</EuiToolTip>
</EuiFlexItem>
</React.Fragment>
<React.Fragment
@ -88,14 +93,19 @@ exports[`render 1`] = `
}
}
>
<EuiLink
className="recentlyAccessedLongLink"
color="primary"
href="link1"
type="button"
<EuiToolTip
content="label1"
position="bottom"
>
label1
</EuiLink>
<EuiLink
className="recentlyAccessedLongLink"
color="primary"
href="link1"
type="button"
>
label1
</EuiLink>
</EuiToolTip>
</EuiFlexItem>
</React.Fragment>
</EuiFlexGroup>

18
src/core_plugins/kibana/public/home/components/recently_accessed.js
View file

@ -12,6 +12,7 @@ import {
EuiPopover,
EuiIcon,
EuiSpacer,
EuiToolTip,
} from '@elastic/eui';
export const NUM_LONG_LINKS = 5;
@ -130,12 +131,17 @@ export class RecentlyAccessed extends Component {
style={style}
grow={false}
>
<EuiLink
className="recentlyAccessedLongLink"
href={recentlyAccessedItem.link}
<EuiToolTip
position="bottom"
content={recentlyAccessedItem.label}
>
{recentlyAccessedItem.label}
</EuiLink>
<EuiLink
className="recentlyAccessedLongLink"
href={recentlyAccessedItem.link}
>
{recentlyAccessedItem.label}
</EuiLink>
</EuiToolTip>
</EuiFlexItem>
</React.Fragment>
);
@ -178,7 +184,7 @@ export class RecentlyAccessed extends Component {
<EuiSpacer size="s"/>
<EuiFlexGroup justifyContent="spaceBetween" alignItems="flexEnd">
<EuiFlexGroup justifyContent="spaceBetween" alignItems="flexEnd" wrap>
<EuiFlexItem grow={false} className="recentlyAccessedFlexItem">
<EuiFlexGroup>
{this.renderRecentlyAccessed()}

5
src/core_plugins/kibana/public/home/components/recently_accessed.less
View file

@ -7,6 +7,11 @@
.recentlyAccessedItem {
overflow: hidden;
max-width: 300px;
.euiToolTipAnchor {
overflow: hidden;
text-overflow: ellipsis;
}
}
.recentlyAccessedLongLink {