s434730/RandomSec
3
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

Factored out grid layout CSS rules.

Browse Source 
git-svn-id: http://google-refine.googlecode.com/svn/trunk@288 7d457c2a-affb-35e4-300a-418c747d4874
This commit is contained in:
David Huynh 2010-03-12 22:42:05 +00:00
parent 67bac099f0
commit c637df71c9
12 changed files with 107 additions and 184 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
src/main/webapp/index.html
View File

@ -1 +1 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> <html> <head> <title>Gridworks</title> <link rel="stylesheet" href="/styles/common.css" /> <link rel="stylesheet" href="/styles/index.css" /> <script type="text/javascript" src="externals/jquery-1.4.1.min.js"></script> <script type="text/javascript" src="externals/date.js"></script> <script type="text/javascript" src="scripts/util/string.js"></script> <script type="text/javascript" src="scripts/index.js"></script> </head> <body> <div id="header"> <a id="logo" href="http://www.metaweb.com/"><img alt="Metaweb" src="images/metaweb-headerlogo.png" /></a> </div> <div id="body"> <div id="body-empty"> <table><tr> <td id="body-empty-logo-container"><img src="images/gridworks.png" /> Gridworks</td> <td id="body-empty-create-project-panel-container"></td> </tr></table> </div> <div id="body-nonempty"> <table><tr> <td id="body-nonempty-logo-container"><img src="images/gridworks.png" /> Gridworks</td> <td id="body-nonempty-projects-container"> <div id="projects"></div> </td> <td id="body-nonempty-create-project-panel-container"></td> </tr></table> </div> </div> <div id="footer"> <a href="about.html">About Gridworks</a> &bull; &copy; 2010 <a href="http://www.metaweb.com/">Metaweb Technologies, Inc.</a> </div> <div id="body-template"> <div id="create-project-panel"> <h1>Upload Data File</h1> <form id="file-upload-form" method="post" enctype="multipart/form-data" action="/command/create-project-from-upload" accept-charset="UTF-8"> <table id="create-project-panel-layout"> <tr><td>Data File:</td><td> <input type="file" id="project-file-input" name="project-file" /> </td></tr> <tr><td>Project Name:</td><td> <input type="text" size="30" id="project-name-input" name="project-name" /> </td></tr> <tr><td>Load up to:</td><td> <input id="limit-input" name="limit" size="5" /> data rows (optional) </td></tr> <tr><td>Skip:</td><td> <input id="skip-input" name="skip" size="5" /> initial data rows (optional) </td></tr> <tr><td></td><td> <input type="submit" value="Create Project" id="upload-file-button" /> </td></tr> </table> </form> <h1>Import Existing Project</h1> <form id="project-upload-form" method="post" enctype="multipart/form-data" action="/command/import-project" accept-charset="UTF-8"> <table id="import-project-panel-layout"> <tr><td>Project TAR File:</td><td> <input type="file" id="project-tar-file-input" name="project-file" /> </td></tr> <tr><td>Re-name Project:</td><td> <input type="text" size="30" id="project-name-input" name="project-name" /> (optional) </td></tr> <tr><td></td><td> <input type="submit" value="Import Project" id="import-project-button" /> </td></tr> </table> </form> </div> </div> </body> </html>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> <html> <head> <title>Gridworks</title> <link rel="stylesheet" href="/styles/common.css" /> <link rel="stylesheet" href="/styles/index.css" /> <script type="text/javascript" src="externals/jquery-1.4.1.min.js"></script> <script type="text/javascript" src="externals/date.js"></script> <script type="text/javascript" src="scripts/util/string.js"></script> <script type="text/javascript" src="scripts/index.js"></script> </head> <body> <div id="header"> <a id="logo" href="http://www.metaweb.com/"><img alt="Metaweb" src="images/metaweb-headerlogo.png" /></a> </div> <div id="body"> <div id="body-empty"> <table><tr> <td id="body-empty-logo-container"><img src="images/gridworks.png" /> Gridworks</td> <td id="body-empty-create-project-panel-container"></td> </tr></table> </div> <div id="body-nonempty"> <table><tr> <td id="body-nonempty-logo-container"><img src="images/gridworks.png" /> Gridworks</td> <td id="body-nonempty-projects-container"> <div id="projects"></div> </td> <td id="body-nonempty-create-project-panel-container"></td> </tr></table> </div> </div> <div id="footer"> <a href="about.html">About Gridworks</a> &bull; &copy; 2010 <a href="http://www.metaweb.com/">Metaweb Technologies, Inc.</a> </div> <div id="body-template"> <div id="create-project-panel"> <h1>Upload Data File</h1> <form id="file-upload-form" method="post" enctype="multipart/form-data" action="/command/create-project-from-upload" accept-charset="UTF-8"> <table class="grid-layout layout-tight"> <tr><td>Data File:</td><td> <input type="file" id="project-file-input" name="project-file" /> </td></tr> <tr><td>Project Name:</td><td> <input type="text" size="30" id="project-name-input" name="project-name" /> </td></tr> <tr><td>Load up to:</td><td> <input id="limit-input" name="limit" size="5" /> data rows (optional) </td></tr> <tr><td>Skip:</td><td> <input id="skip-input" name="skip" size="5" /> initial data rows (optional) </td></tr> <tr><td></td><td> <input type="submit" value="Create Project" id="upload-file-button" /> </td></tr> </table> </form> <h1>Import Existing Project</h1> <form id="project-upload-form" method="post" enctype="multipart/form-data" action="/command/import-project" accept-charset="UTF-8"> <table id="import-project-panel-layout"> <tr><td>Project TAR File:</td><td> <input type="file" id="project-tar-file-input" name="project-file" /> </td></tr> <tr><td>Re-name Project:</td><td> <input type="text" size="30" id="project-name-input" name="project-name" /> (optional) </td></tr> <tr><td></td><td> <input type="submit" value="Import Project" id="import-project-button" /> </td></tr> </table> </form> </div> </div> </body> </html>

