I made a userscript (eventually converted into a userstyle) so I could go sightseeing across lemmy and spot all you animals out in the wild. pawb.social, pawb.fun, and furry.engineer are pre-filled already, but you can add other servers to track as well!

Edit: Special mention to redyoshi49q@furry.engineer for this post, whose techniques resulted in CSS to achieve parity with my userscript. My older userscript should not be used anymore, as the CSS will do the same thing but more efficiently.

Instructions:

  1. Install Stylus extension for firefox/chrome

  2. “Write new style” in the addon settings

  3. Copy paste the CSS code below in

  4. Modify the code around line ~11 in order to reflect your homeserver and any additional frendservers that you want to highlight. Currently it’s set to pawb.social and the mastodon servers that pawb.social also operates, but feel free to add some of the furry instances below as well (post in the comments if you’ve got a good furry instance to add here!):

  1. Modify the code around line ~19 to reflect your homeserver

  2. (Optional) If you’d like your homeserver buddies to have a different marker, uncomment the various sections around line ~27 through ~50 by removing the /* and */ bits

  3. (Optional) Play around with different markers and colors!

CSS/Userstyle: https://gist.github.com/redyoshi49q/f1b2d1da0a8f7536aba1f8c3110d2dd8

  • Yote.zipOP
    link
    fedilink
    English
    arrow-up
    1
    ·
    edit-2
    2 years ago

    I’m unsure if this is what you mean exactly, but I was able to use your techniques to get parity with my script’s logic (star removed for simplicity at the moment):

    a.text-info[href*="/u/"][href$="@pawb.social"] span::before,
    a.text-info[href*="/u/"][href$="@pawb.fun"] span::before,
    a.text-info[href*="/u/"][href$="@furry.engineer"] span::before {
        content: "❤ ";
        color: red;
    }
    @-moz-document domain("pawb.social") {
        a.text-info[href*="/u/"]:not([href*="@"]) span::before {
            content: "❤ " !important;
            color: red !important;
        }
    }
    

    This CSS is logically equivalent to what I was doing in my script:

    So it works on all sites and highlights users from the first 3 sites (first is a user’s homeserver). On pawb.social specifically, it detects native users and adds a heart to them. In practice, this means everyone from those 3 servers should always have a heart next to them no matter where you go in the lemmyverse.

    • redyoshi49q@furry.engineer
      link
      fedilink
      arrow-up
      2
      ·
      2 years ago

      It took me a bit to realize as much, but it seems that you edited the script based on another commenter’s suggestion to make parts of it run on /every/ page (with the expectation of only changing anything on Lemmy pages). That’s… probably fine; the CSS is pretty specific.

      https://gist.github.com/redyoshi49q/f1b2d1da0a8f7536aba1f8c3110d2dd8 <- I made an update that cleans up a few things and re-adds the functionality that I originally intended for the stars to have (using houses instead) with commented out CSS.

      • redyoshi49q@furry.engineer
        link
        fedilink
        arrow-up
        2
        ·
        2 years ago

        You’re welcome to version bump this and add yourself as an author, by the way; you participated quite a bit in this process.

        (The character limit of Mastodon has been a little bit cozy for this extended exchange, hence why I finally decided to just make and link a gist.)

        • Yote.zipOP
          link
          fedilink
          English
          arrow-up
          1
          ·
          2 years ago

          Sure. just add me as an author on that gist and I’ll put it in the post instead. Posting raw code on lemmy is not ideal, especially because I can’t seem to color it based on the language.

      • Yote.zipOP
        link
        fedilink
        English
        arrow-up
        1
        ·
        edit-2
        2 years ago

        Yeah, I had the same concerns here: https://pawb.social/comment/121816. The CSS is specific enough that I don’t think it’s a problem, but it is slightly more of a concern with the CSS than the JS because the CSS doesn’t abort itself. With my userscript it also ran on every site but instantly aborted if it wasn’t actually a lemmy site.

        As far as wildcard fediverse stuff goes, I still think this is quite acceptable. I just saw this addon which scans every word on every website (and every mutation?) for fediverse formatted links to convert to clickables, so on a scale of 1 to that monstrosity, this one’s at a 0.