From 24cdbc3ba29dde8ea67c6c9cce527c0557a6cdb4 Mon Sep 17 00:00:00 2001 From: xenua Date: Mon, 21 Nov 2022 11:57:49 +0100 Subject: [PATCH] initial commit --- README.md | 5 +++ mastodon/mastodon4.user.css | 84 +++++++++++++++++++++++++++++++++++++ 2 files changed, 89 insertions(+) create mode 100644 README.md create mode 100644 mastodon/mastodon4.user.css diff --git a/README.md b/README.md new file mode 100644 index 0000000..8b35628 --- /dev/null +++ b/README.md @@ -0,0 +1,5 @@ +this is where the user styles live if i ever make any + +idk not much to say about this + +use the theme via https://github.com/openstyles/stylus or any other css injector diff --git a/mastodon/mastodon4.user.css b/mastodon/mastodon4.user.css new file mode 100644 index 0000000..3330286 --- /dev/null +++ b/mastodon/mastodon4.user.css @@ -0,0 +1,84 @@ +/* ==UserStyle== +@name mastodon 4 ui tweaks +@namespace mastodon4 +@version 1.0.0 +@description fixes the weird spacing on the new mastodon web ui. intended for the advanced user interface, may also work with the single column one. +@author xenua +@license CNPLv7+ +==/UserStyle== */ + +@-moz-document domain("chaos.social") { + /* compact, space-optimized timeline look */ + .status__prepend { + padding-top: 8px; + } + .status, .detailed-status { + padding: 8px 0; + } + .status > *, .detailed-status > * { + padding: 0 12px; + } + .status > .status__content, .detailed-status > .status__content { + padding: 0 16px; + } + .status > .media-gallery, .detailed-status > .media-gallery { + padding: 0 !important; + } + .media-gallery { + margin-top: 12px !important; + } + .status__action-bar { + margin-top: 8px; + padding: 0 20px; + } + .conversation .status__action-bar { + padding: 0; + } + .detailed-status > .detailed-status__meta { + margin-top: 12px; + padding: 0 16px; + } + .status__info { + margin-bottom: 12px; + } + .detailed-status__display-name { + margin-bottom: 12px; + } + .notification > .notification__message { + padding: 8px 8px 0 8px; + } + + /* it's the toot button and it never will change */ + .compose-form__publish-button-wrapper > button::before { + content: "Toot"; + font-size: 15px; + } + .compose-form__publish-button-wrapper > button { + font-size: 0px; + padding-bottom: 2px; + } + + /* consistent spacing in some ui elements */ + .compose-form, .navigation-bar, .reply-indicator, .search-input, .link-footer { + padding: 8px; + } + + /* spoiler image button less intrusive */ + .icon-button.overlayed { + background: rgba(0,0,0,.4) /* default rgba(0,0,0,.6) */ + } + + /* rainbow boost button */ + .icon-button.active i.fa-retweet { + animation: 4s linear 0s infinite rainbowrt; + } + + @keyframes rainbowrt { + from { + filter: hue-rotate(0deg) saturate(1) brightness(1.1); + } + to { + filter: hue-rotate(360deg) saturate(1) brightness(1.1); + } + } +}