X-Git-Url: https://git-public.kairo.at/?p=themes.git;a=blobdiff_plain;f=LCARStrek%2Fbrowser%2Fbrowser.css;h=cfc77afdd255cd409d1d3bae714d0119f22a43e0;hp=5be039e47d22a6b396d73154fe7f96eae0f022c3;hb=36759a51bcc412b1c08d2cad716a8898243c404c;hpb=e9c7359024773e51a001bef9c0ab3ac94fd60675 diff --git a/LCARStrek/browser/browser.css b/LCARStrek/browser/browser.css index 5be039e4..cfc77afd 100644 --- a/LCARStrek/browser/browser.css +++ b/LCARStrek/browser/browser.css @@ -30,7 +30,7 @@ menubar { /* ::::: primary toolbar ::::: */ .toolbar-primary > .toolbar-box > .toolbar-holder { - background-color: #FF9F00; + background-color: #A09090; } .toolbar-primary > .toolbar-box > .toolbar-startcap, @@ -643,7 +643,7 @@ toolbar[mode="full"] .toolbarbutton-1 > .toolbarbutton-menubutton-button { #back-button:-moz-locale-dir(rtl) > .toolbarbutton-icon, #forward-button:-moz-locale-dir(rtl), #forward-button:-moz-locale-dir(rtl) > .toolbarbutton-text { - -moz-transform: scaleX(-1); + transform: scaleX(-1); } #nav-bar #back-button { @@ -776,7 +776,7 @@ window:not([chromehidden~=toolbar]) #navigator-toolbox[iconsize=large][mode=icon window:not([chromehidden~=toolbar]) #navigator-toolbox[iconsize=large][mode=icons] > :-moz-any(#nav-bar[currentset*="unified-back-forward-button,urlbar-container"],#nav-bar:not([currentset])) > #unified-back-forward-button:not([switchingtabs]) > #forward-button { - -moz-transition: opacity 150ms ease-out; + transition: opacity 150ms ease-out; } window:not([chromehidden~=toolbar]) #navigator-toolbox[iconsize=large][mode=icons] > @@ -897,6 +897,10 @@ window:not([chromehidden~=toolbar]) #navigator-toolbox[iconsize=large][mode=icon -moz-image-region: rect(36px, 108px, 54px, 90px); } +#downloads-button > .toolbarbutton-icon { + margin: 0; +} + /* history sidebar button */ #history-button { @@ -958,12 +962,12 @@ window:not([chromehidden~=toolbar]) #navigator-toolbox[iconsize=large][mode=icon -moz-image-region: rect(0, 180px, 18px, 162px); } -#print-button:not([disabled="true"]):hover { - -moz-image-region: rect(18px, 162px, 36px, 144px); +#new-tab-button:not([disabled="true"]):hover { + -moz-image-region: rect(18px, 180px, 36px, 162px); } -#print-button[disabled="true"] { - -moz-image-region: rect(36px, 162px, 54px, 144px); +#new-tab-button[disabled="true"] { + -moz-image-region: rect(36px, 180px, 54px, 162px); } /* new window button */ @@ -1136,7 +1140,6 @@ window:not([chromehidden~=toolbar]) #navigator-toolbox[iconsize=large][mode=icon #urlbar { width: 7em; - min-width: 7em; /* make color as light as possible to deal with dark non-domain parts */ color: #FFBFFF; } @@ -1168,7 +1171,7 @@ window:not([chromehidden~=toolbar]) #navigator-toolbox[iconsize=large][mode=icon window:not([chromehidden~=toolbar]) #navigator-toolbox[iconsize=large][mode=icons] > :-moz-any(#nav-bar[currentset*="unified-back-forward-button,urlbar-container"],#nav-bar:not([currentset])) > #unified-back-forward-button:not([switchingtabs]) + #urlbar-container > #urlbar { - -moz-transition: margin-left 150ms ease-out; + transition: margin-left 150ms ease-out; } window:not([chromehidden~=toolbar]) #navigator-toolbox[iconsize=large][mode=icons] > @@ -1195,7 +1198,7 @@ window:not([chromehidden~=toolbar]) #navigator-toolbox[iconsize=large][mode=icon :-moz-any(#nav-bar[currentset*="unified-back-forward-button,urlbar-container"],#nav-bar:not([currentset])) > #unified-back-forward-button[forwarddisabled]:hover:not([switchingtabs]) + #urlbar-container > #urlbar { /* delay the hiding of the forward button when hovered to avoid accidental clicks on the url bar */ - -moz-transition-delay: 100s; + transition-delay: 100s; } window:not([chromehidden~=toolbar]) #navigator-toolbox[iconsize=large][mode=icons] > @@ -1212,11 +1215,11 @@ window:not([chromehidden~=toolbar]) #navigator-toolbox[iconsize=large][mode=icon :-moz-any(#nav-bar[currentset*="unified-back-forward-button,urlbar-container"],#nav-bar:not([currentset])) > #unified-back-forward-button + #urlbar-container > #urlbar:-moz-locale-dir(rtl) { /* let winstripe-urlbar-back-button-clip-path clip the urlbar's right side for RTL */ - -moz-transform: scaleX(-1); + transform: scaleX(-1); } -html|*.urlbar-input:-moz-lwtheme:-moz-placeholder, -.searchbar-textbox:-moz-lwtheme > .autocomplete-textbox-container > .textbox-input-box > html|*.textbox-input:-moz-placeholder { +html|*.urlbar-input:-moz-lwtheme::-moz-placeholder, +.searchbar-textbox:-moz-lwtheme > .autocomplete-textbox-container > .textbox-input-box > html|*.textbox-input::-moz-placeholder { color: #E7ADE7; } @@ -1236,6 +1239,7 @@ html|*.urlbar-input:-moz-lwtheme:-moz-placeholder, .urlbar-input-box { -moz-margin-start: 0; + min-width: 4em; } #urlbar-icons { @@ -1243,7 +1247,7 @@ html|*.urlbar-input:-moz-lwtheme:-moz-placeholder, } .urlbar-icon { - padding: 2px; + padding: 0 2px; } .searchbar-engine-button, @@ -1313,21 +1317,21 @@ window:not([chromehidden~=toolbar]) #navigator-toolbox[iconsize=large][mode=icon :-moz-any(#nav-bar[currentset*="unified-back-forward-button,urlbar-container"],#nav-bar:not([currentset])) > #unified-back-forward-button[forwarddisabled] + #urlbar-container > #urlbar > #notification-popup-box[hidden] + #identity-box:-moz-locale-dir(ltr) { padding-left: 2px; - -moz-transition: padding-left; + transition: padding-left; } window:not([chromehidden~=toolbar]) #navigator-toolbox[iconsize=large][mode=icons] > :-moz-any(#nav-bar[currentset*="unified-back-forward-button,urlbar-container"],#nav-bar:not([currentset])) > #unified-back-forward-button[forwarddisabled] + #urlbar-container > #urlbar > #notification-popup-box[hidden] + #identity-box:-moz-locale-dir(rtl) { padding-right: 2px; - -moz-transition: padding-right; + transition: padding-right; } window:not([chromehidden~=toolbar]) #navigator-toolbox[iconsize=large][mode=icons] > :-moz-any(#nav-bar[currentset*="unified-back-forward-button,urlbar-container"],#nav-bar:not([currentset])) > #unified-back-forward-button[forwarddisabled]:hover:not([switchingtabs]) + #urlbar-container > #urlbar > #notification-popup-box[hidden] + #identity-box { /* forward button hiding is delayed when hovered */ - -moz-transition-delay: 100s; + transition-delay: 100s; } window:not([chromehidden~=toolbar]) #navigator-toolbox[iconsize=large][mode=icons] > @@ -1406,23 +1410,18 @@ window:not([chromehidden~=toolbar]) #navigator-toolbox[iconsize=large][mode=icon -moz-image-region: rect(0, 16px, 16px, 0); } -.verifiedDomain > #identity-box-inner > #page-proxy-stack > #page-proxy-favicon, .verifiedDomain > #page-proxy-favicon[pageproxystate="valid"] { list-style-image: url("chrome://browser/skin/identity-icons-https.png"); } -.verifiedIdentity > #identity-box-inner > #page-proxy-stack > #page-proxy-favicon, .verifiedIdentity > #page-proxy-favicon[pageproxystate="valid"] { list-style-image: url("chrome://browser/skin/identity-icons-https-ev.png"); } -#identity-box:hover > #identity-box-inner > #page-proxy-stack > #page-proxy-favicon, #identity-box:hover > #page-proxy-favicon { -moz-image-region: rect(0, 32px, 16px, 16px); } -#identity-box:hover:active > #identity-box-inner > #page-proxy-stack > #page-proxy-favicon, -#identity-box[open=true] > #identity-box-inner > #page-proxy-stack > #page-proxy-favicon, #identity-box:hover:active > #page-proxy-favicon, #identity-box[open=true] > #page-proxy-favicon { -moz-image-region: rect(0, 48px, 16px, 32px); @@ -1563,7 +1562,7 @@ richlistitem[type~="action"][actiontype="switchtab"][selected="true"] > .ac-url- #go-button:-moz-locale-dir(rtl) > .toolbarbutton-icon, #urlbar-go-button:-moz-locale-dir(rtl) > .toolbarbutton-icon { - -moz-transform: scaleX(-1); + transform: scaleX(-1); } #urlbar-go-button:hover, @@ -1604,6 +1603,50 @@ richlistitem[type~="action"][actiontype="switchtab"][selected="true"] > .ac-url- -moz-image-region: rect(0, 32px, 16px, 16px); } +/* social recommending panel */ + +#share-button { + -moz-image-region: rect(0, 16px, 16px, 0); +} + +#socialUserPortrait { + width: 48px; + height: 48px; +} + +#socialUserDisplayName, +#socialUserPortrait { + cursor: pointer; +} + +#socialUserDisplayName { + border: none; + background-color: transparent; + margin-top: 0; + padding-top: 0; + font-size: 130%; + font-weight: bold; +} + +#socialUserDisplayName > .button-box { + -moz-padding-start: 0; + padding-top: 0; + border-top-width: 0; +} + +#socialUserDisplayName:hover { + color: #9C9CFF; + text-decoration: underline; +} + +#unsharePopupText { + height: 48px; +} + +#unsharePopupBottomButtons { + margin-top: 1em; +} + /* star button */ #star-button { @@ -1659,9 +1702,9 @@ richlistitem[type~="action"][actiontype="switchtab"][selected="true"] > .ac-url- .panel-promo-box { margin: 5px -6px -6px; padding: 5px; + border-top: 1px solid #9C9CFF; border-bottom-left-radius: 5px; border-bottom-right-radius: 5px; - border-top: 1px solid #9C9CFF; } .panel-promo-icon { @@ -1708,12 +1751,12 @@ richlistitem[type~="action"][actiontype="switchtab"][selected="true"] > .ac-url- } #navigator-throbber[busy="true"] { - list-style-image: url("chrome://communicator/skin/brand/throbber16-anim.gif"); + list-style-image: url("chrome://communicator/skin/brand/throbber16-anim.png"); } #navigator-throbber, #wrapper-navigator-throbber > #navigator-throbber { - list-style-image: url("chrome://communicator/skin/brand/throbber16-single.gif"); + list-style-image: url("chrome://communicator/skin/brand/throbber16-single.png"); } /* Tabstrip */ @@ -1738,6 +1781,23 @@ richlistitem[type~="action"][actiontype="switchtab"][selected="true"] > .ac-url- margin-top: 0px; } +.tabbrowser-tab{ + padding: 1px 4px 2px; +} + +.tabbrowser-tab:first-of-type { + -moz-margin-start: 2px; +} + +.tabs-newtab-button { + border-radius: 8px 8px 0px 0px; + -moz-margin-start: 0; +} + +.tabs-newtab-button:not(:hover) { + background-color: #C09070; +} + .tabbrowser-tab:hover, .tabs-newtab-button:hover { } @@ -1774,7 +1834,7 @@ richlistitem[type~="action"][actiontype="switchtab"][selected="true"] > .ac-url- background-color: #E7ADE7; } .tabbrowser-tab[pinned][titlechanged]:not([selected="true"]):hover { - background-color: #0000FF; + background-color: #3333FF; color: #000000; } @@ -1788,15 +1848,11 @@ richlistitem[type~="action"][actiontype="switchtab"][selected="true"] > .ac-url- } .tab-throbber { - list-style-image: url("chrome://browser/skin/tabbrowser/connecting.png"); + list-style-image: url("chrome://communicator/skin/brand/throbber16-anim-connect.png"); } .tab-throbber[progress] { - list-style-image: url("chrome://browser/skin/tabbrowser/loading.png"); -} - -#tabbrowser-tabs[positionpinnedtabs] > .tabbrowser-tab[pinned] { - min-height: 16px; /* corresponds to the max. height of non-textual tab contents, i.e. the favicon */ + list-style-image: url("chrome://communicator/skin/brand/throbber16-anim.png"); } .tab-throbber[pinned], @@ -1820,11 +1876,12 @@ richlistitem[type~="action"][actiontype="switchtab"][selected="true"] > .ac-url- .tab-close-button { border: none; padding: 0px; + margin-top: 1px; list-style-image: url("chrome://global/skin/icons/close-button.gif"); } .tab-close-button:-moz-system-metric(touch-enabled) { - -moz-transform: scale(1.2); + transform: scale(1.2); } .tab-close-button:hover, @@ -1851,7 +1908,7 @@ richlistitem[type~="action"][actiontype="switchtab"][selected="true"] > .ac-url- } .tab-content { - min-height: -moz-calc(6.8mozmm - 7px); /* subtract borders from the desired height */ + min-height: calc(6.8mozmm - 7px); /* subtract borders from the desired height */ } } @@ -1965,7 +2022,7 @@ toolbarbutton.chevron:hover { toolbarbutton.chevron:-moz-locale-dir(rtl) > .toolbarbutton-icon, toolbarbutton.chevron:-moz-locale-dir(rtl):hover > .toolbarbutton-icon { - -moz-transform: scaleX(-1); + transform: scaleX(-1); } toolbarbutton.chevron > .toolbarbutton-text, @@ -2109,9 +2166,7 @@ toolbarbutton.bookmark-item[dragover="true"][open="true"] { } .popup-notification-icon[popupid="click-to-play-plugins"] { - list-style-image: url("chrome://mozapps/skin/plugins/pluginGeneric.png"); - width: 32px; - height: 32px; + list-style-image: url("chrome://mozapps/skin/plugins/pluginBlocked-64.png"); } .addon-progress-description { @@ -2159,6 +2214,10 @@ toolbarbutton.bookmark-item[dragover="true"][open="true"] { list-style-image: url("chrome://browser/skin/webapps-64.png"); } +.popup-notification-icon[popupid="webRTC-shareDevices"] { + list-style-image: url("chrome://browser/skin/webRTC-shareDevice-64.png"); +} + /* Notification icon box */ #notification-popup-box { position: relative; @@ -2180,7 +2239,7 @@ window:not([chromehidden~=toolbar]) #navigator-toolbox[iconsize=large][mode=icon #notification-popup-box:-moz-locale-dir(rtl), .notification-anchor-icon:-moz-locale-dir(rtl) { - -moz-transform: scaleX(-1); + transform: scaleX(-1); } .notification-anchor-icon { @@ -2198,6 +2257,10 @@ window:not([chromehidden~=toolbar]) #navigator-toolbox[iconsize=large][mode=icon list-style-image: url("chrome://global/skin/icons/information-16.png"); } +#identity-notification-icon { + list-style-image: url("chrome://mozapps/skin/profile/profileicon.png"); +} + #geo-notification-icon { list-style-image: url("chrome://browser/skin/Geolocation-16.png"); } @@ -2222,6 +2285,27 @@ window:not([chromehidden~=toolbar]) #navigator-toolbox[iconsize=large][mode=icon list-style-image: url("chrome://mozapps/skin/plugins/pluginGeneric-16.png"); } +#blocked-plugins-notification-icon { + list-style-image: url("chrome://mozapps/skin/plugins/notifyPluginBlocked.png"); +} + +#blocked-plugins-notification-icon[showing] { + animation: pluginBlockedNotification 500ms ease 0s 5 alternate both; +} + +@keyframes pluginBlockedNotification { + from { + opacity: 0; + } + to { + opacity: 1; + } +} + +#webRTC-notification-icon { + list-style-image: url("chrome://browser/skin/webRTC-shareDevice-16.png"); +} + #identity-popup-container { min-width: 280px; } @@ -2375,29 +2459,6 @@ window:not([chromehidden~=toolbar]) #navigator-toolbox[iconsize=large][mode=icon outline: 1px dotted #008484; } -/* Inspector / Highlighter */ - -#highlighter-panel { - -moz-window-shadow: none; - background: #000000; - border: none; -} - -listitem.style-selector { - background-color: #9C9CFF; - color: #000000; -} - -listitem.style-section { - background-color: #E7ADE7; - color: #000000; - font-weight: bold; -} - -panel[dimmed="true"] { - opacity: 0.5; -} - /* Add-on bar */ #addon-bar { @@ -2485,19 +2546,14 @@ panel[dimmed="true"] { /* Highlighter */ -.highlighter-veil { - background-color: rgba(25, 25, 25, 0.5); -} - -highlighter-veil-transparentbox { - box-shadow: 0 0 0 1px rgba(0,0,0,0.5); - outline: 1px dashed rgba(255,255,255,0.5); - outline-offset: -1px; +#highlighter-outline { + box-shadow: 0 0 0 1px black; + outline: 1px dashed white; } -#highlighter-veil-container[locked] > #highlighter-veil-middlebox > #highlighter-veil-transparentbox { - box-shadow: 0 0 0 1px black; - outline-color: white; +#highlighter-outline[locked] { + box-shadow: 0 0 0 1px rgba(0,0,0,0.3); + outline-color: rgba(255,255,255,0.7); } /* Highlighter toolbar */ @@ -2512,16 +2568,6 @@ highlighter-veil-transparentbox { -moz-image-region: rect(0 32px 16px 16px); } -#inspector-option-toolbarbutton { - list-style-image: url("chrome://browser/skin/devtools/inspector-option-icon.png"); - -moz-image-region: rect(0 16px 16px 0); -} - -#inspector-option-toolbarbutton[open], -#inspector-option-toolbarbutton:hover { - -moz-image-region: rect(0 32px 16px 16px); -} - #inspector-toolbar, #developer-toolbar { border-top: 3px solid #000000; @@ -2572,7 +2618,7 @@ html|*#highlighter-nodeinfobar-pseudo-classes { #highlighter-nodeinfobar-text { /* 100% - size of the buttons and margins */ - max-width: -moz-calc(100% - 2 * (26px + 6px)); + max-width: calc(100% - 2 * (26px + 6px)); padding-bottom: 1px; } @@ -2628,8 +2674,8 @@ html|*#highlighter-nodeinfobar-pseudo-classes { .highlighter-nodeinfobar-arrow { width: 14px; height: 14px; - -moz-margin-start: -moz-calc(50% - 7px); - -moz-transform: rotate(-45deg); + -moz-margin-start: calc(50% - 7px); + transform: rotate(-45deg); border: 1px solid transparent; background-clip: padding-box; background-repeat: no-repeat; @@ -2746,7 +2792,7 @@ html|*#highlighter-nodeinfobar-pseudo-classes { #inspector-breadcrumbs > .scrollbutton-up > .toolbarbutton-icon:-moz-locale-dir(rtl), #inspector-breadcrumbs > .scrollbutton-down > .toolbarbutton-icon:-moz-locale-dir(ltr) { -/* -moz-transform: scaleX(-1); */ +/* transform: scaleX(-1); */ } .inspector-breadcrumbs-button { @@ -2987,6 +3033,12 @@ html|*#gcli-output-frame { border-color: transparent; } +.gclitoolbar-input-node > .textbox-input-box > html|*.textbox-input::-moz-selection { + background-color: #008484; + color: #000000; + text-shadow: none; +} + .gclitoolbar-complete-node { padding-left: 21px; background-color: transparent; @@ -3036,13 +3088,12 @@ html|*#gcli-output-frame { /* Responsive Mode */ -vbox[anonid=browserContainer][responsivemode] { - background: #392900 url("chrome://browser/skin/devtools/responsive-background.png"); - box-shadow: 0 0 7px #9C9CFF inset; +.browserContainer[responsivemode] { + background: #221500 url("chrome://browser/skin/devtools/responsive-background.png"); padding: 0 20px 20px 20px; } -stack[anonid=browserStack][responsivemode] { +.browserStack[responsivemode] { box-shadow: 0 0 7px #9C9CFF; } @@ -3069,7 +3120,7 @@ stack[anonid=browserStack][responsivemode] { width: 7px; height: 24px; cursor: ew-resize; - -moz-transform: translate(12px, -12px); + transform: translate(12px, -12px); background-image: url("chrome://browser/skin/devtools/responsive-vertical-resizer.png"); } @@ -3077,102 +3128,133 @@ stack[anonid=browserStack][responsivemode] { width: 16px; height: 16px; cursor: se-resize; - -moz-transform: translate(12px, 12px); + transform: translate(12px, 12px); background-image: url("chrome://browser/skin/devtools/responsive-se-resizer.png"); } /* Web Console */ .web-console-frame { + /* border-bottom: 3px solid #000000; */ } .web-console-frame[animated] { transition: height 100ms; } -.web-console-splitter { - border: none; +/* Developer Toolbar */ + +.developer-toolbar-button { + min-width: 78px; + min-height: 21px; + margin: 0 1px; + list-style-image: url("chrome://browser/skin/devtools/tools-icons-small.png"); } +.developer-toolbar-button[open=true], +.developer-toolbar-button:active:hover, +.developer-toolbar-button[checked=true] { +} -/* social toolbar button */ -.social-statusarea-container { - -moz-appearance: none; - border-radius: 3px; - background-color: #000000; +.developer-toolbar-button[checked=true] { } -.social-statusarea-container:hover { - background-color: #FFCF00; +#developer-toolbar-webconsole { + -moz-image-region: rect(0, 16px, 16px, 0); } -#social-toolbar-button[open="true"] > .social-statusarea-container { - background-color: #FF9F00; +#developer-toolbar-inspector { + -moz-image-region: rect(16px, 16px, 32px, 0); } -/* favicon for the service */ -#social-provider-image { - min-width: 20px; - min-height: 20px; - padding: 2px 5px; - margin: 0; - background: transparent; - list-style-image: url("chrome://browser/skin/social/social.png"); +#developer-toolbar-styleeditor { + -moz-image-region: rect(32px, 16px, 48px, 0); } -#social-provider-image > .button-box > .box-inherit > .button-icon { - max-height: 16px; - max-width: 16px; +#developer-toolbar-debugger { + -moz-image-region: rect(48px, 16px, 64px, 0); } -#social-provider-image > .button-box { - padding: 0; - margin: 0; - background: transparent; - border: none; +#developer-toolbar-other-tools { + -moz-image-region: rect(64px, 16px, 80px, 0); } -#social-provider-image > .button-box > .button-menu-dropmarker { +#developer-toolbar-other-tools > .toolbarbutton-menu-dropmarker { display: none; } -/* hbox that hold notification icons */ -#social-status-iconbox { - margin: 0; - padding: 0; +#developer-toolbar-toolbox-button { + -moz-image-region: rect(64px, 16px, 80px, 0); } -/* hbox that surrounds an image and its counter */ -.social-notification-icon-container { - padding: 0; - margin: 0; - position: relative; +/* Error counter */ + +#developer-toolbar-webconsole[error-count]:before { + color: #000000; + min-width: 16px; + text-shadow: none; + background-color: #FF0000; + border-radius: 1px; + -moz-margin-end: 5px; } -/* notification counter box */ -.social-notification-icon-counter { - background-color: #000000; - border: 1px solid #9C9CFF; - padding-right: 1px; - padding-left: 1px; - color: #FF9F00; +/* Social toolbar item */ + +#social-provider-button > .toolbarbutton-menu-dropmarker { + display: none; +} + +#social-toolbar-item > .toolbarbutton-1 { +} + +#navigator-toolbox[iconsize=large][mode=icons] > #nav-bar > #social-toolbar-item > .toolbarbutton-1 { +} + +#navigator-toolbox[iconsize=large][mode=icons] > #nav-bar > #social-toolbar-item > .toolbarbutton-1:first-child { +} + +#navigator-toolbox[iconsize=large][mode=icons] > #nav-bar > #social-toolbar-item > .toolbarbutton-1:last-child { +} + +.social-notification-icon-hbox { + pointer-events: none; +} + +.social-notification-icon-stack > image { + max-height: 20px; +} + +.social-notification-icon-label { + text-align: end; font-size: 9px; font-weight: bold; - position: absolute; - right: -3px; - top: -4px; - z-index: 1; - text-align: center; + padding: 0 1px; + color: #FF9F00; + background-color: #000000; + border: 1px solid #9C9CFF; + border-radius: 2px; +} + +.social-notification-icon-label[value=""] { + display: none; } -/* notification image */ .social-notification-icon-image { - padding: 2px; - margin: 0; - min-width: 20px; - max-width: 32px; - max-height: 20px; - list-style-image: url("chrome://mozapps/skin/places/defaultFavicon.png"); + -moz-image-region: rect(0, 16px, 16px, 0); +} + +#social-notification-icon-mentions { + background-color: #000000; + border-radius: 3px; + -moz-margin-start: 2px; +} + +#social-notification-icon-mentions:hover { + background-color: #FFCF00; +} + +#social-notification-icon-mentions[open="true"] { + background-color: #FF9F00; } #social-sidebar-splitter { @@ -3180,47 +3262,47 @@ stack[anonid=browserStack][responsivemode] { } /* social toolbar provider menu */ -#social-statusarea-popup { +.social-statusarea-popup { margin-top: 0; margin-left: -12px; margin-right: -12px; } -#social-statusarea-user { +.social-statusarea-user { border-bottom: 1px solid #9C9CFF; background-color: #000000; color: #FF9F00; position: relative; - font: 11px "Liberation Sans",Arial,Tahoma,Helvetica,sans-serif; + cursor: pointer; } -#social-statusarea-user-portrait { +.social-statusarea-user-portrait { width: 32px; height: 32px; border-radius: 2px; margin: 10px; - list-style-image: url("chrome://browser/skin/social/social.png"); } -#social-statusarea-username { +.social-statusarea-loggedInStatus { background: transparent; border: none; - color: #9C9CFF; - cursor: pointer; + color: #3333FF; min-width: 0; margin: 0 6px; + list-style-image: none; } -#social-statusarea-username:hover { + +#social-statusarea-user[_moz-menuactive] > vbox > .social-statusarea-loggedInStatus { text-decoration: underline; } -#social-notification-panel { - min-height: 100px; - min-width: 100px; - max-height: 600px; - max-width: 400px; +.social-panel > .panel-arrowcontainer > .panel-arrowcontent { + padding: 0; } +.social-panel-frame { + border-radius: inherit; +} .chat-status-icon { max-height: 16px; @@ -3241,54 +3323,48 @@ stack[anonid=browserStack][responsivemode] { } .chat-close-button { - list-style-image: url("chrome://global/skin/icons/close-button.gif"); - padding: 2px 4px; + list-style-image: url('chrome://browser/skin/social/chat-close.png'); + -moz-image-region: rect(0, 14px, 14px, 0); } .chat-close-button:hover, .chat-close-button:hover:active { - list-style-image: url("chrome://global/skin/icons/close-button-hover.gif"); -} - - -.chat-toggle-button { - /* XXX get a real image for this */ - list-style-image: url("chrome://global/skin/arrow/arrow-down-sharp.gif"); -} - -.chat-toggle-button:hover { - list-style-image: url("chrome://global/skin/arrow/arrow-down-sharp-hover.gif"); -} - -.chat-toggle-button[minimized="true"] { - list-style-image: url("chrome://global/skin/arrow/arrow-left-sharp.png"); -} - -.chat-toggle-button[minimized="true"]:hover { - list-style-image: url("chrome://global/skin/arrow/arrow-left-sharp-hover.png"); + -moz-image-region: rect(14px, 14px, 28px, 0); } .chat-title { font-weight: bold; font: 11px "Liberation Sans",Arial,Tahoma,Helvetica,sans-serif; + text-shadow: none; + cursor: inherit; } .chat-titlebar { background-color: #9C9CFF; color: #000000; height: 20px; - min-height: 20px; + min-height: 16px; width: 100%; margin: 0; padding: 2px; + -moz-padding-start: 6px; border: none; border-bottom: 1px solid #008484; + cursor: pointer; } .chat-titlebar[minimized="true"] { border-bottom: none; } +.chat-titlebar[selected] { + background-color: #008484; +} + +.chat-titlebar[activity] { + background-color: #E7ADE7; +} + .chat-frame { padding: 0; margin: 0; @@ -3308,43 +3384,173 @@ stack[anonid=browserStack][responsivemode] { -moz-border-end: 1px solid #008484; } -.chatbar-button > .button-box > .box-inherit > .button-icon { +.chatbar-button > menupopup > .menuitem-iconic > .menu-iconic-left > .menu-iconic-icon { + width: auto; + height: auto; max-height: 16px; max-width: 16px; - 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"] { } -/* toolbarbutton-icon */ .chatbar-button > .toolbarbutton-text, .chatbar-button > .toolbarbutton-menu-dropmarker { display: none; } +.chatbar-button[activity]:not([open="true"]) { + background-color: #E7ADE7; +} + +.chatbar-button > menupopup > menuitem[activity] { + font-weight: bold; +} + .chatbar-innerbox { background: transparent; - margin: -200px -1px 0 -1px; + margin: -285px 0 0; overflow: hidden; } +chatbar { + -moz-margin-end: 20px; +} + chatbar > chatbox { - height: 200px; - width: 200px; + height: 285px; + width: 260px; + -moz-margin-start: 4px; background-color: #000000; border: 1px solid #9C9CFF; border-bottom: none; + border-top-left-radius: 2.5px; + border-top-right-radius: 2.5px; } -chatbar > chatbox[minimized="true"] { - width: 100px; +chatbox[minimized="true"] { + width: 160px; height: 20px; - border-bottom: none; } -chatbar > chatbox + chatbox { - -moz-margin-start: -1px; +.click-to-play-plugins-notification-content { + margin: -10px; + border-radius: 4px; +} + +.click-to-play-plugins-notification-icon-box { + background: #000000; + -moz-border-end: 1px solid #FF9F00; + padding-top: 16px; + -moz-padding-end: 16px; + -moz-padding-start: 24px; + -moz-margin-start: 4px; + margin-top: 4px; + margin-bottom: 4px; +} + +.click-to-play-plugins-notification-icon-box:-moz-locale-dir(ltr) { + border-bottom-left-radius: 4px; + border-top-left-radius: 4px; +} + +.click-to-play-plugins-notification-icon-box:-moz-locale-dir(rtl) { + border-bottom-right-radius: 4px; + border-top-right-radius: 4px; +} + +.click-to-play-plugins-notification-separator { + /*-moz-border-start: 1px solid #9C9CFF; + border-top: 1px solid #9C9CFF;*/ +} + +.click-to-play-plugins-notification-description-box { + /*border-bottom: 1px solid #9C9CFF; + -moz-border-start: 1px solid #9C9CFF;*/ + padding-top: 12px; + -moz-padding-end: 11px; + padding-bottom: 9px; + -moz-padding-start: 10px; +} + +.click-to-play-plugins-notification-center-box { + border-top: 1px solid #FF9F00; + border-bottom: 1px solid #FF9F00; + /*-moz-border-start: 1px solid #9C9CFF;*/ + background-color: #000000; + -moz-margin-end: 4px; +} + +.click-to-play-plugins-notification-button-container { + /*border-top: 1px solid #9C9CFF; + -moz-border-start: 1px solid #9C9CFF;*/ + margin: 0px; + padding: 16px; +} + +.center-item-box { + padding: 12px 16px 0px 16px; +} + +.center-item-box[padbottom="true"] { + padding-bottom: 12px; +} + +.center-item-icon { + background-image: url("chrome://mozapps/skin/plugins/pluginGeneric-16.png"); + background-repeat: no-repeat; + height: 16px; + width: 16px; + margin-bottom: 4px; +} + +.center-item-box[warn="true"] { + background-color: #FFCF00; + color: #000000; + padding: 8px 16px 6px 16px; +} + +.center-item-box[padbottom="true"][warn="true"] { + padding-bottom: 4px; +} + +.center-item-box[showseparator="true"] { + border-top: 1px solid #9C9CFF; +} + +.center-item-box[warn="false"] > .center-item-warning { + display: none; +} + +.center-item-warning > .text-link { + color: #6868AA; +} + +.center-item-warning > .text-link[href=""] { + display: none; +} + +.center-item-warning-icon { + background-image: url("chrome://mozapps/skin/extensions/alerticon-info-negative.png"); + background-repeat: no-repeat; + width: 16px; + height: 15px; + margin-bottom: 4px; +} + +.center-item-warning-description { + color: #828282; +} + +.center-item-button { + min-width: 0; }