first round of UI improvements:

- new front page
- new header
- improved about and preference pages
- new project tabs and header
- new buttons
- new logos



git-svn-id: http://google-refine.googlecode.com/svn/trunk@1533 7d457c2a-affb-35e4-300a-418c747d4874
This commit is contained in:
James Home 2010-10-14 17:39:41 +00:00
parent 4ccdbc8716
commit d6015f783c
31 changed files with 737 additions and 964 deletions

View File

@ -152,7 +152,7 @@ function init() {
[
"externals/jquery-ui/css/ui-lightness/jquery-ui-1.8.custom.css",
"styles/common.less",
"styles/freebase.less",
"styles/pure.css",
"styles/index.less",
"styles/jquery-ui-overrides.less"
]
@ -227,6 +227,7 @@ function init() {
"externals/imgareaselect/css/imgareaselect-default.css",
"styles/common.less",
"styles/pure.css",
"styles/jquery-ui-overrides.less",
"styles/util/menu.less",
@ -236,8 +237,6 @@ function init() {
"styles/project.less",
"styles/project/browsing.less",
"styles/project/process.less",
"styles/project/extension-bar.less",
"styles/project/summary-widget.less",
"styles/widgets/history.less",
"styles/widgets/histogram-widget.less",
@ -274,10 +273,9 @@ function init() {
[
"externals/suggest/css/suggest-1.2.min.css",
"externals/jquery-ui/css/ui-lightness/jquery-ui-1.8.custom.css",
"styles/common.less",
"styles/pure.css",
"styles/jquery-ui-overrides.less",
"styles/preferences.less"
]
);
}

View File

@ -1,92 +1,42 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<!DOCTYPE html>
<html>
<head>
<title>About Google Refine</title>
<head>
<title>About - Google Refine</title>
<link rel="icon" type="image/png" href="images/favicon.png">
<link rel="stylesheet" href="/styles/common.less" />
<link rel="stylesheet" href="/styles/index.less" />
<script type="text/javascript" src="scripts/version.js"></script>
<script type="text/javascript" src="externals/jquery-1.4.2.min.js"></script>
<script>
$(function() {
if (GoogleRefineVersion && GoogleRefineVersion.version) {
if (GoogleRefineVersion.version != "$VERSION") {
$("#version").text("Version " + GoogleRefineVersion.version + " [" + GoogleRefineVersion.revision + "]").show();
}
if (GoogleRefineVersion && GoogleRefineVersion.version) {
if (GoogleRefineVersion.version != "$VERSION") {
$("#version").text("Version " + GoogleRefineVersion.version + " [" + GoogleRefineVersion.revision + "]").show();
}
else {
$("#version").text("Version <trunk>").show();
}
}
});
</script>
<style>
#body {
margin: 0em;
padding: 40px;
}
h1 {
font-family: helvetica;
font-weight: normal;
letter-spacing: -0.04em;
}
h1 + h2 {
font-family: myriad pro, tahoma;
font-weight: normal;
position: relative;
bottom: 1em;
letter-spacing: 0.3em;
font-size: 130%;
margin: 0em;
padding: 0em;
color: #888;
}
#about p {
width: 40em;
}
.license {
font-family: monospace;
font-size: 12px;
white-space: pre;
border: 1px solid #ddd;
background: #eee;
padding: 20px;
width: 60em;
}
h2 {
margin-top: 2em;
color: #888;
}
ul.credit-entries {
margin: 0;
padding: 0;
}
ul.credit-entries li {
display: block;
margin: 1em 0;
}
</style>
</head>
<body>
</head>
<body>
<div id="header">
<a id="app-home-button" href="./"><img alt="Google Refine" src="images/google-refine-home-button.png" /></a>
<div id="path"><span class="app-path-section">About</span></div>
<a id="app-home-button" href="./"><img alt="Google Refine" src="images/logo-googlerefine-30.png" width="129" height="29" /></a>
</div>
<div id="body">
<h1>About Google Refine</h1>
<h2 id="version" style="display: none"></h2>
<div id="body-info">
<h1>About Google Refine</h1>
<h2 id="version" style="display: none"></h2>
<p>
Google Refine is a power tool for working with messy data. Use it to improve data consistency, link it to data registries like Freebase, augment it with data from other sources, transform it into different formats for other tools to consume, and contribute it to back to the original sources. Google Refine is not a web service but a desktop app that runs on your own computer, so you can process sensitive data with privacy.
</p>
<p>
Google Refine was originally developed as Gridworks by <a href="http://www.metaweb.com/">Metaweb, Inc.</a>. Metaweb was acquired by <a href="http://www.google.com/">Google</a> in July 2010.
</p>
<div id="about">
<p>
Google Refine is a power tool that allows you to load data,
understand it, clean it up, reconcile it internally, and augment it
with data coming from Freebase and other web sources. All with the comfort and privacy of
your own computer.</p>
<p>
It was originally developed by <a href="http://www.metaweb.com/">Metaweb Technologies, Inc.</a>.
Metaweb was acquired by <a href="http://www.google.com/">Google, Inc.</a>, in July 2010.
</p>
<h2>License</h2>
<h2>Google Refine License</h2>
<pre class="license">/*
* Copyright (c) 2010, Google, Inc. All rights reserved.
@ -118,7 +68,7 @@
*
*/</pre>
<h2>Dependencies Licenses</h2>
<h2>Dependencies Licenses</h2>
<pre class="license">Apache License 2.0
------------------
@ -149,7 +99,6 @@ LGPL
licenses/marj4j.LICENSE.txt
marc4j
BSD
---
@ -204,24 +153,23 @@ Flag icon
http://pixel-mixer.com/category/free-icons/
</pre>
<h2>Credits</h2>
<ul class="credit-entries">
<li><a href="http://www.freebase.com/view/en/david_francois_huynh">David Huynh</a></li>
<li><a href="http://www.freebase.com/view/en/stefano_mazzocchi">Stefano Mazzocchi</a></li>
<li><a href="http://www.freebase.com/view/en/vishal_talwar">Vishal Talwar</a></li>
<li><a href="http://www.freebase.com/view/en/will_moffat">Will Moffat</a></li>
<li><a href="http://www.freebase.com/view/en/jeff_fry">Jeff Fry</a></li>
<li><a href="http://www.freebase.com/view/en/james_home">James Home</a></li>
<li><a href="http://www.freebase.com/view/m/046vz5k">Iain Sproat</a></li>
<li><a href="http://www.freebase.com/view/user/tfmorris">Tom Morris</a></li>
<li><a href="http://www.freebase.com/view/user/heathercampbell">Heather Campbell</a></li>
</ul>
<h2>Credits</h2>
<ul>
<li><a href="http://www.freebase.com/view/en/david_francois_huynh">David Huynh</a></li>
<li><a href="http://www.freebase.com/view/en/stefano_mazzocchi">Stefano Mazzocchi</a></li>
<li><a href="http://www.freebase.com/view/en/vishal_talwar">Vishal Talwar</a></li>
<li><a href="http://www.freebase.com/view/en/will_moffat">Will Moffat</a></li>
<li><a href="http://www.freebase.com/view/en/jeff_fry">Jeff Fry</a></li>
<li><a href="http://www.freebase.com/view/en/james_home">James Home</a></li>
<li><a href="http://www.freebase.com/view/m/046vz5k">Iain Sproat</a></li>
<li><a href="http://www.freebase.com/view/user/tfmorris">Tom Morris</a></li>
<li><a href="http://www.freebase.com/view/user/heathercampbell">Heather Campbell</a></li>
</ul>
<h2>Special Thanks</h2>
<ul class="credit-entries">
<li><a href="http://www.paolociccarese.info/">Paolo Ciccarese</a></li>
</ul>
</div>
<h2>Special Thanks</h2>
<ul>
<li><a href="http://www.paolociccarese.info/">Paolo Ciccarese</a></li>
</ul>
</div>
</body>
</body>
</html>

View File

@ -1,45 +0,0 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>Error - Google Refine</title>
<link rel="icon" type="image/png" href="images/favicon.png">
<link rel="stylesheet" href="styles/common.less" />
<link rel="stylesheet" href="styles/error.less" />
<script type="text/javascript" src="externals/jquery-1.4.2.min.js"></script>
<script type="text/javascript" src="scripts/util/url.js"></script>
<script>
$(function() {
var params = URL.getParameters();
$("#message").text(params.msg.replace(/\+/g, ' '));
window.setTimeout(function() {
document.location.href = params.redirect;
}, 20000);
});
</script>
</head>
<body>
<div id="header">
<a id="app-home-button" href="./"><img alt="Google Refine" src="images/google-refine-home-button.png" /></a>
<div id="path"><span class="app-path-section">Error</span></div>
</div>
<div id="body">
<h1>Oops, something went wrong!</h1>
<p id="message"></p>
<p>Redirecting you back to <a href="/">Google Refine' home page</a> in 20 seconds ...</p>
</div>
<div id="footer">
<a href="about.html">About Google Refine</a>
&bull;
&copy; 2010 <a href="http://www.google.com/">Google, Inc.</a>
</div>
</body>
</html>

View File

@ -1,25 +1,19 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Error - Google Refine</title>
<link rel="icon" type="image/png" href="/images/favicon.png">
<link rel="icon" type="image/png" href="images/favicon.png">
<link rel="stylesheet" href="/styles/common.less" />
<link rel="stylesheet" href="/styles/error.less" />
</head>
<body>
</head>
<body>
<div id="header">
<a id="app-home-button" href="/"><img alt="Google Refine" src="/images/google-refine-home-button.png" /></a>
<div id="path"><span class="app-path-section">Error</span></div>
<a id="app-home-button" href="/"><img alt="Google Refine" src="/images/logo-googlerefine-30.png" width="129" height="29" /></a>
</div>
<div id="body">
<h1>Oops, something went wrong!</h1>
<p id="message">$message</p>
<pre>$stack</pre>
<div id="body-info">
<h1>Something went wrong!</h1>
<h2>$message:</h2>
<pre class="errorstack">$stack</pre>
</div>
</body>
</html>
</body>
</html>

Binary file not shown.

After

Width:  |  Height:  |  Size: 7.9 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.0 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 3.4 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 4.0 KiB

View File

@ -1,125 +1,131 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<!doctype html>
<html lang="en">
<head>
<title>Google Refine</title>
<link rel="icon" type="image/png" href="images/favicon.png">
$scriptInjection
$styleInjection
<meta charset="utf-8">
<title>Google Refine</title>
<link rel="icon" type="image/png" href="images/favicon.png">
$scriptInjection
$styleInjection
</head>
<body>
<div id="header">
<span id="google-refine-version"></span>
<a id="app-home-button" href="./"><img alt="Google Refine" src="images/google-refine-home-button.png" /></a>
<div id="path">&nbsp;</div>
<div id="container">
<div id="header-home">
<img alt="Google Refine" src="images/logo-googlerefine-40.png" />
<h1>A power tool for working with messy data.</h1>
</div>
<div id="body">
<div class="grid-layout layout-loose"><table>
<tr>
<td id="welcome-panel">
<h1>Welcome to Google Refine</h1>
<p>Google Refine is a power tool that allows you to load data, understand it,
clean it up, reconcile it internally, augment it with data coming from
<a href="http://www.freebase.com/" class="quiet-link">Freebase</a>, and optionally
contribute your data to Freebase for others to use.
</p>
<p><a href="about.html" class="quiet-link">Credits and Licenses &raquo;</a>
</p>
</td>
<td id="projects-panel">
<div class="island">
<div id="projects" class="round-corners">
<h1>Open a Project</h1>
<div id="projects-container"></div>
<div id="content-home">
<div id="project-open">
<h1>Open a Project</h1>
<div id="projects-container"></div>
</div>
<div id="project-create">
<form id="file-upload-form" method="post" enctype="multipart/form-data" action="/command/core/create-project-from-upload" accept-charset="UTF-8">
<h1>Create a New Project</h1>
<h2 id="project-toggle">
<a class="secondary" href="javascript:showHide('file-upload-form', 'project-upload-form')">or Import an Existing Project</a>
</h2>
<div class="project-create-basic">
<table class="form-table">
<tr>
<th><label for="project-file">Data file:</label></th>
<td><input type="file" id="project-file-input" name="project-file" /></td>
</tr>
<tr>
<th><label for="project-url">or data file URL:</label></th>
<td><input type="text" id="project-url-input" name="project-url" size="40" /></td>
</tr>
<tr>
<th><label for="project-name">Project name:</label></th>
<td><input type="text" size="25" id="project-name-input" name="project-name" /></td></tr>
<tr>
<td></td>
<td><input type="submit" value="Create Project" id="upload-file-button" class="button button-primary" /></td>
</tr>
</table>
</div>
<div class="project-create-advanced">
<h2>Advanced Options</h2>
<div class="project-create-option">
Limit load to:
<div class="project-create-suboption">
<input type="text" id="limit-input" name="limit" size="5" /> rows (blank for all)
</div>
</div>
</td>
<td id="forms">
<div class="island">
<form id="file-upload-form" method="post" enctype="multipart/form-data" action="/command/core/create-project-from-upload" accept-charset="UTF-8">
<div id="form-tabs-create-project" class="round-corners">
<a class="form-tab-link" href="javascript:showHide('file-upload-form', 'project-upload-form')">or Import an Existing Project</a>
<h1>Create a New Project</h1>
<div class="grid-layout layout-tight layout-full"><table>
<tr><td><span class="field-label">Data File</span>:</td>
<td><input type="file" id="project-file-input" name="project-file" /></td>
</tr>
<tr><td><span class="field-label">Or Data File URL</span>:</td>
<td><input id="project-url-input" name="project-url" size="50" /></td>
</tr>
<tr><td><span class="field-label">Project Name</span>:</td>
<td><input type="text" size="30" id="project-name-input" name="project-name" /></td></tr>
<tr><td></td>
<td><input type="submit" value="Create Project" id="upload-file-button" class="button-primary" /></td></tr>
</table></div>
</div>
<div id="form-create-project-more-options">
<h2>Advanced Options</h2>
<table><tr>
<td>
<div class="field-label">Limit load to:</div>
<div class="field-body"><input id="limit-input" name="limit" size="5" /> rows (blank for all)</div>
<div class="field-label">Ignore:</div>
<div class="field-body"><input id="ignore-input" name="ignore" size="5" value="0" /> initial non-blank lines</div>
<div class="field-label">Skip:</div>
<div class="field-body"><input id="skip-input" name="skip" size="5" value="0" /> initial data rows</div>
</td>
<td>
<div class="field-label">When parsing text files:</div>
<div class="field-group">
<div><input id="split-into-columns-input" type="checkbox" checked="true" name="split-into-columns" /> Split into columns</div>
<div>Column separator:
<input id="separator-input" name="separator" size="2" /></div>
<div class="field-hint">leave blank to guess comma or tab</div>
</div>
<div class="field-group">
<div><input id="guess-value-type-input" name="guess-value-type" type="checkbox" checked="true" /> Guess cells' value types</div>
<div class="field-hint">try to parse numbers, dates, etc.</div>
</div>
<div class="field-group">
<div>Header lines:
<input id="header-lines-input" name="header-lines" size="5" value="1" /></div>
<div class="field-hint">use 0 if there is no header line</div>
</div>
<div class="field-group">
<div><input id="ignore-quotes-input" name="ignore-quotes" type="checkbox" />Ignore Quotation Marks </div>
<div class="field-hint">Ignore quotation marks,<br/>using all newlines and separators</div>
</div>
</td>
</tr></table>
</div>
</form>
<form id="project-upload-form" method="post" enctype="multipart/form-data" action="/command/core/import-project" accept-charset="UTF-8" style="display:none;">
<div id="form-tabs-import-project" class="round-corners">
<a class="form-tab-link" href="javascript:showHide('project-upload-form', 'file-upload-form')">or Create a New Project</a>
<h1>Import an Existing Project</h1>
<p>Import an existing Google Refine .tar or .tar.gz file:</p>
<div class="grid-layout layout-tight"><table>
<tr><td class="field-label">Project File:</td><td><input type="file" id="project-tar-file-input" name="project-file" /></td></tr>
<tr><td class="field-label">Rename (optional):</td><td><input type="text" size="30" id="project-name-input" name="project-name" /></td></tr>
<tr><td></td><td><input type="submit" value="Import Project" id="import-project-button" class="button-primary" /></td></tr>
</table></div>
</div>
</form>
<div class="project-create-option">
Ignore:
<div class="project-create-suboption">
<input type="text" id="ignore-input" name="ignore" size="5" value="0" /> initial non-blank lines
</div>
</div>
</td>
</tr>
</table></div>
<div class="project-create-option">
Skip:
<div class="project-create-suboption">
<input type="text" id="skip-input" name="ignore" size="5" value="0" /> initial data rows
</div>
</div>
<div id="project-create-parsetext">
<div class="project-create-option">
When parsing text files:
<div class="project-create-suboption">
<input id="split-into-columns-input" type="checkbox" checked="true" name="split-into-columns" />
Split into columns
</div>
<div class="project-create-suboption">
Column separator:
<input type="text" id="separator-input" name="separator" size="2" /><br />
(leave blank to auto-detect)
</div>
<div class="project-create-suboption">
<input type="checkbox" id="guess-value-type-input" name="guess-value-type" checked="true" />
Auto-detect value types<br />
(numbers, dates, etc)
</div>
<div class="project-create-suboption">
Header lines: <input type="text" id="header-lines-input" name="header-lines" size="5" value="1" /><br />
(use 0 if your data has no header)
</div>
<div class="project-create-suboption">
<input type="checkbox" id="ignore-quotes-input" name="ignore-quotes" />
Ignore quotation marks
</div>
</div>
</div>
</div>
</form>
<form id="project-upload-form" method="post" enctype="multipart/form-data" action="/command/core/import-project" accept-charset="UTF-8" style="display:none;">
<h1>Import an Existing Project</h1>
<h2 id="project-toggle">
<a class="secondary" href="javascript:showHide('project-upload-form', 'file-upload-form')">or Create a New Project</a>
</h2>
<div class="project-create-basic">
<p>Import an existing Google Refine .tar or .tar.gz project file:</p>
<table class="form-table">
<tr>
<th><label for="project-file">Project file:</label></th>
<td><input type="file" id="project-tar-file-input" name="project-file" /></td>
</tr>
<tr>
<th><label for="project-name">Project name (optional):</label></th>
<td><input type="text" size="25" id="project-name-input" name="project-name" /></td></tr>
<tr>
<td></td>
<td><input type="submit" value="Import Project" id="import-project-button" class="button button-primary" /></td>
</tr>
</table>
</div>
</form>
</div>
<div id="project-links">
<ul>
<li><a href="/about.html">About Google Refine</a></li>
<li><a href="https://code.google.com/p/google-refine/">Project Home Page</a></li>
<li><a href="http://vimeo.com/groups/gridworks/videos">Screencasts</a></li>
</ul>
<div id="google-refine-version"></div>
</div>
</div>
</div>
</body>
</html>

View File

@ -1,24 +1,20 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<!doctype html>
<html lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>Google Refine - Preferences</title>
<script type="text/javascript" src="wirings.js"></script>
$scriptInjection
<link rel="icon" type="image/png" href="images/favicon.png" />
$styleInjection
<meta charset="utf-8">
<title>Preferences - Google Refine</title>
<link rel="icon" type="image/png" href="images/favicon.png">
<script type="text/javascript" src="wirings.js"></script>
$scriptInjection
$styleInjection
</head>
<body>
<div id="header">
<a id="app-home-button" href="./"><img alt="Google Refine" src="images/google-refine-home-button.png" /></a>
<div id="path"><span class="app-path-section">Preferences</span></div>
</div>
<div id="body">
<div id="loading-message"><img src="images/large-spinner.gif" /> starting up ...</div>
</div>
<div id="header">
<a id="app-home-button" href="./"><img alt="Google Refine" src="images/logo-googlerefine-30.png" width="129" height="29" /></a>
</div>
<div id="body-info">
<div id="loading-message"><img src="images/large-spinner.gif" /> Loading...</div>
</div>
</body>
</html>

View File

@ -1,55 +1,49 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Google Refine</title>
<script type="text/javascript">var theProject = { id : $projectID };</script>
<script type="text/javascript" src="wirings.js"></script>
<link rel="icon" type="image/png" href="images/favicon.png">
$scriptInjection
<link rel="icon" type="image/png" href="images/favicon.png" />
$styleInjection
</head>
<body>
</head>
<body>
<div id="header">
<a id="app-home-button" href="./"><img alt="Google Refine" src="images/google-refine-home-button.png" /></a>
<div id="path"><table id="header-layout"><tr>
<td id="header-layout-left">
<span id="project-name-button" class="app-path-section" title="Click to rename project"></span>
<a id="project-permalink-button" href="javascript:{}" class="permalink">Permalink</a></td>
<td id="header-layout-right">
<a class="app-menu-button" bind="exportButton" id="export-button" href="#export">Export</a>
</td></tr>
</table></div>
<a id="app-home-button" href="./"><img alt="Google Refine" src="images/logo-googlerefine-30.png" width="129" height="29" /></a>
<div id="project-title">
<span id="project-name-button" class="app-path-section" title="Click to rename project"></span>
<a id="project-permalink-button" href="javascript:{}" class="secondary">Permalink</a>
</div>
<div id="project-controls"><a class="button button-primary" bind="exportButton" id="export-button" href="#export">Export</a></div>
</div>
<div id="loading-message"><img src="images/large-spinner.gif" /> starting up ...</div>
<div id="loading-message"><img src="images/large-spinner.gif" /> Starting up...</div>
<div id="body">
<div bind="leftPanel" id="left-panel">
<div bind="leftPanelTabs" class="refine-tabs">
<ul>
<li><a href="#refine-tabs-facets">Facet/Filter</a></li>
<li><a href="#refine-tabs-history" bind="historyTabHeader">Undo/Redo</a></li>
<li><a href="#refine-tabs-facets">Facet / Filter</a></li>
<li><a href="#refine-tabs-history" bind="historyTabHeader">Undo / Redo</a></li>
</ul>
<div id="refine-tabs-facets" bind="facetPanel" id="facet-panel"></div>
<div id="refine-tabs-history" bind="historyPanel" id="history-panel"></div>
</div>
</div>
<div bind="rightPanel" id="right-panel">
<div bind="toolPanel" id="tool-panel"><table id="tool-panel-layout"><tr>
<td id="summary-bar-container"><div bind="summaryBar" id="summary-bar">
<!-- row/record counts displayed here-->
</div></td>
<td id="extension-bar-container"><div bind="extensionBar" id="extension-bar">Extensions:&nbsp;<span bind="menuContainer" id="extension-bar-menu-container"></span>&nbsp;<a>Customize...</a></div></td>
</tr></table></div>
<div bind="toolPanel" id="tool-panel">
<div bind="summaryBar" id="summary-bar">
<!-- row/record counts -->
</div>
<div bind="extensionBar" id="extension-bar">
Extensions: <span bind="menuContainer" id="extension-bar-menu-container"></span> <a href="" class="secondary">Customize...</a>
</div>
</div>
<div bind="viewPanel" id="view-panel"></div>
</div>
<div bind="processPanel" id="process-panel"></div>
</div>
</body>
</body>
</html>

View File

@ -97,11 +97,11 @@ function renderProjects(data) {
if (!projects.length) {
$('<div>')
.addClass("message")
.text("No existing project. Use form on right to create.")
.text("You don't have any projects yet. Create one now!")
.appendTo(container);
} else {
var table = $(
'<table><tr>' +
'<table class="list-table"><tr>' +
'<th>Name</th>' +
'<th></th>' +
'<th align="right">Last Modified</th>' +
@ -114,6 +114,7 @@ function renderProjects(data) {
tr.className = "project";
var nameLink = $('<a></a>')
.addClass("list-table-itemname")
.text(project.name)
.attr("href", "/project?project=" + project.id)
.appendTo(tr.insertCell(tr.cells.length));
@ -123,7 +124,7 @@ function renderProjects(data) {
.attr("href", "javascript:{}")
.css("visibility", "hidden")
.click(function() {
var name = window.prompt("Rename Project", project.name);
var name = window.prompt("New project name:", project.name);
if (name == null) {
return;
}

View File

@ -12,11 +12,11 @@ function onLoad() {
$(onLoad);
function populatePreferences(prefs) {
var body = $("#body").empty();
var body = $("#body-info").empty();
$('<h1>').text("Preferences").appendTo(body);
var table = $('<table>').addClass("preferences").html('<tr><th>Key</th><th>Value</th><td></td></tr>').appendTo(body)[0];
var table = $('<table>').addClass("list-table").addClass("preferences").html('<tr><th>Key</th><th>Value</th><th></th></tr>').appendTo(body)[0];
for (var k in prefs) {
var tr = table.insertRow(table.rows.length);
preferenceUIs.push(new PreferenceUI(tr, k, prefs[k]));
@ -24,10 +24,12 @@ function populatePreferences(prefs) {
var trLast = table.insertRow(table.rows.length);
var tdLast0 = trLast.insertCell(0);
trLast.insertCell(1);
trLast.insertCell(2);
$('<button>').text("Add Preference").appendTo(tdLast0).click(function() {
var key = window.prompt("Preference Key");
var key = window.prompt("Preference key:");
if (key) {
var value = window.prompt("Preference Value");
var value = window.prompt("Preference key value:");
if (value != null) {
var tr = table.insertRow(table.rows.length - 1);
preferenceUIs.push(new PreferenceUI(tr, key, value));
@ -62,7 +64,7 @@ function PreferenceUI(tr, key, value) {
var td2 = tr.insertCell(2);
$('<button>').text("Edit").appendTo(td2).click(function() {
var newValue = window.prompt("Value of preference key " + key, value);
var newValue = window.prompt("Change value of preference key " + key, value);
if (newValue != null) {
$(td1).text(newValue);
$.post(

View File

@ -70,7 +70,8 @@ function resizeAll() {
function initializeUI(uiState) {
$("#loading-message").hide();
$("#header-layout").show();
$("#project-title").show();
$("#project-controls").show();
$("#body").show();
$('#project-name-button').click(Refine._renameProject);
@ -139,7 +140,7 @@ Refine.reinitializeProjectData = function(f) {
};
Refine._renameProject = function() {
var name = window.prompt("Rename Project", theProject.metadata.name);
var name = window.prompt("New project name:", theProject.metadata.name);
if (name == null) {
return;
}

View File

@ -37,7 +37,7 @@ ExtensionBar.prototype._initializeUI = function() {
ExtensionBar.prototype._createMenuButton = function(label, submenu) {
var self = this;
var menuItem = $("<a>").addClass("app-menu-button").text(label);
var menuItem = $("<a>").addClass("button").text(label);
menuItem.click(function(evt) {
MenuSystem.createAndShowStandardMenu(

View File

@ -11,10 +11,9 @@ SummaryWidget.prototype.updateResultCount = function() {
var summaryText;
var units = theProject.rowModel.mode == "row-based" ? "rows" : "records";
if (theProject.rowModel.filtered == theProject.rowModel.total) {
summaryText = '<span class="summaryWidget-rowCount">' + (theProject.rowModel.total) + ' ' + units + '</span>';
summaryText = (theProject.rowModel.total) + ' ' + units;
} else {
summaryText = '<span class="summaryWidget-rowCount">' +
(theProject.rowModel.filtered) + ' matching ' + units + '</span>' + ' (' + (theProject.rowModel.total) + ' total)';
summaryText = (theProject.rowModel.filtered) + ' matching ' + units + ' <span id="summary-total">(' + (theProject.rowModel.total) + ' total)</span>';
}
$('<span>').html(summaryText).appendTo(this._div.empty());

View File

@ -33,19 +33,17 @@ DataTableView.prototype.render = function() {
var scrollLeft = (oldTableDiv.length > 0) ? oldTableDiv[0].scrollLeft : 0;
var html = $(
'<table class="viewPanel-header">' +
'<tr>' +
'<td bind="rowRecordControls">Show as ' +
'<span bind="modeSelectors" class="viewPanel-browsingModes">' +
'<input type="radio" id="viewPanel-browsingMode-row-based" name="viewPanel-browsingMode" value="row-based" /><label for="viewPanel-browsingMode-row-based">rows</label>' +
'<input type="radio" id="viewPanel-browsingMode-record-based" name="viewPanel-browsingMode" value="record-based" /><label for="viewPanel-browsingMode-record-based">records</label>' +
'</span>' +
'</td>' +
'<td bind="pageSizeControls"></td>' +
'<td bind="sortingControls" align="center"></td>' +
'<td bind="pagingControls" align="right"></td>' +
'</tr>' +
'</table>' +
'<div id="viewPanel-header">' +
'<div bind="rowRecordControls">Show as ' +
'<span bind="modeSelectors" class="viewPanel-browsingmodes">' +
'<input type="radio" id="viewPanel-browsingMode-row-based" name="viewPanel-browsingMode" value="row-based" /><label for="viewPanel-browsingMode-row-based">rows</label>' +
'<input type="radio" id="viewPanel-browsingMode-record-based" name="viewPanel-browsingMode" value="record-based" /><label for="viewPanel-browsingMode-record-based">records</label>' +
'</span>' +
'</div>' +
'<div bind="pageSizeControls"></div>' +
'<div bind="sortingControls" align="center"></div>' +
'<div bind="pagingControls" align="right"></div>' +
'</div>' +
'<div bind="dataTableContainer" class="data-table-container" style="display: none;"><table bind="table" class="data-table" cellspacing="0"></table></div>'
);
var elmts = DOM.bind(html);
@ -79,7 +77,7 @@ DataTableView.prototype._renderSortingControls = function(sortingControls) {
$('<a href="javascript:{}"></a>')
.addClass("action")
.text("Sorted")
.text("Sort")
.append($('<img>').attr("src", "/images/down-arrow.png"))
.appendTo(sortingControls)
.click(function() {

View File

@ -30,7 +30,7 @@ HistoryWidget.prototype.update = function(onDone) {
HistoryWidget.prototype._render = function() {
var self = this;
this._tabHeader.html('Undo/Redo <span class="count">' + this._data.past.length + '</span>');
this._tabHeader.html('Undo / Redo <span class="count">' + this._data.past.length + '</span>');
this._div
.empty()

View File

@ -1,23 +1,230 @@
@import-less url("theme.less");
html {
font-size: 62.5%;
font-family: "Helvetica Neue", Arial, Helvetica, sans-serif;
html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, abbr, address, cite, code, del, dfn, em, img, ins, kbd, q, samp, small, strong, sub, sup, var, b, i, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, figure, footer, header, hgroup, menu, nav, section, menu, time, mark, audio, video { margin: 0; padding: 0; border: 0; outline: 0; font-size: 100%; vertical-align: baseline; background: transparent; }
article, aside, figure, footer, header, hgroup, nav, section { display: block; }
ul { list-style-position: inside; }
a { margin: 0; padding: 0; font-size: 100%; vertical-align: baseline; background: transparent; }
table { border-collapse: collapse; border-spacing: 0; }
input, select { vertical-align: middle; }
body {
font-size: 62.5%;
font-family: Arial, sans-serif;
background: #fff;
}
h1 {
font-size: 1.8em;
}
h2 {
font-size: 1.3em;
font-weight: bold;
}
body {
font-size: 11px;
margin: 0;
padding: 0;
input[type=text] {
padding: @padding_tighter;
font-size: 1em;
font-family: inherit;
border: #ccc 1px solid;
border-top: #888 1px solid;
}
a {
color: @link_primary;
text-decoration: none;
}
a:hover {
text-decoration: underline;
}
a.secondary {
color: @link_secondary;
}
a img {
border: 0;
}
.button, a.button {
display: inline-block;
overflow: visible;
font-size: 1em;
line-height: 1.4;
color: #000;
text-decoration: none;
padding: 1px 6px;
border: 1px solid #bbb;
cursor: pointer;
background: #eee;
font-family: Arial, Helvetica, sans-serif;
.rounded_corners(3px);
}
.button:hover, a.button:hover {
border: 1px solid #666;
}
.button:active, a.button:active {
border: 1px solid #000;
}
.button-primary, a.button-primary {
font-weight: bold;
padding: 1px 15px;
}
.button-disabled {
color: #666;
border: 1px solid #ddd;
background: #f3f3f3;
cursor: default;
}
.button-disabled:hover {
color: #666;
border: 1px solid #ddd;
background: #f3f3f3;
cursor: default;
}
.form-table th, .form-table td {
vertical-align: top;
font-size: 1.3em;
padding: 2px;
}
.form-table th {
text-align: left;
padding-top: 8px;
font-weight: bold;
}
.list-table {
width: 100%;
}
.list-table th, .list-table td {
padding-top: @padding_tight;
text-align: left;
vertical-align: baseline;
padding: @padding_tight;
font-size: 1.1em;
color: @metadata_grey;
border-bottom: dotted 1px @faint_grey;
}
.list-table th {
font-weight: bold;
color: #444;
background: #f2f2f2;
}
.list-table-itemname {
font-size: 1.2em;
}
#loading-message {
text-align: center;
font-size: 300%;
color: @light_grey;
padding: 4em;
}
table {
font-size: inherit;
#loading-message img {
position: relative;
top: -4px;
}
tr, td {
#header {
height: 40px;
margin: 10px;
position: relative;
overflow: hidden;
}
#app-home-button {
position: absolute;
top: 0;
left: 0;
}
#body-info {
margin: 0 40px;
}
#body-info p {
font-size: 1.3em;
margin: 1.3em;
width: 50em;
line-height: 1.3;
}
#body-info h1 {
font-size: 3.0em;
font-weight: normal;
color: @metadata_grey;
}
#body-info h2 {
margin: 1.6em 0 .5em 0;
}
#body-info .license, #body-info .errorstack {
font-family: monospace;
font-size: 1.3em;
white-space: pre;
border: 1px solid #ddd;
background: #eee;
padding: @padding_looser;
width: 60em;
overflow: auto;
}
#body-info ul {
font-size: 1.3em;
margin: .5em 0 2em;
}
#body-info li {
margin: 0.4em;
}
input[type="checkbox"], input[type="radio"] {
vertical-align: baseline;
}
input.inline {
vertical-align: middle;
}
a.action,
a.quiet-link {
text-decoration: none;
color: #448;
}
a.action {
margin: 0 3px;
}
a.action:hover,
a.quiet-link:hover {
color: #88f;
}
a.inaction {
margin: 0 3px;
text-decoration: none;
color: #ccc;
}
div.grid-layout > table {
border-collapse: separate;
@ -79,12 +286,6 @@ div.grid-layout.layout-looser > table {
border-spacing: 20px;
}
input[type="checkbox"], input[type="radio"] {
vertical-align: baseline;
}
input.inline {
vertical-align: middle;
}
div.input-container {
padding: 3px;
@ -103,28 +304,6 @@ input.code, textarea.code {
font-family: monospace;
}
a.action,
a.quiet-link {
text-decoration: none;
color: #448;
}
a.action {
margin: 0 3px;
}
a.action:hover,
a.quiet-link:hover {
color: #88f;
}
a.inaction {
margin: 0 3px;
text-decoration: none;
color: #ccc;
}
a img {
border: none;
}
img {
vertical-align: middle;
@ -146,55 +325,3 @@ img {
font-family: inherit;
font-size: inherit;
}
#header {
height: 40px;
position: relative;
overflow: hidden;
background: white;
padding-left: 125px;
}
#app-home-button {
position: absolute;
top: 50%;
margin-top: -16px;
left: 0px;
}
#path {
position: absolute;
height: 40px;
top: 50%;
margin-top: -0.5em;
left: 125px;
right: 10px;
line-height: 1em;
}
#path .app-path-section {
font-size: 150%;
margin: 0 0.5em;
padding: 0 0.5em;
}
#path a {
text-decoration: none;
}
#path a:hover {
text-decoration: underline;
}
#body {
}
a.app-menu-button, #path a.app-menu-button {
text-decoration: none;
font-weight: bold;
padding: 4px 8px;
color: black;
background: #eee;
border: 1px solid #aaa;
border-radius: 5px;
cursor: pointer;
}
a.app-menu-button:hover, #path a.app-menu-button:hover {
text-decoration: none;
background: #white;
}

View File

@ -1,5 +0,0 @@
@import-less url("theme.less");
#body {
padding: 5em;
}

View File

@ -1,93 +0,0 @@
@import-less url("theme.less");
/*
-----------------------------------------
Buttons
-----------------------------------------
*/
/*
Active button currently is used to for buttons which are the primary call to action.
This should be updated so that .active represents the state of a button, not it's
relative importance in a workflow. Suggested class name would be .primary, which
may or may not be .active
*/
button, a.button-link {
font-size: 1.2em;
line-height: 1.5;
background: #e6e6e6 url(/images/freebase-sprite-vertical.png) repeat-x 0 -3380px;
color: #666;
font-weight:bold;
margin: 2px;
padding: 3px 6px;
border: 1px solid #c5c5c5;
-moz-border-radius: 4px;
-webkit-border-radius: 4px;
display: inline-block;
overflow: visible;
cursor: pointer;
font-family: "Helvetica Neue", Arial, Helvetica, sans-serif;
}
.button-primary,
input[type=submit].button-primary,
button.active {
color: #fff;
border: 1px solid #dc5800;
font-weight: bold;
-moz-border-radius: 4px;
-webkit-border-radius: 4px;
display: inline-block;
overflow: visible;
cursor: pointer;
margin: 2px;
padding: 3px 6px;
font-size: 1.2em;
line-height: 1.5;
background: #fa7c0a url(/images/freebase-sprite-vertical.png) repeat-x 0 -3450px;
}
button[disabled],
button.disabled,
button.primary.disabled,
a.button-link.disabled,
a.button-link-primary.disabled {
background: #e6e6e6 url(/images/freebase-sprite-vertical.png) repeat-x 0 -3380px;
color: #b3b3b3;
border: 1px solid #d6d6d6;
cursor: default;
}
button[disabled]:hover,
button.disabled:hover {
cursor: default;
border: 1px solid #d6d6d6;
}
a.button-link-primary {
font-size: 12px;
line-height: 1.5;
background: #fa7c0a url(/images/freebase-sprite-vertical.png) repeat-x 0 -3450px;
margin: 2px;
color: #fff;
padding: 3px 6px;
border: 1px solid #dc5800;
-moz-border-radius: 4px;
-webkit-border-radius: 4px;
display: inline-block;
overflow: visible;
cursor: pointer;
font-family: "Helvetica Neue", Arial, Helvetica, sans-serif;
font-weight: bold;
}
button:hover,
.button-link:hover,
a.button-link-primary:hover {
border: 1px solid #61d7f7;
text-decoration: none;
}

View File

@ -1,178 +1,114 @@
body {
background-color: #f4f7fa;
background-repeat: no-repeat;
background-position: left top;
}
#body {
padding: 40px;
}
#body > div.grid-layout > table > tbody > tr > th,
#body > div.grid-layout > table > tbody > tr > td {
vertical-align: top;
}
@import-less url("theme.less");
#google-refine-version {
float: right;
color: #aaa;
margin: 5px;
}
#container {
width: 980px;
height: 600px;
margin: 10px auto;
padding: 0 10px;
background: url(../images/logo-gem-150.png) no-repeat 20px right;
}
#header-home img {
padding: 6px 0;
}
#content-home {
position: relative;
margin: 20px 0;
}
#welcome-panel {
width: 230px;
min-width: 230px !important;
font-size: 10pt;
line-height: 150%;
color: #666;
}
#welcome-panel h1 {
font-size: 15pt;
margin: 0;
padding: 0;
font-weight: bold;
color: #848C8E;
}
div.island {
background: #dbe8eb;
padding: 4px;
-moz-border-radius: 7px;
-webkit-border-radius: 7px;
}
div.round-corners {
border: 1px solid #c5d1d4;
-moz-border-radius: 7px;
-webkit-border-radius: 7px;
}
#projects-panel {
width: 320px;
min-width: 320px !important;
}
#projects {
background: white;
}
#projects h1 {
margin: 0;
padding: 7px 10px;
font-size: 13pt;
font-weight: bold;
}
#project-open, #project-create, #project-links {
position: absolute;
top: 0;
}
#project-open {
left: 0;
width: 330px;
}
#projects-container {
height: 40em;
overflow: auto;
}
border-top: 1px solid @line_accent;
background: #fff;
overflow: auto;
height: 400px;
}
#projects-container .message {
padding: 15px;
color: #aaa;
font-size: 150%;
}
#projects-container table {
border-collapse: collapse;
width: 100%;
}
#projects-container td, #projects-container th {
padding: 3px;
text-align: left;
vertical-align: middle;
}
#projects-container td:first-child, #projects-container th:first-child {
padding-left: 7px;
}
#projects-container td:last-child, #projects-container th:last-child {
padding-right: 7px;
}
#projects-container th {
font-weight: normal;
background: #f4f7fa;
border-bottom: 1px solid #eee;
}
.project a {
text-decoration: none;
font-weight: normal;
color: #1170a3;
}
.project a:hover {
text-decoration: underline;
}
.last-modified {
white-space: pre;
text-align: right;
color: #aaa;
}
padding: @padding_loose;
font-size: 1.3em;
color: @near_black;
}
#forms {
color: #666;
}
#project-create {
left: 350px;
width: 430px;
}
a.form-tab-link {
display: block;
float: right;
text-decoration: none;
font-size: 10pt;
font-weight: bold;
color: #1170a3;
margin-left: 1em;
}
#project-links {
top: 110px;
left: 810px;
width: 150px;
font-size: 1.3em;
}
#form-tabs-create-project, #form-tabs-import-project, #form-create-project-more-options {
padding: 7px 10px;
}
#form-tabs-create-project, #form-tabs-import-project {
background: white;
width: 400px;
}
#form-tabs-create-project h1, #form-tabs-import-project h1 {
margin: 0;
padding: 0px 0px 15px 0px;
font-size: 13pt;
font-weight: bold;
color: black;
}
#form-create-project-more-options h2 {
font-size: 100%;
color: black;
margin: 0;
}
#form-create-project-more-options > table {
border-collapse: collapse;
}
#form-create-project-more-options > table > tbody > tr > td {
padding: 1em;
}
#project-links li {
padding: @padding_tight 0;
}
div.field-group {
margin-top: 0.7em;
margin-bottom: 1.5em;
}
.field-label {
font-weight: bold;
white-space: pre;
}
div.field-label {
margin-top: 0.5em;
margin-bottom: 0.25em;
}
td.field-label {
text-align: right;
}
#google-refine-version {
margin: 30px 0 0 0;
color: @metadata_grey;
}
#project-open, #project-create {
background: @fill_primary;
border: 1px solid @chrome_primary;
.rounded_corners;
}
div.field-body {
white-space: pre;
}
div.field-hint {
font-size: 90%;
white-space: pre;
}
#project-open h1, #project-create h1 {
padding: @padding_loose;
}
#version-message {
padding: 20px;
border: 1px solid #aaa;
background: #ffddaa;
position: absolute;
top: -1px;
left: 40%;
width: 20%;
z-index: 1000;
}
.project-create-basic {
border-top: 1px solid @line_accent;
padding: @padding_loose;
background: #fff;
}
.project-create-basic p {
font-size: 1.3em;
padding: 0 0 @padding_normal 0;
}
.project-create-advanced {
position: relative;
padding: @padding_loose 200px 48px @padding_loose;
background: @fill_secondary;
color: @metadata_grey;
}
#project-create-parsetext {
position: absolute;
width: 200px;
top: 25px;
left: 210px;
}
.project-create-option {
padding: @padding_normal;
font-size: 1.3em;
}
.project-create-suboption {
padding: @padding_tight 0;
font-size: 0.85em;
}
#project-toggle {
position: absolute;
top: 12px;
right: 10px;
}

