Improving category reorder modal layout

This commit is contained in:
Kris 2018-08-10 22:09:46 -04:00
parent e53983b53b
commit a960a57c72
2 changed files with 23 additions and 23 deletions

View File

@ -12,7 +12,7 @@
{{d-button class="no-text" action="moveUp" actionParam=cat icon="arrow-up"}}
{{d-button class="no-text" action="moveDown" actionParam=cat icon="arrow-down"}}
{{#if cat.hasBufferedChanges}}
{{d-button class="no-text" action="commit" icon="check"}}
{{d-button class="no-text ok" action="commit" icon="check"}}
{{/if}}
</td>
<td>{{category-badge cat allowUncategorized="true"}}</td>

View File

@ -1,31 +1,31 @@
.reorder-categories {
thead {
border-bottom: 1px solid $primary-low;
th {
padding-bottom: 0.5em;
text-align: left;
}
}
input {
width: 4em;
@include breakpoint(mobile) {
width: 2em;
}
.th-pos {
width: calc(4em + 150px);
}
tbody tr {
background-color: transparent;
transition: background 0s ease;
&.highlighted {
background-color: rgba($highlight, 0.4);
&.done {
background-color: transparent;
transition-duration: 1s;
}
}
&:first-child td {
padding-top: 7px;
}
}
tbody {
border-bottom: 1px solid blend-primary-secondary(50%);
}
table {
width: 100%;
padding-bottom: 150px;
td {
padding: 0.5em 0.5em 0.5em 0;
@include breakpoint(mobile, min-width) {
min-width: 15em;
}
}
}
.badge-wrapper span.badge-category {
max-width: 20em;
@include breakpoint(mobile) {
max-width: 30vw;
}
}
.category-admin-menu ul {
width: 320px;
}