From 57f6cf9aeebe45029224fd3eea77656b2f8d65fe Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Elo=C3=AFse=20Piret?= Date: Tue, 7 Feb 2017 20:38:51 +0100 Subject: [PATCH 01/12] change upper layout --- content/index.erb | 89 ++++++++++++++++++++++++++--------------------- 1 file changed, 50 insertions(+), 39 deletions(-) diff --git a/content/index.erb b/content/index.erb index ffdf193..5d7fcf0 100644 --- a/content/index.erb +++ b/content/index.erb @@ -7,50 +7,61 @@
<%= if studytime? then render '/tiles/blokmap.*'end %> -
- -
-
-
- <%= render '/partials/_tile.*', article: upcoming_events[0] || all_events[-1], small_text: if upcoming_events[0] then "Upcoming event" else "Past event" end %> -
-
-
-
- -
-
- <%= render '/partials/_tile.*', article: sorted_articles.first, small_text: "Latest blogpost",htmlclass:"highlighted"%> -
-
-
- <%= render '/partials/_tile.*', article: upcoming_events[1] || all_events[-2], small_text: if upcoming_events[1] then "Upcoming event" else "Past event" end %> + +
+ <%= render '/partials/_tile.*', + article: upcoming_events[0] || all_events[-1], + small_text: if upcoming_events[0] then "Upcoming event" else "Past event" end %> +
+ + +
+ <%= render '/partials/_tile.*', + article: sorted_articles.first, + small_text: "Latest blogpost", + htmlclass:"highlighted"%> +
+
+ +
+
+
+ <%= render '/partials/_tile.*', article: upcoming_events[1] || all_events[-2], small_text: if upcoming_events[1] then "Upcoming event" else "Past event" end %> +
-
<%= asset :js, :gamification %> From 84f7ed1a37248ce236ad12b1d13f343de32a5b54 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Elo=C3=AFse=20Piret?= Date: Tue, 7 Feb 2017 23:30:11 +0100 Subject: [PATCH 02/12] layout upper tiles --- .../stylesheets/includes/tiles.erb.scss | 105 ++++++++++++++++++ .../assets/stylesheets/includes/tiles.scss | 8 ++ content/assets/stylesheets/main.scss | 2 +- content/index.erb | 8 +- layouts/partials/_tile.erb | 10 +- lib/helpers/tile_helper.rb | 14 +++ lib/helpers_.rb | 1 + 7 files changed, 142 insertions(+), 6 deletions(-) create mode 100644 content/assets/stylesheets/includes/tiles.erb.scss create mode 100644 lib/helpers/tile_helper.rb diff --git a/content/assets/stylesheets/includes/tiles.erb.scss b/content/assets/stylesheets/includes/tiles.erb.scss new file mode 100644 index 0000000..0b53100 --- /dev/null +++ b/content/assets/stylesheets/includes/tiles.erb.scss @@ -0,0 +1,105 @@ +a.box { + &:hover { + box-shadow: 0 2px 3px rgba($black, 0.1), 0 0 0 1px $blue + } +} + +#homepage { + .box { + border-radius: 0; + + img { + width: 100%; + } + } +} + +.centering { + display: flex; + justify-content: center; + align-items: center; +} +.highlighted{ + background: $tile-orange; + .content { + color: white; + + h1, h2 { + color: inherit; + } + a, a:visited { + color:inherit; + } + } +} +#quote{ + font-style: italic; +} + +.icon a{ + color:$tile-orange; +} +#gamification-coders { + display: flex; + justify-content: center; + ol{ + list-style-type: decimal-leading-zero; + counter-reset:li; + > li{ + float:left; + padding:5px; + margin:20px; + margin-bottom:3px; + margin-top:3px; + display:inline; + &:before{ + content:counter(li); /* Use the counter as content */ + counter-increment:li; + color:$tile-orange; + font: bold 18pt helvetica, arial, sans-serif; + background-color:whitesmoke; + height:30px; + width:30px; + display:inline-block; + margin-right:10px; + border-radius:50px; + text-align: center; + line-height: 30px; + } + } + } +} + +#blokmap-tile { + position: relative; + + height: 200px; + //background-image: url("https://i.imgur.com/PMaIG7X.jpg"); + background-image: url("https://cldup.com/-FmSDFbd07.jpg"); + + background-position: center; + + .overlay { + left: 0; + top: 0; + position: absolute; + height: 100%; + width: 100%; + background-color: rgba(0, 0, 0, 0.2); + } + + .content { + position: relative; + + h1, h2 { + color: white; + } + + h2 { + margin-top: 0; + } + } +} + +.eventtile{ +} diff --git a/content/assets/stylesheets/includes/tiles.scss b/content/assets/stylesheets/includes/tiles.scss index a62ba5f..20251d2 100644 --- a/content/assets/stylesheets/includes/tiles.scss +++ b/content/assets/stylesheets/includes/tiles.scss @@ -100,3 +100,11 @@ a.box { } } } + +.teaser{ + font-style: italic; +} + +.description{ + font-weight: bold; +} diff --git a/content/assets/stylesheets/main.scss b/content/assets/stylesheets/main.scss index 2096b9a..e394794 100644 --- a/content/assets/stylesheets/main.scss +++ b/content/assets/stylesheets/main.scss @@ -24,7 +24,7 @@ body.site { @import "includes/cammie"; @import "includes/events"; -@import "includes/tiles"; +@import "includes/tileS"; @import "includes/blogpost"; @import "includes/general"; @import "includes/eventpage"; diff --git a/content/index.erb b/content/index.erb index 5d7fcf0..8c795b4 100644 --- a/content/index.erb +++ b/content/index.erb @@ -20,10 +20,10 @@
-
+
<%= render '/partials/_tile.*', article: upcoming_events[0] || all_events[-1], - small_text: if upcoming_events[0] then "Upcoming event" else "Past event" end %> + small_text: if upcoming_events[0] then "Upcoming event" else "Past event" end%>
@@ -58,7 +58,9 @@
- <%= render '/partials/_tile.*', article: upcoming_events[1] || all_events[-2], small_text: if upcoming_events[1] then "Upcoming event" else "Past event" end %> + <%= render '/partials/_tile.*', + article: upcoming_events[1] || all_events[-2], + small_text: if upcoming_events[1] then "Upcoming event" else "Past event" end %>
diff --git a/layouts/partials/_tile.erb b/layouts/partials/_tile.erb index 9808a7b..63135af 100644 --- a/layouts/partials/_tile.erb +++ b/layouts/partials/_tile.erb @@ -1,5 +1,6 @@ - -
+ +