View File

@ -1,73 +1,65 @@
@import-less url("theme.less");
.refine-tabs.ui-tabs {
padding: 0;
}
.refine-tabs.ui-corner-all {
}
.refine-tabs.ui-widget-content {
border: none;
background: none;
color: inherit;
}
.refine-tabs.ui-tabs .ui-tabs-nav {
padding: 0 @padding_normal;
}
.refine-tabs.ui-tabs .ui-widget-header {
background: none;
border: none;
}
.refine-tabs.ui-tabs .ui-tabs-nav li a {
padding: 4px 10px;
}
.refine-tabs.ui-tabs .ui-tabs-nav li a span.count {
color: #666;
font-weight: normal;
font-size: 80%;
}
.ui-tabs {
padding: 0;
}
.refine-tabs.ui-tabs .ui-tabs-nav .ui-state-default,
.refine-tabs.ui-tabs .ui-tabs-nav .ui-widget-content .ui-state-default {
background: none;
border: none;
}
.ui-widget-content, .ui-tabs .ui-widget-header {
border: none;
background: none;
color: inherit;
}
.refine-tabs.ui-tabs .ui-tabs-nav .ui-state-default a,
.refine-tabs.ui-tabs .ui-tabs-nav .ui-state-default a:link,
.refine-tabs.ui-tabs .ui-tabs-nav .ui-state-default a:visited {
color: @link_color;
font-weight: normal;
}
.ui-tabs .ui-tabs-nav {
padding: 0 @padding_normal;
}
.ui-tabs .ui-tabs-nav li a {
padding: 4px 10px;
}
.refine-tabs.ui-tabs .ui-tabs-nav .ui-state-active,
.refine-tabs.ui-tabs .ui-tabs-nav .ui-widget-content .ui-state-active {
margin-top: 1px;
border: 1px solid @line_accent;
border-bottom: none;
background: white;
color: black;
font-weight: bold;
}
.ui-tabs .ui-tabs-nav .ui-state-default,
.ui-tabs .ui-tabs-nav .ui-widget-content .ui-state-default {
background: none;
border: 1px solid transparent;
border-bottom: 0;
}
.refine-tabs.ui-tabs .ui-tabs-nav .ui-state-active a,
.refine-tabs.ui-tabs .ui-tabs-nav .ui-state-active a:link,
.refine-tabs.ui-tabs .ui-tabs-nav .ui-state-active a:visited {
color: black;
font-weight: bold;
}
.ui-tabs .ui-tabs-nav .ui-state-default a,
.ui-tabs .ui-tabs-nav .ui-state-default a:link,
.ui-tabs .ui-tabs-nav .ui-state-default a:visited {
color: @link_primary;
font-weight: normal;
}
.refine-tabs.ui-tabs .ui-corner-top {
.ui-tabs .ui-tabs-nav li a span.count {
color: #666;
font-weight: normal;
font-size: 80%;
}
.ui-tabs .ui-tabs-nav .ui-state-active,
.ui-tabs .ui-tabs-nav .ui-widget-content .ui-state-active {
border: 1px solid @line_accent;
border-bottom: none;
background: white;
}
.ui-tabs .ui-tabs-nav .ui-state-active a,
.ui-tabs .ui-tabs-nav .ui-state-active a:link,
.ui-tabs .ui-tabs-nav .ui-state-active a:visited {
color: black;
font-weight: bold;
}
.ui-tabs .ui-corner-top, .ui-tabs .ui-corner-top {
border-top-left-radius: 0;
border-top-right-radius: 0;
}
.refine-tabs.ui-tabs .ui-corner-bottom {
border-bottom-left-radius: 0;
border-bottom-right-radius: 0;
}
.refine-tabs.ui-tabs .ui-tabs-panel {
margin: 0px;
padding: 15px;
border: 1px solid @line_accent;
background: white;
}
}
.ui-tabs .ui-tabs-panel {
margin: 0px;
padding: 15px;
border: 1px solid @chrome_primary;
background: white;
}

