fixed some issues with the flexbox approach

- had to remove border, padding, and margin from input boxes
- centered images
- fixed y-overflow of description and images by restricting height
This commit is contained in:
Gesina Schwalbe 2021-01-03 21:50:16 +01:00
parent 4e60687b2b
commit d9eef7592f

View file

@ -16,13 +16,26 @@
.item-image { .item-image {
flex: 0 0 24px; flex: 0 0 24px;
margin-right: 5px; height: 100%;
//margin-right: 5px;
@include centered-content;
} }
img { img {
display: block; display: block;
border: none; border: none;
} }
input {
border: 0;
padding: 0;
}
input[type="checkbox"] {
width: auto;
height: 100%;
margin: 0px;
}
} }
.item-name { .item-name {
@ -36,7 +49,8 @@
.item-num-val { .item-num-val {
text-align: center; text-align: center;
max-width: 2.5em; width: 2.5em;
padding: 0;
} }
.item-description { .item-description {
@ -44,6 +58,7 @@
white-space: nowrap; white-space: nowrap;
overflow: hidden; overflow: hidden;
text-overflow: ellipsis; text-overflow: ellipsis;
height: 100%;
p { p {
text-overflow: ellipsis; text-overflow: ellipsis;
overflow: hidden; overflow: hidden;