Add word-break: break-word; so we make sure even long names or titles
without spaces are broken/wrapped where they need to.
Bug: T142662
Change-Id: I166e834495972ec49eb98e301ab9be85f40f5a5e
p-personal links have a white background on hover, and links
inside the notifications popup were inheriting that CSS rule.
Bug: T144063
Change-Id: I3868e418ab8cce8e5ff6f7cc10e042907cb1e8df
Allow extensions to add dynamic actions that perform some
API request and display a confirmation message.
Bug: T132975
Change-Id: Ib16d57c3f1a11a9749564c6e2112bf1ca32c55e8
Work around new styles introduced in oojs-ui in I77cd5212c.
Bonus: remove useless styles targeting the dotdotdot popup
in NotificationItemWidget.less: it's not even a popupWidget
any more and it's located in an overlay anyway, so these
styles didn't do anything.
Change-Id: Ifb16b7bb0b01c1eb2551ba4c173042cc759e9b02
Just like we do in the mobile popup, the menu should be accessible
in mobile clicks/taps by being "stuck" at the bottom of the screen.
Bug: T142013
Change-Id: I730216e717c2a02ad98bbcc28f66b13c1cbe29ed
In the unseen notifications case, Monobook used badges with
black text on a light red/blue, even though the text
is white on grey in the non-unseen case. Change the unseen style
to white on dark red/blue like Vector, and also make the colors
exactly the same as Vector.
Change-Id: I9d2d1a2614ac1130e027fb952c9288588d25d495
We have to override a CSS rule that tries to make all <a>s blue,
but not override it so powerfully that the real link in the footer
notice isn't blue.
Change-Id: I5a91419aab7cf6d6fe10c8e707168b52c2451cd8
The color: transparent; hack was being overridden by a color rule
that's only in effect after the popup is opened.
Change-Id: I2f415619603ccadb625ed2482c25fde78765fee4
Now that we have the cog menu, it should be placed correctly in
mobile and the "preferences" link should be hidden.
Since MobileFrontend doesn't have the personal toolbar, and we
can't cheat by using jQuery and grabbing the url of preferences,
we have to get SpecialNotifications.php to output the urls
to a wg variable and reading it from there.
Bug: T115528
Change-Id: I6a69823d6f75c376c04e9a21d79916321e417178
Bundles only have a header, no body, so when we include excerpts
in bundle headers, we wrap them in <em> tags. This change
makes these excerpts the same color as the excerpts in the
non-bundled case.
Bug: T139960
Bug: T141034
Change-Id: I6a14274b42ba672ab1366c0dd106ea0847db6404
And change all CSS and JS dependent calls/tags based on the new
tooltip message and ID of the personal tool <li> item.
Change-Id: I136fabe5710f90da10eb8d4afe92acdb77571eec
Add a global-wiki 'mark all as read' to the Special:Notifications page.
The 'mark all as read' will makr all notifications in the given
wiki. The context of the wiki changes when filters are chosen,
and so the message of the button changes as well.
Bug: T115528
Change-Id: Ibd9dcdf7072d6cbc1a268c18e558e6d0df28f929
As a first step for mobile support, make the page responsive,
hide the sidebar, and slightly adjust button/title positions and
sizes so they fit in a small screen.
Bug: T140687
Change-Id: I98f264948a57924f6370a861381456ce9c82f8d8
We need a fixed-width CSS table with a number of fixed-width
cells and one cell that takes up the remaining width, with
text truncation. This is a pain to do with CSS tables,
but this trick I found on StackOverflow[1] works well:
wrap the contents of the cell in a div that's position: relative;,
containing another div that's position: absolute; width: 100%;
[1] http://stackoverflow.com/questions/7569436/css-constrain-a-table-with-long-cell-contents-to-page-width
Bug: T140349
Change-Id: I507f915f06185c767d7a5c8edbff6c341e07b6e2
Following up on setting max-width, this actually should be strict
width for the moment (until we decide on more responsive design)
since without restricting width, the notification view becomes really
thin and compact if the list contains notifications that have short
titles and descriptions.
Bug: T138433
Change-Id: Ia663f7968033b01f3553a326f70736cc6a6a54a9
This is to make sure that concatenation of text inside items works
properly given CSS table-layout.
Bug: T138433
Change-Id: Iae32cbf82cdb91880c7ccd7df14d167eb75527cf
This rule ensures that long human-readable wiki names
don't cause horizontal scroll bars in the notifications
popup.
Change-Id: Id0c954d2059aeed875fa2eea7a45537aac4e2e58
The bounding box of where this cursor effect is applied isn't
quite the same as with bundled notifications (which in turn isn't
the same as with normal notifications), but to fix that we need
to normalize the DOM structures of the three types. They
currently differ in the presence/absence of the <a> wrapper
and in how padding and margins are used.
Bug: T138913
Change-Id: I1ed32e0a9deca62b68d08acd0699431ddda8ca44
Also add border-box to prevent the circle from appearing
to grow when a border appears.
Bug: T126214
Change-Id: Id5e89ff87759c4ae44851d5ad3061230a0e59ff0
Add a sidebar with cross-wiki sources and pages of unread notifications.
The filter allows the user to fetch notifications from a foreign source
and specific pages if those exist.
Bug: T129366
Change-Id: I57d827a47f80274d75364c2099a9624049a26834
Allow for mark read and mark unread through the side button, and
change its style according to spec in the ticket.
Bug: T126214
Change-Id: I78a93c0545bbe2d7c11a0c62557cd2e97e9d3866
The "Mark all as read" button had margins that made it just a little
bit taller than the header would otherwise be. This pushed the
bottom border of the header and the top border of the first notification
away from each other.
We only need top and right margins on this button, so drop the
bottom and left margins.
Bug: T137778
Change-Id: I8d47d84c79cbdad707b8cbaa8d43187c054755b3
Add a pagination widget with events and separate the logic for
organization. Let the widget listen to events from the pagination
model so it always keeps itself updated.
Change-Id: Id1df112cbb0d90195217e88fbee97a59170b99c5
The items should resemble the popup items, but the styles clashed
with the popup's cross-wiki notification item, so the image size
was smaller and the border was incomplete.
Bug: T136572
Change-Id: I3c3f825d469ccee1e711da21f627eeb9491e9480
Change the pending element to be the notifications list rather than
the whole inbox widget in the Special:Notifications page.
Bug: T136581
Change-Id: I82b073c9cd628f30c13305510d6604e3ef636c2a
* Use `margin: A` with `padding: B` rather than `padding: calc(A + B)`.
* Remove a `display: inline-block` which necessitated `width: 100%`.
I think this results in the same rendering, but please test carefully,
as I didn't check it for all the possible notifications.
(There is one more calc() in mw.echo.badge.less that can't be avoided.)
Bug: T135936
Change-Id: Ic01f16c8469c3b9d45d2885108ec6260e967731a
Allow for the widget to have a mark-as-read button to its individual
groups, as well as change the event listening from 'remove' to 'discard'
The problem with 'remove' event is that it is triggered when an item
is either intentionally removed from the list *and* when an item is
changing its position in the list (move event includes 'remove' and
then 'add' event)
If we listen to 'remove' events we will get both cases, which is
unhelpful. Instead, a new event - 'discard' - was introduced so
we are certain it is used with the clear intention of removing the
item completely.
Change-Id: Ia08720bf4c547fa41edf62331eeb1a45ff4965b7
We have to make sure that any notifications wrapper has the css
term overflow-y: auto; so that the popup menus behave properly.
Change-Id: I14a1a9f1c3610ef27fe04aa4b1e7197c08d1dfd4
Changing the way Echo's front-end architecture works to work with
model-view-controller methodology.
Change-Id: I97862402c41bc04dd41cd08d79f19ff677340249
