about summary refs log tree commit diff
diff options
context:
space:
mode:
authorOndřej Hruška <ondra@ondrovo.com>2017-08-04 22:11:46 +0200
committerGitHub <noreply@github.com>2017-08-04 22:11:46 +0200
commitf34f33c19e14d03dfcdaa0d6c66460d3c248309f (patch)
tree99c3002baf0281281bad0c266f6664229afb1b47
parent8b581535832a05f58e1c6faf9e6aa040ca8154d9 (diff)
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
-rw-r--r--app/javascript/glitch/components/status/index.js20
1 files changed, 20 insertions, 0 deletions
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 ? (
           <StatusPrepend