Skip to content

Commit

Permalink
Merge pull request #23 from smurfpandey/result-window-redesign
Browse files Browse the repository at this point in the history
Fixes #15
  • Loading branch information
Neeraj committed Mar 21, 2015
2 parents c3defbb + ca6743e commit fea4d9c
Show file tree
Hide file tree
Showing 3 changed files with 90 additions and 81 deletions.
50 changes: 25 additions & 25 deletions static/css/app.css
Original file line number Diff line number Diff line change
Expand Up @@ -185,23 +185,23 @@
overflow: auto;
}

#input {
.input {
overflow: hidden;
}

#input .wrapper {
.input .wrapper {
position: relative;
}

#input .actions {
.input .actions {
background: #fff;
padding: 10px;
height: 50px;
border-top: solid 1px #e1e2e3;
border-bottom: solid 1px #b8b7b5;
}

#input .actions .btn {
.input .actions .btn {
line-height: 30px;
height: 30px;
padding: 0px 13px;
Expand All @@ -214,62 +214,62 @@
margin-right: 10px;
}

#input .actions .btn-default {
.input .actions .btn-default {
background: #aaa;
}

#input .actions #query_progress {
.input .actions #query_progress {
display: none;
float: left;
line-height: 30px;
height: 30px;
color: #aaa;
}

#input .actions .btn:focus {
.input .actions .btn:focus {
outline: 0 none;
box-shadow: 0;
}

#input .actions .btn:hover {
.input .actions .btn:hover {
background: #7eb154;
}

#input .actions .btn-default:hover {
.input .actions .btn-default:hover {
background: #bbb;
}

#output {
.output {
margin: 0px;
padding: 0px;
overflow: auto;
}

#output.full {
.output.full {
top: 0px;
}

#results {
.results {
font-size: 12px;
margin: 0px;
padding: 0px;
}

#results.empty td {
.results.empty td {
border: 0px none;
}

#results tr:nth-child(even) > td {
.results tr:nth-child(even) > td {
border: none;
background: #f8f8f8;
}

#results tr:nth-child(odd) > td {
.results tr:nth-child(odd) > td {
border: none;
background: #fff;
}

#results th {
.results th {
background: #f3f3f3;
border-top: none;
border-bottom: 1px solid #eae9e9;
Expand All @@ -282,22 +282,22 @@
-webkit-font-smoothing: antialiased;
}

#results tbody tr:hover td {
.results tbody tr:hover td {
background: #ffe;
}

#results tr.selected td {
.results tr.selected td {
background: #3874d7 !important;
color: #fff !important;
}

#results td {
.results td {
color: #3a3633;
vertical-align: middle;
border: 0px none;
}

#results td div {
.results td div {
max-width: 350px;
max-height: 51px;
overflow: hidden;
Expand All @@ -311,22 +311,22 @@
*/
}

#results td div span.null {
.results td div span.null {
color: #bbb;
text-transform: uppercase;
}

#results td textarea {
.results td textarea {
color: #000 !important;
font-size: 12px;
}

#results th:first-child,
#results td:first-child {
.results th:first-child,
.results td:first-child {
padding-left: 15px;
}

#results.no-crop td div {
.results.no-crop td div {
max-width: none;
}

Expand Down
72 changes: 40 additions & 32 deletions static/index.html
Original file line number Diff line number Diff line change
Expand Up @@ -58,7 +58,6 @@
</div>
</div>
<div id="body">
<div id="input">
<div role="tabpanel">
<!-- Nav tabs -->
<ul id="ulQueryTab" class="nav nav-tabs" role="tablist">
Expand All @@ -75,25 +74,27 @@
<div class="tab-content">
<div role="tabpanel" class="tab-pane active" id="query_tab_1">
<div class="wrapper">
<div id="custom_query" class="query-editor"></div>
<div class="actions">
<input type="button" value="Run Query" class="btn btn-sm btn-primary js-run-query" />
<input type="button" value="Explain Query" class="btn btn-sm btn-default js-explain-query" />
<input type="button" id="csv" value="Download CSV" class="btn btn-sm btn-default" />
<div class="input">
<div id="custom_query" class="query-editor"></div>
<div class="actions">
<input type="button" value="Run Query" class="btn btn-sm btn-primary js-run-query" />
<input type="button" value="Explain Query" class="btn btn-sm btn-default js-explain-query" />
<input type="button" id="csv" value="Download CSV" class="btn btn-sm btn-default" />

<div id="query_progress">Please wait, query is executing...</div>
<div id="query_progress">Please wait, query is executing...</div>
</div>
</div>
<div class="output">
<div class="wrapper">
<table class="table results"></table>
</div>
</div>
</div>
</div>
</div>

</div>
</div>
<div id="output">
<div class="wrapper">
<table id="results" class="table"></table>
</div>
</div>

</div>
</div>

Expand Down Expand Up @@ -436,28 +437,35 @@ <h4 class="modal-title">Create table?</h4>
<script type="text/x-handlebars-template" id="tmpl-query-tab">
<div role="tabpanel" class="tab-pane" id="query_tab_{{tab_id}}">
<div class="wrapper">
{{#equal tab_mode 'proc'}}
<div class="editor-title">
<span>Name: </span><input type="text" disabled value="{{tab_title}}" />
</div>
{{/equal}}
<div id="query_editor_{{tab_id}}" class="query-editor {{tab_mode}}" data-isnew="{{is_new}}" data-procname=" {{proc_name}}" data-dbname="{{db_name}}"></div>
{{#equal tab_mode 'proc'}}
<div class="actions text-right">
<input type="button" value="Apply" data-proctype="{{proc_type}}" class="btn btn-sm btn-primary js-apply-proc" />
<input type="button" value="Cancel" class="btn btn-sm btn-default" />
<div class="input">
{{#equal tab_mode 'proc'}}
<div class="editor-title">
<span>Name: </span><input type="text" disabled value="{{tab_title}}" />
</div>
{{/equal}}
<div id="query_editor_{{tab_id}}" class="query-editor {{tab_mode}}" data-isnew="{{is_new}}" data-procname=" {{proc_name}}" data-dbname="{{db_name}}"></div>
{{#equal tab_mode 'proc'}}
<div class="actions text-right">
<input type="button" value="Apply" data-proctype="{{proc_type}}" class="btn btn-sm btn-primary js-apply-proc" />
<input type="button" value="Cancel" class="btn btn-sm btn-default" />

<div id="query_progress">Please wait, query is executing...</div>
</div>
{{else}}
<div class="actions">
<input type="button" value="Run Query" class="btn btn-sm btn-primary js-run-query" />
<input type="button" value="Explain Query" class="btn btn-sm btn-default js-explain-query" />
<input type="button" value="Download CSV" class="btn btn-sm btn-default js-export-query" />
<div id="query_progress">Please wait, query is executing...</div>
</div>
{{else}}
<div class="actions">
<input type="button" value="Run Query" class="btn btn-sm btn-primary js-run-query" />
<input type="button" value="Explain Query" class="btn btn-sm btn-default js-explain-query" />
<input type="button" value="Download CSV" class="btn btn-sm btn-default js-export-query" />

<div id="query_progress">Please wait, query is executing...</div>
<div id="query_progress">Please wait, query is executing...</div>
</div>
{{/equal}}
</div>
<div class="output">
<div class="wrapper">
<table class="table results"></table>
</div>
</div>
{{/equal}}
</div>
</div>
</script>
Expand Down
Loading

0 comments on commit fea4d9c

Please sign in to comment.