1
0
Fork 0
mirror of https://we.phorge.it/source/phorge.git synced 2024-11-23 15:22:41 +01:00
phorge-phorge/webroot/rsrc/css/application/base/notification-menu.css
Chad Little 801607381d [Redesign] PhabricatorApplicationSearchResultView
Summary: Ref T8099. This adds a new class which all search engines return for layout. I thought about this a number of ways, and I think this is the cleanest path. Each Engine can return whatever UI bits they needs, and AppSearch or Dashboard picks and lays the bits out as needed. In the AppSearch case, interfaces like Notifications, Calendar, Legalpad all need more custom layouts. I think this also leaves a resonable path forward for NUX as well. Also, not sure I implemented the class correctly, but assume thats easy to fix?

Test Plan: Review and do a search in each application changed. Grep for all call sites.

Reviewers: btrahan, epriestley

Reviewed By: epriestley

Subscribers: epriestley, Korvin

Maniphest Tasks: T8099

Differential Revision: https://secure.phabricator.com/D13332
2015-06-19 11:46:20 +01:00

130 lines
2.7 KiB
CSS

/**
* @provides phabricator-notification-menu-css
*/
.phabricator-notification-menu {
background: #fff;
font-size: 11px;
word-wrap: break-word;
overflow-y: auto;
box-shadow: {$dropshadow};
border: 1px solid {$blueborder};
border-radius: 3px;
}
.phabricator-notification .phabricator-notification-date {
margin-left: 8px;
color: {$lightgreytext};
}
.phabricator-notification-menu-loading {
text-align: center;
padding: 10px 0;
color: {$lightgreytext};
}
.device-desktop .phabricator-notification-menu,
.device-tablet .phabricator-notification-menu {
position: absolute;
width: 360px;
top: 42px;
}
.device-phone .phabricator-notification-menu {
border-bottom: 1px solid {$thinblueborder};
width: 94%;
max-width: 390px;
top: 42px !important;
left: 3% !important;
position: absolute;
}
.phabricator-notification-list.pm {
padding: 0;
}
.phabricator-notification-list .phabricator-notification {
padding: 10px 4px;
}
.phabricator-notification {
padding: 6px 8px;
}
.phabricator-notification-menu .phabricator-notification {
cursor: pointer;
}
.device-desktop .phabricator-notification-menu .phabricator-notification:hover {
background: {$hoverblue};
}
.device-desktop .phabricator-notification-menu
.phabricator-notification-unread.phabricator-notification:hover {
background: {$hoverselectedblue};
}
.phabricator-notification + .phabricator-notification {
border-top: 1px solid {$hoverborder};
}
.no-notifications {
color: {$lightgreytext};
}
.phabricator-notification-list .phabricator-notification-unread,
.phabricator-notification-menu .phabricator-notification-unread {
background: {$hoverblue};
}
.phabricator-notification-header {
font-weight: bold;
padding: 10px 8px;
font-size: 12px;
border-bottom: 1px solid {$thinblueborder};
}
.phabricator-notification-header a {
color: {$darkgreytext};
}
.phabricator-notification-header a:hover {
text-decoration: underline;
}
.phabricator-notification-header .phabricator-notification-clear-all {
color: {$anchor};
float: right;
font-weight: normal;
}
.phabricator-notification-footer {
background: {$greybackground};
border-top: 1px solid {$thinblueborder};
border-bottom-left-radius: 3px;
border-bottom-right-radius: 3px;
padding: 8px;
font-size: 12px;
color: {$darkgreytext};
}
.phabricator-notification-footer a {
color: {$darkgreytext};
}
.phabricator-notification-footer a:hover {
text-decoration: underline;
}
.phabricator-notification-menu .aphlict-connection-status {
color: {$lightgreytext};
}
.aphlict-connection-status .aphlict-connection-status-connected {
color: {$green};
}
.aphlict-connection-status .aphlict-connection-status-error {
color: {$red};
}