Stylus & AO3

[queer_scribbling]

Even though I am aware that a subscription, hits, or kudos count on AO3 isn't supposed to be the absolute most important thing on AO3, I still feel kind of anxious when I can see, for example, the user subscription count decrease. I recently realised that I could just put all that CSS that most people talked about putting in a site skin into a Stylus theme for AO3.

This has been copied over from vriddy's Dreamwidth post about hiding various stats on the Statistics page of one's AO3 account.

Changes to vriddy's CSS: I added an 's' to comment in order to hide 'comments' (trying to hide 'comment' didn't take away the numbers themselves). The line for 'dt.comment.thread.count' removes that stat in the top section; 'dd.comment.thread.count' removes the numbers. I removed the 'statisics .group' from vriddy's list in order to still list out all the works on the page. The only stat visible is word count.

.statistics .subscriptions {
display: none;
}

.statistics .kudos {
display: none;
}

.statistics .comments {
display: none;
}

.statistics dt.comment.thread.count {
display: none;
}

.statistics dd.comment.thread.count {
display: none;
}

.statistics .bookmarks {
display: none;
}

.statistics .hits {
display: none;
}

.stats-index .chart {
display: none;
}

.stats-index .actions {
display: none;
}

I remembered that @ao3commentoftheday created a Spooky Season site skin that substituted different stat words for emoji (example: 💬 instead of 'Comments'). I double checked the basics of adding emoji, and then I got rid of the numbers for stats while browsing (blurb stats). Certain stats are still visible, such as the bookmarks on one of my series. However, I don't check on those as often as I browse the rest of the site.

The first section of each grouping leaves the words alone and just gets rid of the numbers. For example, for the first one that says "dd.kudos" the resulting stat goes from "Kudos: 5" [Kudos colon space 5] to "Kudos: " [Kudos colon two spaces]. The second section that says "dt.kudos::after" then replaces the empty space with whatever the emoji is in between the quotation marks. I did not want all of the bright pops of color and different shapes of actually using different emoji, so I've got the Trigram for Heaven in the content spot right now.

dl.stats dd.kudos {
display: none;
}

dl.stats dt.kudos::after {
content: "☰ ";
}

dl.stats dd.hits {
display: none;
}

dl.stats dt.hits::after {
content: "☰ ";
}

dl.stats dd.bookmarks {
display: none;
}

dl.stats dt.bookmarks::after {
content: "☰ ";
}

dl.stats dd.comments {
display: none;
}

dl.stats dt.comments::after {
content: "☰ ";
}

Shared on Tumblr.