paulmataruso/zulip
1
0
Fork 0
mirror of https://github.com/zulip/zulip.git synced 2025-11-03 05:23:35 +00:00
Code Issues Packages Projects Releases Wiki Activity

settings: Add new sort arrows to all settings tables.

Browse Source
This commit is contained in:
Karl Stolley
2025-04-01 15:55:54 -04:00
committed by Tim Abbott
parent d2772a0a38
commit ede630a6dd
18 changed files with 156 additions and 59 deletions
Download Patch File Download Diff File Expand all files Collapse all files

34
web/styles/app_components.css
View File

@@ -775,32 +775,36 @@ input.settings_text_input {
background-color: hsl(0deg 0% 100%);
word-break: normal;
&.active::after,
&[data-sort]:hover::after {
content: " \f0d8";
white-space: pre;
padding-top: 3px;
font: normal normal normal 12px/1 FontAwesome;
font-size: inherit;
.table-sortable-arrow {
/* Sub alignment works perfectly in this context,
where the table header is a text node. */
vertical-align: sub;
transform: rotate(180deg);
opacity: 0;
transition: opacity 100ms ease-out;
}
&.descend .table-sortable-arrow {
transform: rotate(0deg);
}
&:not(.active)[data-sort]:hover .table-sortable-arrow {
opacity: 0.3;
}
&.active .table-sortable-arrow {
opacity: 1;
}
&.active {
opacity: 1;
transition: opacity 100ms ease-out;
&.descend::after {
content: " \f0d7";
}
}
&[data-sort]:hover {
cursor: pointer;
background-color: hsl(0deg 0% 95%) !important;
transition: background-color 100ms ease-in-out;
&:not(.active)::after {
opacity: 0.3;
}
}
}