isa/gnome-shell
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Update the look of various message tray components

Browse Source 
The following changes make message tray look more polished:
 - all notifications are now same width (no min and max width)
 - there is an equal padding all around the notification (which resulted in
   the increased tray height)
 - action buttons are now nicely styled
 - chat text box glows when focused (nevermind the unfocused look because
   we'll soon always have it focused when it is showing)
 - chat text has padding on the left and rounded background
 - summary source buttons no longer have a border

https://bugzilla.gnome.org/show_bug.cgi?id=624584
This commit is contained in:
Marina Zhurakhinskaya 2010-07-21 02:41:45 -04:00
parent 65991cc057
commit 6eb90434f0
1 changed files with 41 additions and 31 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

72
data/theme/gnome-shell.css
View File

@ -807,7 +807,7 @@ StTooltip {
background-gradient-direction: vertical;
background-gradient-start: rgba(0,0,0,0.01);
background-gradient-end: rgba(0,0,0,0.95);
height: 28px;
height: 36px;
}
#notification {
@ -815,15 +815,15 @@ StTooltip {
border-radius: 5px 5px 0px 0px;
background: rgba(0,0,0,0.9);
color: white;
padding: 2px 10px 10px 10px;
spacing-rows: 5px;
padding: 8px 8px 8px 8px;
spacing-rows: 10px;
spacing-columns: 10px;
max-width: 40em;
width: 34em;
}
#summary-notification-bin #notification {
/* message-tray.height + notification.padding-bottom */
padding-bottom: 38px;
padding-bottom: 44px;
}
#notification-scrollview {
@ -843,21 +843,19 @@ StTooltip {
}
.notification-button {
border: 2px rgba(0,0,0,0.0);
border-radius: 5px;
padding: 5px;
background: #c0c0c0;
color: black;
font-weight: bold;
background-color: #3c3c3c;
padding: 2px 14px;
border-radius: 12px;
border: 1px solid #181818;
}
.notification-button:hover {
border: 2px solid white;
border: 1px solid #a1a1a1;
}
.notification-button:active {
border: 2px solid white;
background: #808080;
border: 1px solid #a1a1a1;
background-color: #2b2b2b;
}
.notification-icon-button {
@ -865,6 +863,7 @@ StTooltip {
border-radius: 5px;
padding: 5px;
}
.notification-icon-button:hover {
background: rgba(192,192,192,0.7);
}
@ -875,20 +874,39 @@ StTooltip {
.chat-received {
background-gradient-direction: horizontal;
background-gradient-start: #606060;
background-gradient-end: #000000;
background-gradient-start: rgba(255, 255, 255, 0.2);
background-gradient-end: rgba(255, 255, 255, 0);
min-width: 20em;
padding-left: 4px;
border-radius: 4px;
}
.chat-sent {
background-gradient-direction: horizontal;
background-gradient-start: #000000;
background-gradient-end: #606060;
background-gradient-start: rgba(255, 255, 255, 0);
background-gradient-end: rgba(255, 255, 255, 0.2);
padding-left: 4px;
border-radius: 4px;
}
.chat-response {
border: 1px solid white;
padding: 4px;
border-radius: 4px;
border: 1px solid #565656;
color: #a8a8a8;
background-color: #404040;
caret-color: #ffffff;
caret-size: 1px;
height: 18px;
}
.chat-response:focus {
border: 1px solid #3a3a3a;
color: #545454;
background-color: #e8e8e8;
caret-color: #545454;
-st-shadow: 0px 0px 6px 2px rgba(255,255,255,0.9);
}
/* The spacing and padding on the summary is tricky; we want to keep
@ -905,17 +923,9 @@ StTooltip {
* pseudo-class we could fix that...
*/
#summary-mode {
spacing: 4px;
padding: 2px 0px 0px 4px;
}
.summary-source-button {
padding: 0px 2px 0px 2px;
border: 1px solid transparent;
}
.summary-source-button:hover {
border: 1px solid #ffffff;
spacing: 6px;
padding: 2px 12px 0px 4px;
height: 36px;
}
.summary-source {