From e9b630bd76bc4265c7b9eb1038a161bbdbed5c1c Mon Sep 17 00:00:00 2001 From: David Huynh Date: Tue, 4 May 2010 21:23:51 +0000 Subject: [PATCH] Fixed front page to James' new design. git-svn-id: http://google-refine.googlecode.com/svn/trunk@588 7d457c2a-affb-35e4-300a-418c747d4874 --- src/main/webapp/images/close.png | Bin 392 -> 238 bytes src/main/webapp/index.html | 2 +- src/main/webapp/scripts/index.js | 39 ++++--- src/main/webapp/styles/common.css | 4 +- src/main/webapp/styles/freebase.css | 91 ++++++++++++++++ src/main/webapp/styles/index.css | 162 +++++++++++++++++++++------- 6 files changed, 241 insertions(+), 57 deletions(-) create mode 100644 src/main/webapp/styles/freebase.css diff --git a/src/main/webapp/images/close.png b/src/main/webapp/images/close.png index 7cfa7bad566b8e4b6ffd480efd6f045a13725ec4..5f72fab990152db334bdd9f31f03e8114ee17a0e 100644 GIT binary patch literal 238 zcmeAS@N?(olHy`uVBq!ia0vp^JRr=$3?vg*uel1OBuiW)N`mv#O3D+9QW+dm@{>{( zJaZG%Q-e|yQz{EjrrH1%DF*n2xXzg~=ics!JR)%=wo4|0;8ydNb5C)OWe(i*X}GhVIj?^JnMJ;uGNgnyZyrE bY9C-I{=?WZUM{U!lmtoF$*TD7O>x#EfAKvm|IHt#sS-iDv|4V z7=BC6QV{F0@1E|Ley=)n`DNGZrQFi5c9of!+0N0N=ey&oKxn9J_o9l188TZVnSF0O zubg+JP^b33ef7NM42G6j1#8%LJxGh3)|OZy Freebase Gridworks

Freebase Gridworks

• about

Upload a data file to create a new project.

Data File:
Project Name:
More options ...

Import an existing Gridworks project that has been exported as a .tar or .tar.gz file.

Project .tar or .tar.gz File:
Re-name Project: (optional)

Projects
\ No newline at end of file + Freebase Gridworks

Welcome to Gridworks

Freebase Gridworks is a power tool that allows you to load data, understand it, clean it up, reconcile it internally, augment it with data coming from Freebase, and optionally contribute your data to Freebase for others to use.

It was originally developed by Metaweb.

Credits and Licenses »

Open a Project
or Import an Existing Project

Create a New Project

Data File:
Project Name:

Advanced Options