View File

@ -1,24 +0,0 @@
@import-less url("theme.less");
#body {
padding: 5em;
margin: 0;
}
#loading-message {
text-align: center;
font-size: 300%;
color: #aaa;
padding: 1in;
font-style: italic;
}
table.preferences th, table.preferences td {
padding: 3px;
}
table.preferences th {
background: #ddd;
}
table.preferences td {
background: #eee;
}

View File

@ -1,65 +0,0 @@
body {
background: white;
}
#body {
padding: 0;
margin: 0;
}
#loading-message {
text-align: center;
font-size: 300%;
color: #aaa;
padding: 1in;
font-style: italic;
}
#footer {
position: fixed;
bottom: 0px;
left: 0px;
z-index: 1000;
padding: 0.4em 0em 0.5em 0em;
width: 100%;
background: #E8E8E8;
color: #666;
}
#footer a {
font-weight: bold;
color: #333;
text-decoration: none;
}
#footer a:hover {
text-decoration: underline;
}
.menu-bar-container {
position: fixed;
left: 0px;
width: 100%;
}
.view-panel {
position: fixed;
background: white;
overflow: hidden;
}
.left-panel {
position: fixed;
background: white;
overflow: hidden;
padding: 0px;
font-size: 11px;
}
.left-panel .refine-tabs.ui-tabs .ui-tabs-panel {
padding: 7px;
overflow: hidden;
}
.facet-panel {
overflow: auto;
}
.history-panel {
overflow: auto;
}

