diff --git a/layouts/default.html b/layouts/default.html
index 4887498..6c4f293 100644
--- a/layouts/default.html
+++ b/layouts/default.html
@@ -1,17 +1,17 @@
-
-
+
+
-
-
+
+
<%= yield %>
<%= render 'footer' %>
diff --git a/layouts/home.html b/layouts/home.html
new file mode 100644
index 0000000..f199615
--- /dev/null
+++ b/layouts/home.html
@@ -0,0 +1,54 @@
+
+
+
+
+
+
<%= @item[:title] %>
+
+
+
+
+
+
+
+
+
+ <%= render 'header' %>
+
+
+
Geeky
+
+
+
+ <% sorted_articles[0..4].each do |article| %>
+ <%= render 'article', :article => article %>
+ <% end %>
+
+
More
+
+
+
+
+
+
Non-Geeky
+
+
+
+ <% sorted_articles[5..9].each do |article| %>
+ <%= render 'article', :article => article %>
+ <% end %>
+
+
More
+
+
+
+
+
+
+ -
+
+
+
+ <%= render 'footer' %>
+
+
diff --git a/layouts/home.yaml b/layouts/home.yaml
new file mode 100644
index 0000000..20670d5
--- /dev/null
+++ b/layouts/home.yaml
@@ -0,0 +1,2 @@
+--- {}
+
diff --git a/output/css/mobile.css b/output/css/mobile.css
index 34a1181..1f4667a 100644
--- a/output/css/mobile.css
+++ b/output/css/mobile.css
@@ -1,3 +1,7 @@
#technical div, #personal div {
padding: 0 1em;
}
+
+.column {
+ min-width: 600px;
+}
diff --git a/output/css/style.css b/output/css/style.css
index 5a7dba8..8a82148 100644
--- a/output/css/style.css
+++ b/output/css/style.css
@@ -1,8 +1,3 @@
-@font-face {
- font-family: "Titillium";
- src: url(/fonts/TitilliumMaps26L004.otf) format("opentype");
-}
-
body {
font-family: Constantia, Georgia, "Bitstream Vera Serif", "Liberation Serif", serif;
font-size: 62.5%;
@@ -118,10 +113,19 @@ ul#menu li {
font-size: inherit;
}
-#main {
- padding: 0 2em;
+body.article h1 {
+ padding-left: 20px;
+ padding-right: 20px;
+}
+
+#content {
+ padding: 0 20px;
clear: both;
}
+body.article #content {
+ min-width: 600px;
+ margin-right: 40%;
+}
#footer {
color: gray;
@@ -147,7 +151,7 @@ ul#menu li {
float: left;
width: 50%;
margin: 0;
- min-width: 480px;
+ min-width: 400px;
}
#personal div {
padding-right: 2em;
@@ -155,36 +159,38 @@ ul#menu li {
.column div {
padding: 0 0 0 2em;
}
-.column strong {
+
+/* Article Listing */
+ul.articles {
+ list-style: none;
+ margin: 0;
+}
+ul.articles li {
+ margin: 0;
+ padding-top: 1em;
+ height: 80px;
+}
+body.articles ul.articles li {
+ height: 60px;
+}
+ul.articles li:first-child {
+ border-top: none;
+ padding-top: 1em;
+}
+ul.articles abbr {
+ display: block;
+ font-size: 0.8em;
+ color: #aaa;
+}
+ul.articles strong {
font-family: "Helvetica Neue", Helvetica, "Liberation Sans", "Bitstream Vera Sans", Tahoma, Geneva, Arial, sans-serif;
margin: 0;
font-weight: 200;
display: block;
font-size: 18px;
}
-#twitter {
- display: none;
-}
-.column p {
-/* margin-bottom: 1em;*/
-}
-.column ul {
- list-style: none;
- margin: 0;
-}
-.column ul li {
- margin: 0;
- padding-top: 1em;
- height: 80px;
-}
-.column ul li:first-child {
- border-top: none;
- padding-top: 1em;
-}
-.column abbr {
- display: block;
- font-size: 0.8em;
- color: #aaa;
+a.more {
+/* float: right;*/
}
/* Inline flat list style */
diff --git a/output/js/home.js b/output/js/home.js
index cf1dee2..dad8b53 100644
--- a/output/js/home.js
+++ b/output/js/home.js
@@ -1,4 +1,3 @@
-
jQuery(function () {
function populate_flickr(data, text_status) {
var ul = $("ul", "#flickr");