Merge branch 'styling' into development

app/assets/stylesheets/application.css.scss

@@ -6,4 +6,4 @@
 @import 'bootstrap-tagsinput.css';
 @import 'campaign';
 
-///////////////////////////////////////////////////////////////////////////////
+///////////////////////////////////////////////////////////////////////////////

app/assets/stylesheets/campaign.css.scss

@@ -1,5 +1,13 @@
-section {
-  margin-top: 70px;
+body {
+  margin-top: 50px;
+}
+
+h2 {
+  margin-top: 0;
+}
+
+strong, label, th {
+  color: #395C84;
 }
 
 ul {
@@ -11,8 +19,17 @@ ul {
   font-size: .85em;
 }
 
+.alert {
+  margin-bottom: 0;
+  margin-top: 1.5em;
+  padding: 5px 10px;
+}
 
-$medgray: #3A9AC9;
+.alert-form {
+  margin-top: .5em !important;
+}
+
+// $medgray: #3A9AC9;
 
 .videolisting {
   label {
@@ -23,7 +40,8 @@ $medgray: #3A9AC9;
   //   border: 2px inset;
   // }
 
-  .nested-fields {
+  .nested-fields:nth-of-type(odd), li.blue-box:nth-of-type(odd),
+  .nested-fields:nth-of-type(even), li.blue-box:nth-of-type(even) {
     -webkit-border-radius: 1em; 
     -moz-border-radius: 1em; 
     border-radius: 1em;
@@ -34,16 +52,15 @@ $medgray: #3A9AC9;
     }
   }
 
-  .nested-fields:nth-of-type(odd){
+  .nested-fields:nth-of-type(odd), li.blue-box:nth-of-type(odd){
     background-color: #395C84;
-
   }
 
-  .nested-fields:nth-of-type(even) {
+  .nested-fields:nth-of-type(even), li.blue-box:nth-of-type(even) {
     background-color: lighten(#395C84, 10%);
   }
 
-  .blah {
+  .remove-video {
     a {
       color: #ffffff;
       font-weight: bold;
@@ -52,7 +69,6 @@ $medgray: #3A9AC9;
 
 }
 
-
 .campaigns {
   input, select, textarea {
     width: 100%;
@@ -102,11 +118,10 @@ $medgray: #3A9AC9;
   }
 }
 
-
 #error_explanation ul{
   display: none;
 }
 
 span.help-inline {
   color: #f00;
-}
+}

app/views/application/_flashes.html.erb

@@ -1,5 +1,13 @@
-<div id="flash">
-  <% flash.each do |key, value| -%>
-    <div id="flash_<%= key %>"><%= value %></div>
-  <% end -%>
-</div>
+<div class="container">
+	<section>
+		<div id="flash">
+		  <% flash.each do |key, value| -%>
+		  	<% if flash[:notice] %>
+			    <div id="flash_<%= key %>" class="alert alert-success"><%= value %></div>
+		    <% else %>
+		    	<div id="flash_<%= key %>" class="alert alert-danger"><%= value %></div>
+		    <% end %>
+		  <% end -%>
+		</div>
+	</section>
+</div>

app/views/campaigns/_form.html.erb

@@ -4,9 +4,8 @@
         file: :vertical_file_input,
         boolean: :vertical_boolean
 }) do |frm| %>
-    <% if @campaign.errors.any? %>
-      <div class="row">
-        <div class="col-md-12 error_explanation">
+    <!-- <% if @campaign.errors.any? %>
+        <div class="error_explanation">
           <h2><%= pluralize(@campaign.errors.count, "error") %> prohibited this campaign from being saved:</h2>
           <ul>
             <% @campaign.errors.full_messages.each do |msg| %>
@@ -14,11 +13,10 @@
             <% end %>
           </ul>
         </div>
-      </div>
-    <% end %>
+    <% end %> -->
 
     <div class="row">
-       <div class="col-md-6">
+       <div class="col-md-8">
           <%= frm.input :advertisername,
                         label: 'Advertiser Name',
                         hint: "The name of the company." %>
@@ -85,7 +83,7 @@
                         hint: "Toll-free phone number of business. Used in video creation." %>
        </div>
 
-       <div class="col-md-6 videolisting">
+       <div class="col-md-4 videolisting">
             <%= frm.simple_fields_for(:videolistings, html: {class: 'form-horizontal'}) do |videolisting| %>
                 <%= render 'videolisting_fields', :f => videolisting %>
             <% end %>

app/views/campaigns/_videolisting_fields.html.erb

@@ -18,5 +18,5 @@
                       label: 'Asset Urls',
                       hint: "A list of all file assets. Comma Separated, (press backspace or click the x to remove)",
                       input_html: {data: {role: "tagsinput" }, value: ""} %>
-    <div class="blah"><%= link_to_remove_association "Remove Video Listing", f %></div>
+    <div class="text-right remove-video"><%= link_to_remove_association "Remove Video Listing", f %></div>
 </div>

app/views/campaigns/show.html.erb

@@ -8,7 +8,7 @@
     <hr>
     <p id="notice"><%= notice %></p>
     <div class="row">
-      <div class="col-md-6">
+      <div class="col-md-8">
         <ul>
           <% unless @campaign.listingcode.empty? %>
               <li>
@@ -132,10 +132,10 @@
           <% end %>
         </ul>
       </div>
-      <div class="col-md-6 videolisting">
-        <ul class="nested-fields">
+      <div class="col-md-4 videolisting">
+        <ul class="blue-box-container">
           <% @campaign.videolistings.each do |videolisting| %>
-            <li><%= render 'videolisting', videolisting: videolisting %></li>
+            <li class="blue-box"><%= render 'videolisting', videolisting: videolisting %></li>
           <% end %>
           <% if @campaign.videolistings.empty? %>
               <li><p>No Video Listings for this Campaign.</p></li>

config/initializers/simple_form_bootstrap.rb

@@ -9,7 +9,7 @@ SimpleForm.setup do |config|
     b.use :label
     b.wrapper tag: 'div', class: 'controls' do |ba|
       ba.use :input
-      ba.use :error, wrap_with: { tag: 'span', class: 'help-inline' }
+      ba.use :error, wrap_with: { tag: 'div', class: 'alert alert-danger alert-form' }
       ba.use :hint,  wrap_with: { tag: 'p', class: 'help-block' }
     end
   end
@@ -23,7 +23,7 @@ SimpleForm.setup do |config|
         prepend.use :input
       end
       input.use :hint,  wrap_with: { tag: 'span', class: 'help-block' }
-      input.use :error, wrap_with: { tag: 'span', class: 'help-inline' }
+      input.use :error, wrap_with: { tag: 'div', class: 'alert alert-danger alert-form' }
     end
   end
 
@@ -36,7 +36,7 @@ SimpleForm.setup do |config|
         append.use :input
       end
       input.use :hint,  wrap_with: { tag: 'span', class: 'help-block' }
-      input.use :error, wrap_with: { tag: 'span', class: 'help-inline' }
+      input.use :error, wrap_with: { tag: 'div', class: 'alert alert-danger alert-form' }
     end
   end