Update icon for channels button on side nav (#5273)

* * Update icon for channels button on side nav

* * Reduce size of new icon

* * Align new icon manually

* * Update mobile menu item icon
This commit is contained in:
PikachuEXE 2024-07-25 10:24:23 +08:00 committed by GitHub
parent 0e72be464e
commit 0ac277ac84
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
5 changed files with 25 additions and 2 deletions

View File

@ -69,6 +69,11 @@
margin-block-start: 0.5em;
}
.navIcon.fa-user-check {
/* Align icon according to torso */
transform: translateX(0.2em);
}
.moreOption {
display: block;
}

View File

@ -37,7 +37,7 @@
class="thumbnailContainer"
>
<font-awesome-icon
:icon="['fas', 'list']"
:icon="['fas', 'user-check']"
class="navIcon"
:class="applyNavIconExpand"
fixed-width

View File

@ -78,9 +78,19 @@
}
.navIcon {
block-size: 1em;
inline-size: 1.25em;
margin-inline-start: 10px;
}
.navIcon.fa-user-check {
/* This icon is too big by default */
inline-size: 1em;
/* Align icon according to torso */
transform: translateX(0.2em);
}
.navChannel .navLabel {
overflow: hidden;
margin-inline-start: 40px;
@ -94,6 +104,7 @@
position: absolute;
inset-block-start: 50%;
transform: translateY(-50%);
text-align: center;
}
.channelThumbnail {
@ -139,6 +150,11 @@
block-size: 1.3em;
}
.closed .navIconExpand.fa-user-check {
/* This icon is too big by default */
block-size: 1.15em;
}
.closed .navLabel {
margin-inline-start: 0;
inline-size: 100%;

View File

@ -42,7 +42,7 @@
class="thumbnailContainer"
>
<font-awesome-icon
:icon="['fas', 'list']"
:icon="['fas', 'user-check']"
class="navIcon"
:class="applyNavIconExpand"
fixed-width

View File

@ -89,6 +89,7 @@ import {
faTimes,
faTimesCircle,
faTrash,
faUserCheck,
faUsers,
faUsersSlash,
} from '@fortawesome/free-solid-svg-icons'
@ -187,6 +188,7 @@ library.add(
faTimes,
faTimesCircle,
faTrash,
faUserCheck,
faUsers,
faUsersSlash,