1berry/mastodon-bird-ui
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Add green/red indicator in the follow/unfollow button in notifications

Browse Source
This commit is contained in:
Roni Laukkarinen 2023-03-13 16:48:43 +02:00
parent 3cb362c42b
commit fd35eef1a2
3 changed files with 33 additions and 4 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
CHANGELOG.md
View File

@ -1,7 +1,9 @@
### 1.1.9rc2: 2023-03-13
### 1.1.9rc3: 2023-03-13
* Fix blur overlay on iPad
* Fix compose form z-index on mobile
* Add green/red indicator in the follow/unfollow button in notifications
* Add missing stylelint-order package
### 1.1.8: 2023-03-12

5
package.json
View File

@ -14,6 +14,7 @@
"@ronilaukkarinen/stylelint-value-no-unknown-custom-properties": "^4.0.1",
"postcss": "^8.4.21",
"stylelint": "^15.2.0",
"stylelint-config-standard": "^30.0.1"
"stylelint-config-standard": "^30.0.1",
"stylelint-order": "^6.0.3"
}
}
}

28
style.css
View File

@ -1,5 +1,5 @@
/* Mastodon Bird UI by @rolle@mementomori.social
1.1.9rc2 */
1.1.9rc3 */
/* CSS variables */
:root {
@ -1134,12 +1134,38 @@ a.status-card.compact .status-card__description {
font-size: 24px;
}
/* Follow/unfollow button in notifications */
.layout-single-column .notification .account__relationship .icon-button:focus,
.layout-single-column .notification .account__relationship .icon-button:hover {
background-color: transparent;
}
.layout-single-column .notification .account__relationship .fa::before {
/* stylelint-disable-next-line */
color: var(--color-dim) !important;
font-size: 20px;
}
.layout-single-column .notification .account__relationship .icon-button.active .fa::before {
/* stylelint-disable-next-line */
color: var(--color-green) !important;
opacity: .75;
}
.layout-single-column .notification .account__relationship .icon-button:focus .fa::before,
.layout-single-column .notification .account__relationship .icon-button:hover .fa::before {
opacity: 1;
/* stylelint-disable-next-line */
color: var(--color-red) !important;
}
.layout-single-column .notification .account__relationship .icon-button:not(.active):focus .fa::before,
.layout-single-column .notification .account__relationship .icon-button:not(.active):hover .fa::before {
opacity: 1;
/* stylelint-disable-next-line */
color: var(--color-green) !important;
}
.layout-single-column .account__relationship .button:hover {
background-color: transparent;
}