styling

UI/AddSeries/SearchResultTemplate.html

@@ -2,7 +2,7 @@
     <div class="row">
         <div class="span2">
             <a href="{{traktUrl}}" target="_blank">
-                <img class="series-poster img-polaroid" src="{{remotePoster}}">
+                <img class="add-series-poster" src="{{remotePoster}}">
             </a>
         </div>
         <div class="span9">

UI/AddSeries/addSeries.less

@@ -41,7 +41,7 @@
   padding-top: 10px;
 }
 
-.img-polaroid {
+.add-series-poster {
   min-width: 138px;
   min-height: 203px;
   max-width: 138px;

UI/Index.html

@@ -34,9 +34,9 @@
                     <li><a href="/calendar"><i class="icon-calendar"></i>
                         <br>
                         Calendar</a></li>
-                    <li><span class="label label-important pull-right">08</span><a href="history"><i class="icon-time"></i><br>
+                    <li><a href="history"><i class="icon-time"></i><br>
                         History</a></li>
-                    <li><span class="label label-important pull-right">04</span><a href="missing"><i class="icon-folder-open"></i><br>
+                    <li><a href="missing"><i class="icon-folder-open"></i><br>
                         Missing</a></li>
                     <li><a href="settings"><i class="icon-cogs"></i>
                         <br>

UI/Series/Details/SeasonLayoutTemplate.html

@@ -1,4 +1,4 @@
 <div class="series-season">
-    <h3>{{seasonTitle}}</h3>
+    <h2>{{seasonTitle}}</h2>
     <div id="x-episode-grid"/>
 </div>

UI/Series/Details/SeriesDetailsTemplate.html

@@ -1,14 +1,14 @@
-<div class="row series-page-header series-detail-summary">
-    <div class="span2">
+<div class="row series-page-header">
+    <div class="span3">
         <a href="{{traktUrl}}" target="_blank">
-            <img class="series-poster img-polaroid" src="{{poster}}">
+            <img class="series-poster" src="{{poster}}">
         </a>
     </div>
-    <div class="span9">
+    <div class="offset1 span7">
         <div class="row">
-            <h2>{{title}}</h2>
+            <h1>{{title}}</h1>
         </div>
-        <div class="row">
+        <div class="row  series-detail-overview">
             {{overview}}
         </div>
         <div class="row">

UI/Series/Index/List/ItemTemplate.html

@@ -2,7 +2,7 @@
     <div class="row">
         <div class="span2">
             <a href="{{route}}">
-                <img class="series-poster img-polaroid" src="{{poster}}">
+                <img class="series-poster" src="{{poster}}">
             </a>
         </div>
         <div class="span10">

UI/Series/Index/Posters/ItemTemplate.html

@@ -11,7 +11,7 @@
                         <div class="ended-banner">Ended</div>
                     {{/unless}}
                     <a href="{{route}}">
-                        <img class="series-poster img-polaroid" src="{{poster}}">
+                        <img class="series-poster" src="{{poster}} ">
                     </a>
                 </div>
             </div>

UI/Series/series.less

@@ -1,4 +1,5 @@
 @import "../Shared/Styles/card.less";
+@import "../Shared/Styles/clickable.less";
 
 .series-item {
   padding-bottom: 30px;
@@ -16,6 +17,18 @@
   }
 }
 
+.series-page-header {
+  .card;
+  padding: 30px 0px;
+}
+
+.series-season {
+  .card;
+  margin: 80px 10px;
+  padding: 20px 40px;
+
+}
+
 .series-posters {
   list-style-type: none;
 
@@ -23,16 +36,13 @@
     display: inline-block;
     vertical-align: top;
   }
-  .series-page-header {
-    padding-bottom: 50px;
-  }
 
   .series-posters-item {
 
     .card;
-
+    .clickable;
     margin-bottom: 20px;
-    height: 260px;
+    height: 300px;
 
     .center {
       display: block;
@@ -58,7 +68,7 @@
     .labels {
       display: inline-block;
       opacity: 0.75;
-      width: 138px;
+      width: 170px;
 
       :hover {
         cursor: default;
@@ -73,10 +83,6 @@
         opacity: 1;
       }
     }
-    .series-season {
-      padding-bottom: 20px;
-
-    }
   }
 
   .series-poster-container {
@@ -115,6 +121,6 @@
 
 }
 
-.series-detail-summary {
+.series-detail-overview {
   margin-bottom: 50px;
 }

UI/Shared/Styles/card.less

@@ -1,7 +1,7 @@
 .card {
   margin :10px;
   padding: 10px;
-  box-shadow: 0px 0px 20px 1px #e1e1e1;
+  box-shadow: 0px 0px 10px 1px #e1e1e1;
   color: #444444;
   -moz-border-radius: 3px;
   -webkit-border-radius: 3px;