Restyle sort icons of table headers

This commit is contained in:
Stanislav Romanov 2022-09-10 15:26:24 +03:00
parent 547c37cb79
commit bc2e4b0ca7
5 changed files with 21 additions and 22 deletions

View file

@ -209,13 +209,6 @@ body {
&[type='button'] {
@apply cursor-pointer select-none;
}
svg {
width: 1em;
height: 1em;
bottom: 0.1em;
position: relative;
}
}
}
}

View file

@ -0,0 +1 @@
export { ArrowDownThin as default } from 'ember-mdi';

View file

@ -0,0 +1 @@
export { ArrowUpThin as default } from 'ember-mdi';

View file

@ -0,0 +1 @@
export { Sort as default } from 'ember-mdi';

View file

@ -8,22 +8,25 @@
{{on 'click' this.handleSort}}
{{! DOTO: align is depricated, use styles align instead }}
>
{{#if @sortable}}
{{#if this.isAscSorted}}
<Icons::ArrowDown />
{{else if this.isDescSorted}}
<Icons::ArrowUp />
{{else}}
<Icons::ArrowUpDown />
<span class='inline-flex items-center'>
{{#if (has-block 'name')}}
{{yield to='name'}}
{{else if @name}}
{{@name}}
{{else if @prop}}
{{capitalize @prop}}
{{/if}}
{{/if}}
{{#if (has-block 'name')}}
{{yield to='name'}}
{{else if @name}}
{{@name}}
{{else if @prop}}
{{capitalize @prop}}
{{/if}}
{{#if @sortable}}
{{#if this.isAscSorted}}
<Icons::ArrowDownThin class="fill-base-3 ml-0.5" @size={{14}} />
{{else if this.isDescSorted}}
<Icons::ArrowUpThin class="fill-base-3 ml-0.5" @size={{14}} />
{{else}}
<Icons::ArrowUpDown class="fill-base-3 ml-0.5" @size={{14}} />
{{/if}}
{{/if}}
</span>
</th>
{{else if this.isBody}}
<td align={{@align}} ...attributes>