Permalink
Browse files

Display collection header.

  • Loading branch information...
1 parent b0b2cf4 commit 7716eeea8a27a7c3fa84b113b38e57f5f94479f7 @michael michael committed Oct 3, 2013
Showing with 56 additions and 16 deletions.
  1. +37 −13 library.css
  2. +19 −3 src/collection_view.js
View
50 library.css
@@ -24,12 +24,10 @@
display: block;
padding: 20px;
margin-left: 30px;
-
margin-right: 20px;
margin-bottom: 20px;
}
-
.library-view .collection .teaser {
position: absolute;
top: 40px;
@@ -58,17 +56,6 @@
}
-.library-view .collection.active {
- background: #fff;
-}
-
-.library-view .navigation .label {
- margin-top: 30px;
- padding-bottom: 20px;
- font-family: 'Avenir LT W01 85 Heavy', 'Montserrat', 'Source Sans Pro';
- font-size: 16px;
-}
-
/* Collection View
======================================= */
@@ -83,6 +70,43 @@
padding-top: 30px;
}
+
+
+/* Collection metadata */
+
+.collection-view .collection {
+ position: relative;
+ display: block;
+ padding: 40px;
+ padding-top: 20px;
+ margin-left: 30px;
+ margin-right: 20px;
+ margin-bottom: 20px;
+ border-bottom: 2px solid #ccc;
+}
+
+.collection-view .collection .teaser {
+ position: absolute;
+ top: 40px;
+ right: 20px;
+ width: 100px;
+ border-radius: 50px;
+}
+
+.collection-view .collection .name {
+ font-family: 'Avenir LT W01 85 Heavy', 'Montserrat', 'Source Sans Pro';
+ font-size: 26px;
+}
+
+.collection-view .collection .description {
+ color: rgba(0,0,0, 0.7);
+ padding: 10px 0;
+ margin-right: 100px;
+ font-size: 18px;
+}
+
+/* Records stuff */
+
.collection-view .record {
display: block;
background: white;
View
22 src/collection_view.js
@@ -6,6 +6,7 @@ var html = util.html;
var View = require("substance-application").View;
var $$ = require("substance-application").$$;
+
// Substance.Collection.View
// ==========================================================================
//
@@ -23,15 +24,32 @@ CollectionView.Prototype = function() {
// Rendering
// --------
//
- // .collection
+ // .collection-view
// .records
// .title
// .authors
this.render = function() {
+
// Render the collection
var collection = this.collectionCtrl.collection;
var records = collection.records;
+
+ // Collection metadata
+ // ----------
+
+ this.el.appendChild($$('.collection', {
+ children: [
+ $$('.name', {text: collection.name}),
+ $$('.description', {text: collection.description}),
+ $$('img.teaser', {src: collection.image})
+ ]
+ }));
+
+
+ // Collection records
+ // ----------
+
var recordsEl = $$('.records');
// Sort by published_on date
@@ -74,8 +92,6 @@ CollectionView.Prototype = function() {
children: children
}));
-
-
}, this);
this.el.appendChild(recordsEl);

0 comments on commit 7716eee

Please sign in to comment.