From de20f24e574a9c83fdb7e61dd7d371a6d6bf439e Mon Sep 17 00:00:00 2001 From: Nick Colley <2445413+nickcolley@users.noreply.github.com> Date: Sun, 11 Dec 2022 00:34:47 +0000 Subject: [PATCH] Prototype more elegant status icons --- bin/svgs.js | 1 + src/routes/_components/status/StatusToolbar.html | 8 +++----- .../font-awesome-svg-png/white/svg/retweet-o.svg | 2 ++ src/thirdparty/font-awesome-svg-png/white/svg/retweet.svg | 3 ++- 4 files changed, 8 insertions(+), 6 deletions(-) create mode 100644 src/thirdparty/font-awesome-svg-png/white/svg/retweet-o.svg diff --git a/bin/svgs.js b/bin/svgs.js index 3d828bba..df7a5c55 100644 --- a/bin/svgs.js +++ b/bin/svgs.js @@ -9,6 +9,7 @@ export default [ { id: 'fa-reply', src: 'src/thirdparty/font-awesome-svg-png/white/svg/reply.svg' }, { id: 'fa-reply-all', src: 'src/thirdparty/font-awesome-svg-png/white/svg/reply-all.svg' }, { id: 'fa-retweet', src: 'src/thirdparty/font-awesome-svg-png/white/svg/retweet.svg' }, + { id: 'fa-retweet-o', src: 'src/thirdparty/font-awesome-svg-png/white/svg/retweet-o.svg' }, { id: 'fa-star', src: 'src/thirdparty/font-awesome-svg-png/white/svg/star.svg' }, { id: 'fa-star-o', src: 'src/thirdparty/font-awesome-svg-png/white/svg/star-o.svg' }, { id: 'fa-ellipsis-h', src: 'src/thirdparty/font-awesome-svg-png/white/svg/ellipsis-h.svg' }, diff --git a/src/routes/_components/status/StatusToolbar.html b/src/routes/_components/status/StatusToolbar.html index c4208d25..1e1d31cc 100644 --- a/src/routes/_components/status/StatusToolbar.html +++ b/src/routes/_components/status/StatusToolbar.html @@ -14,7 +14,6 @@ pressedLabel="Unboost" pressable={!reblogDisabled} pressed={reblogged} - checked={reblogged} disabled={reblogDisabled} href={reblogIcon} clickListener={false} @@ -26,8 +25,7 @@ pressedLabel="{intl.unfavorite}" pressable={true} pressed={favorited} - checked={favorited} - href="#fa-star" + href={favorited ? '#fa-star' : '#fa-star-o'} clickListener={false} elementId={favoriteKey} ref:favoriteIcon @@ -201,14 +199,14 @@ return 'intl.reblog' } }, - reblogIcon: ({ visibility }) => { + reblogIcon: ({ reblogged, visibility }) => { switch (visibility) { case 'private': return '#fa-lock' case 'direct': return '#fa-envelope' default: - return '#fa-retweet' + return reblogged ? '#fa-retweet' : '#fa-retweet-o' } }, reblogDisabled: ({ visibility }) => { diff --git a/src/thirdparty/font-awesome-svg-png/white/svg/retweet-o.svg b/src/thirdparty/font-awesome-svg-png/white/svg/retweet-o.svg new file mode 100644 index 00000000..18a11961 --- /dev/null +++ b/src/thirdparty/font-awesome-svg-png/white/svg/retweet-o.svg @@ -0,0 +1,2 @@ + + diff --git a/src/thirdparty/font-awesome-svg-png/white/svg/retweet.svg b/src/thirdparty/font-awesome-svg-png/white/svg/retweet.svg index af167af1..9cbfb9ec 100644 --- a/src/thirdparty/font-awesome-svg-png/white/svg/retweet.svg +++ b/src/thirdparty/font-awesome-svg-png/white/svg/retweet.svg @@ -1 +1,2 @@ - + +