1
0
Fork 0
mirror of https://we.phorge.it/source/phorge.git synced 2024-12-29 17:00:59 +01:00
phorge-phorge/webroot/rsrc/css/aphront/notification.css
Chad Little ed75250f1a Update notification UI a little
Summary: Fixes T8944. Adds a small dot if notification is new along with color. Goes away when clicked. Increased font and padding for readability.

Test Plan: Send notifications from test account, review them in menu, application search, and in real-time display.

Reviewers: epriestley

Reviewed By: epriestley

Spies: Korvin

Maniphest Tasks: T8944

Differential Revision: https://secure.phabricator.com/D18485
2017-08-28 14:52:52 -07:00

62 lines
1 KiB
CSS

/**
* @provides phabricator-notification-css
*/
.jx-notification-container {
position: fixed;
bottom: 24px;
left: 24px;
}
.jx-notification {
width: 240px;
padding: 8px 12px;
font-size: 11px;
overflow: hidden;
background: {$lightsky};
color: {$darkgreytext};
border: 1px solid {$sky};
cursor: pointer;
border-radius: 3px;
box-shadow: 0px 1px 2px rgba({$alphablack}, 0.25);
margin-top: 4px;
}
.jx-notification-alert {
background: {$lightyellow};
border: 1px solid {$yellow};
}
.jx-notification-debug {
background: {$lightindigo};
border: 1px solid {$indigo};
}
.jx-notification-done {
background: {$lightgreen};
border: 1px solid {$green};
}
.jx-notification-error {
background: {$lightred};
border: 1px solid {$red};
}
.jx-notification-security {
background: {$lightviolet};
border: 1px solid {$violet};
}
.jx-notification-read-only {
background: {$greybackground};
border: 1px solid {$darkgreyborder};
}
.jx-notification-container .phabricator-notification {
padding: 0;
}