masto-modern-tweaks.user.css
edited
1/* ==UserStyle==
2@name mastodon tweaks
3@namespace github.com/openstyles/stylus
4@version 1.0.0
5@description A new userstyle
6@author Niko @gayfamicom@merping.synth.download
7==/UserStyle== */
8
9@-moz-document domain("wetdry.world"), domain("fuzzies.wtf"), domain("merping.synth.download") {
10 :root {
11 --avatar-size: 40px;
12 --emoji-size: 1.5em;
13 --status-gutter-width: 1px;
14 --tl-width: 700px;
15 }
16 body {
17 font-weight: 500;
18 line-height: 16px;
19 }
20 .status__content {
21 line-height: 1.35;
22 }
23 .status__info {
24 font-size: 12px;
25 }
26 .status__content,
27 .edit-indicator__content,
28 .reply-indicator__content {
29 padding-top: 0px;
30 }
31 .icon {
32 width: 20px;
33 height: 20px;
34 }
35 .content-warning {
36 padding: 6px 12px;
37 }
38 .status__info .status__display-name {
39 line-height: 18px;
40 }
41 .reactions-bar__item {
42 margin: 2px;
43 padding: 0 2px;
44 }
45 body.app-body.flavour-glitch>#mastodon .reactions-bar button {
46 padding-block: 0px;
47 }
48 body.app-body.flavour-glitch>#mastodon .reactions-bar {
49 margin-top: 0px;
50 }
51 body.app-body.flavour-glitch>#mastodon .reactions-bar button .reactions-bar__item__emoji {
52 height: 1.75em;
53 }
54 .reactions-bar__item__emoji {
55 margin: 2px 0;
56 }
57 .content-warning {
58 padding: 6px 6px;
59 line-height: 14px;
60 }
61 .status .content-warning {
62 margin-bottom: 4px;
63 }
64 .status__action-bar {
65 margin-top: .1em;
66 margin-bottom: -9px;
67 }
68 .status__action-bar__button-wrapper {
69 max-width: 40px;
70 }
71 .status__info .account__avatar, .status__info .status__avatar {
72 max-height: 42px !important;
73 max-width: 42px !important;
74 }
75 .account__action-bar__tab {
76 padding: 6px 0;
77 }
78 .notification__filter-bar button, .notification__filter-bar a, .account__section-headline button, .account__section-headline a {
79 padding: 8px 0;
80 }
81 .account__action-bar-links {
82 line-height: 14px;
83 }
84 .reactions-bar__item.active {
85 background-color: rgb(var(--accent),.75);
86 color: var(--background-color);
87 }
88 .account__header__fields dl {
89 padding: 4px 8px !important;
90 }
91 .status__content__read-more-button, .status__content__translate-button {
92 margin-top: 6px;
93 }
94 .status__quote {
95 -webkit-margin-before: 4px;
96 margin-block-start: 4px;
97 border-radius: 8px;
98 }
99 .status__content__read-more-button, .status__content__translate-button {
100 margin-top: 2px;
101 }
102 .status__prepend+.status:not(.status-direct) {
103 padding-top: 1px;
104 }
105 .notification-group__main {
106 gap: 4px;
107 }
108 .notification-group {
109 padding: 12px
110 }
111 body.app-body.flavour-glitch>#mastodon .compose-form__submit button {
112 padding: 8px 12px;
113 }
114 .compose-form {
115 gap: 8px;
116 }
117 .compose-panel .search, .drawer .search {
118 margin-bottom: 12px;
119 }
120 .detailed-status__meta {
121 margin-top: 10px;
122 }
123 .account__header__tabs__buttons .icon-button {
124 padding: 3px;
125 }
126 .button.button-secondary {
127 padding: 3px 12px;
128 }
129 .button {
130 padding: 4px 18px;
131 }
132 .account__header__tabs__buttons {
133 gap: 4px;
134 }
135 .account__header__bar .avatar {
136 margin-top: 10px;
137 }
138 .account__header__tabs__name {
139 margin-top: 12px;
140 }
141 .account__header__bar {
142 padding-inline: 12px;
143 }
144 .account__header__familiar-followers {
145 margin-block: 4px;
146 }
147 .account__relationship .icon-button, .explore-suggestions-card .icon-button {
148 padding: 2px;
149 }
150 .account {
151 padding: 8px;
152 }
153 .status {
154 padding: 12px 10px
155 }
156 .status__info {
157 padding-bottom: 6px;
158 }
159 .detailed-status__display-name {
160 margin-bottom: 12px;
161 }
162 [style*="width: 46px;height: 46px;"] {
163 width: 42px;
164 height: 42px;
165 }
166 .media-gallery, .video-player, .status-card.horizontal.interactive, .status-card, .audio-player, .picture-in-picture-placeholder {
167 margin-block: 8px;
168 }
169 .status-card__content {
170 padding: 6px 10px;
171 }
172 .upload-progress {
173 gap: 4px;
174 }
175 .upload-progress__tracker {
176 height: 3px;
177 }
178 .compose-form__footer {
179 padding: 4px;
180 }
181 .dialog-modal__header {
182 border-bottom: 0px;
183 padding: 6px 12px;
184 min-height: 41px;
185 }
186 .dialog-modal__content__description {
187 margin: 2px 12px 0;
188 }
189 .dialog-modal__content__form {
190 gap: 6px;
191 padding: 12px;
192 }
193 .visibility-dropdown__button {
194 font-size: 13px;
195 height: 36px;
196 }
197 .dialog-modal__content {
198 letter-spacing: 0px;
199 }
200 .account__header__buttons .icon-button .icon {
201 height: 20px;
202 width: 20px;
203 }
204 div [class*="account__avatar-overlay"] {
205 width: 30px;
206 height: 30px;
207 }
208}