framework/extensions/mentions/less/forum.less

138 lines
2.5 KiB
Plaintext

.PostMention, .UserMention, .GroupMention {
background: var(--control-bg);
color: var(--control-color);
border-radius: var(--border-radius);
font-weight: 600;
blockquote & {
background: var(--body-bg);
}
&:hover,
&:active {
color: var(--link-color);
}
}
.UserMention, .PostMention, .GroupMention, .TagMention {
padding: 2px 5px;
vertical-align: middle;
border: 0 !important;
white-space: nowrap;
&--deleted {
opacity: 0.8;
filter: grayscale(1);
}
}
.PostMention {
margin: 0 3px;
&:first-child {
margin-left: 0;
}
.icon {
margin-right: 5px;
}
}
.GroupMention {
background-color: var(--color, var(--control-bg));
color: var(--control-color);
--link-color: currentColor;
&--colored {
--control-color: var(--contrast-color, var(--body-bg));
--link-color: var(--control-color);
}
.icon {
margin-left: 5px;
}
}
& when (is-extension-enabled('flarum-tags')) {
.TagMention {
--tag-bg: var(--color, var(--control-bg));
.tag-label();
margin: 0 2px;
.icon {
margin-right: 2px;
}
}
}
.ComposerBody-mentionsWrapper {
position: relative;
}
.MentionsDropdown {
max-width: 500px;
max-height: 150px;
overflow: auto;
position: absolute;
mark {
padding: 0;
}
> li > a:hover {
background: none;
}
}
.MentionsDropdown, .PostMention-preview, .Post-mentionedBy-preview {
// @TODO: Rename to .MentionsDropdownItem, along with child classes. 2.0
.PostPreview {
color: var(--muted-color);
.Avatar {
.Avatar--size(24px);
margin: 0 0 0 -37px;
.MentionsDropdown-post& {
margin-top: 3px;
margin-bottom: 3px;
}
}
.username {
color: var(--text-color);
font-weight: bold;
}
}
.PostPreview-content {
padding-left: 37px;
overflow: hidden;
line-height: 1.7em;
display: block;
}
}
.Post-mentionedBy {
display: inline-block;
}
.Post-mentionedBy-summary {
cursor: pointer;
}
.Post-mentionedBy-preview, .PostMention-preview, .MentionsDropdown {
margin: 5px 0 !important;
> li > a {
white-space: normal;
border-bottom: 0;
}
}
.PostMention-preview-discussion {
padding-top: 0 !important;
font-weight: bold !important;
white-space: normal !important;
}
.PostQuoteButton {
position: absolute;
.Button--color(@tooltip-color, @tooltip-bg);
}
.MentionsDropdown .Badge {
box-shadow: none;
}
@media @phone {
.MentionsDropdown {
max-width: 100%;
}
}
.Post-footer .item-replies {
position: relative;
}