gecko/mobile/themes/wince/browser.css

645 lines
14 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>
* Kantha Kanchiraju <kkanchir@sta.samsung.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 ***** */
@import url("chrome://browser/skin/browser-high.css");
@import url("chrome://browser/skin/browser-low.css");
/* browser area -------------------------------------------------- */
#tile-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;
}
#toolbar-moveable-container {
display: block;
}
#toolbar-moveable-container[top="0"] {
position: fixed;
left: 0;
z-index: 1000;
}
/* main toolbar buttons */
toolbarbutton.urlbar-button {
/* space out the buttons a bit horizontally */
margin-left: 1.1mm; /* core spacing */
}
/* URL bar cap buttons */
toolbarbutton.urlbar-cap-button {
margin: 0;
padding: 0;
min-width: 0 !important;
min-height: 0 !important;
}
#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;
}
#urlbar-edit {
-moz-appearance: none !important;
padding: 0px !important;
border: none !important;
color: #000;
background-color: #fff;
}
/* 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 */
}
/* browser tools panel UI ------------------------------------------------ */
@media (orientation: landscape) {
#panel-container {
-moz-box-orient: horizontal;
}
#panel-controls {
-moz-box-orient: vertical;
-moz-box-ordinal-group: 1;
-moz-box-pack: end;
}
#tool-panel-close {
-moz-box-ordinal-group: 1000;
}
}
@media (orientation: portrait) {
#panel-container {
-moz-box-orient: vertical;
}
#panel-controls {
-moz-box-orient: horizontal;
-moz-box-ordinal-group: 1000;
-moz-box-pack: start;
padding-top: 1.1mm; /* core spacing */
}
#tool-panel-close {
-moz-box-ordinal-group: 1;
}
}
#panel-controls {
/* match #browser-controls end padding */
padding-left: 1.1mm; /* core spacing */
padding-right: 1.1mm; /* core spacing */
-moz-box-align: end;
}
.panel-header {
padding: 1.1mm; /* core spacing */
}
/* addons panel UI ------------------------------------------------------- */
@media (orientation: landscape) {
#addons-repo {
-moz-box-orient: horizontal;
-moz-box-align: center;
}
}
@media (orientation: portrait) {
#addons-repo {
-moz-box-orient: vertical;
-moz-box-pack: center;
}
/* let the buttons in a selected addon wrap */
#addons-list > richlistitem .buttons-box {
display: block;
}
}
#addons-update-all {
color: #000 !important;
}
#addons-update-all[disabled="true"] {
color: #aaa !important;
}
/* console panel UI ------------------------------------------------------ */
@media (orientation: landscape) {
#console-filter-warnings,
#console-filter-messages {
visibility: visible;
}
}
@media (orientation: portrait) {
#console-filter-warnings,
#console-filter-messages {
visibility: collapse;
}
}
/* bookmark list panel UI ------------------------------------------------ */
#bookmarklist-container {
padding: 0;
}
#bookmarklist-header {
color: rgb(255,255,255);
-moz-box-align: center;
padding: 1.1mm; /* core spacing */
}
#bookmark-items {
-moz-appearance: none !important;
background-color: rgb(255,255,255);
padding: 0;
}
.place-list-parents {
background-color: rgb(207,207,207);
}
.place-list-parents placelabel {
visibility: collapse;
}
.place-list-parents placelabel:last-child:not(:only-child) {
visibility: visible;
}
.place-list-children {
-moz-appearance: none;
border: none !important;
margin: 0.25mm;
padding: 0;
}
.bookmark-folder, .bookmark-item {
padding: 0.25mm 0.55mm;
border-bottom: 0.05mm solid rgb(207,207,207);
min-height: 7.2mm; /* row size */
}
.bookmark-manage-controls {
padding-top: 0.55mm;
padding-bottom: 0.55mm;
}
.bookmark-edit-textboxes {
padding-top: 0.55mm;
}
.bookmark-item-image {
height: 24px;
width: 24px;
max-height: 24px;
max-width: 24px;
margin: 1.6mm 1.5mm 0mm 2mm;
}
placeitem[selected] .bookmark-item-image {
margin-top: 3mm;
}
.bookmark-item-name {
font-size: 9pt !important;
}
.bookmark-item-uri {
font-size: 8pt !important;
color: blue;
}
.bookmark-item-tags {
color: black;
margin-right: 1.1mm;
font-size: 8pt !important;
font-weight: lighter;
}
placelabel.bookmark-folder {
border-bottom: 0.05mm solid rgb(255,255,255);
background: url(chrome://browser/skin/images/arrowup-16.png) no-repeat 98% 50%;
}
placeitem[type="folder"] {
background: url(chrome://browser/skin/images/arrowright-16.png) no-repeat 98% 50%;
}
/* hide the unuseful fields for folder */
placeitem[type="folder"] .bookmark-item-uri,
placeitem[type="folder"] .bookmark-item-tags {
visibility: hidden;
}
/* control the manage controls */
placelist[ui="manage"] placeitem[type="folder"] {
background-image: none;
}
placeitem[ui="manage"] .bookmark-close-button,
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;
}
.searchengine {
-moz-box-orient: horizontal;
min-width: 7.2mm;
}
#autocomplete_navbuttons {
padding: 1.1mm; /* core spacing */
min-height: 7.2mm; /* row size */
-moz-user-focus: ignore;
}
#autocomplete_navbuttons autorepeatbutton {
display: none;
}
.autocomplete-items {
background-color: white;
}
autocompleteresult {
color: black;
background-color: white;
padding: 1.25mm 0.5mm;
border-bottom: 0.05mm solid rgb(207,207,207);
min-height: 9.2mm; /* row size */
}
.autocompleteresult-selected {
color: white;
background-color: grey !important;
}
.autocomplete-item-label {
margin: 0;
padding: 0;
font-size: 9pt !important;
font-weight: normal;
margin-right: 2mm;
}
.autocomplete-item-label > image {
width: 24px;
height: 24px;
margin: 0mm 2.5mm 0mm 2mm;
}
.autocomplete-item-label > label {
-moz-margin-start: 1px;
}
.autocomplete-item-label[favorite="true"] {
padding-right: 30px;
background: url(images/star-24.png) no-repeat 100%;
}
.autocomplete-item-label[favorite="true"]:after {
float: right;
content: attr(tags);
font-size: 8pt !important;
font-weight: lighter;
padding-top: 1mm;
margin-left: 2mm;
}
.autocomplete-item-url {
margin: 0;
padding: 0;
color: blue;
font-size: 8pt !important;
margin-left: 11.5mm;
margin-right: 2mm;
}
/* special "no results" and "all bookmarks" items */
autocompleteresult.noresults {
font-style: italic;
border-bottom: none;
}
autocompleteresult.noresults > .autocomplete-item-label {
text-align: center;
color: grey;
}
autocompleteresult.noresults > .autocomplete-item-label > image,
autocompleteresult.noresults > .autocomplete-item-url {
visibility: hidden;
}
autocompleteresult.allbookmarks {
-moz-box-pack: center;
background: #E9E9E9 url("images/arrowright-16.png") no-repeat 98% 50%;
}
autocompleteresult.allbookmarks > .autocomplete-item-label {
font-size: 9pt !important;
margin: 0 1.5mm;
}
autocompleteresult.allbookmarks > .autocomplete-item-url {
display: none;
}
/* 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 */
padding-bottom: 1.1mm; /* core spacing */
border-right: 3px solid #262629; /* keep pixels */
}
#tabs {
display: block;
-moz-column-width: 128px;
-moz-column-gap: 0;
-moz-user-focus: ignore;
margin: 0;
padding: 0;
background-color: transparent;
}
#tabs-controls {
margin-top: 1.1mm; /* core spacing */
-moz-box-pack: start;
}
box[type="documenttab"] .documenttab-canvas {
/* keep the unselected thumbnails aligned with the selected one */
border: 1.0mm solid transparent;
}
box[type="documenttab"][selected="true"] .documenttab-canvas {
border: 1.0mm solid #262629;
-moz-border-radius: 4px;
}
box[type="documenttab"]:only-child .documenttab-close {
display: none;
}
/* findbar --------------------------------------------------------------- */
findbar {
background: rgba(128, 128, 128, 0.75);
}
/* bookmark editor ------------------------------------------------------- */
#bookmark-container {
padding: 1.1mm; /* core spacing */
}
#bookmark-form {
background-color: #fff;
padding: 1.1mm; /* core spacing */
}
/* Identity popup -------------------------------------------------------- */
#identity-container {
border-bottom: 0.1mm solid grey;
}
#identity-popup-container {
padding: 1.1mm; /* core spacing */
}
/* 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: 9pt !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;
}
/* search popup ---------------------------------------------------------- */
#search-container {
border-top: 0.1mm solid rgb(207,207,207);
padding: 1.1mm; /* core spacing */
margin-top: 1mm;
}
#search-engine-label-add {
font-size: 80%;
}
#search-buttons,
.search-engine-button {
-moz-user-focus: ignore;
}
/* Preferences window ---------------------------------------------------- */
/* XXX should be a richlistitem */
setting {
background-color: white;
color: black;
}
settings {
background-color: lightgray;
color: #000;
}
settings .settings-title {
font-weight: bold;
padding: 0.25mm;
}
/* XXX should be a richlistitem */
.prefbox {
padding: 0.25mm 1.1mm;
border-bottom: 0.05mm solid rgb(207,207,207);
min-height: 7.2mm; /* row size */
}
.options-box setting:last-child .prefbox {
border-bottom: 0;
}
/* 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 ----------------------------------------------------------- */
#bookmark-popup,
#newtab-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;
}
.modal-block {
-moz-box-align: center;
-moz-box-pack: center;
background-color: rgba(128, 128, 128, 0.5);
}