Fix: Truncate overflowing dashboard apps text (#5221)
* Truncate overflowing text * Update app/javascript/dashboard/routes/dashboard/settings/integrations/DashboardApps/DashboardAppsRow.vue Co-authored-by: Sivin Varghese <64252451+iamsivin@users.noreply.github.com> * Fix overflowing content * Reviwe changes Co-authored-by: Sivin Varghese <64252451+iamsivin@users.noreply.github.com>
This commit is contained in:
parent
3cb72242de
commit
287f0a6de0
1 changed files with 24 additions and 2 deletions
|
@ -1,7 +1,13 @@
|
|||
<template>
|
||||
<tr>
|
||||
<td>{{ app.title }}</td>
|
||||
<td>{{ app.content[0].url }}</td>
|
||||
<td>
|
||||
{{ app.title }}
|
||||
</td>
|
||||
<td class="dashboard-app-label-url">
|
||||
<span class="text-truncate">
|
||||
{{ app.content[0].url }}
|
||||
</span>
|
||||
</td>
|
||||
<td class="button-wrapper">
|
||||
<woot-button
|
||||
v-tooltip.top="
|
||||
|
@ -43,3 +49,19 @@ export default {
|
|||
},
|
||||
};
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.dashboard-app-label-url {
|
||||
position: relative;
|
||||
width: 50%;
|
||||
&:before {
|
||||
content: ' ';
|
||||
visibility: hidden;
|
||||
}
|
||||
span {
|
||||
position: absolute;
|
||||
left: 0;
|
||||
right: 0;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
Loading…
Reference in a new issue