forked from platypush/platypush
Apply word-break: break-all
to entities' names and values.
The entity name and value in the component header may be arbitrarily long and rendered on small screens. We therefore need to ensure that the text won't overflow the screen width.
This commit is contained in:
parent
3d7755159f
commit
0b853e0a54
1 changed files with 5 additions and 0 deletions
|
@ -221,6 +221,7 @@ export default {
|
||||||
.head {
|
.head {
|
||||||
.name {
|
.name {
|
||||||
display: inline-flex;
|
display: inline-flex;
|
||||||
|
word-break: break-all;
|
||||||
|
|
||||||
&:hover {
|
&:hover {
|
||||||
color: $hover-fg;
|
color: $hover-fg;
|
||||||
|
@ -231,6 +232,10 @@ export default {
|
||||||
margin-left: 0.5em;
|
margin-left: 0.5em;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.value {
|
||||||
|
word-break: break-all;
|
||||||
|
}
|
||||||
|
|
||||||
.icon:hover {
|
.icon:hover {
|
||||||
color: $hover-fg;
|
color: $hover-fg;
|
||||||
}
|
}
|
||||||
|
|
Loading…
Reference in a new issue