Update styles and fix other display issues

WasabiFan · WasabiFan · commit 570aa712ab2c · 2014-09-07T00:24:23.000-07:00
diff --git a/_includes/youtube-embed.html b/_includes/youtube-embed.html
@@ -1,7 +1,4 @@
 ﻿{% if page.youtube_video_id %}
-    {% if page.youtube_video_id_pre %}
-        {{page.youtube_video_id_pre}}<br/>
-    {% endif %}
-    <iframe width="560" height="315" src="//www.youtube.com/embed/{{page.youtube_video_id}}?rel=0" frameborder="0" allowfullscreen="1"> </iframe>
+    <iframe src="//www.youtube.com/embed/{{page.youtube_video_id}}?rel=0" frameborder="0" allowfullscreen="1" class="youtube-embed"> </iframe>
     <br /><br />
 {% endif %}
diff --git a/_layouts/project.html b/_layouts/project.html
@@ -36,10 +36,11 @@ <h3>
                     </div><br />
                 {% endif %}
                 {% if page.programming_language %}
+                    <br />
                     Written In {{page.programming_language}}<br />
                 {% endif %}
                 {% if page.author %}
-                    <br />Created By<br /><br />
+                    <br />Created By:<br /><br />
                     {% assign author_card = page.author %}
                     {% include author-card.html %}
                 {% endif %}
diff --git a/stylesheets/styles.css b/stylesheets/styles.css
@@ -625,8 +625,8 @@ strong {
 }
 
 .project-content-wrapper {
-    width: 650px;
-    width: calc(100% - 250px);
+    width: 610px;
+    width: calc(100% - 290px);
     display: inline;
     float: left;
     margin-right: 20px;
@@ -639,6 +639,28 @@ strong {
     text-align:center;
     margin-right: 20px;
     margin-left: 20px;
+    margin-bottom: 20px;
+
+    padding: 20px;
+
+    background: #191919;
+    -moz-border-radius: 2px;
+    -webkit-border-radius: 2px;
+    -o-border-radius: 2px;
+    -ms-border-radius: 2px;
+    -khtml-border-radius: 2px;
+    border-radius: 2px;
+    border: 1px solid #121212;
+    -moz-box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.3);
+    -webkit-box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.3);
+    -o-box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.3);
+    box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.3);
+
+}
+
+.project-sidebar h3 {
+    border-bottom: none;
+    color: #fff;
 }
 
 .project-sidebar .button a {
@@ -819,12 +841,17 @@ dt {
   display: none;
   line-height: 50px;
   height: 50px;
-  padding: 8px 6px;
+  padding: 8px 0 8px 6px;
+  opacity: 0.7;
 
   cursor: pointer;
   float: right;
 }
 
+    .nav-menu:hover {
+        opacity: 1;
+    }
+
 #header nav li.left {
   float: left; 
   margin-right: 6px;
@@ -922,18 +949,18 @@ section #title p {
 .user-card {
     position: relative;
     min-height: 40px;
-    background-color: #333333;
+    background-color: #252525;
     font-family: "Helvetica", Arial, sans-serif;
     color: #fff;
     border-radius: 2px;
     text-align: center;
     font-weight: 100;
     padding: 5px;
 
-    -moz-box-shadow: 0px 3px 7px rgba(0, 0, 0, 0.7);
-    -webkit-box-shadow: 0px 3px 7px rgba(0, 0, 0, 0.7);
-    -o-box-shadow: 0px 3px 7px rgba(0, 0, 0, 0.7);
-    box-shadow: 0px 3px 7px rgba(0, 0, 0, 0.7);
+    -moz-box-shadow: 0px 1px 5px rgba(0, 0, 0, 0.7);
+    -webkit-box-shadow: 0px 1px 5px rgba(0, 0, 0, 0.7);
+    -o-box-shadow: 0px 1px 5px rgba(0, 0, 0, 0.7);
+    box-shadow: 0px 1px 5px rgba(0, 0, 0, 0.7);
 }
 
 .user-card .user-card-avatar {
@@ -978,6 +1005,11 @@ section #title p {
     vertical-align: middle;
 }
 
+.youtube-embed {
+    width: 100%;
+    height: 300px;
+}
+
 @media print, screen and (max-width: 450px) {
     #logo {
         display: none;
