diff --git a/res/css/views/dialogs/_RebrandDialog.scss b/res/css/views/dialogs/_RebrandDialog.scss
index 6c916e0f1d..534584ae2a 100644
--- a/res/css/views/dialogs/_RebrandDialog.scss
+++ b/res/css/views/dialogs/_RebrandDialog.scss
@@ -53,11 +53,12 @@ limitations under the License.
.mx_RebrandDialog_chevron::after {
content: '';
display: inline-block;
- width: 24px;
- height: 24px;
+ width: 30px;
+ height: 30px;
mask-position: center;
mask-size: contain;
mask-repeat: no-repeat;
background-color: $muted-fg-color;
- mask-image: url('$(res)/img/feather-customised/chevron-right.svg');
+ mask-image: url('$(res)/img/feather-customised/chevron-down.svg');
+ transform: rotate(-90deg);
}
diff --git a/res/css/views/directory/_NetworkDropdown.scss b/res/css/views/directory/_NetworkDropdown.scss
index bd5c67c7ed..ae0927386a 100644
--- a/res/css/views/directory/_NetworkDropdown.scss
+++ b/res/css/views/directory/_NetworkDropdown.scss
@@ -145,13 +145,14 @@ limitations under the License.
&::after {
content: "";
position: absolute;
- width: 24px;
- height: 24px;
- right: -28px; // - (24 + 4)
+ width: 26px;
+ height: 26px;
+ right: -27.5px; // - (width: 26 + spacing to align with X above: 1.5)
+ top: -3px;
mask-repeat: no-repeat;
mask-position: center;
mask-size: contain;
- mask-image: url('$(res)/img/feather-customised/chevron-down.svg');
+ mask-image: url('$(res)/img/feather-customised/chevron-down-thin.svg');
background-color: $primary-fg-color;
}
diff --git a/res/css/views/rooms/_JumpToBottomButton.scss b/res/css/views/rooms/_JumpToBottomButton.scss
index 4659442d9b..6cb3b6bce9 100644
--- a/res/css/views/rooms/_JumpToBottomButton.scss
+++ b/res/css/views/rooms/_JumpToBottomButton.scss
@@ -67,9 +67,8 @@ limitations under the License.
bottom: 0;
left: 0;
right: 0;
- mask: url('$(res)/img/icon-jump-to-bottom.svg');
+ mask-image: url('$(res)/img/feather-customised/chevron-down-thin.svg');
mask-repeat: no-repeat;
- mask-position: center;
- mask-size: 50%;
+ mask-size: contain;
background: $muted-fg-color;
}
diff --git a/res/css/views/rooms/_RoomSublist.scss b/res/css/views/rooms/_RoomSublist.scss
index b907d06d36..d3c9b79c69 100644
--- a/res/css/views/rooms/_RoomSublist.scss
+++ b/res/css/views/rooms/_RoomSublist.scss
@@ -142,26 +142,24 @@ limitations under the License.
.mx_RoomSublist_collapseBtn {
display: inline-block;
position: relative;
- width: 12px;
- height: 12px;
- margin-right: 8px;
+ width: 14px;
+ height: 14px;
+ margin-right: 6px;
&::before {
content: '';
- width: 12px;
- height: 12px;
+ width: 18px;
+ height: 18px;
position: absolute;
- top: 1px;
- left: 1px;
mask-position: center;
mask-size: contain;
mask-repeat: no-repeat;
- background-color: $primary-fg-color;
+ background-color: $roomlist-header-color;
mask-image: url('$(res)/img/feather-customised/chevron-down.svg');
}
&.mx_RoomSublist_collapseBtn_collapsed::before {
- mask-image: url('$(res)/img/feather-customised/chevron-right.svg');
+ transform: rotate(-90deg);
}
}
}
@@ -251,22 +249,24 @@ limitations under the License.
.mx_RoomSublist_showNButtonChevron {
position: relative;
- width: 16px;
- height: 16px;
+ width: 18px;
+ height: 18px;
margin-left: 12px;
- margin-right: 18px;
+ margin-right: 16px;
mask-position: center;
mask-size: contain;
mask-repeat: no-repeat;
- background: $roomtile-preview-color;
+ background: $roomlist-header-color;
+ left: -1px; // adjust for image position
}
- .mx_RoomSublist_showMoreButtonChevron {
+ .mx_RoomSublist_showMoreButtonChevron,
+ .mx_RoomSublist_showLessButtonChevron {
mask-image: url('$(res)/img/feather-customised/chevron-down.svg');
}
.mx_RoomSublist_showLessButtonChevron {
- mask-image: url('$(res)/img/feather-customised/chevron-up.svg');
+ transform: rotate(180deg);
}
}
diff --git a/res/css/views/rooms/_TopUnreadMessagesBar.scss b/res/css/views/rooms/_TopUnreadMessagesBar.scss
index d9970ef037..8841b042a0 100644
--- a/res/css/views/rooms/_TopUnreadMessagesBar.scss
+++ b/res/css/views/rooms/_TopUnreadMessagesBar.scss
@@ -51,11 +51,11 @@ limitations under the License.
position: absolute;
width: 36px;
height: 36px;
- mask-image: url('$(res)/img/icon-jump-to-first-unread.svg');
+ mask-image: url('$(res)/img/feather-customised/chevron-down-thin.svg');
mask-repeat: no-repeat;
- mask-position: center;
- mask-size: 50%;
+ mask-size: contain;
background: $muted-fg-color;
+ transform: rotate(180deg);
}
.mx_TopUnreadMessagesBar_markAsRead {
diff --git a/res/img/feather-customised/chevron-down-thin.svg b/res/img/feather-customised/chevron-down-thin.svg
new file mode 100644
index 0000000000..109c83def6
--- /dev/null
+++ b/res/img/feather-customised/chevron-down-thin.svg
@@ -0,0 +1,3 @@
+
diff --git a/res/img/feather-customised/chevron-down.svg b/res/img/feather-customised/chevron-down.svg
index bcb185ede7..a091913b42 100644
--- a/res/img/feather-customised/chevron-down.svg
+++ b/res/img/feather-customised/chevron-down.svg
@@ -1,3 +1,3 @@
-