View File

@ -1,90 +1,97 @@
@import-less url("theme.less");
body {
background: white;
}
#body {
padding: 0;
margin: 0;
display: none;
}
display: none;
}
#project-title, #project-controls {
position: absolute;
top: 0;
display: none;
}
#header-layout {
display: none;
width: 100%;
border-collapse: collapse;
border: none;
}
#header-layout > tbody > tr > td {
padding: 0;
}
#header-layout-right {
text-align: right;
}
#project-title {
left: 140px;
height: 40px;
padding: 4px 0 0 0;
font-size: 1.6em;
}
#project-controls {
right: 0;
height: 40px;
font-size: 1.3em;
}
#project-name-button {
:hover {
background: #fffee0;
padding: 3px;
border: 1px solid transparent;
}
#project-name-button:hover {
background: #ffffd6;
border: 1px solid #ccc;
border-top: 1px solid #aaa;
}
}
#project-permalink-button {
}
#loading-message {
text-align: center;
font-size: 300%;
color: #aaa;
padding: 1in;
font-style: italic;
}
padding: 0 4px;
font-size: 0.7em;
}
#left-panel {
position: fixed;
overflow: hidden;
padding: 0px;
padding-top: @padding_tight;
font-size: 11px;
background: @fill_normal;
}
position: fixed;
overflow: hidden;
padding: 0px;
padding-top: @padding_tight;
font-size: 1.3em;
background: @fill_normal;
}
#right-panel {
position: fixed;
overflow: hidden;
padding: 0px;
padding-left: @padding_tight;
font-size: 11px;
background: @fill_accent;
}
position: fixed;
overflow: hidden;
padding: 0px;
padding-left: @padding_tight;
background: @chrome_primary;
}
#tool-panel {
padding: @padding_tight @padding_tight @padding_tight 0;
}
position: relative;
height: 32px;
}
#tool-panel-layout {
width: 100%;
border-collapse: collapse;
}
#tool-panel-layout > tbody > tr >td {
padding: 0px;
}
#summary-bar-container {
padding: @padding_tight 0;
}
#extension-bar-container {
text-align: right;
}
#summary-bar {
position: absolute;
top: @padding_normal;
left: @padding_normal;
font-size: 1.8em;
font-weight: bold;
}
#summary-total {
font-size: 0.8em;
font-weight: normal;
}
#extension-bar {
padding: @padding_tight 0;
}
position: absolute;
top: 0px;
right: @padding_normal;
white-space: nowrap;
font-size: 1.3em;
padding: @padding_tight 0;
}
#extension-bar .secondary {
font-size: 0.85em;
}
#view-panel {
background: white;
overflow: hidden;
}
#left-panel .refine-tabs.ui-tabs .ui-tabs-panel {
border-bottom: none;
border-left: none;
@ -93,9 +100,6 @@ body {
overflow: hidden;
}
#facet-panel {
overflow: auto;
}
#history-panel {
#facet-panel, #history-panel {
overflow: auto;
}

