remove top-level divs from handlebars templates -- move that logic into the backbone view.
This commit is contained in:
parent
806487a5ff
commit
e78ab14fc5
9 changed files with 39 additions and 46 deletions
|
|
@ -24,7 +24,7 @@ app.pages.PostViewer = app.views.Base.extend({
|
|||
|
||||
this.postView = new app.views.Post({
|
||||
model : this.model,
|
||||
className : "post loaded",
|
||||
className : this.options.postTemplateName + " post loaded",
|
||||
templateName : "post-viewer/content/" + this.options.postTemplateName,
|
||||
attributes : {"data-template" : this.options.postTemplateName}
|
||||
});
|
||||
|
|
|
|||
|
|
@ -1,10 +1,7 @@
|
|||
<div class="activity-streams-photo backdrop">
|
||||
<div class="photoset">
|
||||
<div class="img-bounding-box">
|
||||
<a href="{{object_url}}" class="stream-photo-link">
|
||||
<img src="{{image_url}}" data-small-photo="{{image_url}}" data-full-photo="{{image_url}}" class="stream-photo" />
|
||||
</a>
|
||||
</div>
|
||||
<div class="photoset">
|
||||
<div class="img-bounding-box">
|
||||
<a href="{{object_url}}" class="stream-photo-link">
|
||||
<img src="{{image_url}}" data-small-photo="{{image_url}}" data-full-photo="{{image_url}}" class="stream-photo" />
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
|
|
|||
|
|
@ -1,13 +1,11 @@
|
|||
<div class="multi-photo backdrop">
|
||||
<h3>
|
||||
{{{text}}}
|
||||
</h3>
|
||||
<h3>
|
||||
{{{text}}}
|
||||
</h3>
|
||||
|
||||
<div class="photoset">
|
||||
{{#each photos}}
|
||||
<div class="img-bounding-box">
|
||||
<img src="{{sizes.large}}" />
|
||||
</div>
|
||||
{{/each}}
|
||||
</div>
|
||||
<div class="photoset">
|
||||
{{#each photos}}
|
||||
<div class="img-bounding-box">
|
||||
<img src="{{sizes.large}}" />
|
||||
</div>
|
||||
{{/each}}
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -1,4 +1,4 @@
|
|||
<div class="note offset5">
|
||||
<div class="note-content">
|
||||
<h1>
|
||||
A HEADING
|
||||
</h1>
|
||||
|
|
|
|||
|
|
@ -1,4 +1,4 @@
|
|||
{{#each photos}}
|
||||
<div class="status photo-backdrop" style="background-image: url({{sizes.large}})">
|
||||
<div class="photo-fill" style="background-image: url({{sizes.large}})">
|
||||
</div>
|
||||
{{/each}}
|
||||
|
|
|
|||
|
|
@ -1,4 +1,4 @@
|
|||
<div class="backdrop rich-media">
|
||||
<div class="rich-media">
|
||||
|
||||
{{{o_embed_cache.data.html}}}
|
||||
|
||||
|
|
|
|||
|
|
@ -1,5 +1,5 @@
|
|||
{{#each photos}}
|
||||
<div class="status photo-backdrop" style="background-image: url({{sizes.large}})">
|
||||
<div class="photo-fill" style="background-image: url({{sizes.large}})">
|
||||
<div class="darken">
|
||||
<h1>
|
||||
{{{../text}}}
|
||||
|
|
|
|||
|
|
@ -1,5 +1,3 @@
|
|||
<div class="status backdrop">
|
||||
<h1>
|
||||
{{{text}}}
|
||||
</h1>
|
||||
</div>
|
||||
<h1>
|
||||
{{{text}}}
|
||||
</h1>
|
||||
|
|
|
|||
|
|
@ -111,10 +111,6 @@ $light-grey: #999;
|
|||
}
|
||||
|
||||
/* styles */
|
||||
|
||||
.bump-left { @include animation(bump-left) }
|
||||
.bump-right { @include animation(bump-right) }
|
||||
|
||||
.multi-photo {
|
||||
.img-bounding-box {
|
||||
@include center(horizontal);
|
||||
|
|
@ -137,7 +133,7 @@ $light-grey: #999;
|
|||
width: 100%;
|
||||
}
|
||||
|
||||
.note {
|
||||
.note-content {
|
||||
width: 550px;
|
||||
padding-bottom: 50px;
|
||||
|
||||
|
|
@ -151,16 +147,19 @@ $light-grey: #999;
|
|||
}
|
||||
}
|
||||
|
||||
.status {
|
||||
.status,
|
||||
.status-with-photo-backdrop
|
||||
{
|
||||
h1 {
|
||||
font-weight: bold;
|
||||
font-size: 40px;
|
||||
}
|
||||
}
|
||||
|
||||
&.photo-backdrop {
|
||||
h1 {
|
||||
font-size: 100px;
|
||||
}
|
||||
.status-with-photo-backdrop {
|
||||
h1 {
|
||||
font-size: 100px;
|
||||
color: #fff;
|
||||
}
|
||||
}
|
||||
|
||||
|
|
@ -175,10 +174,8 @@ $light-grey: #999;
|
|||
background-color: rgba(0,0,0,0.5);
|
||||
}
|
||||
|
||||
.backdrop,
|
||||
.photo-backdrop {
|
||||
.post {
|
||||
@include center();
|
||||
@include background-cover();
|
||||
|
||||
position: absolute;
|
||||
|
||||
|
|
@ -189,6 +186,13 @@ $light-grey: #999;
|
|||
height: 100%;
|
||||
}
|
||||
|
||||
.photo-fill {
|
||||
@include background-cover();
|
||||
position: absolute;
|
||||
height: 100%;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.photo-backdrop {
|
||||
h1 {
|
||||
color: #fff;
|
||||
|
|
@ -516,7 +520,3 @@ $light-grey: #999;
|
|||
}
|
||||
}
|
||||
}
|
||||
|
||||
#post-content {
|
||||
padding-top: 50px;
|
||||
}
|
||||
|
|
|
|||
Loading…
Reference in a new issue