typeahead: Move all global typeahead styles together.

This commit is contained in:
Aman Agrawal 2024-07-17 03:24:28 +00:00 committed by Tim Abbott
parent 7a80fcf042
commit c82012e5e2
3 changed files with 79 additions and 83 deletions

View File

@ -1402,32 +1402,6 @@ textarea.new_message_textarea {
}
}
.typeahead.dropdown-menu {
.typeahead-menu {
list-style: none;
margin: 4px 0;
max-height: min(248px, 95vh);
overflow-y: auto;
.simplebar-content {
min-width: max-content;
}
}
.typeahead-header {
margin: 0;
padding: 4px 10px;
border-top: 1px solid hsl(0deg 0% 0% / 20%);
display: flex;
align-items: center;
}
#typeahead-header-text {
color: var(--color-dropdown-item);
font-size: 12px;
}
}
/* Class for send-area buttons, such as
Drafts and the send-adjacent vdots */
.send-control-button {

View File

@ -15,6 +15,8 @@
}
.typeahead.dropdown-menu .typeahead-menu .simplebar-content {
min-width: max-content;
& > li {
word-break: break-word;
@ -97,3 +99,80 @@
opacity: 1;
}
}
.typeahead.dropdown-menu {
.typeahead-menu {
list-style: none;
margin: 4px 0;
max-height: min(248px, 95vh);
overflow-y: auto;
}
.typeahead-header {
margin: 0;
padding: 4px 10px;
border-top: 1px solid hsl(0deg 0% 0% / 20%);
display: flex;
align-items: center;
}
#typeahead-header-text {
color: var(--color-dropdown-item);
font-size: 12px;
}
a strong.typeahead-strong-section {
white-space: pre;
/* Present as flexbox to better control
icon alignment and spacing, when icons
are shown. */
display: flex;
align-items: baseline;
/* Approximate space as preserved in
typeahead lines, e.g., between the channel
name and its description. */
gap: 0.25ch;
}
.active {
.unsubscribed_icon {
visibility: visible;
float: right;
margin-top: 5px;
color: hsl(96deg 7% 73%);
}
}
.unsubscribed_icon {
visibility: hidden;
font-size: 0.8em;
}
}
.typeahead-option-label {
display: flex !important;
justify-content: space-between;
> strong {
margin-right: 14px;
}
}
.typeahead-image {
display: inline-block;
height: 21px;
width: 21px;
border-radius: 4px;
/* For FontAwesome icons and zulip icons used in place of images for some users. */
font-size: 19px;
text-align: center;
&.zulip-icon-triple-users {
font-size: 19px;
}
&.no-presence-circle {
margin-left: 14px;
}
}

View File

@ -1266,54 +1266,6 @@ div.focused-message-list {
font-size: 0;
}
.typeahead.dropdown-menu {
a strong.typeahead-strong-section {
white-space: pre;
/* Present as flexbox to better control
icon alignment and spacing, when icons
are shown. */
display: flex;
align-items: baseline;
/* Approximate space as preserved in
typeahead lines, e.g., between the channel
name and its description. */
gap: 0.25ch;
}
.active {
.unsubscribed_icon {
visibility: visible;
float: right;
margin-top: 5px;
color: hsl(96deg 7% 73%);
}
}
.unsubscribed_icon {
visibility: hidden;
font-size: 0.8em;
}
}
.typeahead-image {
display: inline-block;
height: 21px;
width: 21px;
border-radius: 4px;
/* For FontAwesome icons and zulip icons used in place of images for some users. */
font-size: 19px;
text-align: center;
&.zulip-icon-triple-users {
font-size: 19px;
}
&.no-presence-circle {
margin-left: 14px;
}
}
nav {
.column-left {
text-align: left;
@ -2223,15 +2175,6 @@ body:not(.hide-left-sidebar) {
}
}
.typeahead-option-label {
display: flex !important;
justify-content: space-between;
> strong {
margin-right: 14px;
}
}
.header-main .column-right {
display: flex;
/* Make the top navbar right column its full width,