X-Git-Url: https://git-public.kairo.at/?p=themes.git;a=blobdiff_plain;f=LCARStrek%2Fbrowser%2Fbrowser.css;h=be874fa3ce34ed2395cf85431c3cdabbb3bce2e9;hp=1ec8b87ca275875dc20af19898c526698d02b3c0;hb=f897a590a135f4de8227cc5cc228bd0b60885c05;hpb=b7f3670c9080327045c25fbe0f6ef266bdc01c9e diff --git a/LCARStrek/browser/browser.css b/LCARStrek/browser/browser.css index 1ec8b87c..be874fa3 100644 --- a/LCARStrek/browser/browser.css +++ b/LCARStrek/browser/browser.css @@ -7,6 +7,7 @@ @namespace url("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"); @namespace html url("http://www.w3.org/1999/xhtml"); +@namespace svg url("http://www.w3.org/2000/svg"); toolbar { -moz-binding: url("chrome://global/skin/globalBindings.xml#toolbar"); @@ -61,8 +62,8 @@ menubar { /* margin-top: 3px;*/ } -#main-window[tabsintitlebar][sizemode="normal"][chromehidden~="menubar"] #toolbar-menubar ~ #TabsToolbar, -#main-window[tabsintitlebar][sizemode="normal"] #toolbar-menubar[autohide="true"][inactive] ~ #TabsToolbar { +#main-window[tabsintitlebar][sizemode="normal"]:not([inFullscreen])[chromehidden~="menubar"] #toolbar-menubar ~ #TabsToolbar, +#main-window[tabsintitlebar][sizemode="normal"]:not([inFullscreen]) #toolbar-menubar[autohide="true"][inactive] ~ #TabsToolbar { /* margin-top: 15px;*/ } @@ -126,13 +127,6 @@ menubar { visibility: visible; } -/* Make the menu inherit the toolbar's color. On non-compositor (Aero Basic, XP modern, classic) - * this is defined above, but only for tabsintitlebar. Otherwise (Aero Glass, Windows 8), - * this is hardcoded to black in browser-aero.css, even without tabsintitlebar. */ - #main-window[tabsintitlebar] #main-menubar > menu:not(:-moz-lwtheme) { -/* color: inherit; */ - } - #nav-bar { /* Position the toolbar above the bottom of background tabs */ position: relative; @@ -1251,7 +1245,7 @@ toolbar .toolbarbutton-1 > .toolbarbutton-menubutton-dropmarker:-moz-lwtheme-bri } #nav-bar .toolbarbutton-1 > menupopup.cui-widget-panel { -/* margin-top: -8px;*/ + margin-top: -4px; } #nav-bar .toolbarbutton-1 > .toolbarbutton-menubutton-button { @@ -1268,7 +1262,7 @@ toolbar .toolbarbutton-1 > .toolbarbutton-menubutton-dropmarker:-moz-lwtheme-bri #nav-bar .toolbarbutton-1 > .toolbarbutton-badge-container, #nav-bar .toolbarbutton-1 > .toolbarbutton-menubutton-button > .toolbarbutton-icon, #nav-bar .toolbarbutton-1 > .toolbarbutton-menubutton-dropmarker > .dropmarker-icon, -window:not([chromehidden~="toolbar"]) #urlbar-container > .toolbarbutton-1:-moz-any([disabled=true],:not([open]):not([disabled=true]):not(:active)) > .toolbarbutton-icon { +window:not([chromehidden~="toolbar"]) #urlbar-wrapper > .toolbarbutton-1:-moz-any([disabled=true],:not([open]):not([disabled=true]):not(:active)) > .toolbarbutton-icon { /* padding: 2px 6px; border: 1px solid; border-color: transparent; @@ -1328,19 +1322,20 @@ toolbarbutton[sdk-button="true"][cui-areatype="toolbar"] > .toolbarbutton-icon { */ } -window:not([chromehidden~="toolbar"]) #urlbar-container > .toolbarbutton-1:-moz-any([disabled=true],:not([open]):not([disabled=true]):not(:active)) > .toolbarbutton-icon { +window:not([chromehidden~="toolbar"]) #urlbar-wrapper > .toolbarbutton-1:-moz-any([disabled=true],:not([open]):not([disabled=true]):not(:active)) > .toolbarbutton-icon { } +#nav-bar .toolbarbutton-1:not([disabled=true]) > .toolbarbutton-menubutton-button[open] + .toolbarbutton-menubutton-dropmarker > .dropmarker-icon, #nav-bar .toolbarbutton-1:not([disabled=true]):-moz-any(:hover,[open]) > .toolbarbutton-menubutton-button > .toolbarbutton-icon, #nav-bar .toolbarbutton-1:not([disabled=true]):-moz-any(:hover,[open]) > .toolbarbutton-menubutton-dropmarker > .dropmarker-icon, #nav-bar .toolbarbutton-1:not([disabled=true]):not([checked]):not([open]):not(:active):hover > .toolbarbutton-icon, #nav-bar .toolbarbutton-1:not([disabled=true]):not([checked]):not([open]):not(:active):hover > .toolbarbutton-text, #nav-bar .toolbarbutton-1:not([disabled=true]):not([checked]):not([open]):not(:active):hover > .toolbarbutton-badge-container, -window:not([chromehidden~="toolbar"]) #urlbar-container > #forward-button:not([open]):not(:active):not([disabled=true]):hover > .toolbarbutton-icon, +window:not([chromehidden~="toolbar"]) #urlbar-wrapper > #forward-button:not([open]):not(:active):not([disabled=true]):hover > .toolbarbutton-icon, #nav-bar .toolbarbutton-1:not([buttonover]):not([open]):not(:active):hover > .toolbarbutton-menubutton-dropmarker:not([disabled=true]) > .dropmarker-icon { } -#nav-bar .toolbarbutton-1 > .toolbarbutton-menubutton-button:not([disabled=true]):hover:active > .toolbarbutton-icon, +#nav-bar .toolbarbutton-1 > .toolbarbutton-menubutton-button:not([disabled=true]):-moz-any(:hover:active, [open]) > .toolbarbutton-icon, #nav-bar .toolbarbutton-1[open] > .toolbarbutton-menubutton-dropmarker:not([disabled=true]) > .dropmarker-icon, #nav-bar .toolbarbutton-1:not([disabled=true]):-moz-any([open],[checked],:hover:active) > .toolbarbutton-icon, #nav-bar .toolbarbutton-1:not([disabled=true]):-moz-any([open],[checked],:hover:active) > .toolbarbutton-text, @@ -1388,6 +1383,7 @@ window:not([chromehidden~="toolbar"]) #urlbar-container > #forward-button:not([o border-radius: 10000px 0 0 10000px; } +/* pre-31 forward button */ window:not([chromehidden~="toolbar"]) #urlbar-container:not([switchingtabs]) > #forward-button { transition: opacity 150ms ease-out; } @@ -1400,6 +1396,27 @@ window:not([chromehidden~="toolbar"]) #urlbar-container > #forward-button[occlud visibility: hidden; } +/* post-31 forward button */ +window:not([chromehidden~="toolbar"]) #urlbar-wrapper:not([switchingtabs]) > #forward-button { + transition: margin-left,opacity 150ms ease-out; +} + +window:not([chromehidden~="toolbar"]) #urlbar-wrapper > #forward-button[disabled] { + margin-left: -30px !important; + opacity: 0; +} + +window:not([chromehidden~="toolbar"]) #urlbar-wrapper:hover:not([switchingtabs]) > #forward-button[disabled] { + /* delay the hiding of the forward button when hovered to avoid accidental clicks on the url bar */ + transition-delay: 100s; +} + +window:not([chromehidden~="toolbar"]) #urlbar-wrapper:not(:hover) > #forward-button[disabled] { + /* when not hovered anymore, trigger a new transition to hide the forward button immediately */ + margin-left: -30.01px !important; + opacity: 0; +} + #back-button { /* padding-top: 3px !important; padding-bottom: 3px !important; @@ -1442,8 +1459,7 @@ window:not([chromehidden~="toolbar"]) #urlbar-container > #forward-button[occlud box-shadow: 0 1px 0 0 hsla(210,80%,20%,.1) inset !important;*/ } -#back-button:-moz-locale-dir(rtl) > .toolbarbutton-icon, -#forward-button:-moz-locale-dir(rtl) { +#back-button:-moz-locale-dir(rtl) > .toolbarbutton-icon { transform: scaleX(-1); } /* @@ -1584,6 +1600,7 @@ window:not([chromehidden~="toolbar"]) #urlbar-container > #forward-button[occlud /* background-color: white;*/ } +/* pre-31 forward button */ window:not([chromehidden~="toolbar"]) #urlbar-container > #urlbar-wrapper { padding-left: 22px; -moz-margin-start: -22px; @@ -1597,6 +1614,11 @@ window:not([chromehidden~="toolbar"]) #urlbar-container > #urlbar-wrapper > #url pointer-events: all; } +/* The next rule is a workaround to deal with the above rules in post-31 */ +window:not([chromehidden~="toolbar"]) #urlbar-container > #urlbar-wrapper > #forward-button { + pointer-events: all; +} + window:not([chromehidden~="toolbar"]) #urlbar-container:not([switchingtabs]) > #urlbar-wrapper > #urlbar { transition: margin-left 150ms ease-out; } @@ -1635,6 +1657,37 @@ window:not([chromehidden~="toolbar"]) #urlbar-container > #urlbar-wrapper > #url transform: scaleX(-1); } +/* post-31 forward button */ +window:not([chromehidden~="toolbar"]) #urlbar-wrapper > #urlbar { + -moz-border-start: none; +/* margin-left: 0;*/ +} + +window:not([chromehidden~="toolbar"]) #urlbar-wrapper > #urlbar:-moz-locale-dir(ltr) { +/* border-top-left-radius: 0; + border-bottom-left-radius: 0; */ +} + +window:not([chromehidden~="toolbar"]) #urlbar-wrapper > #urlbar:-moz-locale-dir(rtl) { +/* border-top-right-radius: 0; + border-bottom-right-radius: 0; */ +} + +window:not([chromehidden~="toolbar"]) #urlbar-wrapper { +/* clip-path: url("chrome://browser/content/browser.xul#urlbar-back-button-clip-path");*/ + -moz-margin-start: -5px; +} + +window:not([chromehidden~="toolbar"]) #urlbar-wrapper:-moz-locale-dir(rtl), +window:not([chromehidden~="toolbar"]) #urlbar-wrapper > #urlbar:-moz-locale-dir(rtl) { + /* let urlbar-back-button-clip-path clip the urlbar's right side for RTL */ + transform: scaleX(-1); +} + +window:not([chromehidden~="toolbar"]) #urlbar-wrapper:-moz-locale-dir(rtl) { + -moz-box-direction: reverse; +} + html|*.urlbar-input:-moz-lwtheme::-moz-placeholder, .searchbar-textbox:-moz-lwtheme > .autocomplete-textbox-container > .textbox-input-box > html|*.textbox-input::-moz-placeholder { color: #E7ADE7; @@ -1727,38 +1780,53 @@ html|*.urlbar-input:-moz-lwtheme::-moz-placeholder, border-radius: 0; } -window:not([chromehidden~="toolbar"]) #urlbar-container > #urlbar-wrapper > #urlbar > #identity-box { +window:not([chromehidden~="toolbar"]) #urlbar-container > #urlbar-wrapper > #urlbar > #identity-box, +window:not([chromehidden~="toolbar"]) #urlbar-wrapper > #urlbar > #identity-box { /* border-radius: 0; */ -moz-padding-start: 2px; -moz-padding-end: 2px; -moz-margin-end: 1px; } +window:not([chromehidden~="toolbar"]) #urlbar-wrapper:not([switchingtabs]) > #urlbar > #identity-box { + transition: padding-left, padding-right; +} + window:not([chromehidden~="toolbar"]) #urlbar-container[forwarddisabled] > #urlbar-wrapper > #urlbar > + #notification-popup-box[hidden] + #identity-box:-moz-locale-dir(ltr), +window:not([chromehidden~="toolbar"]) #urlbar-wrapper > #forward-button[disabled] + #urlbar > #notification-popup-box[hidden] + #identity-box:-moz-locale-dir(ltr) { padding-left: 2px; - transition: padding-left; + transition: padding-left; /* pre-31 */ } -window:not([chromehidden~="toolbar"]) #urlbar-container[forwarddisabled] > #urlbar-wrapper > #urlbar > +window:not([chromehidden~="toolbar"]) #urlbar-container[forwarddisabled] > #urlbar-wrapper > #urlbar > + #notification-popup-box[hidden] + #identity-box:-moz-locale-dir(rtl), +window:not([chromehidden~="toolbar"]) #urlbar-wrapper > #forward-button[disabled] + #urlbar > #notification-popup-box[hidden] + #identity-box:-moz-locale-dir(rtl) { padding-right: 2px; - transition: padding-right; + transition: padding-right; /* pre-31 */ } -window:not([chromehidden~="toolbar"]) #urlbar-container[forwarddisabled]:hover:not([switchingtabs]) > #urlbar-wrapper > #urlbar > +window:not([chromehidden~="toolbar"]) #urlbar-container[forwarddisabled]:hover:not([switchingtabs]) > #urlbar-wrapper > #urlbar > + #notification-popup-box[hidden] + #identity-box, +window:not([chromehidden~="toolbar"]) #urlbar-wrapper:hover:not([switchingtabs]) > #forward-button[disabled] + #urlbar > #notification-popup-box[hidden] + #identity-box { /* forward button hiding is delayed when hovered */ transition-delay: 100s; } -window:not([chromehidden~="toolbar"]) #urlbar-container[forwarddisabled]:not(:hover) > #urlbar-wrapper > #urlbar > +window:not([chromehidden~="toolbar"]) #urlbar-container[forwarddisabled]:not(:hover) > #urlbar-wrapper > #urlbar > + #notification-popup-box[hidden] + #identity-box:-moz-locale-dir(ltr), +window:not([chromehidden~="toolbar"]) #urlbar-wrapper:not(:hover) > #forward-button[disabled] + #urlbar > #notification-popup-box[hidden] + #identity-box:-moz-locale-dir(ltr) { /* when not hovered anymore, trigger a new non-delayed transition to react to the forward button hiding */ padding-left: 2.01px; } -window:not([chromehidden~="toolbar"]) #urlbar-container[forwarddisabled]:not(:hover) > #urlbar-wrapper > #urlbar > +window:not([chromehidden~="toolbar"]) #urlbar-container[forwarddisabled]:not(:hover) > #urlbar-wrapper > #urlbar > + #notification-popup-box[hidden] + #identity-box:-moz-locale-dir(rtl), +window:not([chromehidden~="toolbar"]) #urlbar-wrapper:not(:hover) > #forward-button[disabled] + #urlbar > #notification-popup-box[hidden] + #identity-box:-moz-locale-dir(rtl) { /* when not hovered anymore, trigger a new non-delayed transition to react to the forward button hiding */ padding-right: 2.01px; @@ -2063,7 +2131,7 @@ richlistitem[type~="action"][actiontype="switchtab"][selected="true"] > .ac-url- -moz-image-region: rect(0, 42px, 14px, 28px); } -#urlbar-go-button:hover, +#urlbar-go-button:hover { -moz-image-region: rect(14px, 42px, 28px, 28px); } @@ -2452,16 +2520,6 @@ toolbarbutton[type="socialmark"] > .toolbarbutton-icon { /* End selected tab */ -/* Background tabs */ - -/* Decrease the height of the hoverable region of background tabs whenever the tabs are at the top - of the window (e.g. no menubar, tabs in titlebar, etc.) to make it easier to drag the window by - the titlebar. We don't need this in fullscreen since window dragging is not an issue there. */ -#main-window[tabsintitlebar]:not([sizemode="maximized"]):not([inFullscreen]) #toolbar-menubar:-moz-any([autohide="true"][inactive], :not([autohide])) + #TabsToolbar .tab-background-middle:not([selected=true]) { -} - -/* End background tabs */ - /* Tab pointer-events */ /* .tabbrowser-tab { @@ -2493,6 +2551,16 @@ toolbarbutton[type="socialmark"] > .toolbarbutton-icon { /* === END tabs.inc.css === */ +/* Background tabs: + * + * Decrease the height of the hoverable region of background tabs whenever the tabs are at the top + * of the window (e.g. no menubar, tabs in titlebar, etc.) to make it easier to drag the window by + * the titlebar. We don't need this in fullscreen since window dragging is not an issue there. + */ +#main-window[tabsintitlebar][sizemode=normal] #toolbar-menubar[autohide="true"][inactive] + #TabsToolbar .tab-background-middle:not([selected=true]) { +/* clip-path: url(chrome://browser/content/browser.xul#tab-hover-clip-path);*/ +} + /* Tab DnD indicator */ .tab-drop-indicator { list-style-image: url("chrome://browser/skin/tabbrowser/tabDragIndicator.png"); @@ -2897,11 +2965,20 @@ toolbarbutton.bookmark-item[dragover="true"][open="true"] { list-style-image: url("chrome://browser/skin/webRTC-shareDevice-64.png"); } +.popup-notification-icon[popupid="webRTC-sharingMicrophone"], +.popup-notification-icon[popupid="webRTC-shareMicrophone"] { + list-style-image: url("chrome://browser/skin/webRTC-shareMicrophone-64.png"); +} + .popup-notification-icon[popupid="pointerLock"] { list-style-image: url("chrome://browser/skin/pointerLock-64.png"); } /* Notification icon box */ +#notification-popup .panel-promo-box { +/* margin: 10px -10px -10px; */ +} + #notification-popup-box { position: relative; background-color: #000000; @@ -2914,7 +2991,8 @@ toolbarbutton.bookmark-item[dragover="true"][open="true"] { border-right-width: 8px; } -window:not([chromehidden~="toolbar"]) #urlbar-container[forwarddisabled] > #urlbar-wrapper > #urlbar > #notification-popup-box { +window:not([chromehidden~="toolbar"]) #urlbar-container[forwarddisabled] > #urlbar-wrapper > #urlbar > #notification-popup-box, +window:not([chromehidden~="toolbar"]) #urlbar-wrapper[forwarddisabled] > #urlbar > #notification-popup-box { /* padding-left: 5px; */ } @@ -3025,6 +3103,16 @@ window:not([chromehidden~="toolbar"]) #urlbar-container[forwarddisabled] > #urlb list-style-image: url("chrome://browser/skin/webRTC-sharingDevice-16.png"); } +.webRTC-shareMicrophone-notification-icon, +#webRTC-shareMicrophone-notification-icon { + list-style-image: url("chrome://browser/skin/webRTC-shareMicrophone-16.png"); +} + +.webRTC-sharingMicrophone-notification-icon, +#webRTC-sharingMicrophone-notification-icon { + list-style-image: url("chrome://browser/skin/webRTC-sharingMicrophone-16.png"); +} + .web-notifications-notification-icon, #web-notifications-notification-icon { list-style-image: url("chrome://browser/skin/notification-16.png"); @@ -3121,6 +3209,7 @@ window:not([chromehidden~="toolbar"]) #urlbar-container[forwarddisabled] > #urlb /* Sync Panel */ .sync-panel-icon { + height:32px; width: 32px; background: url("chrome://browser/content/abouthome/sync.png") top left no-repeat; } @@ -3136,7 +3225,9 @@ window:not([chromehidden~="toolbar"]) #urlbar-container[forwarddisabled] > #urlb #sync-error-panel-title, #sync-start-panel-title { + font-size: 120%; font-weight: bold; + margin-bottom: 5px; } #sync-start-panel-subtitle, @@ -3178,11 +3269,40 @@ window:not([chromehidden~="toolbar"]) #urlbar-container[forwarddisabled] > #urlb /* === BEGIN highlighter.inc.css === */ -/* Highlighter */ +/* Box model highlighter */ +svg|g.box-model-container { + opacity: 0.4; +} + +svg|polygon.box-model-content { + fill: #008484; +} + +svg|polygon.box-model-padding { + fill: #9C9CFF; +} + +svg|polygon.box-model-border { + fill: #FFCF00; +} + +svg|polygon.box-model-margin { + fill: #A09090; +} + +svg|polygon.box-model-content, +svg|polygon.box-model-padding, +svg|polygon.box-model-border, +svg|polygon.box-model-margin { + stroke: none; +} -.highlighter-outline { - box-shadow: 0 0 0 1px black; - outline: 1px dashed #A09090; +svg|line.box-model-guide-top, +svg|line.box-model-guide-right, +svg|line.box-model-guide-bottom, +svg|line.box-model-guide-left { + stroke: #E7ADE7; + stroke-dasharray: 5 3; } /* Highlighter - Node Infobar */ @@ -3720,8 +3840,7 @@ html|*#gcli-output-frame { #servicesInstall-notification-icon { list-style-image: url("chrome://browser/skin/social/services-16.png"); } -#social-undoactivation-button, -#servicesInstall-learnmore-link { +#social-undoactivation-button { -moz-margin-start: 0; /* override default label margin to match description margin */ } @@ -4723,3 +4842,108 @@ toolbarpaletteitem[place="toolbar"] { #UITourTooltipButtons { margin: 24px -4px -4px; } + +/* === BEGIN contextmenu.inc.css === */ + +menugroup > .menuitem-iconic[disabled="true"] > .menu-iconic-left { +} + +#context-navigation > .menuitem-iconic { + -moz-box-flex: 1; + -moz-box-pack: center; + -moz-box-align: center; +} + +#context-navigation > .menuitem-iconic[disabled="true"] { + background-color: transparent; +} + +#context-navigation > .menuitem-iconic > .menu-iconic-left { + -moz-appearance: none; +} + +#context-navigation > #context-back > .menu-iconic-left { + list-style-image: url("chrome://browser/skin/ToolbarFx.png"); + -moz-image-region: rect(0, 54px, 18px, 36px); +} + +#context-navigation > #context-back:not([disabled="true"]):hover > .menu-iconic-left { + -moz-image-region: rect(18px, 54px, 36px, 36px); +} + +#context-navigation > #context-back[disabled="true"] > .menu-iconic-left { + -moz-image-region: rect(36px, 54px, 54px, 36px); +} + +#context-navigation > #context-forward > .menu-iconic-left { + list-style-image: url("chrome://browser/skin/ToolbarFx.png"); + -moz-image-region: rect(0, 72px, 18px, 54px); +} + +#context-navigation > #context-forward:not([disabled="true"]):hover > .menu-iconic-left { + -moz-image-region: rect(18px, 72px, 36px, 54px); +} + +#context-navigation > #context-forward[disabled="true"] > .menu-iconic-left { + -moz-image-region: rect(36px, 72px, 54px, 54px); +} + +#context-navigation > #context-reload > .menu-iconic-left { + list-style-image: url("chrome://browser/skin/reload-stop-go.png"); + -moz-image-region: rect(0, 14px, 14px, 0); +} + +#context-navigation > #context-reload:not([disabled="true"]):hover > .menu-iconic-left { + -moz-image-region: rect(14px, 14px, 28px, 0); +} + +#context-navigation > #context-reload[disabled="true"] > .menu-iconic-left { + -moz-image-region: rect(28px, 14px, 42px, 0); +} + +#context-navigation > #context-stop > .menu-iconic-left { + list-style-image: url("chrome://browser/skin/reload-stop-go.png"); + -moz-image-region: rect(0, 28px, 14px, 14px); +} + +#context-navigation > #context-stop:not([disabled="true"]):hover > .menu-iconic-left { + -moz-image-region: rect(14px, 28px, 28px, 14px); +} + +#context-navigation > #context-stop[disabled="true"] > .menu-iconic-left { + -moz-image-region: rect(28px, 28px, 42px, 14px); +} + +#context-navigation > #context-bookmarkpage > .menu-iconic-left { + list-style-image: url("chrome://browser/skin/ToolbarFx.png"); + -moz-image-region: rect(0, 144px, 18px, 126px); +} + +#context-navigation > #context-bookmarkpage:not([disabled="true"]):hover > .menu-iconic-left { + -moz-image-region: rect(18px, 144px, 36px, 126px); +} + +#context-navigation > #context-bookmarkpage[disabled="true"] > .menu-iconic-left { + -moz-image-region: rect(36px, 144px, 54px, 126px); +} + +#context-back:-moz-locale-dir(rtl), +#context-forward:-moz-locale-dir(rtl), +#context-reload:-moz-locale-dir(rtl) { + transform: scaleX(-1); +} + +#context-navigation > .menuitem-iconic > .menu-iconic-left > .menu-iconic-icon { + width: 18px; + height: 18px; + margin: 7px; +} + +#context-navigation > #context-reload > .menu-iconic-left > .menu-iconic-icon, +#context-navigation > #context-stop > .menu-iconic-left > .menu-iconic-icon { + width: 14px; + height: 14px; + margin: 9px; +} + +/* === END contextmenu.inc.css === */