From: Robert Kaiser Date: Sun, 19 Jun 2011 01:27:25 +0000 (+0200) Subject: add theming for panorama X-Git-Tag: EarlyBlue-2.1~2 X-Git-Url: https://git-public.kairo.at/?a=commitdiff_plain;h=9e47e6012b872c12203d341800e69d4f519ed6e1;p=themes.git add theming for panorama --- diff --git a/LCARStrek/browser/tabview/close.png b/LCARStrek/browser/tabview/close.png new file mode 100644 index 00000000..7d357f3e Binary files /dev/null and b/LCARStrek/browser/tabview/close.png differ diff --git a/LCARStrek/browser/tabview/edit-light.png b/LCARStrek/browser/tabview/edit-light.png new file mode 100644 index 00000000..59d0d0d9 Binary files /dev/null and b/LCARStrek/browser/tabview/edit-light.png differ diff --git a/LCARStrek/browser/tabview/new-tab.png b/LCARStrek/browser/tabview/new-tab.png new file mode 100644 index 00000000..679e7d7b Binary files /dev/null and b/LCARStrek/browser/tabview/new-tab.png differ diff --git a/LCARStrek/browser/tabview/search.png b/LCARStrek/browser/tabview/search.png new file mode 100644 index 00000000..d175a662 Binary files /dev/null and b/LCARStrek/browser/tabview/search.png differ diff --git a/LCARStrek/browser/tabview/stack-expander.png b/LCARStrek/browser/tabview/stack-expander.png new file mode 100644 index 00000000..9bf87415 Binary files /dev/null and b/LCARStrek/browser/tabview/stack-expander.png differ diff --git a/LCARStrek/browser/tabview/tabview.css b/LCARStrek/browser/tabview/tabview.css new file mode 100644 index 00000000..4f4885c1 --- /dev/null +++ b/LCARStrek/browser/tabview/tabview.css @@ -0,0 +1,615 @@ +body { + font: 11px "Liberation Sans",Arial,Tahoma,Helvetica,sans-serif; + color: #FF9F00; +} + +#bg { + background: #000000; +} + +/* Tabs +----------------------------------*/ + +.tab { + padding-top: 4px; + -moz-padding-end: 6px; + padding-bottom: 6px; + -moz-padding-start: 4px; + background-color: #000000; + border-radius: 0.4em; + border: 1px solid #9C9CFF; + cursor: pointer; + margin: 4px; +} + +.tab canvas, +.cached-thumb { + border: none; +} + +.thumb { + background-color: white; +} + +.favicon { + background-color: #000000; + padding-top: 4px; + -moz-padding-end: 6px; + padding-bottom: 6px; + -moz-padding-start: 4px; + top: 4px; + left: 4px; + -moz-border-end: 1px solid #9C9CFF; + border-bottom: 1px solid #9C9CFF; + height: 17px; + width: 17px; +} + +html[dir=ltr] .favicon { + border-bottom-right-radius: 0.4em; +} + +html[dir=rtl] .favicon { + border-bottom-left-radius: 0.4em; + left: auto; + right: 2px; +} + +.favicon img { + border: none; + width: 16px; + height: 16px; +} + +.close { + top: 6px; + right: 8px; + width: 16px; + height: 16px; + border-radius: 3px; + background-image: -moz-image-rect(url("chrome://browser/skin/tabview/close.png"), 0, 16, 16, 0); +} + +.close:hover { + background-image: -moz-image-rect(url("chrome://browser/skin/tabview/close.png"), 0, 32, 16, 16); + background-color: #FFCF00; +} + +html[dir=rtl] .close { + right: auto; + left: 6px; +} + +.expander { + bottom: 6px; + right: 6px; + width: 16px; + height: 16px; + background: url(chrome://global/skin/icons/resizer.png) no-repeat; + -moz-transition-property: opacity; + -moz-transition-duration: 0.5s; + -moz-transition-timing-function: ease-out; + opacity: 0.2; +} + +html[dir=rtl] .expander { + right: auto; + left: 6px; + -moz-transform: scaleX(-1); +} + +.expander:hover, +.appTabIcon:hover { + -moz-transition-property: opacity; + -moz-transition-duration: 0.5s; + -moz-transition-timing-function: ease-out; + opacity: 1.0; +} + +.favicon img:hover, +.close img:hover, +.expander img:hover { + opacity: 1; + border: none; +} + +.tab-title { + bottom: -20px; + text-align: center; + width: 94.5%; + white-space: nowrap; + overflow: hidden; +} + +.stacked { + padding: 0; +} + +.stacked .thumb { +} + +.stack-trayed .tab-title { + color: #E7ADE7; + font-size: 10px; +} + +.stack-trayed .thumb { + box-shadow: none !important; +} + +.tab.focus { + box-shadow: + 0 1px 0 #008484 inset, + 0 -1px 1px #008484 inset, + 1px 0 1px #008484 inset, + -1px 0 1px #008484 inset, + 0 0 5.5px #008484; +} + +/* Tab: Zooming +----------------------------------*/ + +.front .tab-title, +.front .close, +.front .favicon, +.front .expander, +.front .thumb-shadow { + display: none; +} + +.front .thumb { + box-shadow: none !important; +} + +.front.focus { + box-shadow: none !important; +} + +/* Tab GroupItem +----------------------------------*/ + +.tabInGroupItem { + box-shadow: none; + background-color: #000000; +} + +.tabInGroupItem .favicon { + background-color: #000000; +} + +.groupItem { + cursor: move; + background-color: #000000; + border-radius: 0.4em; + border: 1px solid #6080B5; +} + +.groupItem.activeGroupItem { + border: 1px solid #008484; +} + +.groupItem .close { + z-index: 10; +} + +.dragRegion { + background: #008484; +} + +.overlay { + background-color: #6000CF !important; + border-radius: 0.4em; +} + +.appTabTrayContainer { + top: 34px; + right: 1px; + -moz-border-start: 1px solid #9C9CFF; + padding: 0 5px; + overflow-x: hidden; + text-align: start; + line-height: 0; +} + +html[dir=rtl] .appTabTrayContainer { + right: auto; + left: 1px; +} + +.appTabTray { + display: inline-block; + -moz-column-width: 16px; + -moz-column-count: 0; + -moz-column-gap: 5px; +} + +.appTabTrayContainerTruncated { + padding-bottom: 7px; +} + +.appTabTrayContainerTruncated:after { + content: "…"; + position: absolute; + bottom: 2px; + left: 0; + display: block; + width: 100%; + height: 15px; + line-height: 15px; + text-align: center; + font-size: 15px; +} + +.appTabIcon { + width: 16px; + height: 16px; + cursor: pointer; + opacity: 0.8; + padding-bottom: 3px; + display: block; +} + +.undo { + background-color: #8050B0; + width: 150px; + height: 30px; + line-height: 30px; + box-shadow: 0px 1px 0px #9F9FCC, 0px -1px 0px #008484; + color: #FFCF00; + border-radius: 0.4em; + text-align: center; + border: none; + cursor: pointer; +} + +.undo:hover { + background-color: #FFCF00; + color: #000000; +} + +.undo .close { + top: 4px; + left: 4px; + opacity: 0.5; +} + +html[dir=rtl] .undo .close { + left: auto; + right: 4px; +} + +.undo .close:hover{ + opacity: 1.0; +} + +/* InfoItems +----------------------------------*/ + +.info-item { + cursor: move; + border: 1px solid #9C9CFF; + background-color: #000000; + border-radius: 0.4em; +} + +.intro { + margin: 10px; +} + +/* Trenches +----------------------------------*/ + +.guideTrench { + opacity: 0.9; + border: 1px dashed rgba(156,156,255,.12); + border-bottom: none; + -moz-border-end: none; + box-shadow: 1px 1px 0 rgba(0,132,132,.15); +} + +html[dir=rtl] .guideTrench { + box-shadow: -1px 1px 0 rgba(0,132,132,.15); +} + +.visibleTrench { + opacity: 0.05; +} + +.activeVisibleTrench { + opacity: 0; +} + +.activeVisibleTrench.activeTrench { + opacity: 0.45; +} + +.visibleTrench.border, +.activeVisibleTrench.border { + background-color: #E7ADE7; +} + +.visibleTrench.guide, +.activeVisibleTrench.guide { + background-color: #9C9CFF; +} + +/* Other +----------------------------------*/ + +.newTabButton { + width: 16px; + height: 15px; + bottom: 10px; + left: 10px; + cursor: pointer; + opacity: .3; + background-image: url(chrome://browser/skin/tabview/new-tab.png); +} + +html[dir=rtl] .newTabButton { + left: auto; + right: 10px; +} + +.newTabButton:hover { + opacity: 1; +} + +.active { + box-shadow: 5px 5px 3px rgba(255,207,0,.5); +} + +html[dir=rtl] .active { + box-shadow: -5px 5px 3px rgba(255,207,0,.5); +} + +.acceptsDrop { + box-shadow: 2px 2px 7px -1px rgba(0,132,132,.6); +} + +html[dir=rtl] .acceptsDrop { + box-shadow: -2px 2px 7px -1px rgba(0,132,132,.6); +} + +.titlebar { + font-size: 12px; + height: 18px; +} + +input.name { + background: transparent; + border: 1px solid transparent; + color: #FF9F00; + margin-top: 3px; + -moz-margin-end: 0; + margin-bottom: 0; + -moz-margin-start: 3px; + padding: 1px; +} + +html[dir=rtl] input.name { + background-position: right top; +} + +.title-container:hover input.name, +.title-container input.name:focus { + border: 1px solid #008484; +} + +.title-container:hover input.name-locked { + border: 1px solid transparent !important; + cursor: default; +} + +input.name:focus { + color: #FFCF00; +} + +input.name:-moz-placeholder { + font-style: italic !important; + color: transparent; + background-image: url(chrome://browser/skin/tabview/edit-light.png); + background-repeat: no-repeat; + -moz-padding-start: 20px; +} + +.title-container:hover input.name:-moz-placeholder { + color: #E7ADE7; +} + +.title-shield { + margin-top: 3px; + -moz-margin-end: 0; + margin-bottom: 0; + -moz-margin-start: 3px; + padding: 1px; + left: 0; + top: 0; + width: 100%; + height: 100%; + cursor: text; +} + +html[dir=rtl] .title-shield { + left: auto; + right: 0; +} + +.transparentBorder { + border: 1px solid transparent !important; +} + +.stackExpander { + cursor: pointer; + bottom: 8px; + background-image: -moz-image-rect(url(chrome://browser/skin/tabview/stack-expander.png), 0, 48, 24, 24); + width: 24px; + height: 24px; +} + +.stackExpander:hover { + background-image: -moz-image-rect(url(chrome://browser/skin/tabview/stack-expander.png), 0, 24, 24, 0); +} + +/* Resizable +----------------------------------*/ +.resizer { + background-image: url(chrome://global/skin/icons/resizer.png); + width: 16px; + height: 16px; + bottom: 0px; + right: 0px; + opacity: .2; +} + +html[dir=rtl] .resizer { + right: auto; + left: 0; + -moz-transform: scaleX(-1); +} + +.iq-resizable-handle { + font-size: 0.1px; +} + +.iq-resizable-se { + cursor: se-resize; + width: 12px; + height: 12px; + padding-right: 3px; + padding-bottom: 3px; + right: -2px; + bottom: -2px; +} + +html[dir=rtl] .iq-resizable-se { + cursor: sw-resize; + right: auto; + left: 1px; +} + +/* Exit button ++----------------------------------*/ +#exit-button { + width: 18px; + height: 18px; + -moz-margin-end: 4px; + margin-top: 2px; + background-image: -moz-image-rect(url(chrome://browser/skin/tabview/tabview.png), 0, 90, 18, 72); + background-attachment: scroll; + background-repeat: no-repeat; + border: none; +} + +#exit-button[groups="0"] { + background-image: -moz-image-rect(url(chrome://browser/skin/tabview/tabview.png), 0, 18, 18, 0); +} + +#exit-button[groups="1"] { + background-image: -moz-image-rect(url(chrome://browser/skin/tabview/tabview.png), 0, 36, 18, 18); +} + +#exit-button[groups="2"] { + background-image: -moz-image-rect(url(chrome://browser/skin/tabview/tabview.png), 0, 54, 18, 36); +} + +#exit-button[groups="3"] { + background-image: -moz-image-rect(url(chrome://browser/skin/tabview/tabview.png), 0, 72, 18, 54); +} + +/* Search +----------------------------------*/ +#searchshade{ + background-color: rgba(231,174,231,.42); + width: 100%; + height: 100%; +} + +#search{ + width: 100%; + height: 100%; +} + +#searchbox{ + width: 270px; + height: 30px; + color: #FF9F00; + border: 2px solid #008484; + background-color: #000000; + border-radius: 0.4em; + -moz-padding-start: 5px; + -moz-padding-end: 5px; + font-size: 14px; +} + +#actions{ + top: -3px; + padding-top: 3px; + width: 29px; + border: none; + text-align: center; + background-color: #000000; + border-radius: 0.4em; + border: 1px solid #9C9CFF; +} + +#actions #searchbutton{ + background: transparent url(chrome://browser/skin/tabview/search.png) no-repeat; + border: none; + width: 20px; + height: 20px; + margin-top: 3px; + -moz-margin-end: 1px; +} + +.notMainMatch{ + opacity: .70; +} + +#otherresults { + left: 0px; + bottom: 0px; + width: 100%; + height: 30px; + background-color: rgba(0,132,132,.3); + box-shadow: 0px -1px 0px rgba(255,207,0,.1), inset 0px 2px 5px rgba(255,207,0,.3); +} + +html[dir=rtl] #otherresults { + left: auto; + right: 0; +} + +#otherresults .label { + color: #999; + line-height: 30px; + -moz-margin-start: 5px; + -moz-margin-end: 5px; +} + +.inlineMatch { + background-color: rgba(0,132,132,.5); + border-radius: 0.4em; + box-shadow: 0 1px 4px rgba(255,207,0, 0.6); + border: 1px solid #008484; + -moz-padding-start: 3px; + -moz-padding-end: 3px; + height: 20px; + -moz-margin-end: 5px; + cursor: pointer; +} + +.inlineMatch:hover { + opacity: 1.0; +} + +.inlineMatch > img { + -moz-margin-end: 5px; + position: relative; + top: 2px; +} + +.inlineMatch > span { + max-width: 200px; + height: 15px; +} diff --git a/LCARStrek/browser/tabview/tabview.png b/LCARStrek/browser/tabview/tabview.png new file mode 100644 index 00000000..c9ac0910 Binary files /dev/null and b/LCARStrek/browser/tabview/tabview.png differ