From 9496e8023e96bb5a9f16f061483f89ae6b5f8d0e Mon Sep 17 00:00:00 2001 From: Markus Grigull Date: Thu, 1 Oct 2015 16:36:37 +0200 Subject: [PATCH] Changed layout to two columns based The left column displays all entities found and the right column displays the properties of one entity. An entity can be selected by clicking on it in the left table. Last updated label is visible but not used yet. --- app/components/entities-table.js | 2 +- app/components/properties-table.js | 2 +- app/routes/lab-mashup.js | 3 +++ app/routes/lab-mashup/index.js | 3 --- app/styles/app.css | 38 +++++++++++++++++++---------- app/templates/lab-mashup.hbs | 14 ++++++++++- app/templates/lab-mashup/entity.hbs | 2 -- app/templates/lab-mashup/index.hbs | 2 +- 8 files changed, 44 insertions(+), 22 deletions(-) diff --git a/app/components/entities-table.js b/app/components/entities-table.js index b47b62e..555fdc6 100644 --- a/app/components/entities-table.js +++ b/app/components/entities-table.js @@ -2,5 +2,5 @@ import Ember from 'ember'; export default Ember.Component.extend({ tagName: 'table', - classNames: ['properties-table'] + classNames: ['data-table'] }); diff --git a/app/components/properties-table.js b/app/components/properties-table.js index b47b62e..555fdc6 100644 --- a/app/components/properties-table.js +++ b/app/components/properties-table.js @@ -2,5 +2,5 @@ import Ember from 'ember'; export default Ember.Component.extend({ tagName: 'table', - classNames: ['properties-table'] + classNames: ['data-table'] }); diff --git a/app/routes/lab-mashup.js b/app/routes/lab-mashup.js index 26d9f31..3ac0567 100644 --- a/app/routes/lab-mashup.js +++ b/app/routes/lab-mashup.js @@ -1,4 +1,7 @@ import Ember from 'ember'; export default Ember.Route.extend({ + model() { + return this.store.findAll('entity'); + } }); diff --git a/app/routes/lab-mashup/index.js b/app/routes/lab-mashup/index.js index 3ac0567..26d9f31 100644 --- a/app/routes/lab-mashup/index.js +++ b/app/routes/lab-mashup/index.js @@ -1,7 +1,4 @@ import Ember from 'ember'; export default Ember.Route.extend({ - model() { - return this.store.findAll('entity'); - } }); diff --git a/app/styles/app.css b/app/styles/app.css index fff2f7e..58b25b0 100644 --- a/app/styles/app.css +++ b/app/styles/app.css @@ -54,20 +54,32 @@ body { z-index: 2; } -#footer { - color: #777; - border-top: 1px solid #e6e6e6; +#main-left { + float: left; + width: 45%; - padding: 10px 15px; - height: 20px; + padding-top: 10px; + padding-left: 25px; +} - text-align: center; +#main-right { + float: right; + width: 45%; + + padding-top: 10px; + padding-right: 25px; +} + +#main::after { + display: block; + content: ""; + clear: both; } #info { color: #777; - margin: 65px auto 0; + margin: 35px auto 0; font-size: 12px; text-shadow: 0 1px 0 rgba(255, 255, 255, 0.5); @@ -75,23 +87,23 @@ body { } #last-update-info { - margin: 30px auto auto 0; + padding: 0px 0 20px 0; - font-size: 12px; + font-size: 16px; text-align: center; } -.properties-table { +.data-table { background: #eee; border: 1px solid #999; border-collapse: collapse; - width: 50%; + width: 100%; margin: 0 auto; } -.properties-table th { +.data-table th { background: #ddd; border: 1px solid #999; @@ -102,7 +114,7 @@ body { font-size: 16px; } -.properties-table td { +.data-table td { border: 1px solid #999; border-collapse: collapse; diff --git a/app/templates/lab-mashup.hbs b/app/templates/lab-mashup.hbs index 405f0a0..5f86ee1 100644 --- a/app/templates/lab-mashup.hbs +++ b/app/templates/lab-mashup.hbs @@ -1,3 +1,15 @@
- {{outlet}} +
+

Entities

+ + {{entities-table entities=model}} +
+ +
+ {{outlet}} +
+
+ +
+

Last updated:

diff --git a/app/templates/lab-mashup/entity.hbs b/app/templates/lab-mashup/entity.hbs index 7e7e964..eb6e543 100644 --- a/app/templates/lab-mashup/entity.hbs +++ b/app/templates/lab-mashup/entity.hbs @@ -1,5 +1,3 @@ {{entity-title entity=model}} {{properties-table entity=model}} - -{{#link-to 'lab-mashup'}}Entities{{/link-to}} diff --git a/app/templates/lab-mashup/index.hbs b/app/templates/lab-mashup/index.hbs index 8c43439..5321cb4 100644 --- a/app/templates/lab-mashup/index.hbs +++ b/app/templates/lab-mashup/index.hbs @@ -1 +1 @@ -{{entities-table entities=model}} +

Select an entity to show it's properties