View File

@ -1,7 +0,0 @@
@import-less url("../theme.less");
#extension-bar {
}
#extension-bar-menu-container {
}

View File

@ -1,9 +0,0 @@
@import-less url("../theme.less");
#summary-bar {
}
.summaryWidget-rowCount {
font-size: 150%;
font-weight: bold;
}

View File

@ -0,0 +1,11 @@
.button, a.button {
background: -webkit-gradient(linear, left top, left bottom, from(#f9f9f9), to(#e3e3e3));
background: -moz-linear-gradient(top, #f9f9f9, #e3e3e3);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#f9f9f9', endColorstr='#e3e3e3');
}
.button:active, a.button:active {
background: -webkit-gradient(linear, left top, left bottom, from(#e3e3e3), to(#f9f9f9));
background: -moz-linear-gradient(top, #e3e3e3, #f9f9f9);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#e3e3e3', endColorstr='#f9f9f9');
}

View File

@ -1,12 +1,27 @@
@fill_normal: #e3e9ff;
@fill_accent: #bbccff;
@line_accent: #bbccff;
@padding_normal: 7px;
@padding_tight: 5px;
@link_primary: #11c;
@link_secondary: #4272db;
@chrome_primary: #bcf;
@chrome_secondary: #e3e9ff;
@fill_primary: #ebeef8;
@fill_secondary: #f2f2f2;
@faint_grey: #ddd;
@light_grey: #999;
@metadata_grey: #777;
@near_black: #444;
@padding_tighter: 3px;
@padding_tight: 5px;
@padding_normal: 7px;
@padding_loose: 10px;
@padding_looser: 15px;
@link_color: blue;
.rounded_corners (@radius: 5px) {
-moz-border-radius: @radius;
-webkit-border-radius: @radius;
border-radius: @radius;
}

View File

@ -1,5 +1,11 @@
@import-less url("../theme.less");
#viewPanel-header {
background: @chrome_secondary;
font-size: 1.3em;
padding: @padding_normal;
}
.viewPanel-browsingModes .ui-button .ui-button-text {
line-height: 1.0;
text-decoration: line-through;
@ -112,13 +118,6 @@ a.column-header-menu:hover {
background: #6d6;
}
table.viewPanel-header {
border-collapse: collapse;
width: 100%;
}
table.viewPanel-header td {
padding: 1em 1em 1em 0;
}
div.data-table-cell-content {
position: relative;