more polish on the layout

LasVegasRubyGroup · Jul 1, 2013 · 2530f58 · 2530f58
1 parent d9d07b5
commit 2530f58
Show file tree

Hide file tree

Showing 34 changed files with 378 additions and 167 deletions.
diff --git a/app/assets/images/vegas_bars_and_star.png b/app/assets/images/vegas_bars_and_star.png
diff --git a/app/assets/stylesheets/application.css.scss b/app/assets/stylesheets/application.css.scss
@@ -11,8 +11,8 @@
 
  *= require_self
 */
+@import url(https://fonts.googleapis.com/css?family=Lato:100,200,300,400,700);
 @import 'colors';
-
 @import 'compass';
 @import "bootstrap_and_overrides";
 
@@ -26,6 +26,29 @@ body { padding-top: 80px; }
 body {
   // background: url(/assets/cork.png) top left;
   background: $lightGray;
+  font-family: 'Lato', sans-serif;
+  font-weight: 300;
+}
+
+h1{
+  font-weight: 200;
+  font-size: 60px;
+}
+
+h2{
+  margin-top: 50px;
+  font-weight: 200;
+  font-size: 40px;
+}
+
+h3{
+  margin-top: 50px;
+  font-weight: 200;
+  font-size: 30px;
+}
+
+.red-border{
+  border: red solid 1px;
 }
 
 .score{
@@ -78,7 +101,7 @@ i.icon-twitter{
   text-align: center;
 
   p {
-    font-size: 10px;
+    font-size: 12px;
     color: darken($lightYellow, 90%);
 
     img {

diff --git a/app/assets/stylesheets/bootstrap_and_overrides.css.scss b/app/assets/stylesheets/bootstrap_and_overrides.css.scss
@@ -2,22 +2,47 @@
 
 $linkColor: $vegasRed;
 
+//borders
+$baseBorderRadius: 0px;
+$borderRadiusLarge: 0px;
+$borderRadiusSmall: 0px;
+$inputBorderRadius: 0px;
+
 //nav bar
 $navbarLinkColor: $lightGray;
 $navbarLinkBackgroundActive: none;
+$navbarLinkColorActive: $lightYellow;
 $navbarBackground: transparentize($vegasBlue, 0.2);
 $navbarBackgroundHighlight: transparentize($vegasBlue, 0.2);
-$dropdownLinkBackgroundHover: $yellowMustard;
-$navbarLinkColorHover: white;
+$dropdownLinkBackgroundHover: $lightYellow;
+$navbarLinkColorHover: $lightYellow;
 $dropdownLinkColorHover: white;
 $navbarHeight: 60px;
+// $navbarBrandColor: $lightYellow;
 
 .nav {
 
  li a {
   font-size: 18px;
-  // font-weight: 400;
   text-transform: uppercase;
-  // margin-top: 3px;
+  @include transition-duration(500ms);
+
+  }
+
+  ul.dropdown-menu{
+    @include border-radius(0px);
+  }
+}
+
+
+.dropdown-menu {
+  @include border-radius(0px);
+
+  li a{
+    @include transition-duration(0s);
   }
 }
+
+.alert{
+  margin-top: 20px;
+}
diff --git a/app/assets/stylesheets/colors.css.scss b/app/assets/stylesheets/colors.css.scss
@@ -2,5 +2,5 @@ $yellowMustard: #df9b53;
 $vegasRed: #db3c21;
 $vegasBlue: #407fd3;
 $lightGray: #f9f9f9;
-$lightYellow: #fdfcf7;
+$lightYellow: #FFCC66;
 $darkYellow: darken($lightYellow, 50%);
diff --git a/app/assets/stylesheets/stories.css.scss b/app/assets/stylesheets/stories.css.scss
@@ -1,8 +1,33 @@
 
+  // .blurb-container{
+  //   position: absolute;
+  //   right: 20px;
+  //   @include transition-property(background-color);
+  //   @include transition-duration(2s);
+
+  //   &:hover{
+  //   background-color: rgba(0,0,0,0.65);
+  //   @include transition-property(background-color);
+  //   @include transition-duration(2s);
+  //   }
+  // }
+
+
+.event-date{
+  margin-bottom: 150px;
+  border-left: 10px dashed $lightYellow;
+  padding-bottom: 20px;
+  padding-left: 20px;
+
+  h3{
+    font-weight: 400;
+  }
+}
 
 .story {
-  margin-bottom: 20px;
+  // background-color: rgba(249,249,249,0.85);
   position: relative;
+  // background: $lightGray;
 
   .left-pin {
     position: absolute;
@@ -21,51 +46,47 @@
   }
 
   .content {
-    // #gradient > .vertical(darken(@lightYellow, 1%), darken(@lightYellow, 2%));
-    box-shadow: 0px 3px 15px rgba(0,0,0,.1);
-
+    margin-top: 30px;
+    border-top: solid 1px lighten(gray, 40%);
     font-size: 20px;
-    line-height: 26px;
+    line-height: 28px;
     color: #555;
-    padding: 25px;
+    padding-top: 15px;
 
-    .vote {
-      @include border-radius(5px);
+    .vote_actions{
+      border-left: solid 1px lighten(gray, 40%);
+      min-height: 140px;
+    }
 
-      float: right;
-      background: $darkYellow;
+    .vote {
+      color: gray;
       padding: 15px;
-      margin: 0 0 25px 20px;
-      font-size: 200%;
       width: 30px;
+      font-size: 60px;
+      @include transition-property(background-color color);
+      @include transition-duration(750ms);
+
       &:hover {
+        @include transition-property(background-color color);
+        @include transition-duration(750ms);
         text-decoration: none;
-        background: darken($darkYellow, 15%);
-      }
-
-      i {
-        color: white;
-
-        &:hover {
-          color: white;
-          text-decoration: none;
-        }
+        color: green;
       }
     }
 
     .voted {
-      background: lighten(gray, 35%);
+      padding: 15px;
+      width: 30px;
+      font-size: 60px;
+      color: green;
+
       &:hover {
         text-decoration: none;
-        background: lighten(gray, 35%);
       }
     }
 
     @media (max-width: 767px) {
       .vote {
-        float: left;
-        padding: 0 9px 5px 10px;
-        margin: 10px 10px 0 0;
 
         i {
           font-size: 60%;
@@ -79,7 +100,6 @@
     }
 
     .rank {
-      text-align: right;
       color: #777;
       font-size: 120%;
     }
@@ -124,6 +144,7 @@
 
 .comments {
   margin-top: 15px;
+  margin-right: 10px;
 }
 
 .comment-form {

diff --git a/app/controllers/comments_controller.rb b/app/controllers/comments_controller.rb
@@ -5,6 +5,7 @@ def create
       params[:comment].merge(
         from_user_name: current_user.twitter_handle,
         twitter_handle: current_user.twitter_handle,
+        twitter_profile_image_url: current_user.twitter_profile_image_url,
         tweeted_at: Time.now))
     @comment.save!
 

diff --git a/app/controllers/info_controller.rb b/app/controllers/info_controller.rb
@@ -10,4 +10,8 @@ def users
   def best_of_week
     @stories = Story.within_past_week.sorted_by_most_votes.limit(25)
   end
+
+  def about
+
+  end
 end
diff --git a/app/controllers/sessions_controller.rb b/app/controllers/sessions_controller.rb
@@ -3,6 +3,7 @@ def create
     user = User.find_by_uid(auth_hash['uid'])
     unless user
       user = User.create(
+        twitter_profile_image_url: auth_hash.extra.raw_info.profile_image_url,
         twitter_handle: twitter_handle,
         uid: auth_hash['uid'],
         auth_credentials: auth_hash.credentials.token + ':' + auth_hash.credentials.secret)

diff --git a/app/controllers/stories_controller.rb b/app/controllers/stories_controller.rb
@@ -1,5 +1,5 @@
 class StoriesController < ApplicationController
-  before_filter :ensure_admin, except: :index
+  before_filter :ensure_admin, only: [:edit, :update]
 
   def index
     @stories = Story.within_past_month.ranked.page(params[:page]).limit(50)

diff --git a/app/helpers/bootstrap_flash_helper.rb b/app/helpers/bootstrap_flash_helper.rb
@@ -0,0 +1,18 @@
+module BootstrapFlashHelper
+
+  def bootstrap_flash
+    flash_messages = []
+    flash.each do |type, message|
+      # Skip Devise :timeout and :timedout flags
+      next if type == :timeout
+      next if type == :timedout
+      type = :success if type == :notice
+      type = :error   if type == :alert
+      text = content_tag(:div, 
+               content_tag(:button, raw("&times;"), :class => "close", "data-dismiss" => "alert") +
+               message, :class => "alert fade in alert-#{type}")
+      flash_messages << text if message
+    end
+    flash_messages.join("\n").html_safe
+  end
+end
diff --git a/app/models/comment.rb b/app/models/comment.rb
@@ -3,7 +3,7 @@ class Comment < Post
 
   # after_create :queue_reply_checker
 
-  attr_accessible :post_to_twitter
+  attr_accessible :post_to_twitter, :twitter_profile_image_url
   attr_accessor :post_to_twitter
 
   private

diff --git a/app/models/user.rb b/app/models/user.rb
@@ -1,5 +1,5 @@
 class User < ActiveRecord::Base
-  attr_accessible :twitter_handle, :uid, :auth_credentials
+  attr_accessible :twitter_handle, :uid, :auth_credentials, :twitter_profile_image_url
 
   def index
   end

diff --git a/app/views/comments/_comment.html.erb → app/views/comments/_cold_omment.html.erb b/app/views/comments/_comment.html.erb → app/views/comments/_cold_omment.html.erb
@@ -1,11 +1,9 @@
 <div class="story" data-id="<%= story.id %>" data-score="<%= story.score %>">
   <div class="row">
     <div class="content">
-      <%= image_tag(asset_path('pin.png'), class: 'left-pin visible-desktop') %>
-      <%= image_tag(asset_path('pin.png'), class: 'right-pin visible-desktop') %>
-      <%= image_tag(asset_path('pin.png'), class: 'center-pin hidden-desktop') %>
 
-      <div class="span7">
+
+      <div class="offset1 span7">
         <%= auto_link(story.content, url_target: '_blank').html_safe %>
 
         <div class="metadata">
@@ -25,7 +23,7 @@
         </div>
       </div>
 
-      <div class="span2">
+      <div class="span3">
         <% if current_user && !current_user.voted_on?(story) %>
           <%= link_to("<i class='icon-thumbs-up icon-white'></i>".html_safe, "#retweet-modal-#{story.twitter_id}", 'data-toggle' => 'modal', class: 'vote') %>
         <% elsif current_user && current_user.voted_on?(story) %>