diff --git a/public/javascripts/app/helpers/text_formatter.js b/public/javascripts/app/helpers/text_formatter.js index 99115f507..08b4e224b 100644 --- a/public/javascripts/app/helpers/text_formatter.js +++ b/public/javascripts/app/helpers/text_formatter.js @@ -3,11 +3,11 @@ var text = model.get("text"); var mentions = model.get("mentioned_people"); - return $(textFormatter.mentionify( + return textFormatter.mentionify( textFormatter.hashtagify( textFormatter.markdownify(text) ), mentions - )).html() + ) }; textFormatter.markdownify = function markdownify(text){ diff --git a/public/javascripts/app/templates/post-viewer/content/multi-photo.handlebars b/public/javascripts/app/templates/post-viewer/content/multi-photo.handlebars index d33548782..25a681ef9 100644 --- a/public/javascripts/app/templates/post-viewer/content/multi-photo.handlebars +++ b/public/javascripts/app/templates/post-viewer/content/multi-photo.handlebars @@ -1,6 +1,4 @@ -

- {{{text}}} -

+{{{text}}}
{{#each photos}} diff --git a/public/javascripts/app/templates/post-viewer/content/note.handlebars b/public/javascripts/app/templates/post-viewer/content/note.handlebars index 40f1369b4..bb45a09d9 100644 --- a/public/javascripts/app/templates/post-viewer/content/note.handlebars +++ b/public/javascripts/app/templates/post-viewer/content/note.handlebars @@ -1,8 +1,3 @@
-

- A HEADING -

-

- {{{text}}} -

+ {{{text}}}
diff --git a/public/javascripts/app/templates/post-viewer/content/photo-backdrop.handlebars b/public/javascripts/app/templates/post-viewer/content/photo-backdrop.handlebars index eca34ca0b..6afb41df1 100644 --- a/public/javascripts/app/templates/post-viewer/content/photo-backdrop.handlebars +++ b/public/javascripts/app/templates/post-viewer/content/photo-backdrop.handlebars @@ -1,4 +1,4 @@ {{#each photos}} -
-
+
+ {{/each}} diff --git a/public/javascripts/app/templates/post-viewer/content/rich-media.handlebars b/public/javascripts/app/templates/post-viewer/content/rich-media.handlebars index 229c3d677..b15780879 100644 --- a/public/javascripts/app/templates/post-viewer/content/rich-media.handlebars +++ b/public/javascripts/app/templates/post-viewer/content/rich-media.handlebars @@ -5,7 +5,5 @@

-

- {{{text}}} -

+ {{{text}}}
diff --git a/public/javascripts/app/templates/post-viewer/content/status-with-photo-backdrop.handlebars b/public/javascripts/app/templates/post-viewer/content/status-with-photo-backdrop.handlebars index 935e215b0..cc15b92a9 100644 --- a/public/javascripts/app/templates/post-viewer/content/status-with-photo-backdrop.handlebars +++ b/public/javascripts/app/templates/post-viewer/content/status-with-photo-backdrop.handlebars @@ -2,9 +2,7 @@
-

- {{{../text}}} -

+ {{{../text}}}
diff --git a/public/javascripts/app/templates/post-viewer/content/status.handlebars b/public/javascripts/app/templates/post-viewer/content/status.handlebars index 8585a42c9..05a443902 100644 --- a/public/javascripts/app/templates/post-viewer/content/status.handlebars +++ b/public/javascripts/app/templates/post-viewer/content/status.handlebars @@ -1,3 +1 @@ -

- {{{text}}} -

+{{{text}}} diff --git a/public/stylesheets/sass/new-templates.scss b/public/stylesheets/sass/new-templates.scss index 4c5b4d698..a0b47d23a 100644 --- a/public/stylesheets/sass/new-templates.scss +++ b/public/stylesheets/sass/new-templates.scss @@ -87,6 +87,10 @@ $pane-width: 420px; background-image: url("../images/hatched-bg-dark.png"); } +@mixin photo-shadow() { + @include box-shadow(0, 3px, 15px, #999); +} + /* keyframes */ @-webkit-keyframes bump-left { @@ -153,7 +157,7 @@ $pane-width: 420px; } img { - @include box-shadow(0, 3px, 15px, #999); + @include photo-shadow(); max-width: 100%; max-height: 100%; @@ -175,26 +179,40 @@ $pane-width: 420px; p { font-size: 20px; line-height: 28px; - } - - h1 { - margin-bottom: 1em; + font-family: georgia, times, serif; } } .status, .status-with-photo-backdrop { - h1 { + p { font-weight: bold; font-size: 40px; + line-height: 45px; + padding-bottom: 0; + margin-bottom: 0; } } .status-with-photo-backdrop { - h1 { - font-size: 100px; + p { color: #fff; + + a { + @include transition(background-color, 0.3s); + + color: #000; + background-color: #fff; + background-color: rgba(255,255,255,0.7); + padding: 0 5px; + + &:hover { + text-decoration: none; + background-color: #fff; + background-color: rgba(255,255,255,1); + } + } } } @@ -213,6 +231,8 @@ $pane-width: 420px; vertical-align: middle; text-align: center; + padding: 70px 10%; + height: 100%; width: 100%; } @@ -235,10 +255,18 @@ $pane-width: 420px; } .photo-backdrop { - h1 { + p { color: #fff; z-index: 2; } + + img { + position: relative; + } + + .photo-fill { + @include opacity(0.2) + } } .rich-media { @@ -381,6 +409,7 @@ body.idle { bottom: 0; left: 0; text-align: center; + z-index: 100; } #post-reactions { @@ -639,9 +668,15 @@ body.idle { #post-content { display: table; + padding: 70px 10%; + position: absolute; height: 100%; width: 100%; + + img { + @include photo-shadow(); + } } #post-feedback {