improve icons

This commit is contained in:
Rob Watson 2020-07-04 09:11:41 +02:00
parent 16b1ffbe45
commit 7b880e5819
3 changed files with 12 additions and 5 deletions

View File

@ -80,7 +80,10 @@ a::-moz-focus-inner {
} }
th .icon { th .icon {
color: #333333; color: #666666;
position: relative;
top: 0.125em;
left: 0.125em;
} }
.spinner { .spinner {

View File

@ -137,18 +137,16 @@ export class Search extends Component<any, State> {
sortLinkIcon(sortKey: string) { sortLinkIcon(sortKey: string) {
const searchParams = this.state.searchParams; const searchParams = this.state.searchParams;
if (searchParams.sort_key !== sortKey) { if (searchParams.sort_key !== sortKey) {
return ""; return "";
} }
if (searchParams.sort_dir === "Asc") { if (searchParams.sort_dir === "Asc") {
return ( return (
<svg class="icon icon-arrow-up d-none d-sm-inline mr-1"><use xlinkHref="#icon-arrow-up"></use></svg> <svg class="icon icon-arrow-up2"><use xlinkHref="#icon-arrow-up2"></use></svg>
) )
} else { } else {
return ( return (
<svg class="icon icon-arrow-down mr-1"><use xlinkHref="#icon-arrow-down"></use></svg> <svg class="icon icon-arrow-down2"><use xlinkHref="#icon-arrow-down2"></use></svg>
) )
} }
} }

View File

@ -49,6 +49,12 @@ class Index extends Component<any, any> {
<title>arrow-up</title> <title>arrow-up</title>
<path d="M16 1l-15 15h9v16h12v-16h9z"></path> <path d="M16 1l-15 15h9v16h12v-16h9z"></path>
</symbol> </symbol>
<symbol id="icon-arrow-up2" viewBox="0 0 32 32">
<path d="M27.414 12.586l-10-10c-0.781-0.781-2.047-0.781-2.828 0l-10 10c-0.781 0.781-0.781 2.047 0 2.828s2.047 0.781 2.828 0l6.586-6.586v19.172c0 1.105 0.895 2 2 2s2-0.895 2-2v-19.172l6.586 6.586c0.39 0.39 0.902 0.586 1.414 0.586s1.024-0.195 1.414-0.586c0.781-0.781 0.781-2.047 0-2.828z"></path>
</symbol>
<symbol id="icon-arrow-down2" viewBox="0 0 32 32">
<path d="M27.414 19.414l-10 10c-0.781 0.781-2.047 0.781-2.828 0l-10-10c-0.781-0.781-0.781-2.047 0-2.828s2.047-0.781 2.828 0l6.586 6.586v-19.172c0-1.105 0.895-2 2-2s2 0.895 2 2v19.172l6.586-6.586c0.39-0.39 0.902-0.586 1.414-0.586s1.024 0.195 1.414 0.586c0.781 0.781 0.781 2.047 0 2.828z"></path>
</symbol>
<symbol id="icon-search" viewBox="0 0 32 32"> <symbol id="icon-search" viewBox="0 0 32 32">
<title>search</title> <title>search</title>
<path d="M31.008 27.231l-7.58-6.447c-0.784-0.705-1.622-1.029-2.299-0.998 1.789-2.096 2.87-4.815 2.87-7.787 0-6.627-5.373-12-12-12s-12 5.373-12 12 5.373 12 12 12c2.972 0 5.691-1.081 7.787-2.87-0.031 0.677 0.293 1.515 0.998 2.299l6.447 7.58c1.104 1.226 2.907 1.33 4.007 0.23s0.997-2.903-0.23-4.007zM12 20c-4.418 0-8-3.582-8-8s3.582-8 8-8 8 3.582 8 8-3.582 8-8 8z"></path> <path d="M31.008 27.231l-7.58-6.447c-0.784-0.705-1.622-1.029-2.299-0.998 1.789-2.096 2.87-4.815 2.87-7.787 0-6.627-5.373-12-12-12s-12 5.373-12 12 5.373 12 12 12c2.972 0 5.691-1.081 7.787-2.87-0.031 0.677 0.293 1.515 0.998 2.299l6.447 7.58c1.104 1.226 2.907 1.33 4.007 0.23s0.997-2.903-0.23-4.007zM12 20c-4.418 0-8-3.582-8-8s3.582-8 8-8 8 3.582 8 8-3.582 8-8 8z"></path>