zulip/web/styles/user_status.css

86 lines
2.1 KiB
CSS
Raw Normal View History

#set-user-status-modal {
/* A narrower width is more attractive for this modal. */
width: 384px;
.user-status-content-wrapper {
display: flex;
align-items: center;
border: 1px solid;
border-color: hsl(0deg 0% 0% / 60%);
border-radius: 5px;
2023-03-15 19:45:26 +01:00
& input.user-status {
flex: 1 1 0;
width: 100%;
border: none;
outline: none;
box-shadow: none;
background-color: transparent;
margin: 0;
&:focus {
box-shadow: none;
}
}
.clear_search_button {
position: static;
padding: 6px;
}
.status-emoji-wrapper {
padding: 4px 8px;
border-right: 1px solid;
border-color: hsl(0deg 0% 0% / 60%);
cursor: pointer;
.selected-emoji {
width: 20px;
height: 20px;
cursor: pointer;
}
/* For custom emojis and smiley icon to take full width. */
& img.selected-emoji,
2023-03-15 20:36:05 +01:00
.smiley-icon {
text-align: center;
min-width: 20px;
}
2023-03-15 20:36:05 +01:00
.smiley-icon {
&:hover {
text-decoration: none;
}
}
}
}
.user-status-options {
padding-top: 15px;
2021-06-29 08:42:31 +02:00
padding-left: 2px;
& button.user-status-value:hover,
& button.user-status-value:focus {
/* Important is required for generic night them styling to not
have precedence over this. */
color: hsl(200deg 100% 40%) !important;
}
.user-status-value {
display: flex;
align-items: center;
width: 100%;
margin-bottom: 7px;
line-height: 1em;
2023-03-15 21:56:35 +01:00
.status-emoji {
/* Size and align status emoji to match
the top line of the modal. */
height: 20px;
width: 20px;
margin: 0 7px;
}
}
}
}