gecko/mobile/themes/wince/browser.css

667 lines
17 KiB
CSS

/* ***** BEGIN LICENSE BLOCK *****
* Version: MPL 1.1/GPL 2.0/LGPL 2.1
*
* The contents of this file are subject to the Mozilla Public License Version
* 1.1 (the "License"); you may not use this file except in compliance with
* the License. You may obtain a copy of the License at
* http://www.mozilla.org/MPL/
*
* Software distributed under the License is distributed on an "AS IS" basis,
* WITHOUT WARRANTY OF ANY KIND, either express or implied. See the License
* for the specific language governing rights and limitations under the
* License.
*
* The Original Code is Mozilla Mobile Browser.
*
* The Initial Developer of the Original Code is
* Mozilla Corporation.
* Portions created by the Initial Developer are Copyright (C) 2008
* the Initial Developer. All Rights Reserved.
*
* Contributor(s):
* Mark Finkle <mfinkle@mozilla.com>
*
* Alternatively, the contents of this file may be used under the terms of
* either the GNU General Public License Version 2 or later (the "GPL"), or
* the GNU Lesser General Public License Version 2.1 or later (the "LGPL"),
* in which case the provisions of the GPL or the LGPL are applicable instead
* of those above. If you wish to allow use of your version of this file only
* under the terms of either the GPL or the LGPL, and not to allow others to
* use your version of this file under the terms of the MPL, indicate your
* decision by deleting the provisions above and replace them with the notice
* and other provisions required by the GPL or the LGPL. If you do not delete
* the provisions above, a recipient may use your version of this file under
* the terms of any one of the MPL, the GPL or the LGPL.
*
* ***** END LICENSE BLOCK ***** */
/* browser area -------------------------------------------------- */
#browser-container {
background-image: url("chrome://browser/content/checkerboard.png");
}
/* main toolbar (URL bar) -------------------------------------------------- */
#toolbar-main {
-moz-appearance: none;
-moz-box-align: center;
padding: 1.1mm; /* core spacing */
border: none;
}
/* main toolbar buttons */
toolbarbutton.urlbar-button {
/* space out the buttons a bit horizontally */
margin-left: 1.1mm; /* core spacing */
}
#tool-bookmarks {
list-style-image: url("chrome://browser/skin/images/bookmarks-default-64.png");
}
#tool-bookmarks:hover:active {
list-style-image: url("chrome://browser/skin/images/bookmarks-active-64.png");
}
/* URL bar cap buttons */
toolbarbutton.urlbar-cap-button {
margin: 0;
padding: 0;
min-width: 0;
min-height: 0;
}
#tool-go {
list-style-image: url("chrome://browser/skin/images/go-30.png");
}
#tool-reload {
list-style-image: url("chrome://browser/skin/images/reload-30.png");
}
#tool-stop {
list-style-image: url("chrome://browser/skin/images/stop-30.png");
}
#urlbar-icons[mode="loading"] > #tool-go,
#urlbar-icons[mode="loading"] > #tool-reload {
visibility: collapse;
}
#urlbar-icons[mode="view"] > #tool-go,
#urlbar-icons[mode="view"] > #tool-stop {
visibility: collapse;
}
#urlbar-icons[mode="edit"] > #tool-reload,
#urlbar-icons[mode="edit"] > #tool-stop {
visibility: collapse;
}
/* URL bar ----------------------------------------------------------------- */
#urlbar-container {
color: #000;
-moz-box-align: center;
}
/* creates the left endcap */
#identity-box {
min-height: 64px;
min-width: 64px;
background: url("images/leftcap-default-64.png") top left no-repeat;
-moz-box-align: center;
-moz-box-pack: center;
}
#identity-box:hover:active {
background: url("images/leftcap-active-64.png");
}
/* add special color */
#identity-box[mode="verifiedIdentity"] {
background: url("images/leftcapEV-default-64.png");
}
#identity-box[mode="verifiedIdentity"]:hover:active {
background: url("images/leftcapEV-active-64.png");
}
/* add special color */
#identity-box[mode="verifiedDomain"] {
background: url("images/leftcapSSL-default-64.png");
}
#identity-box[mode="verifiedDomain"]:hover:active {
background: url("images/leftcapSSL-active-64.png");
}
#urlbar-throbber[loading] {
list-style-image: url("chrome://browser/skin/images/throbber.png");
}
#urlbar-favicon {
width: 30px;
height: 30px;
}
#urlbar-editarea {
min-height: 64px;
-moz-box-align: center;
padding: 0;
border-top: 1px solid #262629; /* keep pixels */
border-bottom: 3px solid #262629; /* keep pixels */
background: #fff;
}
#urlbar-edit {
-moz-appearance: none !important;
padding: 0px !important;
border: none !important;
color: #000;
background-color: #fff;
}
/* make sure this endcap matches the other endcap */
#urlbar-icons {
min-height: 64px;
min-width: 64px;
background: url("images/rightcap-default-64.png") top right no-repeat;
-moz-box-pack: center;
}
#urlbar-icons:hover:active {
background: url("images/rightcap-active-64.png");
}
/* right toolbar (browser controls) ---------------------------------------- */
#browser-controls {
-moz-box-align: start;
padding: 0 1.1mm; /* core spacing + tiny bit for a rounding issue? */
border-left: 3px solid #262629; /* keep pixels */
}
toolbarbutton.browser-control-button,
toolbarbutton.panel-button,
toolbarbutton.page-button {
/* space out the buttons a bit vertically */
margin-bottom: 1.1mm; /* core spacing */
}
#tool-star {
list-style-image: url("chrome://browser/skin/images/bookmark-default-64.png");
}
#tool-star:hover:active {
list-style-image: url("chrome://browser/skin/images/bookmark-active-64.png");
}
#tool-star[starred="true"] {
list-style-image: url("chrome://browser/skin/images/bookmarked-default-64.png");
}
#tool-star[starred="true"]:hover:active {
list-style-image: url("chrome://browser/skin/images/bookmarked-active-64.png");
}
#tool-back {
list-style-image: url("chrome://browser/skin/images/back-default-64.png");
}
#tool-back:hover:active {
list-style-image: url("chrome://browser/skin/images/back-active-64.png");
}
#tool-back[disabled="true"],
#tool-back[disabled="true"]:hover:active {
list-style-image: url("chrome://browser/skin/images/back-disabled-64.png");
}
#tool-forward {
list-style-image: url("chrome://browser/skin/images/forward-default-64.png");
}
#tool-forward:hover:active {
list-style-image: url("chrome://browser/skin/images/forward-active-64.png");
}
#tool-forward[disabled="true"],
#tool-forward[disabled="true"]:hover:active {
list-style-image: url("chrome://browser/skin/images/forward-disabled-64.png");
}
/* button overflows off the right edge */
#tool-panel-open {
list-style-image: url("chrome://browser/skin/images/settings-default-64.png");
margin-right: -40px; /* big number just to make sure the image overflows the edge */
}
/* button overflows off the left edge */
#tool-panel-close {
list-style-image: url("chrome://browser/skin/images/settings-active-64.png");
margin-left: -40px; /* big number just to make sure the image overflows the edge */
}
/* "extras" panel UI ----------------------------------------------------- */
#panel-controls {
/* match #browser-controls end padding */
padding: 0 1.1mm; /* core spacing */
-moz-box-align: end;
}
.panel-header {
padding: 1.1mm; /* core spacing */
}
#tool-addons {
list-style-image: url("chrome://browser/skin/images/addons-default-64.png");
}
#tool-addons:hover:active,
#tool-addons[checked="true"] {
list-style-image: url("chrome://browser/skin/images/addons-active-64.png");
}
#tool-downloads {
list-style-image: url("chrome://browser/skin/images/downloads-default-64.png");
}
#tool-downloads:hover:active,
#tool-downloads[checked="true"] {
list-style-image: url("chrome://browser/skin/images/downloads-active-64.png");
}
#tool-preferences {
list-style-image: url("chrome://browser/skin/images/preferences-default-64.png");
}
#tool-preferences:hover:active,
#tool-preferences[checked="true"] {
list-style-image: url("chrome://browser/skin/images/preferences-active-64.png");
}
#tool-console {
list-style-image: url("chrome://browser/skin/images/console-default-64.png");
}
#tool-console:hover:active,
#tool-console[checked="true"] {
list-style-image: url("chrome://browser/skin/images/console-active-64.png");
}
/* URL List and autocomplete navigation popup ------------------------------ */
#tool-bookmarks-close,
#tool-folders-close {
list-style-image: url("chrome://browser/skin/images/bookmarks-active-64.png");
}
#bookmarklist-container {
padding: 0;
}
#bookmarklist-header, #folder-header {
color: rgb(255,255,255);
-moz-box-align: center;
padding: 1.1mm; /* core spacing */
}
#bookmark-items, #folder-items {
-moz-appearance: none !important;
background-color: rgb(255,255,255);
padding: 0;
}
.place-list-parents {
background-color: rgb(207,207,207);
padding: 0.25mm;
}
.place-list-children {
-moz-appearance: none;
border: none !important;
padding: 0;
}
.bookmark-folder, .bookmark-item {
padding: 0.25mm 0.1mm;
border-bottom: 0.05mm solid rgb(207,207,207);
min-height: 7.2mm; /* row size */
-moz-box-align: center;
}
.bookmark-folder textbox[readonly="true"], .bookmark-item textbox[readonly="true"] {
-moz-appearance: none !important;
background-color: transparent;
border: none !important;
-moz-user-select: none !important;
}
placelabel.bookmark-folder {
border-bottom: 0.05mm solid rgb(255,255,255);
}
.bookmark-item-image, .bookmark-folder-image {
width: 24px;
height: 24px;
}
/* folders have a fixed image */
.bookmark-folder-image {
list-style-image: url("chrome://browser/skin/images/folder-30.png");
}
/* control the manage controls */
.bookmark-manage-controls, .bookmark-folder-new {
visibility: collapse;
}
placelist[ui="manage"] .bookmark-manage-controls,
placelist[ui="manage"] .bookmark-folder-new,
placeitem[ui="manage"] .bookmark-manage-controls {
visibility: visible;
}
placeitem[ui="manage"] .bookmark-item-image {
visibility: collapse;
}
/* be consistent with the size of placeitem */
placelabel {
min-height: 7.2mm; /* row size */
-moz-box-align: center;
}
/* use a smaller font size for the manage buttons */
placeitem .button-text {
font-size: 9pt !important;
}
.close-button {
-moz-appearance: none;
border: none;
margin: 0;
padding: 0;
list-style-image: url("chrome://browser/skin/images/close-30.png");
}
.tool-search {
list-style-image: url("chrome://browser/skin/images/navigation-magnifier-30.png");
}
.searchengine {
-moz-box-orient: horizontal;
}
#autocomplete_navbuttons {
margin: 1.1mm; /* core spacing */
min-height: 7.2mm; /* row size */
}
.autocomplete-items {
color: black;
background-color: white;
}
.autocomplete-item,
.autocomplete-item-selected {
padding: 0.25mm 0.1mm;
border-bottom: 0.05mm solid rgb(207,207,207);
min-height: 7.2mm; /* row size */
-moz-box-pack: center;
}
.autocomplete-item-selected {
color: white;
background-color: grey;
}
.autocomplete-item.noresults {
text-align: center;
font-style: italic;
color: grey;
background-color: white;
border-bottom: none;
}
.ac-result-type-bookmark {
list-style-image: url("chrome://browser/skin/images/star-30.png");
}
.ac-result-type-tag {
list-style-image: url("chrome://browser/skin/images/tag-30.png");
}
/* Left sidebar (tabs) ---------------------------------------------------- */
#tabs-container {
-moz-padding-start: 0.6mm; /* allow the thumbnails to get close to the edge */
-moz-padding-end: 1.1mm; /* core spacing */
border-right: 3px solid #262629; /* keep pixels */
}
#tabs {
-moz-appearance: none;
margin: 0;
padding: 0;
background-color: transparent;
}
#tabs-controls {
margin-top: 1.1mm; /* core spacing */
-moz-box-pack: center;
}
richlistitem[type="documenttab"] {
-moz-appearance: none;
padding: 0;
border: none;
}
richlistitem[type="documenttab"] .documenttab-canvas {
/* keep the unselected thumbnails aligned with the selected one */
border: 1.0mm solid transparent;
}
richlistitem[type="documenttab"][selected="true"] {
background-color: transparent;
}
richlistitem[type="documenttab"][selected="true"] .documenttab-canvas {
border: 1.0mm solid #262629;
-moz-border-radius: 4px;
}
.documenttab-close {
width: 28px;
height: 30px;
list-style-image: url("chrome://browser/skin/images/close-30.png");
}
vbox:first-child richlistitem[type="documenttab"]:only-child .documenttab-close {
display: none;
}
#newtab-button {
list-style-image: url("images/newtab-default-64.png");
}
#newtab-button:hover:active {
list-style-image: url("images/newtab-active-64.png");
}
/* findbar --------------------------------------------------------------- */
findbar {
background: rgba(128, 128, 128, 0.75);
}
findbar .findbar-closebutton {
list-style-image: url("chrome://browser/skin/images/close-30.png");
}
/* bookmark editor ------------------------------------------------------- */
#bookmark-container {
padding: 1.1mm; /* core spacing */
}
#bookmark-form {
background-color: #fff;
padding: 1.1mm; /* core spacing */
}
/* Identity popup -------------------------------------------------------- */
#identity-container {
padding: 1.1mm; /* core spacing */
}
/* Popup Icons */
#identity-popup-icon {
padding: 0;
list-style-image: url("chrome://browser/skin/images/identity-64.png");
}
#identity-container[mode="verifiedDomain"] > #identity-popup-icon {
list-style-image: url("chrome://browser/skin/images/identitySSL-64.png");
}
#identity-container[mode="verifiedIdentity"] > #identity-popup-icon {
list-style-image: url("chrome://browser/skin/images/identityEV-64.png");
}
/* Popup Body Text */
#identity-popup-content-box {
-moz-padding-start: 1.1mm; /* core spacing */
}
#identity-popup-content-box.unknownIdentity > hbox > #identity-popup-connectedToLabel,
#identity-popup-content-box.unknownIdentity > hbox > #identity-popup-runByLabel,
#identity-popup-content-box.unknownIdentity > hbox > #identity-popup-content-host,
#identity-popup-content-box.unknownIdentity > hbox > #identity-popup-content-owner,
#identity-popup-content-box.verifiedIdentity > hbox > #identity-popup-connectedToLabel2,
#identity-popup-content-box.verifiedDomain > hbox > #identity-popup-connectedToLabel2 {
display: none;
}
#identity-popup-content-box > hbox > description,
#identity-popup-content-box > hbox > label {
font-size: 11pt !important;
white-space: pre-wrap;
}
#identity-popup-encryption-label,
#identity-popup-content-verifier {
font-size: 8pt !important;
}
#identity-popup-content-host,
#identity-popup-content-owner {
font-weight: bold;
}
#identity-popup-encryption-icon {
list-style-image: url("chrome://browser/skin/images/unlock-40.png");
}
#identity-container[mode="verifiedIdentity"] > vbox > #identity-popup-encryption-icon ,
#identity-container[mode="verifiedDomain"] > vbox > #identity-popup-encryption-icon {
list-style-image: url("chrome://browser/skin/images/lock-40.png");
}
/* Preferences window ---------------------------------------------------- */
/* XXX should be a richlistitem */
richpref {
background-color: white;
color: black;
}
/* XXX should be a richlistitem.section-header */
.prefsection {
font-weight: bold;
color: #000;
background-color: lightgray;
padding: 0.25mm;
}
/* XXX should be a richlistitem */
.prefbox {
padding: 0.25mm;
border-bottom: 0.05mm solid rgb(207,207,207);
min-height: 7.2mm; /* row size */
-moz-box-align: center;
}
/* XXX should be a richlistitem description.title */
.preftitle {
font-size: 9pt !important;
}
/* XXX should be a richlistitem description.normal */
.prefdesc {
font-size: 8pt !important;
color: grey;
background-color: white;
}
/* alerts popup ----------------------------------------------------------- */
#alerts-container {
color: #000;
background-color: #fff;
border: 0.25mm solid gray;
-moz-border-radius: 1.0mm;
padding: 1.1mm; /* core spacing */
-moz-box-shadow: black 0.25mm 0.25mm 0.5mm;
}
#alerts-text {
font-size: 85% !important;
white-space: pre-wrap;
}
/* helperapp (save-as) popup ----------------------------------------------- */
#helperapp-target {
font-size: 8pt !important;
}
/* select popup ------------------------------------------------------------ */
#select-container {
border: 0.5mm solid #36373b;
-moz-border-radius: 1.0mm;
padding-top: 1.1mm; /* core spacing */
}
#select-list > option {
color: #000;
background-color: #fff;
padding: 5px;
border-bottom: 1px solid rgb(207,207,207);
min-height: 7.2mm; /* row size */
-moz-box-align: center;
}
#select-list > option[selected="true"] {
color: #fff;
background-color: grey;
}
#select-list > option.optgroup {
font-weight: bold;
font-style: italic;
}
#select-list > option.optgroup > image {
display: none;
}
#select-list > option.in-optgroup {
-moz-padding-start: 4.4mm;
}
#select-buttons {
padding: 0.55mm 1.1mm; /* row size & core spacing */
-moz-box-pack: center;
}
#select-list > option > image {
min-width: 30px;
}
#select-list > option[selected="true"] > image {
list-style-image: url("chrome://browser/skin/images/check-30.png");
}