feat: update items layout for links widget

This commit is contained in:
Shivam Mishra 2020-06-29 19:36:47 +05:30
parent 64fc9940d7
commit b0c8d29eb4
2 changed files with 20 additions and 10 deletions

View file

@ -55,17 +55,17 @@ export default class LinksWidget extends Widget {
return `<span class="link-content help-video-link ellipsis" data-youtubeid="${item.youtube_id}">
${item.label ? item.label : item.name}</span>`;
return `<a data-route="${generate_route(item)}" class="link-content ellipsis">
${item.label ? item.label : item.name}</a>`;
return `<span class="link-content ellipsis">
${item.label ? item.label : item.name}</span>`;
};
this.link_list = this.links.map(item => {
return $(`<div class="link-item ${
return $(`<a href="${generate_route(item)}" class="link-item ${
item.onboard ? "onboard-spotlight" : ""
} ${disabled_dependent(item)}" type="${item.type}">
<span class="indicator-pill no-margin ${get_indicator_color(item)}"></span>
${get_link_for_item(item)}
</div>`);
</a>`);
});
this.link_list.forEach(link => link.appendTo(this.body));

View file

@ -374,10 +374,22 @@ $panel-bg: $gray-50;
&.links-widget-box {
padding-left: 0px;
.link-item {
color: var(--gray-900);
position: relative;
margin: 10px 0px;
cursor: default;
display: block;
text-decoration: none;
color: var(--grey-900);
padding: 5px;
margin: 1px 0px;
border-radius: 6px;
cursor: pointer;
&:hover {
background-color: var(--grey-50);
.indicator-pill,
.indicator-pill-right {
background: white;
}
}
&:first-child {
margin-top: 15px;
@ -408,8 +420,6 @@ $panel-bg: $gray-50;
.indicator-pill {
margin-right: 0px;
margin-right: 5px;
color: inherit;
font-weight: inherit;
}
}
}