mirror of
https://gitlab.winehq.org/wine/wine-gecko.git
synced 2024-09-13 09:24:08 -07:00
Bug 1055239 - SVG icons and theming for SocialAPI/Loop. r=MattN
This commit is contained in:
parent
90719c0a10
commit
5e1045fae0
@ -137,7 +137,9 @@
|
||||
<method name="swapDocShells">
|
||||
<parameter name="aTarget"/>
|
||||
<body><![CDATA[
|
||||
aTarget.setAttribute('label', this.contentDocument.title);
|
||||
aTarget.setAttribute("label", this.contentDocument.title);
|
||||
if (this.getAttribute("dark") == "true")
|
||||
aTarget.setAttribute("dark", "true");
|
||||
aTarget.src = this.src;
|
||||
aTarget.content.setAttribute("origin", this.content.getAttribute("origin"));
|
||||
aTarget.content.popupnotificationanchor.className = this.content.popupnotificationanchor.className;
|
||||
|
@ -454,6 +454,8 @@ let MozLoopServiceInternal = {
|
||||
return;
|
||||
}
|
||||
|
||||
chatbox.setAttribute("dark", true);
|
||||
|
||||
chatbox.addEventListener("DOMContentLoaded", function loaded(event) {
|
||||
if (event.target != chatbox.contentDocument) {
|
||||
return;
|
||||
|
@ -156,7 +156,7 @@ browser.jar:
|
||||
skin/classic/browser/social/services-64.png (social/services-64.png)
|
||||
skin/classic/browser/social/share-button.png (social/share-button.png)
|
||||
skin/classic/browser/social/share-button-active.png (social/share-button-active.png)
|
||||
skin/classic/browser/social/chat-icons.png (social/chat-icons.png)
|
||||
skin/classic/browser/social/chat-icons.svg (../shared/social/chat-icons.svg)
|
||||
skin/classic/browser/social/gear_default.png (../shared/social/gear_default.png)
|
||||
skin/classic/browser/social/gear_clicked.png (../shared/social/gear_clicked.png)
|
||||
skin/classic/browser/tabbrowser/alltabs.png (tabbrowser/alltabs.png)
|
||||
|
Binary file not shown.
Before Width: | Height: | Size: 4.3 KiB |
@ -260,8 +260,7 @@ browser.jar:
|
||||
skin/classic/browser/social/services-16@2x.png (social/services-16@2x.png)
|
||||
skin/classic/browser/social/services-64.png (social/services-64.png)
|
||||
skin/classic/browser/social/services-64@2x.png (social/services-64@2x.png)
|
||||
skin/classic/browser/social/chat-icons.png (social/chat-icons.png)
|
||||
skin/classic/browser/social/chat-icons@2x.png (social/chat-icons@2x.png)
|
||||
skin/classic/browser/social/chat-icons.svg (../shared/social/chat-icons.svg)
|
||||
skin/classic/browser/social/gear_default.png (../shared/social/gear_default.png)
|
||||
skin/classic/browser/social/gear_clicked.png (../shared/social/gear_clicked.png)
|
||||
skin/classic/browser/tabbrowser/alltabs-box-bkgnd-icon.png (tabbrowser/alltabs-box-bkgnd-icon.png)
|
||||
|
Binary file not shown.
Before Width: | Height: | Size: 4.3 KiB |
Binary file not shown.
Before Width: | Height: | Size: 7.4 KiB |
45
browser/themes/shared/social/chat-icons.svg
Normal file
45
browser/themes/shared/social/chat-icons.svg
Normal file
@ -0,0 +1,45 @@
|
||||
<?xml version="1.0"?>
|
||||
<!-- This Source Code Form is subject to the terms of the Mozilla Public
|
||||
- License, v. 2.0. If a copy of the MPL was not distributed with this
|
||||
- file, You can obtain one at http://mozilla.org/MPL/2.0/. -->
|
||||
<svg xmlns="http://www.w3.org/2000/svg"
|
||||
xmlns:xlink="http://www.w3.org/1999/xlink"
|
||||
x="0px" y="0px"
|
||||
viewBox="-3 -3 16 16"
|
||||
enable-background="new 0 0 16 16"
|
||||
xml:space="preserve">
|
||||
<style>
|
||||
use:not(:target) {
|
||||
display: none;
|
||||
}
|
||||
|
||||
use {
|
||||
fill: #c1c1c1;
|
||||
}
|
||||
|
||||
use[id$="-active"] {
|
||||
fill: #c1c1c1;
|
||||
}
|
||||
|
||||
use[id$="-disabled"] {
|
||||
fill: #c1c1c1;
|
||||
}
|
||||
</style>
|
||||
<defs>
|
||||
<polygon id="close-shape" fill-rule="evenodd" clip-rule="evenodd" points="10,1.717 8.336,0.049 5.024,3.369 1.663,0 0,1.668
|
||||
3.36,5.037 0.098,8.307 1.762,9.975 5.025,6.705 8.311,10 9.975,8.332 6.688,5.037"/>
|
||||
<path id="dropdown-shape" fill-rule="evenodd" clip-rule="evenodd" d="M9,3L4.984,7L1,3H9z"/>
|
||||
<polygon id="expand-shape" fill-rule="evenodd" clip-rule="evenodd" points="10,0 4.838,0 6.506,1.669 0,8.175 1.825,10 8.331,3.494
|
||||
10,5.162"/>
|
||||
<rect id="minimize-shape" y="3.6" fill-rule="evenodd" clip-rule="evenodd" width="10" height="2.8"/>
|
||||
</defs>
|
||||
<use id="close" xlink:href="#close-shape"/>
|
||||
<use id="close-active" xlink:href="#close-shape"/>
|
||||
<use id="close-disabled" xlink:href="#close-shape"/>
|
||||
<use id="expand" xlink:href="#expand-shape"/>
|
||||
<use id="expand-active" xlink:href="#expand-shape"/>
|
||||
<use id="expand-disabled" xlink:href="#expand-shape"/>
|
||||
<use id="minimize" xlink:href="#minimize-shape"/>
|
||||
<use id="minimize-active" xlink:href="#minimize-shape"/>
|
||||
<use id="minimize-disabled" xlink:href="#minimize-shape"/>
|
||||
</svg>
|
After Width: | Height: | Size: 1.7 KiB |
@ -47,10 +47,17 @@
|
||||
.chat-toolbarbutton {
|
||||
-moz-appearance: none;
|
||||
border: none;
|
||||
padding: 0;
|
||||
padding: 0 3px;
|
||||
margin: 0;
|
||||
background: none;
|
||||
width: 16px;
|
||||
}
|
||||
|
||||
.chat-toolbarbutton:hover {
|
||||
background-color: rgba(255,255,255,.35);
|
||||
}
|
||||
|
||||
.chat-toolbarbutton:hover:active {
|
||||
background-color: rgba(255,255,255,.5);
|
||||
}
|
||||
|
||||
.chat-toolbarbutton > .toolbarbutton-text {
|
||||
@ -58,113 +65,37 @@
|
||||
}
|
||||
|
||||
.chat-toolbarbutton > .toolbarbutton-icon {
|
||||
width: inherit;
|
||||
width: 16px;
|
||||
height: 16px;
|
||||
}
|
||||
|
||||
.chat-close-button {
|
||||
list-style-image: url('chrome://browser/skin/social/chat-icons.png');
|
||||
-moz-image-region: rect(0, 16px, 16px, 0);
|
||||
list-style-image: url("chrome://browser/skin/social/chat-icons.svg#close");
|
||||
}
|
||||
|
||||
.chat-close-button:hover {
|
||||
-moz-image-region: rect(0, 32px, 16px, 16px);
|
||||
}
|
||||
|
||||
.chat-close-button:hover:active {
|
||||
-moz-image-region: rect(0, 48px, 16px, 32px);
|
||||
.chat-close-button:-moz-any(:hover,:hover:active) {
|
||||
list-style-image: url("chrome://browser/skin/social/chat-icons.svg#close-active");
|
||||
}
|
||||
|
||||
.chat-minimize-button {
|
||||
list-style-image: url('chrome://browser/skin/social/chat-icons.png');
|
||||
-moz-image-region: rect(16px, 16px, 32px, 0);
|
||||
list-style-image: url("chrome://browser/skin/social/chat-icons.svg#minimize");
|
||||
}
|
||||
|
||||
.chat-minimize-button:hover {
|
||||
-moz-image-region: rect(16px, 32px, 32px, 16px);
|
||||
}
|
||||
|
||||
.chat-minimize-button:hover:active {
|
||||
-moz-image-region: rect(16px, 48px, 32px, 32px);
|
||||
.chat-minimize-button:-moz-any(:hover,:hover:active) {
|
||||
list-style-image: url("chrome://browser/skin/social/chat-icons.svg#minimize-active");
|
||||
}
|
||||
|
||||
.chat-swap-button {
|
||||
list-style-image: url('chrome://browser/skin/social/chat-icons.png');
|
||||
-moz-image-region: rect(48px, 16px, 64px, 0);
|
||||
list-style-image: url("chrome://browser/skin/social/chat-icons.svg#expand");
|
||||
transform: rotate(180deg);
|
||||
}
|
||||
|
||||
.chat-swap-button:hover {
|
||||
-moz-image-region: rect(48px, 32px, 64px, 16px);
|
||||
}
|
||||
|
||||
.chat-swap-button:hover:active {
|
||||
-moz-image-region: rect(48px, 48px, 64px, 32px);
|
||||
.chat-swap-button:-moz-any(:hover,:hover:active) {
|
||||
list-style-image: url("chrome://browser/skin/social/chat-icons.svg#expand-active");
|
||||
}
|
||||
|
||||
chatbar > chatbox > .chat-titlebar > .chat-swap-button {
|
||||
list-style-image: url('chrome://browser/skin/social/chat-icons.png');
|
||||
-moz-image-region: rect(32px, 16px, 48px, 0);
|
||||
}
|
||||
|
||||
chatbar > chatbox > .chat-titlebar > .chat-swap-button:hover {
|
||||
-moz-image-region: rect(32px, 32px, 48px, 16px);
|
||||
}
|
||||
|
||||
chatbar > chatbox > .chat-titlebar > .chat-swap-button:hover:active {
|
||||
-moz-image-region: rect(32px, 48px, 48px, 32px);
|
||||
}
|
||||
|
||||
@media (min-resolution: 2dppx) {
|
||||
.chat-close-button {
|
||||
list-style-image: url('chrome://browser/skin/social/chat-icons@2x.png');
|
||||
-moz-image-region: rect(0, 32px, 32px, 0);
|
||||
}
|
||||
|
||||
.chat-close-button:hover {
|
||||
-moz-image-region: rect(0, 64px, 32px, 32px);
|
||||
}
|
||||
|
||||
.chat-close-button:hover:active {
|
||||
-moz-image-region: rect(0, 96px, 32px, 64px);
|
||||
}
|
||||
|
||||
.chat-minimize-button {
|
||||
list-style-image: url('chrome://browser/skin/social/chat-icons@2x.png');
|
||||
-moz-image-region: rect(32px, 32px, 64px, 0);
|
||||
}
|
||||
|
||||
.chat-minimize-button:hover {
|
||||
-moz-image-region: rect(32px, 64px, 64px, 32px);
|
||||
}
|
||||
|
||||
.chat-minimize-button:hover:active {
|
||||
-moz-image-region: rect(32px, 96px, 64px, 64px);
|
||||
}
|
||||
|
||||
.chat-swap-button {
|
||||
list-style-image: url('chrome://browser/skin/social/chat-icons@2x.png');
|
||||
-moz-image-region: rect(96px, 32px, 128px, 0);
|
||||
}
|
||||
|
||||
.chat-swap-button:hover {
|
||||
-moz-image-region: rect(96px, 64px, 128px, 32px);
|
||||
}
|
||||
|
||||
.chat-swap-button:hover:active {
|
||||
-moz-image-region: rect(96px, 96px, 128px, 64px);
|
||||
}
|
||||
|
||||
chatbar > chatbox > .chat-titlebar > .chat-swap-button {
|
||||
list-style-image: url('chrome://browser/skin/social/chat-icons@2x.png');
|
||||
-moz-image-region: rect(64px, 32px, 96px, 0);
|
||||
}
|
||||
|
||||
chatbar > chatbox > .chat-titlebar > .chat-swap-button:hover {
|
||||
-moz-image-region: rect(64px, 64px, 96px, 32px);
|
||||
}
|
||||
|
||||
chatbar > chatbox > .chat-titlebar > .chat-swap-button:hover:active {
|
||||
-moz-image-region: rect(64px, 96px, 96px, 64px);
|
||||
}
|
||||
transform: none;
|
||||
}
|
||||
|
||||
.chat-title {
|
||||
@ -175,12 +106,11 @@ chatbar > chatbox > .chat-titlebar > .chat-swap-button:hover:active {
|
||||
}
|
||||
|
||||
.chat-titlebar {
|
||||
height: 20px;
|
||||
min-height: 20px;
|
||||
height: 30px;
|
||||
min-height: 30px;
|
||||
width: 100%;
|
||||
margin: 0;
|
||||
padding: 2px;
|
||||
-moz-padding-start: 6px;
|
||||
padding: 7px 6px;
|
||||
border: none;
|
||||
border-bottom: 1px solid #ccc;
|
||||
cursor: pointer;
|
||||
@ -202,6 +132,18 @@ chatbar > chatbox > .chat-titlebar > .chat-swap-button:hover:active {
|
||||
background-position: 0 -10px;
|
||||
}
|
||||
|
||||
chatbox[dark=true] > .chat-titlebar,
|
||||
chatbox[dark=true] > .chat-titlebar[selected] {
|
||||
border-bottom: none;
|
||||
background-color: #000;
|
||||
background-image: none;
|
||||
}
|
||||
|
||||
chatbox[dark=true] > .chat-titlebar > hbox > .chat-title {
|
||||
font-weight: normal;
|
||||
color: #c1c1c1;
|
||||
}
|
||||
|
||||
.chat-frame {
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
|
@ -182,7 +182,7 @@ browser.jar:
|
||||
skin/classic/browser/preferences/aboutPermissions.css (preferences/aboutPermissions.css)
|
||||
skin/classic/browser/social/services-16.png (social/services-16.png)
|
||||
skin/classic/browser/social/services-64.png (social/services-64.png)
|
||||
skin/classic/browser/social/chat-icons.png (social/chat-icons.png)
|
||||
skin/classic/browser/social/chat-icons.svg (../shared/social/chat-icons.svg)
|
||||
skin/classic/browser/social/gear_default.png (../shared/social/gear_default.png)
|
||||
skin/classic/browser/social/gear_clicked.png (../shared/social/gear_clicked.png)
|
||||
skin/classic/browser/tabbrowser/newtab.png (tabbrowser/newtab.png)
|
||||
@ -601,7 +601,7 @@ browser.jar:
|
||||
skin/classic/aero/browser/preferences/aboutPermissions.css (preferences/aboutPermissions.css)
|
||||
skin/classic/aero/browser/social/services-16.png (social/services-16.png)
|
||||
skin/classic/aero/browser/social/services-64.png (social/services-64.png)
|
||||
skin/classic/aero/browser/social/chat-icons.png (social/chat-icons.png)
|
||||
skin/classic/aero/browser/social/chat-icons.svg (../shared/social/chat-icons.svg)
|
||||
skin/classic/aero/browser/social/gear_default.png (../shared/social/gear_default.png)
|
||||
skin/classic/aero/browser/social/gear_clicked.png (../shared/social/gear_clicked.png)
|
||||
skin/classic/aero/browser/tabbrowser/newtab.png (tabbrowser/newtab.png)
|
||||
|
Binary file not shown.
Before Width: | Height: | Size: 4.3 KiB |
Loading…
Reference in New Issue
Block a user