@@ -12,6 +13,11 @@

+
<%= @article[:description] %> +
+
+ <%= get_teaser(@article) %> +
diff --git a/lib/helpers/tile_helper.rb b/lib/helpers/tile_helper.rb new file mode 100644 index 0000000..29636d4 --- /dev/null +++ b/lib/helpers/tile_helper.rb @@ -0,0 +1,14 @@ + +module TileHelper + def get_teaser(post) + content = strip_html(post.compiled_content) + return truncate(content, 300) + end + + def truncate(s, max=70, elided = ' ...') + s.match( /(.{1,#{max}})(?:\s|\z)/ )[1].tap do |res| + res << elided unless res.length == s.length + end + end + +end diff --git a/lib/helpers_.rb b/lib/helpers_.rb index 6b6ae4e..c1c965b 100644 --- a/lib/helpers_.rb +++ b/lib/helpers_.rb @@ -17,3 +17,4 @@ include SearchHelper include BlogHelper include PreprocessHelper include TimeHelper +include TileHelper From 10f89e0c7ab7eee4fd104ebef3e9d544bcddf5d8 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Elo=C3=AFse=20Piret?= Date: Tue, 7 Feb 2017 23:44:33 +0100 Subject: [PATCH 03/12] my bad --- .../stylesheets/includes/tiles.erb.scss | 105 ------------------ content/assets/stylesheets/main.scss | 2 +- 2 files changed, 1 insertion(+), 106 deletions(-) delete mode 100644 content/assets/stylesheets/includes/tiles.erb.scss diff --git a/content/assets/stylesheets/includes/tiles.erb.scss b/content/assets/stylesheets/includes/tiles.erb.scss deleted file mode 100644 index 0b53100..0000000 --- a/content/assets/stylesheets/includes/tiles.erb.scss +++ /dev/null @@ -1,105 +0,0 @@ -a.box { - &:hover { - box-shadow: 0 2px 3px rgba($black, 0.1), 0 0 0 1px $blue - } -} - -#homepage { - .box { - border-radius: 0; - - img { - width: 100%; - } - } -} - -.centering { - display: flex; - justify-content: center; - align-items: center; -} -.highlighted{ - background: $tile-orange; - .content { - color: white; - - h1, h2 { - color: inherit; - } - a, a:visited { - color:inherit; - } - } -} -#quote{ - font-style: italic; -} - -.icon a{ - color:$tile-orange; -} -#gamification-coders { - display: flex; - justify-content: center; - ol{ - list-style-type: decimal-leading-zero; - counter-reset:li; - > li{ - float:left; - padding:5px; - margin:20px; - margin-bottom:3px; - margin-top:3px; - display:inline; - &:before{ - content:counter(li); /* Use the counter as content */ - counter-increment:li; - color:$tile-orange; - font: bold 18pt helvetica, arial, sans-serif; - background-color:whitesmoke; - height:30px; - width:30px; - display:inline-block; - margin-right:10px; - border-radius:50px; - text-align: center; - line-height: 30px; - } - } - } -} - -#blokmap-tile { - position: relative; - - height: 200px; - //background-image: url("https://i.imgur.com/PMaIG7X.jpg"); - background-image: url("https://cldup.com/-FmSDFbd07.jpg"); - - background-position: center; - - .overlay { - left: 0; - top: 0; - position: absolute; - height: 100%; - width: 100%; - background-color: rgba(0, 0, 0, 0.2); - } - - .content { - position: relative; - - h1, h2 { - color: white; - } - - h2 { - margin-top: 0; - } - } -} - -.eventtile{ -} diff --git a/content/assets/stylesheets/main.scss b/content/assets/stylesheets/main.scss index e394794..2096b9a 100644 --- a/content/assets/stylesheets/main.scss +++ b/content/assets/stylesheets/main.scss @@ -24,7 +24,7 @@ body.site { @import "includes/cammie"; @import "includes/events"; -@import "includes/tileS"; +@import "includes/tiles"; @import "includes/blogpost"; @import "includes/general"; @import "includes/eventpage"; From 44e9a4f76c527c21a7d7bc066a38f7cae2f21a72 Mon Sep 17 00:00:00 2001 From: Lorin Werthen Date: Wed, 8 Feb 2017 00:51:46 +0100 Subject: [PATCH 04/12] minor code cleanup --- layouts/partials/_tile.erb | 6 +++--- lib/helpers/tile_helper.rb | 13 +++---------- 2 files changed, 6 insertions(+), 13 deletions(-) diff --git a/layouts/partials/_tile.erb b/layouts/partials/_tile.erb index 63135af..263eaaa 100644 --- a/layouts/partials/_tile.erb +++ b/layouts/partials/_tile.erb @@ -1,5 +1,5 @@ - +
@@ -14,7 +14,7 @@
- <%= @article[:description] %> + <%= @article[:description] %>
<%= get_teaser(@article) %> diff --git a/lib/helpers/tile_helper.rb b/lib/helpers/tile_helper.rb index 29636d4..0c55a1c 100644 --- a/lib/helpers/tile_helper.rb +++ b/lib/helpers/tile_helper.rb @@ -1,14 +1,7 @@ - module TileHelper def get_teaser(post) - content = strip_html(post.compiled_content) - return truncate(content, 300) + # excerptize is part of the TextHelper, given by nanoc + # https://nanoc.ws/doc/reference/helpers/#text + excerptize(post.reps[:text].compiled_content, length: 300) end - - def truncate(s, max=70, elided = ' ...') - s.match( /(.{1,#{max}})(?:\s|\z)/ )[1].tap do |res| - res << elided unless res.length == s.length - end - end - end From ec25ef932fab58e1affe123c60b4908b97ac6f7a Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Elo=C3=AFse=20Piret?= Date: Wed, 8 Feb 2017 11:15:44 +0100 Subject: [PATCH 05/12] more recent blogposts and events #133 --- content/index.erb | 47 ++++++++++++++++++++++++++--------------------- 1 file changed, 26 insertions(+), 21 deletions(-) diff --git a/content/index.erb b/content/index.erb index 8c795b4..6e78d0a 100644 --- a/content/index.erb +++ b/content/index.erb @@ -35,15 +35,33 @@
-
-
-
-
- -
-
+
+ <% for i in [0,1,2] do event = upcoming_events[1+i] || all_events[-2-i] %> +
+ <%= render '/partials/_tile.*', + article: event, + small_text: if upcoming_events[1] then "Upcoming event" else "Past event" end, + htmlclass:"highlighted"%>
+ <%end%>
+
+ <% for i in [1,2,3] do post = sorted_articles[i] %> +
+ <%= render '/partials/_tile.*', + article: post, + small_text: "blogpost"%> +
+ <%end%> + +
+
+
+
+<%= asset :js, :gamification %> +<%= asset :js, :quote %> + From c48d005e91806f2b10be765ef6710ffd84197363 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Elo=C3=AFse=20Piret?= Date: Wed, 8 Feb 2017 11:25:06 +0100 Subject: [PATCH 06/12] prettyyyyyy --- content/assets/stylesheets/includes/tiles.scss | 4 ++++ content/index.erb | 2 +- layouts/partials/_tile.erb | 2 +- 3 files changed, 6 insertions(+), 2 deletions(-) diff --git a/content/assets/stylesheets/includes/tiles.scss b/content/assets/stylesheets/includes/tiles.scss index 20251d2..8db9392 100644 --- a/content/assets/stylesheets/includes/tiles.scss +++ b/content/assets/stylesheets/includes/tiles.scss @@ -108,3 +108,7 @@ a.box { .description{ font-weight: bold; } + +.backgroundimg{ + Background-position: center; +} diff --git a/content/index.erb b/content/index.erb index 6e78d0a..4ab94a8 100644 --- a/content/index.erb +++ b/content/index.erb @@ -10,7 +10,7 @@
-
+

Top Zeus WPI coders this week

diff --git a/layouts/partials/_tile.erb b/layouts/partials/_tile.erb index 263eaaa..6e88fe4 100644 --- a/layouts/partials/_tile.erb +++ b/layouts/partials/_tile.erb @@ -1,4 +1,4 @@ -
From 65d1c50b44d4d0dee4ed1ba99d6576483755ac42 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Elo=C3=AFse=20Piret?= Date: Wed, 8 Feb 2017 12:00:34 +0100 Subject: [PATCH 07/12] pictures --- content/assets/scripts/gamification.coffee | 2 +- content/assets/stylesheets/includes/tiles.scss | 4 ++-- 2 files changed, 3 insertions(+), 3 deletions(-) diff --git a/content/assets/scripts/gamification.coffee b/content/assets/scripts/gamification.coffee index 33d55b8..0b0ea66 100644 --- a/content/assets/scripts/gamification.coffee +++ b/content/assets/scripts/gamification.coffee @@ -2,7 +2,7 @@ $ -> $.getJSON 'https://zeus.ugent.be/game/top4/show.json', (data) -> str = "
    " for x in data - str += "
  1. #{x.github_name} (#{x.score} Z$)
  2. " + str += "
  3. #{x.github_name} (#{x.score} Z$)
  4. " str += "
" $('#gamification-coders').html(str) diff --git a/content/assets/stylesheets/includes/tiles.scss b/content/assets/stylesheets/includes/tiles.scss index 8db9392..1371b19 100644 --- a/content/assets/stylesheets/includes/tiles.scss +++ b/content/assets/stylesheets/includes/tiles.scss @@ -55,9 +55,9 @@ a.box { &:before{ content:counter(li); /* Use the counter as content */ counter-increment:li; - color:$tile-orange; + color:gray;//$tile-orange; font: bold 18pt helvetica, arial, sans-serif; - background-color:whitesmoke; + //background-color:whitesmoke; height:30px; width:30px; display:inline-block; From d11b2d7a64419ce4054aa1037bbd175802e9b67f Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Elo=C3=AFse=20Piret?= Date: Wed, 8 Feb 2017 12:25:11 +0100 Subject: [PATCH 08/12] number on top of picture --- content/assets/stylesheets/includes/tiles.scss | 14 ++++++++++++++ 1 file changed, 14 insertions(+) diff --git a/content/assets/stylesheets/includes/tiles.scss b/content/assets/stylesheets/includes/tiles.scss index 1371b19..c594dbe 100644 --- a/content/assets/stylesheets/includes/tiles.scss +++ b/content/assets/stylesheets/includes/tiles.scss @@ -42,10 +42,20 @@ a.box { #gamification-coders { display: flex; justify-content: center; + img{ + height:40px; + width:40px !important; + border-radius:5px; + top: 0; + left: 0; + position: absolute; + z-index:1; + } ol{ list-style-type: decimal-leading-zero; counter-reset:li; > li{ + position: relative; float:left; padding:5px; margin:20px; @@ -53,6 +63,10 @@ a.box { margin-top:3px; display:inline; &:before{ + top: 0; + left: 0; + position: absolute; + z-index:2; content:counter(li); /* Use the counter as content */ counter-increment:li; color:gray;//$tile-orange; From 907874f4d31a7aed0e5120aa7ee7cb1cd9116c9d Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Elo=C3=AFse=20Piret?= Date: Wed, 8 Feb 2017 13:41:33 +0100 Subject: [PATCH 09/12] pretty frontpage :3 --- content/assets/stylesheets/includes/tiles.scss | 12 +++++------- 1 file changed, 5 insertions(+), 7 deletions(-) diff --git a/content/assets/stylesheets/includes/tiles.scss b/content/assets/stylesheets/includes/tiles.scss index c594dbe..6ac2b59 100644 --- a/content/assets/stylesheets/includes/tiles.scss +++ b/content/assets/stylesheets/includes/tiles.scss @@ -45,11 +45,11 @@ a.box { img{ height:40px; width:40px !important; - border-radius:5px; + border-radius:50px; top: 0; left: 0; - position: absolute; z-index:1; + vertical-align:middle; } ol{ list-style-type: decimal-leading-zero; @@ -63,15 +63,13 @@ a.box { margin-top:3px; display:inline; &:before{ - top: 0; - left: 0; position: absolute; z-index:2; content:counter(li); /* Use the counter as content */ counter-increment:li; - color:gray;//$tile-orange; - font: bold 18pt helvetica, arial, sans-serif; - //background-color:whitesmoke; + color:whitesmoke;//$tile-orange; + opacity:0.9; + font: bold 32pt helvetica, arial, sans-serif; height:30px; width:30px; display:inline-block; From 15ab0113c95740d9a7a8246070cd6096e7851606 Mon Sep 17 00:00:00 2001 From: Lorin Werthen Date: Wed, 8 Feb 2017 13:50:59 +0100 Subject: [PATCH 10/12] more ruby-esque stuff --- content/assets/stylesheets/includes/tiles.scss | 2 +- content/index.erb | 14 +++++++------- 2 files changed, 8 insertions(+), 8 deletions(-) diff --git a/content/assets/stylesheets/includes/tiles.scss b/content/assets/stylesheets/includes/tiles.scss index 6ac2b59..bd43fe4 100644 --- a/content/assets/stylesheets/includes/tiles.scss +++ b/content/assets/stylesheets/includes/tiles.scss @@ -122,5 +122,5 @@ a.box { } .backgroundimg{ - Background-position: center; + background-position: center; } diff --git a/content/index.erb b/content/index.erb index 4ab94a8..3f14787 100644 --- a/content/index.erb +++ b/content/index.erb @@ -36,20 +36,20 @@
- <% for i in [0,1,2] do event = upcoming_events[1+i] || all_events[-2-i] %> + <% all_events.reverse[1..3].each do |event| %>
<%= render '/partials/_tile.*', - article: event, - small_text: if upcoming_events[1] then "Upcoming event" else "Past event" end, - htmlclass:"highlighted"%> + article: event, + small_text: upcoming_events.include?(event) ? "Upcoming event" : "Past event", + htmlclass:"highlighted" %>
<%end%>
- <% for i in [1,2,3] do post = sorted_articles[i] %> + <% sorted_articles[1..3].each do |post| %>
<%= render '/partials/_tile.*', - article: post, + article: post, small_text: "blogpost"%>
<%end%> @@ -60,7 +60,7 @@
<%= asset :js, :gamification %> <%= asset :js, :quote %> -
diff --git a/layouts/partials/_tile.erb b/layouts/partials/_tile.erb index 6e88fe4..75ba5ae 100644 --- a/layouts/partials/_tile.erb +++ b/layouts/partials/_tile.erb @@ -17,7 +17,7 @@ <%= @article[:description] %>
- <%= get_teaser(@article) %> + <%= get_teaser(@article) %>
From cc344920a5a778705f6110e43b03a5d02cabdcaf Mon Sep 17 00:00:00 2001 From: Lorin Werthen Date: Wed, 8 Feb 2017 16:34:30 +0100 Subject: [PATCH 12/12] capitalize --- content/index.erb | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/content/index.erb b/content/index.erb index f56f353..848b57c 100644 --- a/content/index.erb +++ b/content/index.erb @@ -54,7 +54,7 @@
<%= render '/partials/_tile.*', article: post, - small_text: "blogpost"%> + small_text: "Blogpost"%>
<%end%>