Fix clear due date x button not working

- Reduce the width of the datetime-picker-container to prevent it from hiding the clear-date (x button).
This commit is contained in:
sboursen-scinote 2023-01-10 19:45:02 +01:00
parent d5bd26a31b
commit 83378e4ade

View file

@ -8,7 +8,7 @@
.title-row {
.header-actions {
&.experiment-header {
column-gap: .25em;
column-gap: 0.25em;
}
.sort-task-menu {
@ -22,7 +22,10 @@
}
.experiment-table-container {
height: calc(100vh - var(--content-header-size) - var(--navbar-height) - var(--toolbar-height));
height: calc(
100vh - var(--content-header-size) - var(--navbar-height) -
var(--toolbar-height)
);
overflow: auto;
}
@ -35,7 +38,7 @@
display: flex;
.btn {
margin-right: .25em;
margin-right: 0.25em;
}
}
@ -47,7 +50,9 @@
.experiment-table {
display: grid;
grid-auto-rows: 3em 1px;
grid-template-columns: max-content repeat(calc(var(--columns-count)), minmax(max-content, auto)) max-content;
grid-template-columns:
max-content repeat(calc(var(--columns-count)), minmax(max-content, auto))
max-content;
min-width: 100%;
.table-header-cell {
@ -56,7 +61,7 @@
border: 1px solid $color-white;
display: flex;
height: 3em;
padding: 0 .5em;
padding: 0 0.5em;
position: sticky;
position: -webkit-sticky;
top: 0;
@ -113,7 +118,7 @@
.table-body-cell {
align-items: center;
display: flex;
padding: 0 .5em;
padding: 0 0.5em;
.my-module-users-link {
color: $color-silver-chalice;
@ -127,7 +132,7 @@
color: $color-silver-chalice;
height: 2em;
line-height: 2em;
margin-right: .25em;
margin-right: 0.25em;
width: 2em;
}
@ -137,7 +142,7 @@
color: $color-white;
height: 2em;
line-height: 2em;
margin-right: .25em;
margin-right: 0.25em;
text-align: center;
text-decoration: none;
width: 2em;
@ -181,7 +186,7 @@
.assign-users-dropdown {
.dropdown-menu {
padding: .5em;
padding: 0.5em;
width: 280px;
}
@ -193,10 +198,10 @@
.user-container {
align-items: center;
display: flex;
padding: .5em;
padding: 0.5em;
.user-avatar {
padding: 0 .75em;
padding: 0 0.75em;
&.archived {
padding-left: 0;
@ -287,14 +292,13 @@
width: 24px;
}
@keyframes placeholder-pulsing {
0% {
opacity: 1;
}
50% {
opacity: .5;
opacity: 0.5;
}
100% {
@ -380,7 +384,7 @@
left: 0;
position: absolute;
top: 0;
width: 100%;
width: 90%;
.calendar-due-date {
opacity: 0;
@ -388,10 +392,9 @@
}
&:hover {
.date-text[data-editable=true] {
.date-text[data-editable="true"] {
background-color: $color-concrete;
border-radius: 4px;
}
}
}
@ -420,7 +423,7 @@
align-items: center;
border-bottom: $border-default;
display: flex;
padding: .5em 1em;
padding: 0.5em 1em;
&:not(.visible) {
color: $color-alto;