Tweak Windows appearance (Linux still to come)

This commit is contained in:
Simon Kornblith 2011-08-01 16:59:10 +00:00
parent d8cd5cf7ae
commit 46e1fd0600
6 changed files with 214 additions and 157 deletions

View file

@ -0,0 +1,83 @@
body {
line-height: 1.45em;
}
body[multiline="true"] {
line-height: 1.63em;
}
#quick-format-dialog {
background: transparent;
-moz-appearance: none;
padding: 0;
}
#quick-format-search {
height: 22px;
background: white;
-moz-appearance: searchfield;
}
#quick-format-search[multiline="true"] {
padding: 2px 2px 0 18px;
border: 1px solid rgba(0, 0, 0, 0.5);
border-radius: 10px;
-moz-appearance: none;
}
#quick-format-search:not([multiline="true"]) {
height: 22px !important;
}
#quick-format-search[multiline="true"] > #quick-format-iframe {
margin: -1px 0 0 0;
}
#quick-format-entry {
background: -moz-linear-gradient(-90deg, rgb(243,123,119) 0, rgb(180,47,38) 50%, rgb(156,36,27) 50%);
-moz-border-radius:15px;
padding: 10px;
}
#zotero-icon {
margin: 0 0 0 -13px;
}
#citation-properties menulist {
-moz-appearance: none; color: #fff;
text-shadow: 0 -1px 0 rgba(0,0,0,.5);
border-radius: 12px;
border: 1px solid rgba(0,0,0,.65);
background: -moz-linear-gradient(rgba(110,110,110,.9), rgba(70,70,70,.9) 49%, rgba(50,50,50,.9) 51%, rgba(40,40,40,.9));
box-shadow: inset 0 1px 0 rgba(255,255,255,.2), inset 0 0 1px rgba(255,255,255,.1), 0 1px 0 rgba(255,255,255,.1);
background-clip: padding-box;
background-origin: padding-box;
padding: 2px 9px;
border-radius: 3px;
min-height: 22px;
-moz-padding-start: 4px;
-moz-padding-end: 0;
}
#citation-properties menulist:-moz-focusring {
box-shadow: 0 0 1px -moz-mac-focusring inset, 0 0 4px 1px -moz-mac-focusring, 0 0 2px 1px -moz-mac-focusring;
}
#citation-properties menulist[open="true"],
#citation-properties menulist:hover:active {
background: -moz-linear-gradient(rgba(40,40,40,.9), rgba(70,70,70,.9));
box-shadow: inset 0 0 3px rgba(0,0,0,.2), inset 0 1px 7px rgba(0,0,0,.4), 0 1px 0 rgba(255,255,255,.1);
}
#citation-properties menulist > .menulist-dropmarker {
-moz-appearance: none;
display: -moz-box;
background-color: transparent;
border: 0;
margin: 0;
padding: 0;
}
#citation-properties menulist > .menulist-dropmarker > .dropmarker-icon {
list-style-image: url("chrome://browser/skin/hud-style-dropmarker-double-arrows.png");
}

View file

@ -0,0 +1,42 @@
#quick-format-dialog {
background: transparent;
-moz-appearance: -moz-win-borderless-glass;
padding: 0;
}
#quick-format-search {
background: white;
padding: 2px 2px 2px 0;
border: 1px solid rgba(0, 0, 0, 0.5);
border-radius: 10px;
-moz-appearance: none;
}
#quick-format-dialog {
background: transparent;
-moz-appearance: none;
padding: 0;
}
#quick-format-search:not([multiline="true"]) {
height: 28px !important;
}
#quick-format-entry {
background: -moz-linear-gradient(-90deg, rgb(243,123,119) 0, rgb(180,47,38) 50%, rgb(156,36,27) 50%);
-moz-border-radius:15px;
padding: 10px;
}
#zotero-icon {
margin: 2px 0 0 2px;
-moz-appearance: none;
}
body {
line-height: 1.65em;
}
body[multiline="true"] {
padding-bottom: 2px;
}

View file