2
src/main/webapp/scripts/dialogs/expression-preview-dialog.js
View File

@ -32,7 +32,7 @@ function ExpressionPreviewDialog(title, cellIndex, rowIndices, values, expressio
};
ExpressionPreviewDialog.generateWidgetHtml = function() {
return '<table class="expression-preview-layout" rows="4" cols="2">' +
return '<table class="grid-layout layout-tighter layout-full" rows="4" cols="2">' +
'<tr>' +
'<td>Expression</td>' +
'<td>Language</td>' +

10
src/main/webapp/scripts/dialogs/recon-dialog.js
View File

@ -39,7 +39,7 @@ ReconDialog.prototype._createDialog = function() {
'<li><a href="#recon-dialog-tabs-strict">Strict</a></li>' +
'</ul>' +
'<div id="recon-dialog-tabs-heuristic">' +
'<table class="recon-dialog-main-layout" width="100%">' +
'<table class="grid-layout layout-normal layout-full">' +
'<tr>' +
'<td>Reconcile each cell to a Freebase topic of type:</td>' +
'<td>Also use relevant details from other columns:</td>' +
@ -73,13 +73,13 @@ ReconDialog.prototype._createDialog = function() {
'</div>' +
'<div id="recon-dialog-tabs-strict" style="display: none;">' +
'<p>Each cell contains:</p>' +
'<table class="recon-dialog-main-layout">' +
'<table class="grid-layout layout-normal layout-full">' +
'<tr><td width="1%"><input type="radio" name="recon-dialog-strict-choice" value="id" checked /></td><td>a Freebase ID, e.g., /en/solar_system</td></tr>' +
'<tr><td><input type="radio" name="recon-dialog-strict-choice" value="guid" /></td><td>a Freebase GUID, e.g., #9202a8c04000641f80000000000354ae</td></tr>' +
'<tr>' +
'<td width="1%"><input type="radio" name="recon-dialog-strict-choice" value="key" /></td>' +
'<td>' +
'<table class="recon-dialog-inner-layout">' +
'<table class="grid-layout layout-tighter layout-full">' +
'<tr><td colspan="2">a Freebase key in</td></tr>' +
'<tr>' +
'<td width="1%"><input type="radio" name="recon-dialog-strict-namespace-choice" value="/wikipedia/en" nsName="Wikipedia EN" checked /></td>' +
@ -117,7 +117,7 @@ ReconDialog.prototype._populateDialog = function() {
/*
* Populate types in heuristic tab
*/
var typeTable = $('<table></table>').addClass("recon-dialog-inner-layout").appendTo(this._elmts.heuristicTypeContainer)[0];
var typeTable = $('<table></table>').addClass("grid-layout layout-tighter").appendTo(this._elmts.heuristicTypeContainer)[0];
var createTypeChoice = function(type, check) {
var tr = typeTable.insertRow(typeTable.rows.length);
var td0 = tr.insertCell(0);
@ -149,7 +149,7 @@ ReconDialog.prototype._populateDialog = function() {
'<table>' +
'<tr><th>Column</th><th>Freebase property</th></tr>' +
'</table>'
).addClass("recon-dialog-inner-layout").appendTo(this._elmts.heuristicDetailContainer)[0];
).addClass("grid-layout layout-tighter").appendTo(this._elmts.heuristicDetailContainer)[0];
function renderDetailColumn(column) {
var tr = heuristicDetailTable.insertRow(heuristicDetailTable.rows.length);

10
src/main/webapp/scripts/protograph/schema-alignment-ui-node.js
View File

@ -265,10 +265,10 @@ SchemaAlignmentDialog.UINode.prototype._showNodeConfigDialog = function() {
'<option value="/type/datetime">date/time</option>';
var html = $(
'<table class="schema-align-node-dialog-layout">' +
'<table class="grid-layout layout-normal layout-full">' +
'<tr>' +
'<td>' +
'<table class="schema-align-node-dialog-layout2">' +
'<table class="grid-layout layout-tight">' +
'<tr>' +
'<td>' +
'<div class="schema-align-node-dialog-node-type">' +
@ -278,11 +278,11 @@ SchemaAlignmentDialog.UINode.prototype._showNodeConfigDialog = function() {
'</tr>' +
'<tr>' +
'<td>' +
'<table class="schema-align-node-dialog-layout2">' +
'<table class="grid-layout layout-tight">' +
'<tr>' +
'<td><div class="schema-alignment-node-dialog-column-list" bind="divColumns"></div></td>' +
'<td>' +
'<table class="schema-align-node-dialog-layout2" cols="4">' +
'<table class="grid-layout layout-tight" cols="4">' +
'<tr>' +
'<td colspan="4">The cell\'s content is used ...</td>' +
'</tr>' +
@ -336,7 +336,7 @@ SchemaAlignmentDialog.UINode.prototype._showNodeConfigDialog = function() {
'</td>' +
'<td>' +
'<table class="schema-align-node-dialog-layout2">' +
'<table class="grid-layout layout-tight">' +
'<tr>' +
'<td colspan="3">' +
'<div class="schema-align-node-dialog-node-type">' +

2
src/main/webapp/scripts/views/data-table-cell-ui.js
View File

@ -292,7 +292,7 @@ DataTableCellUI.prototype._startEdit = function(elmt) {
var menu = MenuSystem.createMenu().addClass("data-table-cell-editor").width("400px");
menu.html(
'<table class="data-table-cell-editor-layout">' +
'<table class="grid-layout layout-tighest layout-full data-table-cell-editor-layout">' +
'<tr>' +
'<td colspan="5">' +
'<textarea class="data-table-cell-editor-editor" bind="textarea" />' +

143
src/main/webapp/styles/common.css
View File

@ -18,10 +18,104 @@ tr, td {
vertical-align: baseline;
}
table.grid-layout {
border-collapse: collapse;
}
table.grid-layout.layout-full {
width: 100%;
}
table.grid-layout > tbody > tr > th {
text-align: left;
vertical-align: baseline;
}
table.grid-layout > tbody > tr > td {
vertical-align: baseline;
}
table.grid-layout > tbody > tr > td:last-child {
border-right: 0px;
}
table.grid-layout > tbody > tr:last-child > td {
border-bottom: 0px;
}
table.grid-layout.layout-normal > tbody > tr > td {
padding-right: 10px;
padding-bottom: 10px;
}
table.grid-layout.layout-tight > tbody > tr > td {
padding-right: 7px;
padding-bottom: 7px;
}
table.grid-layout.layout-tighter > tbody > tr > td {
padding-right: 5px;
padding-bottom: 5px;
}
table.grid-layout.layout-tightest > tbody > tr > td {
padding-right: 3px;
padding-bottom: 3px;
}
table.grid-layout.layout-loose > tbody > tr > td {
padding-right: 15px;
padding-bottom: 15px;
}
table.grid-layout.layout-looser > tbody > tr > td {
padding-right: 20px;
padding-bottom: 20px;
}
input {
vertical-align: middle;
}
a.action {
margin: 0 3px;
text-decoration: none;
color: #448;
}
a.action:hover {
color: #88f;
}
a.inaction {
margin: 0 3px;
text-decoration: none;
color: #ccc;
}
a img {
border: none;
}
img {
vertical-align: middle;
}
.hidden {
display: none;
}
.fbs-pane, .fbs-flyout-pane {
z-index: 2000;
}
.ui-widget-header {
background-image: none;
background-color: #ccc;
}
.ui-widget-content a.ui-state-default.ui-slider-handle {
background: url(../images/slider-left-bracket.png) no-repeat bottom left;
border: none;
top: -10px;
}
.ui-widget-content a.ui-state-default.ui-slider-handle:last-child {
background: url(../images/slider-right-bracket.png) no-repeat bottom right;
border: none;
top: -10px;
}
.ui-slider .ui-slider-handle {
height: 32px;
}
#header {
background: url(../images/metaweb-sprite-vertical.png) repeat-x scroll 0 0 #025B8D;
border-bottom: 1px solid #FCE166;
@ -49,52 +143,3 @@ input {
background: white;
}
a.action {
margin: 0 3px;
text-decoration: none;
color: #448;
}
a.action:hover {
color: #88f;
}
a.inaction {
margin: 0 3px;
text-decoration: none;
color: #ccc;
}
a img {
border: none;
}
img {
vertical-align: middle;
}
.fbs-pane, .fbs-flyout-pane {
z-index: 2000;
}
.hidden {
display: none;
}
.ui-widget-header {
background-image: none;
background-color: #ccc;
}
.ui-widget-content a.ui-state-default.ui-slider-handle {
background: url(../images/slider-left-bracket.png) no-repeat bottom left;
border: none;
top: -10px;
}
.ui-widget-content a.ui-state-default.ui-slider-handle:last-child {
background: url(../images/slider-right-bracket.png) no-repeat bottom right;
border: none;
top: -10px;
}
.ui-slider .ui-slider-handle {
height: 32px;
}

15
src/main/webapp/styles/dialogs/expression-preview-dialog.css
View File

@ -1,18 +1,3 @@
table.expression-preview-layout {
border-collapse: collapse;
width: 100%;
}
table.expression-preview-layout > tbody > tr > td {
padding-right: 5px;
padding-bottom: 5px;
}
table.expression-preview-layout > tbody > tr > td:last-child {
padding-right: 0px;
}
table.expression-preview-layout > tbody > tr:last-child > td {
padding-bottom: 0px;
}
.expression-preview-layout .ui-tabs .ui-tabs-nav li a {
padding: 0.15em 1em;
}

15
src/main/webapp/styles/dialogs/facet-based-edit-dialog.css
View File

@ -1,18 +1,3 @@
table.facet-based-edit-dialog-main-layout {
border-collapse: collapse;
}
table.facet-based-edit-dialog-main-layout > tbody > tr > td {
padding: 0px;
padding-right: 10px;
padding-bottom: 10px;
}
table.facet-based-edit-dialog-main-layout > tbody > tr > td:last-child {
padding-right: 0px;
}
table.facet-based-edit-dialog-main-layout > tbody > tr:last-child > td {
padding-bottom: 0px;
}
.facet-based-edit-dialog-table-container {
height: 500px;
overflow: auto;

36
src/main/webapp/styles/dialogs/recon-dialog.css
View File

@ -1,39 +1,3 @@
table.recon-dialog-main-layout {
border-collapse: collapse;
}
table.recon-dialog-main-layout > tbody > tr > td {
padding: 0px;
padding-right: 10px;
padding-bottom: 10px;
}
table.recon-dialog-main-layout > tbody > tr > td:last-child {
padding-right: 0px;
}
table.recon-dialog-main-layout > tbody > tr:last-child > td {
padding-bottom: 0px;
}
table.recon-dialog-inner-layout {
border-collapse: collapse;
}
table.recon-dialog-inner-layout > tbody > tr > td {
padding: 0px;
padding-right: 5px;
padding-bottom: 5px;
}
table.recon-dialog-inner-layout > tbody > tr > td:last-child {
padding-right: 0px;
}
table.recon-dialog-inner-layout > tbody > tr:last-child > td {
padding-bottom: 0px;
}
table.recon-dialog-inner-layout > tbody > tr > th {
text-align: left;
padding-bottom: 5px;
padding-right: 5px;
}
.recon-dialog-type-id {
color: #888;
}

15
src/main/webapp/styles/index.css
View File

@ -38,21 +38,6 @@
border-left: 3px solid #eee;
}
#create-project-panel-layout {
width: 100%;
border-collapse: collapse;
}
#create-project-panel-layout > tbody > tr > td {
padding-right: 7px;
padding-bottom: 7px;
}
#create-project-panel-layout > tbody > tr > td:last-child {
padding-right: 0px;
}
#create-project-panel-layout > tbody > tr:last-child > td {
padding-bottom: 0px;
}
#create-project-panel h1 {
font-size: 120%;
margin: 1em 0;

30
src/main/webapp/styles/protograph/schema-alignment-dialog.css
View File

@ -81,36 +81,6 @@ div.schema-alignment-dialog-preview {
*--------------------------------------------------
*/
table.schema-align-node-dialog-layout {
border-collapse: collapse;
}
table.schema-align-node-dialog-layout > tbody > tr > td {
padding-right: 1.5em;
padding-bottom: 1.5em;
vertical-align: baseline;
}
table.schema-align-node-dialog-layout > tbody > tr > td:last-child {
padding-right: 0;
}
table.schema-align-node-dialog-layout > tbody > tr:last-child > td {
padding-bottom: 0;
}
table.schema-align-node-dialog-layout2 {
border-collapse: collapse;
}
table.schema-align-node-dialog-layout2 > tbody > tr > td {
padding-right: 0.75em;
padding-bottom: 0.75em;
vertical-align: baseline;
}
table.schema-align-node-dialog-layout2 > tbody > tr > td:last-child {
padding-right: 0;
}
table.schema-align-node-dialog-layout2 > tbody > tr:last-child > td {
padding-bottom: 0;
}
.schema-align-node-dialog-node-type {
padding: 0.25em;
background: #ddf;

11
src/main/webapp/styles/views/data-table-view.css
View File

@ -171,19 +171,8 @@ a.data-table-star-off {
background: #fffee0;
}
table.data-table-cell-editor-layout {
width: 100%;
white-space: pre;
}
table.data-table-cell-editor-layout > tbody > tr > td {
padding-right: 3px;
padding-bottom: 3px;
}
table.data-table-cell-editor-layout > tbody > tr > td:last-child {
padding-right: 0px;
}
table.data-table-cell-editor-layout > tbody > tr:last-child > td {
padding-bottom: 0px;
}
textarea.data-table-cell-editor-editor {
display: block;