Files
fluxer/fluxer_app/src/features/channel/components/MentionEveryonePopout.module.css
T

79 lines
1.3 KiB
CSS

/* SPDX-License-Identifier: AGPL-3.0-or-later */
.container {
display: flex;
flex-direction: column;
gap: 0.75rem;
padding: 1rem;
background-color: var(--background-primary);
border-radius: 0.5rem;
box-shadow: var(--shadow-lg);
max-width: 21.25rem;
}
.header {
display: flex;
align-items: center;
gap: 0.5rem;
}
.warningIcon {
color: var(--status-warning);
flex-shrink: 0;
}
.title {
font-size: 1rem;
font-weight: 600;
color: var(--text-primary);
}
.description {
margin: 0;
font-size: 0.875rem;
line-height: 1.4;
color: var(--text-secondary);
}
.description strong {
color: var(--text-primary);
font-weight: 600;
}
.roleName {
color: var(--text-primary);
font-weight: 600;
}
.keybindHint {
display: inline-flex;
align-items: center;
justify-content: center;
min-width: 1.25rem;
height: 1.125rem;
padding: 0 0.25rem;
margin-left: 0.375rem;
border-radius: 0.1875rem;
background-color: rgba(255, 255, 255, 0.15);
color: inherit;
font-family: var(--font-keybind);
font-size: 0.6875rem;
font-weight: 600;
line-height: 1;
}
.keybinds {
display: flex;
justify-content: flex-end;
gap: 0.75rem;
}
.keybind {
display: flex;
align-items: center;
gap: 0.375rem;
font-size: 0.8125rem;
color: var(--text-secondary);
text-transform: capitalize;
}