chinwag/ChinwagUI
2
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Navigation icons follow-up: adaptations to MultiColumn layout

Browse source
This commit is contained in:
Niléane 2024-02-19 14:15:36 +01:00
parent 1e87f5d360
commit ebfd758ac2
No known key found for this signature in database
3 changed files with 87 additions and 6 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

31
TangerineUI-cherry.css
View file

@ -888,6 +888,9 @@ body.app-body {
.app-body .column-link.active .icon-home {
background-image: var(--icon-home-active);
}
.layout-multiple-columns .column-link .icon-home {
background-image: var(--icon-home-accent);
}
.app-body .notification__message .icon-home {
background-image: var(--icon-post-notification-accent);
}
@ -899,6 +902,9 @@ body.app-body {
.app-body .column-link.active .icon-globe {
background-image: var(--icon-globe-active);
}
.layout-multiple-columns .column-link .icon-globe {
background-image: var(--icon-globe-accent);
}
/* Explore + Hashtag icon */
.app-body .icon-hashtag,
.app-body .column-link .icon-hashtag {
@ -907,6 +913,9 @@ body.app-body {
.app-body .column-link.active .icon-hashtag {
background-image: var(--icon-explore-active);
}
.layout-multiple-columns .column-link .icon-hashtag {
background-image: var(--icon-explore-accent);
}
/* Search icon */
.app-body .icon-search {
background-image: var(--icon-search);
@ -943,6 +952,9 @@ body.app-body {
.app-body .column-link.active .icon-at {
background-image: var(--icon-direct-messages-active);
}
.layout-multiple-columns .column-link .icon-at {
background-image: var(--icon-direct-messages-accent);
}
/* Bookmarks icon */
.app-body .icon-bookmarks,
.app-body .column-header__icon.icon-bookmarks {
@ -950,7 +962,10 @@ body.app-body {
}
.app-body .column-link.active .icon-bookmarks {
background-image: var(--icon-bookmark-column-link-active);
}
}
.layout-multiple-columns .column-link .icon-bookmarks {
background-image: var(--icon-bookmark-column-link-accent);
}
/* Favorites icon */
.app-body .column-link .icon-star,
.app-body .column-header__icon.icon-star {
@ -959,6 +974,9 @@ body.app-body {
.app-body .column-link.active .icon-star {
background-image: var(--icon-star-column-link-active);
}
.layout-multiple-columns .column-link .icon-star {
background-image: var(--icon-star-column-link-accent);
}
/* Lists icon */
.app-body .icon-list-ul,
.app-body .column-header__icon.icon-list-ul {
@ -967,10 +985,16 @@ body.app-body {
.app-body .column-link.active .icon-list-ul {
background-image: var(--icon-list-active);
}
.layout-multiple-columns .column-link .icon-list-ul {
background-image: var(--icon-list-accent);
}
/* Settings icon */
.app-body .column-link .icon-cog {
background-image: var(--icon-settings);
}
.layout-multiple-columns .column-link .icon-cog {
background-image: var(--icon-settings-accent);
}
/* About page icon */
.app-body .navigation-panel .column-link .icon-ellipsis-h {
background-image: var(--icon-ellipsis);
@ -1007,6 +1031,9 @@ body.app-body {
.app-body .column-link.active .icon-user-plus {
background-image: var(--icon-user-plus-column-link-active);
}
.layout-multiple-columns .column-link .icon-user-plus {
background-image: var(--icon-user-plus-column-link-accent);
}
/* Users icon */
.app-body .icon-users {
background-image: var(--icon-users);
@ -6015,7 +6042,7 @@ a:is(.active,
background-image: var(--icon-gear);
}
.layout-multiple-columns .drawer__tab .icon-globe {
background-image: var(--icon-globe-active);
background-image: var(--icon-globe);
}
.layout-multiple-columns .drawer__tab .icon-users {
background-image: var(--icon-users);

31
TangerineUI-purple.css
View file

@ -888,6 +888,9 @@ body.app-body {
.app-body .column-link.active .icon-home {
background-image: var(--icon-home-active);
}
.layout-multiple-columns .column-link .icon-home {
background-image: var(--icon-home-accent);
}
.app-body .notification__message .icon-home {
background-image: var(--icon-post-notification-accent);
}
@ -899,6 +902,9 @@ body.app-body {
.app-body .column-link.active .icon-globe {
background-image: var(--icon-globe-active);
}
.layout-multiple-columns .column-link .icon-globe {
background-image: var(--icon-globe-accent);
}
/* Explore + Hashtag icon */
.app-body .icon-hashtag,
.app-body .column-link .icon-hashtag {
@ -907,6 +913,9 @@ body.app-body {
.app-body .column-link.active .icon-hashtag {
background-image: var(--icon-explore-active);
}
.layout-multiple-columns .column-link .icon-hashtag {
background-image: var(--icon-explore-accent);
}
/* Search icon */
.app-body .icon-search {
background-image: var(--icon-search);
@ -943,6 +952,9 @@ body.app-body {
.app-body .column-link.active .icon-at {
background-image: var(--icon-direct-messages-active);
}
.layout-multiple-columns .column-link .icon-at {
background-image: var(--icon-direct-messages-accent);
}
/* Bookmarks icon */
.app-body .icon-bookmarks,
.app-body .column-header__icon.icon-bookmarks {
@ -950,7 +962,10 @@ body.app-body {
}
.app-body .column-link.active .icon-bookmarks {
background-image: var(--icon-bookmark-column-link-active);
}
}
.layout-multiple-columns .column-link .icon-bookmarks {
background-image: var(--icon-bookmark-column-link-accent);
}
/* Favorites icon */
.app-body .column-link .icon-star,
.app-body .column-header__icon.icon-star {
@ -959,6 +974,9 @@ body.app-body {
.app-body .column-link.active .icon-star {
background-image: var(--icon-star-column-link-active);
}
.layout-multiple-columns .column-link .icon-star {
background-image: var(--icon-star-column-link-accent);
}
/* Lists icon */
.app-body .icon-list-ul,
.app-body .column-header__icon.icon-list-ul {
@ -967,10 +985,16 @@ body.app-body {
.app-body .column-link.active .icon-list-ul {
background-image: var(--icon-list-active);
}
.layout-multiple-columns .column-link .icon-list-ul {
background-image: var(--icon-list-accent);
}
/* Settings icon */
.app-body .column-link .icon-cog {
background-image: var(--icon-settings);
}
.layout-multiple-columns .column-link .icon-cog {
background-image: var(--icon-settings-accent);
}
/* About page icon */
.app-body .navigation-panel .column-link .icon-ellipsis-h {
background-image: var(--icon-ellipsis);
@ -1007,6 +1031,9 @@ body.app-body {
.app-body .column-link.active .icon-user-plus {
background-image: var(--icon-user-plus-column-link-active);
}
.layout-multiple-columns .column-link .icon-user-plus {
background-image: var(--icon-user-plus-column-link-accent);
}
/* Users icon */
.app-body .icon-users {
background-image: var(--icon-users);
@ -6015,7 +6042,7 @@ a:is(.active,
background-image: var(--icon-gear);
}
.layout-multiple-columns .drawer__tab .icon-globe {
background-image: var(--icon-globe-active);
background-image: var(--icon-globe);
}
.layout-multiple-columns .drawer__tab .icon-users {
background-image: var(--icon-users);

31
TangerineUI.css
View file

@ -888,6 +888,9 @@ body.app-body {
.app-body .column-link.active .icon-home {
background-image: var(--icon-home-active);
}
.layout-multiple-columns .column-link .icon-home {
background-image: var(--icon-home-accent);
}
.app-body .notification__message .icon-home {
background-image: var(--icon-post-notification-accent);
}
@ -899,6 +902,9 @@ body.app-body {
.app-body .column-link.active .icon-globe {
background-image: var(--icon-globe-active);
}
.layout-multiple-columns .column-link .icon-globe {
background-image: var(--icon-globe-accent);
}
/* Explore + Hashtag icon */
.app-body .icon-hashtag,
.app-body .column-link .icon-hashtag {
@ -907,6 +913,9 @@ body.app-body {
.app-body .column-link.active .icon-hashtag {
background-image: var(--icon-explore-active);
}
.layout-multiple-columns .column-link .icon-hashtag {
background-image: var(--icon-explore-accent);
}
/* Search icon */
.app-body .icon-search {
background-image: var(--icon-search);
@ -943,6 +952,9 @@ body.app-body {
.app-body .column-link.active .icon-at {
background-image: var(--icon-direct-messages-active);
}
.layout-multiple-columns .column-link .icon-at {
background-image: var(--icon-direct-messages-accent);
}
/* Bookmarks icon */
.app-body .icon-bookmarks,
.app-body .column-header__icon.icon-bookmarks {
@ -950,7 +962,10 @@ body.app-body {
}
.app-body .column-link.active .icon-bookmarks {
background-image: var(--icon-bookmark-column-link-active);
}
}
.layout-multiple-columns .column-link .icon-bookmarks {
background-image: var(--icon-bookmark-column-link-accent);
}
/* Favorites icon */
.app-body .column-link .icon-star,
.app-body .column-header__icon.icon-star {
@ -959,6 +974,9 @@ body.app-body {
.app-body .column-link.active .icon-star {
background-image: var(--icon-star-column-link-active);
}
.layout-multiple-columns .column-link .icon-star {
background-image: var(--icon-star-column-link-accent);
}
/* Lists icon */
.app-body .icon-list-ul,
.app-body .column-header__icon.icon-list-ul {
@ -967,10 +985,16 @@ body.app-body {
.app-body .column-link.active .icon-list-ul {
background-image: var(--icon-list-active);
}
.layout-multiple-columns .column-link .icon-list-ul {
background-image: var(--icon-list-accent);
}
/* Settings icon */
.app-body .column-link .icon-cog {
background-image: var(--icon-settings);
}
.layout-multiple-columns .column-link .icon-cog {
background-image: var(--icon-settings-accent);
}
/* About page icon */
.app-body .navigation-panel .column-link .icon-ellipsis-h {
background-image: var(--icon-ellipsis);
@ -1007,6 +1031,9 @@ body.app-body {
.app-body .column-link.active .icon-user-plus {
background-image: var(--icon-user-plus-column-link-active);
}
.layout-multiple-columns .column-link .icon-user-plus {
background-image: var(--icon-user-plus-column-link-accent);
}
/* Users icon */
.app-body .icon-users {
background-image: var(--icon-users);
@ -6015,7 +6042,7 @@ a:is(.active,
background-image: var(--icon-gear);
}
.layout-multiple-columns .drawer__tab .icon-globe {
background-image: var(--icon-globe-active);
background-image: var(--icon-globe);
}
.layout-multiple-columns .drawer__tab .icon-users {
background-image: var(--icon-users);