Bug 798124 - Chatbox titlebar and chat menubutton UI cleanup. :mixedpuppy also contributed to the patch. r=felipe

--HG--
extra : rebase_source : 7354b7f189d98d71ae5f04cad901922cf041c506
This commit is contained in:
Jared Wein 2012-10-05 17:57:53 -07:00
parent 9091ebeeb6
commit 7442982b44
3 changed files with 57 additions and 16 deletions

View File

@ -2734,6 +2734,7 @@ html|*#gcli-output-frame {
.chat-titlebar {
background-color: #d9d9d9;
background-image: linear-gradient(@toolbarHighlight@, rgba(255,255,255,0));
height: 20px;
min-height: 20px;
width: 100%;
@ -2754,7 +2755,10 @@ html|*#gcli-output-frame {
}
.chat-titlebar[activity] {
background-color: #ceeaff;
background-image: radial-gradient(ellipse closest-side at center, rgb(255,255,255), rgba(255,255,255,0));
background-repeat: no-repeat;
background-size: 100% 20px;
background-position: 0 -10px;
}
.chat-frame {
@ -2764,6 +2768,7 @@ html|*#gcli-output-frame {
}
.chatbar-button {
-moz-appearance: none;
background-color: #d9d9d9;
list-style-image: url("chrome://browser/skin/social/social.png");
border: none;
@ -2775,8 +2780,16 @@ html|*#gcli-output-frame {
-moz-border-end: 1px solid #ccc;
}
.chatbar-button[open="true"],
.chatbar-button:active:hover {
.chatbar-button > .toolbarbutton-icon {
opacity: .6;
-moz-margin-end: 0;
}
.chatbar-button:hover > .toolbarbutton-icon,
.chatbar-button[open="true"] > .toolbarbutton-icon {
opacity: 1;
}
.chatbar-button[open="true"] {
background-color: #f0f0f0;
box-shadow: inset 0 2px 5px rgba(0,0,0,0.6), 0 1px rgba(255,255,255,0.2);
}
@ -2787,7 +2800,7 @@ html|*#gcli-output-frame {
}
.chatbar-button[activity] {
background-color: #ceeaff;
background-image: radial-gradient(circle farthest-corner at center 3px, rgb(233,242,252) 3%, rgba(172,206,255,0.75) 40%, rgba(87,151,201,0.5) 80%, rgba(87,151,201,0));
}
.chatbar-button > menupopup > menuitem[activity] {
@ -2811,6 +2824,8 @@ chatbox {
background-color: white;
border: 1px solid #ccc;
border-bottom: none;
border-top-left-radius: 2.5px;
border-top-right-radius: 2.5px;
}
chatbox[minimized="true"] {

View File

@ -4156,6 +4156,7 @@ html|*#gcli-output-frame {
.chat-titlebar {
background-color: #d9d9d9;
background-image: linear-gradient(rgba(255,255,255,.43), rgba(255,255,255,0));
height: 20px;
min-height: 20px;
width: 100%;
@ -4172,7 +4173,10 @@ html|*#gcli-output-frame {
}
.chat-titlebar[activity] {
background-color: #ceeaff;
background-image: radial-gradient(ellipse closest-side at center, rgb(255,255,255), rgba(255,255,255,0));
background-repeat: no-repeat;
background-size: 100% 20px;
background-position: 0 -10px;
}
.chat-titlebar[selected] {
@ -4197,8 +4201,15 @@ html|*#gcli-output-frame {
-moz-border-end: 1px solid #ccc;
}
.chatbar-button[open="true"],
.chatbar-button:active:hover {
.chatbar-button > .toolbarbutton-icon {
opacity: .6;
}
.chatbar-button:hover > .toolbarbutton-icon,
.chatbar-button[open="true"] > .toolbarbutton-icon {
opacity: 1;
}
.chatbar-button[open="true"] {
background-color: #f0f0f0;
box-shadow: inset 0 2px 5px rgba(0,0,0,0.6), 0 1px rgba(255,255,255,0.2);
}
@ -4209,7 +4220,7 @@ html|*#gcli-output-frame {
}
.chatbar-button[activity] {
background-color: #ceeaff;
background-image: radial-gradient(circle farthest-corner at center 2px, rgb(254,254,255) 3%, rgba(210,235,255,0.9) 12%, rgba(148,205,253,0.6) 30%, rgba(148,205,253,0.2) 70%);
}
.chatbar-button > menupopup > menuitem[activity] {
@ -4218,7 +4229,7 @@ html|*#gcli-output-frame {
.chatbar-innerbox {
background: transparent;
margin: -285px -1px 0 -1px;
margin: -285px 0 0;
overflow: hidden;
}
@ -4233,6 +4244,8 @@ chatbox {
background-color: white;
border: 1px solid #ccc;
border-bottom: none;
border-top-left-radius: @toolbarbuttonCornerRadius@;
border-top-right-radius: @toolbarbuttonCornerRadius@;
}
chatbox[minimized="true"] {

View File

@ -3438,6 +3438,7 @@ html|*#gcli-output-frame {
.chat-titlebar {
background-color: #c4cfde;
background-image: linear-gradient(rgba(255,255,255,.5), rgba(255,255,255,0));
height: 20px;
min-height: 20px;
width: 100%;
@ -3458,7 +3459,10 @@ html|*#gcli-output-frame {
}
.chat-titlebar[activity] {
background-color: #ceeaff;
background-image: radial-gradient(ellipse closest-side at center, rgb(255,255,255), rgba(255,255,255,0));
background-repeat: no-repeat;
background-size: 100% 20px;
background-position: 0 -10px;
}
.chat-frame {
@ -3487,9 +3491,16 @@ html|*#gcli-output-frame {
padding: 2px;
}
.chatbar-button[open="true"],
.chatbar-button:hover,
.chatbar-button:active:hover {
.chatbar-button > .toolbarbutton-icon {
opacity: .6;
-moz-margin-end: 0;
}
.chatbar-button:hover > .toolbarbutton-icon,
.chatbar-button[open="true"] > .toolbarbutton-icon {
opacity: 1;
}
.chatbar-button[open="true"] {
background-color: #dae3f0;
box-shadow: inset 0 2px 5px rgba(0,0,0,0.6), 0 1px rgba(255,255,255,0.2);
}
@ -3499,8 +3510,8 @@ html|*#gcli-output-frame {
display: none;
}
.chatbar-button[activity] {
background-color: #ceeaff;
.chatbar-button[activity]:not([open="true"]) {
background-image: radial-gradient(circle farthest-corner at center 3px, rgb(255,255,255) 3%, rgba(186,221,251,0.75) 40%, rgba(127,179,255,0.5) 80%, rgba(127,179,255,0.25));
}
.chatbar-button > menupopup > menuitem[activity] {
@ -3509,7 +3520,7 @@ html|*#gcli-output-frame {
.chatbar-innerbox {
background: transparent;
margin: -285px -1px 0 -1px;
margin: -285px 0 0;
overflow: hidden;
}
@ -3524,6 +3535,8 @@ chatbox {
background-color: white;
border: 1px solid #ccc;
border-bottom: none;
border-top-left-radius: 2.5px;
border-top-right-radius: 2.5px;
}
chatbox[minimized="true"] {