@ -35,16 +35,16 @@ var Zotero_QuickFormat = new function () {
this.onDOMContentLoaded = function() {
io = window.arguments[0].wrappedJSObject;
// Only hide chrome on Windows or Mac
if(Zotero.isMac || Zotero.isWin) {
document.documentElement.setAttribute("hidechrome", true);
}
qfs = document.getElementById("quick-format-search");
qfi = document.getElementById("quick-format-iframe");
qfb = document.getElementById("quick-format-entry");
qfbHeight = qfb.scrollHeight;
referencePanel = document.getElementById("quick-format-reference-panel");
referencePanel.addEventListener("popuphidden", _refocusQfe, false);
referencePanel.addEventListener("popupshown", _refocusQfe, false);
referencePanel.addEventListener("focus", _refocusQfe, false);
referencePanel.addEventListener("activate", _refocusQfe, false);
referencePanel.addEventListener("keypress", _onReferencePanelKeypress, false);
referenceBox = document.getElementById("quick-format-reference-list");
qfiWindow = qfi.contentWindow;
qfiDocument = qfi.contentDocument;
@ -103,6 +103,7 @@ var Zotero_QuickFormat = new function () {
function _refocusQfe() {
window.focus();
qfe.focus();
referencePanel.blur();
}
/**
@ -421,18 +422,19 @@ var Zotero_QuickFormat = new function () {
var numReferences = referenceBox.childNodes.length, height;
var qfeHeight = qfe.scrollHeight;
if(qfeHeight > 20) {
var height = (22-16+qfeHeight+(qfs.style.height == "22px" ? 2 : -2));
window.resizeTo(window.innerWidth, height+20);
qfs.style.height = height+"px";
qfe.style.lineHeight = "18px";
if(qfeHeight > 30) {
qfe.setAttribute("multiline", true);
qfs.setAttribute("multiline", true);
} else {
var height = 22;
window.resizeTo(window.innerWidth, height+20);
qfeHeight = qfe.scrollHeight;
var height = 4+qfeHeight;
qfs.style.height = height+"px";
qfe.style.lineHeight = "16px";
window.sizeToContent();
} else {
delete qfs.style.height;
qfe.removeAttribute("multiline");
qfs.removeAttribute("multiline");
window.sizeToContent();
}
var panelShowing = referencePanel.state === "open" || referencePanel.state === "showing";
@ -441,12 +443,12 @@ var Zotero_QuickFormat = new function () {
var height = referenceHeight ? Math.min(numReferences, SHOWN_REFERENCES)*referenceHeight+2 : 39;
if(panelShowing && height !== referencePanel.clientHeight) {
referencePanel.sizeTo((window.innerWidth-30), height);
referencePanel.sizeTo((window.outerWidth-30), height);
/*if(curResizer) curResizer.stop();
curResizer = new Resizer(referencePanel, null, height, 30, 1000);
curResizer.animate();*/
} else {
referencePanel.sizeTo((window.innerWidth-30), height);
referencePanel.sizeTo((window.outerWidth-30), height);
referencePanel.openPopup(document.documentElement, "after_start", 15, null,
false, false, null);
@ -454,7 +456,6 @@ var Zotero_QuickFormat = new function () {
referenceHeight = referenceBox.firstChild.scrollHeight;
height = Math.min(numReferences, SHOWN_REFERENCES)*referenceHeight+2;
referencePanel.sizeTo((window.innerWidth-30), height);
window.setTimeout(_refocusQfe, 100);
}
}
} else {
@ -634,79 +635,77 @@ var Zotero_QuickFormat = new function () {
* Handle return or escape
*/
function _onQuickSearchKeyPress(event) {
try {
var keyCode = event.keyCode;
if(keyCode === event.DOM_VK_RETURN || keyCode === event.DOM_VK_ENTER) {
var keyCode = event.keyCode;
if(keyCode === event.DOM_VK_RETURN || keyCode === event.DOM_VK_ENTER) {
event.preventDefault();
if(!_bubbleizeSelected()) {
_accept();
}
} else if(keyCode === event.DOM_VK_TAB || event.charCode === 59 /* ; */) {
event.preventDefault();
_bubbleizeSelected();
} else if(keyCode === event.DOM_VK_BACK_SPACE) {
_resize();
} else if(keyCode === event.DOM_VK_UP) {
var selectedItem = referenceBox.selectedItem;
var previousSibling;
if((previousSibling = selectedItem.previousSibling)) {
referenceBox.selectedItem = previousSibling;
referenceBox.ensureElementIsVisible(previousSibling);
event.preventDefault();
if(!_bubbleizeSelected()) {
_accept();
}
} else if(keyCode === event.DOM_VK_TAB || event.charCode === 59 /* ; */) {
event.preventDefault();
_bubbleizeSelected();
} else if(keyCode === event.DOM_VK_UP) {
var selectedItem = referenceBox.selectedItem;
var previousSibling;
if((previousSibling = selectedItem.previousSibling)) {
referenceBox.selectedItem = previousSibling;
referenceBox.ensureElementIsVisible(previousSibling);
event.preventDefault();
};
} else if(keyCode === event.DOM_VK_DOWN) {
if((Zotero.isMac ? event.metaKey : event.ctrlKey)) {
// If meta key is held down, show the citation properties panel
var selection = qfiWindow.getSelection();
var range = selection.getRangeAt(0);
// Check whether the bubble is selected
var endContainer = range.endContainer;
if(endContainer !== qfe) {
if(range.endContainer.citationItem) {
_showCitationProperties(range.endContainer);
} else if(endContainer.nodeType === Node.TEXT_NODE) {
if(endContainer.parentNode === qfe) {
var node = endContainer;
while((node = endContainer.previousSibling)) {
if(node.citationItem) {
_showCitationProperties(node);
event.preventDefault();
return;
}
};
} else if(keyCode === event.DOM_VK_DOWN) {
if((Zotero.isMac ? event.metaKey : event.ctrlKey)) {
// If meta key is held down, show the citation properties panel
var selection = qfiWindow.getSelection();
var range = selection.getRangeAt(0);
// Check whether the bubble is selected
var endContainer = range.endContainer;
if(endContainer !== qfe) {
if(range.endContainer.citationItem) {
_showCitationProperties(range.endContainer);
} else if(endContainer.nodeType === Node.TEXT_NODE) {
if(endContainer.parentNode === qfe) {
var node = endContainer;
while((node = endContainer.previousSibling)) {
if(node.citationItem) {
_showCitationProperties(node);
event.preventDefault();
return;
}
}
}
}
event.preventDefault();
return;
}
// Check whether there is a bubble in the range
var endOffset = range.endOffset;
var childNodes = qfe.childNodes;
for(var i=Math.min(endOffset, childNodes.length-1); i>=0; i--) {
var node = childNodes[i];
if(node.citationItem) {
_showCitationProperties(node);
event.preventDefault();
return;
}
// Check whether there is a bubble in the range
var endOffset = range.endOffset;
var childNodes = qfe.childNodes;
for(var i=Math.min(endOffset, childNodes.length-1); i>=0; i--) {
var node = childNodes[i];
if(node.citationItem) {
_showCitationProperties(node);
event.preventDefault();
return;
}
}
event.preventDefault();
} else {
var selectedItem = referenceBox.selectedItem;
var nextSibling;
if((nextSibling = selectedItem.nextSibling)) {
referenceBox.selectedItem = nextSibling;
referenceBox.ensureElementIsVisible(nextSibling);
event.preventDefault();
};
}
event.preventDefault();
} else {
// Use a timeout so that _quickFormat gets called after update
window.setTimeout(_quickFormat, 0);
var selectedItem = referenceBox.selectedItem;
var nextSibling;
if((nextSibling = selectedItem.nextSibling)) {
referenceBox.selectedItem = nextSibling;
referenceBox.ensureElementIsVisible(nextSibling);
event.preventDefault();
};
}
} catch(e) {
Zotero.logError(e);
} else {
// Use a timeout so that _quickFormat gets called after update
window.setTimeout(_quickFormat, 0);
}
}

View file

@ -25,22 +25,19 @@
-->
<?xml-stylesheet href="chrome://global/skin/" type="text/css"?>
<?xml-stylesheet href="chrome://global/skin/browser.css" type="text/css"?>
<?xml-stylesheet href="chrome://zotero/skin/zotero.css" type="text/css"?>
<?xml-stylesheet href="chrome://zotero/skin/overlay.css" type="text/css"?>
<?xml-stylesheet href="chrome://zotero-platform/content/overlay.css" type="text/css"?>
<?xml-stylesheet href="chrome://zotero/skin/integration.css" type="text/css"?>
<?xml-stylesheet href="chrome://zotero-platform/content/integration.css" type="text/css"?>
<!DOCTYPE window SYSTEM "chrome://zotero/locale/zotero.dtd">
<window
id="zotero-quick-format-dialog"
id="quick-format-dialog"
orient="vertical"
title="Quick Format Citation"
width="500" height="44"
width="600" height="42"
xmlns:html="http://www.w3.org/1999/xhtml"
xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"
persist="screenX screenY"
style="background: transparent; -moz-appearance:none; padding: 0"
hidechrome="true" onkeypress="Zotero_QuickFormat.onKeyPress(event)">
onkeypress="Zotero_QuickFormat.onKeyPress(event)">
<script src="../include.js"/>
<script src="quickFormat.js"/>
@ -60,13 +57,12 @@
oncommand="Zotero_QuickFormat.onClassicViewCommand()"/>
</menupopup>
</toolbarbutton>
<!-- javascript:encodeURIComponent('<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head><link rel="stylesheet" type="text/css" href="chrome://zotero/skin/integration.css"/></head><body id="quick-format-editor"/></html>') -->
<iframe id="quick-format-iframe" ondragstart="event.stopPropagation()" src="data:application/xhtml+xml,%3C!DOCTYPE%20html%20PUBLIC%20%22-%2F%2FW3C%2F%2FDTD%20XHTML%201.0%20Strict%2F%2FEN%22%20%22http%3A%2F%2Fwww.w3.org%2FTR%2Fxhtml1%2FDTD%2Fxhtml1-strict.dtd%22%3E%3Chtml%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F1999%2Fxhtml%22%3E%3Chead%3E%3Clink%20rel%3D%22stylesheet%22%20type%3D%22text%2Fcss%22%20href%3D%22chrome%3A%2F%2Fzotero%2Fskin%2Fintegration.css%22%2F%3E%3C%2Fhead%3E%3Cbody%20contenteditable%3D%22true%22%20id%3D%22quick-format-editor%22%2F%3E%3C%2Fhtml%3E"
<iframe id="quick-format-iframe" ondragstart="event.stopPropagation()" src="data:application/xhtml+xml,%3C!DOCTYPE%20html%20PUBLIC%20%22-//W3C//DTD%20XHTML%201.0%20Strict//EN%22%20%22http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd%22%3E%3Chtml%20xmlns=%22http://www.w3.org/1999/xhtml%22%3E%3Chead%3E%3Clink%20rel=%22stylesheet%22%20type=%22text/css%22%20href=%22chrome://zotero/skin/integration.css%22/%3E%3Clink%20rel=%22stylesheet%22%20type=%22text/css%22%20href=%22chrome://zotero-platform/content/integration.css%22/%3E%3C/head%3E%3Cbody%20contenteditable=%22true%22%20id=%22quick-format-editor%22/%3E%3C/html%3E"
tabindex="1" flex="1"/>
</hbox>
</hbox>
</vbox>
<panel id="quick-format-reference-panel" noautofocus="true" noautohide="true" norestorefocus="true" onfocus="window.focus()" onpopupshowing="window.focus()">
<panel id="quick-format-reference-panel" noautofocus="true" norestorefocus="true">
<richlistbox id="quick-format-reference-list" flex="1"/>
</panel>
<panel id="citation-properties" type="arrow" orient="vertical" onkeypress="Zotero_QuickFormat.onPanelKeyPress(event)">

View file

@ -122,10 +122,6 @@
border-color: #6d95e0;
}
.quick-format-bubble:hover {
background-color: #bbcef1;
}
.quick-format-bubble[selected="true"] {
-moz-border-radius: 8px !important;
background-color: #598bec;
@ -135,30 +131,14 @@
#quick-format-search {
margin: 0;
padding: 0;
background: white;
height: 22px;
padding-top: 0;
padding-bottom: 0;
-moz-appearance: searchfield;
}
#quick-format-search[multiline="true"] {
padding: 2px 2px 0 18px;
border: 1px solid rgba(0, 0, 0, 0.5);
border-radius: 10px;
-moz-appearance: none;
}
#quick-format-search[multiline="true"] > #quick-format-iframe {
margin: -1px 0 0 0;
}
body {
margin: 0 2px 0 2px;
padding: 0;
font: -moz-field;
font-size: 11px;
line-height: 16px;
overflow: hidden;
}
@ -167,7 +147,6 @@ body {
font: -moz-field;
-moz-user-focus: normal;
padding: 5px;
max-height: 39px;
}
.quick-format-item:not(:last-child) {
@ -181,15 +160,10 @@ richlistitem[selected="true"] {
color: HighlightText;
}
#quick-format-entry {
background: -moz-linear-gradient(-90deg, rgb(243,123,119) 0, rgb(180,47,38) 50%, rgb(156,36,27) 50%);
-moz-border-radius:15px;
padding: 10px;
}
#quick-format-reference-panel {
margin: 0;
padding: 0;
border: none;
background: white;
opacity: 0.9;
-moz-user-focus: ignore;
@ -201,50 +175,11 @@ richlistitem[selected="true"] {
-moz-user-focus: ignore;
}
#citation-properties menulist {
-moz-appearance: none; color: #fff;
text-shadow: 0 -1px 0 rgba(0,0,0,.5);
border-radius: 12px;
border: 1px solid rgba(0,0,0,.65);
background: -moz-linear-gradient(rgba(110,110,110,.9), rgba(70,70,70,.9) 49%, rgba(50,50,50,.9) 51%, rgba(40,40,40,.9));
box-shadow: inset 0 1px 0 rgba(255,255,255,.2), inset 0 0 1px rgba(255,255,255,.1), 0 1px 0 rgba(255,255,255,.1);
background-clip: padding-box;
background-origin: padding-box;
padding: 2px 9px;
border-radius: 3px;
min-height: 22px;
-moz-padding-start: 4px;
-moz-padding-end: 0;
}
#citation-properties menulist:-moz-focusring {
box-shadow: 0 0 1px -moz-mac-focusring inset, 0 0 4px 1px -moz-mac-focusring, 0 0 2px 1px -moz-mac-focusring;
}
#citation-properties menulist[open="true"],
#citation-properties menulist:hover:active {
background: -moz-linear-gradient(rgba(40,40,40,.9), rgba(70,70,70,.9));
box-shadow: inset 0 0 3px rgba(0,0,0,.2), inset 0 1px 7px rgba(0,0,0,.4), 0 1px 0 rgba(255,255,255,.1);
}
#citation-properties menulist > .menulist-dropmarker {
-moz-appearance: none;
display: -moz-box;
background-color: transparent;
border: 0;
margin: 0;
padding: 0;
}
#citation-properties menulist > .menulist-dropmarker > .dropmarker-icon {
list-style-image: url("chrome://browser/skin/hud-style-dropmarker-double-arrows.png");
}
#zotero-icon {
list-style-image: url("chrome://zotero/skin/zotero-new-z-16px.png");
background-color: #fff;
margin: 0 0 0 -13px;
padding: 0;
margin: 0;
}
#zotero-icon .toolbarbutton-text {
@ -254,6 +189,8 @@ richlistitem[selected="true"] {
#zotero-icon .toolbarbutton-icon {
width: 16px;
height: 16px;
padding: 0;
margin: 0;
}
#citation-properties #suppress-author {