From f34f33c19e14d03dfcdaa0d6c66460d3c248309f Mon Sep 17 00:00:00 2001 From: Ondřej Hruška Date: Fri, 4 Aug 2017 22:11:46 +0200 Subject: Add data- attributes to statuses for userstyle selectors (#117) * Add data- attributes to statuses for userstyle selectors * use const and template string, replace reblog->boosted and favourite->favourited * more template strings because sorin-sama said so --- app/javascript/glitch/components/status/index.js | 20 ++++++++++++++++++++ 1 file changed, 20 insertions(+) (limited to 'app/javascript/glitch') diff --git a/app/javascript/glitch/components/status/index.js b/app/javascript/glitch/components/status/index.js index 5571b3c85..4849170b0 100644 --- a/app/javascript/glitch/components/status/index.js +++ b/app/javascript/glitch/components/status/index.js @@ -664,6 +664,25 @@ backgrounds for collapsed statuses are enabled. ) background = attachments.getIn([0, 'preview_url']); } +/* + +Here we prepare extra data-* attributes for CSS selectors. +Users can use those for theming, hiding avatars etc via UserStyle + +*/ + + const selectorAttribs = { + 'data-status-by': `@${status.getIn(['account', 'acct'])}`, + }; + + if (prepend && account) { + const notifKind = { + favourite: 'favourited', + reblog: 'boosted', + }[prepend]; + + selectorAttribs[`data-${notifKind}-by`] = `@${account.get('acct')}`; + } /* @@ -694,6 +713,7 @@ collapsed. ), }} ref={handleRef} + {...selectorAttribs} > {prepend && account ? (