Limit load to:
rows (blank for all)
Ignore:
initial non-blank lines
Skip:
initial data rows
When parsing text files:
Split into columns
Column separator:
leave blank to guess comma or tab
Guess cells' value types
try to parse numbers, dates, etc.
Header lines:
use 0 if there is no header line
\ No newline at end of file diff --git a/src/main/webapp/scripts/index.js b/src/main/webapp/scripts/index.js index e1e2f07b8..9740b7ffd 100644 --- a/src/main/webapp/scripts/index.js +++ b/src/main/webapp/scripts/index.js @@ -33,6 +33,8 @@ function formatDate(d) { return "Today " + d.toString("h:mm tt"); } else if (d.between(yesterday, today)) { return "Yesterday " + d.toString("h:mm tt"); + } else if (d.getYear() == today.getYear()) { + return d.toString("ddd, MMM d"); } else { return d.toString("ddd, MMM d, yyyy"); } @@ -71,30 +73,20 @@ function renderProjects(data) { if (!projects.length) { $('
') .addClass("message") - .text("No existing project. Use form on left to create.") + .text("No existing project. Use form on right to create.") .appendTo(container); } else { var table = $( '' + - '' + - '' + '' + + '' + + '' + '
Project NameLast ModifiedNameLast Modified
' ).appendTo(container)[0]; var renderProject = function(project) { var tr = table.insertRow(table.rows.length); - tr.className = "project " + (table.rows.length % 2 ? "even" : "odd"); - - $('') - .text(project.name) - .attr("href", "/project.html?project=" + project.id) - .appendTo(tr.insertCell(tr.cells.length)); - - $('') - .text(formatDate(project.date)) - .addClass("last-modified") - .appendTo(tr.insertCell(tr.cells.length)); + tr.className = "project"; $('') .addClass("delete-project") @@ -117,6 +109,17 @@ function renderProjects(data) { } return false; }).appendTo(tr.insertCell(tr.cells.length)); + + $('') + .text(project.name) + .attr("href", "/project.html?project=" + project.id) + .appendTo(tr.insertCell(tr.cells.length)); + + $('
') + .text(formatDate(project.date)) + .addClass("last-modified") + .appendTo(tr.insertCell(tr.cells.length)); + }; for (var i = 0; i < projects.length; i++) { @@ -136,10 +139,14 @@ function fetchProjects() { ); } +function showHide(toHide, toShow) { + $("#" + toHide).hide(); + $("#" + toShow).show(); +} + function onLoad() { fetchProjects(); - $("#form-tabs").tabs(); $("#upload-file-button").click(onClickUploadFileButton); $("#more-options-link").click(function() { $("#more-options-controls").hide(); @@ -147,7 +154,7 @@ function onLoad() { }); $("#gridworks-version").text( - GridworksVersion.version + "-" + GridworksVersion.revision + "Version " + GridworksVersion.version + "-" + GridworksVersion.revision ); if (isThereNewRelease()) { $('
' + diff --git a/src/main/webapp/styles/common.css b/src/main/webapp/styles/common.css index 51607b55a..38ef4e904 100644 --- a/src/main/webapp/styles/common.css +++ b/src/main/webapp/styles/common.css @@ -93,10 +93,12 @@ div.input-container > input, div.input-container > textarea { a.action, a.quiet-link { - margin: 0 3px; text-decoration: none; color: #448; } +a.action { + margin: 0 3px; +} a.action:hover, a.quiet-link:hover { color: #88f; diff --git a/src/main/webapp/styles/freebase.css b/src/main/webapp/styles/freebase.css new file mode 100644 index 000000000..0d5c7993b --- /dev/null +++ b/src/main/webapp/styles/freebase.css @@ -0,0 +1,91 @@ +/* +----------------------------------------- +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; + } diff --git a/src/main/webapp/styles/index.css b/src/main/webapp/styles/index.css index c34653492..c30b9ef20 100644 --- a/src/main/webapp/styles/index.css +++ b/src/main/webapp/styles/index.css @@ -1,53 +1,64 @@ +body { + background: #f4f7fa; +} #body { - padding: 50px; - background: url("/images/gridworks-watermark.png") no-repeat -70px -70px; + padding: 40px; } #body > div.grid-layout > table > tbody > tr > th, #body > div.grid-layout > table > tbody > tr > td { vertical-align: top; } -#top-panel { - margin-bottom: 15px; +#gridworks-version { + float: right; + color: #aaa; + margin: 5px; } -#top-panel h1 { + +#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: normal; -} -#gridworks-info { - color: #aaa; + font-weight: bold; + color: #848C8E; } -#form-tabs > div { - height: 400px; -} - -#create-project-panel h1 { - font-size: 120%; - margin: 2em 0 1em 0; -} -#projects-panel { - width: 400px; -} -#projects { - background: #DBE8EB; +div.island { + background: #dbe8eb; + padding: 4px; -moz-border-radius: 7px; -webkit-border-radius: 7px; - padding: 15px; } +div.round-corners { + border: 1px solid #c5d1d4; + -moz-border-radius: 7px; + -webkit-border-radius: 7px; +} + +#projects-panel { + width: 270px; + min-width: 270px !important; +} +#projects { + background: white; +} + #projects h1 { margin: 0; - margin-bottom: 0.5em; - padding: 0; - font-size: 120%; + padding: 7px 10px; + font-size: 13pt; + font-weight: bold; } #projects-container { - border: 1px solid #C5D1D4; - background: white; - padding: 1px; - height: 30em; + height: 40em; overflow: auto; } #projects-container .message { @@ -60,24 +71,97 @@ width: 100%; } #projects-container td, #projects-container th { - padding: 5px; - border-right: 1px solid white; + 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 { - background: #C5D1D4; -} -#projects-container tr.project.even { - background: #DBE8EB; + font-weight: normal; + background: #f4f7fa; + border-bottom: 1px solid #eee; } .project a { text-decoration: none; - font-weight: bold; - color: #004; + font-weight: normal; + color: #1170a3; } .project a:hover { text-decoration: underline; - color: #008; +} +.last-modified { + white-space: pre; + text-align: right; + color: #aaa; +} + +#forms { + color: #666; +} + +a.form-tab-link { + display: block; + float: right; + text-decoration: none; + font-size: 10pt; + font-weight: bold; + color: #1170a3; + margin-left: 1em; +} + +#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; +} + +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; +} + +div.field-body { + white-space: pre; +} +div.field-hint { + font-size: 90%; + white-space: pre; } #version-message {