mirror of
https://github.com/flarum/framework.git
synced 2024-12-12 14:13:37 +08:00
f89f114fad
* Don't use body as tooltip container, allow notification area overflow Badge tooltips are using container: 'body', so they can overflow the notification area. When the user navigates back while a badge tooltip is showing, the tooltip remains visible. This commit removes the body container attribute and instead allows the notificationDropDown to overflow, so badge tooltips aren't cut off. Instead, this adds overflow: hidden to NotificationList. Fixes #2118. * Remove newline
53 lines
880 B
Plaintext
53 lines
880 B
Plaintext
.NotificationsDropdown {
|
|
.Dropdown-menu {
|
|
padding: 0;
|
|
|
|
.NotificationList-content {
|
|
max-height: 70vh;
|
|
overflow: auto;
|
|
}
|
|
}
|
|
& .Dropdown-toggle .Button-label {
|
|
margin-left: 7px;
|
|
}
|
|
}
|
|
@media @tablet-up {
|
|
.NotificationsDropdown {
|
|
.Dropdown-menu {
|
|
width: 425px;
|
|
}
|
|
.Dropdown-toggle {
|
|
.Button--icon();
|
|
}
|
|
}
|
|
}
|
|
|
|
.NotificationsDropdown .Dropdown-toggle.new .Button-icon {
|
|
color: @header-color;
|
|
}
|
|
|
|
.NotificationsDropdown-unread {
|
|
position: absolute;
|
|
top: 2px;
|
|
left: 18px;
|
|
background: @header-control-color;
|
|
color: @header-bg;
|
|
font-size: 11px;
|
|
font-weight: bold;
|
|
padding: 2px 4px 3px;
|
|
line-height: 1em;
|
|
border-radius: 10px;
|
|
.box-shadow(0 0 0 1px @header-bg);
|
|
min-width: 16px;
|
|
height: 16px;
|
|
text-align: center;
|
|
|
|
@media @phone {
|
|
left: 20px;
|
|
}
|
|
|
|
.new & {
|
|
background: @header-color;
|
|
}
|
|
}
|