diff --git a/content/assets/stylesheets/includes/blogpost.scss b/content/assets/stylesheets/includes/blogpost.scss index 4e64842..b8ff9bf 100644 --- a/content/assets/stylesheets/includes/blogpost.scss +++ b/content/assets/stylesheets/includes/blogpost.scss @@ -55,6 +55,13 @@ $sel: ''; .subtitle { position: absolute; + + @include mobile { + text-align: center; + margin-top: 0; + position: relative; + margin-bottom: .2em; + } } .details { @@ -63,6 +70,12 @@ $sel: ''; margin-top: -1.1rem; line-height: 1; text-align: right; + + @include mobile { + text-align: center; + margin-top: 0; + position: relative; + } } } diff --git a/content/assets/stylesheets/includes/general.scss b/content/assets/stylesheets/includes/general.scss index e5ce7fa..c9cdd1d 100644 --- a/content/assets/stylesheets/includes/general.scss +++ b/content/assets/stylesheets/includes/general.scss @@ -6,7 +6,17 @@ // Override box styling without round corners .box { margin-bottom:10px; - border-radius: 0 !important; + + transition: all .15s ease; + + box-shadow: 0 4px 6px rgba(50,50,93,.11), 0 1px 3px rgba(0,0,0,.08); + +} + +a.box:hover { + color: $blue; + transform: translateY(-1px); + box-shadow: 0 7px 14px rgba(50,50,93,.1), 0 3px 6px rgba(0,0,0,.08); } // Add some hero attributes to make backgrounds prettier diff --git a/content/assets/stylesheets/includes/tiles.scss b/content/assets/stylesheets/includes/tiles.scss index 438bda6..308aadc 100644 --- a/content/assets/stylesheets/includes/tiles.scss +++ b/content/assets/stylesheets/includes/tiles.scss @@ -1,15 +1,7 @@ $top_coder_size: 80px; -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%; } @@ -37,7 +29,7 @@ a.box { font-size: 1.1em; margin-left: 10px; margin-right: 10px; - + .event-time-loc { margin-left: 10px; margin-right: 10px; @@ -119,10 +111,10 @@ a.box { } #blokmap-tile { + position: relative; height: 200px; - //background-image: url("https://i.imgur.com/PMaIG7X.jpg"); - background-image: url("https://cldup.com/-FmSDFbd07.jpg"); + background-image: linear-gradient(rgba(0, 0, 0, 0.1), rgba(0, 0, 0, .2)), url("https://cldup.com/-FmSDFbd07.jpg"); background-position: center; .overlay { diff --git a/layouts/partials/_blog_preview.erb b/layouts/partials/_blog_preview.erb index c6bcfeb..47d9c6f 100644 --- a/layouts/partials/_blog_preview.erb +++ b/layouts/partials/_blog_preview.erb @@ -1,18 +1,16 @@ - -
-
-

<%= post[:title] %>

-

+ +

-
+

+
+ <% if post[:author] %> + door <%= post[:author] %> + <% end %> +
+ <%= post[:created_at] %> +
+ <%= excerptize(post.reps[:text].compiled_content, length: 200).tr("\n", ' ')%> +
diff --git a/layouts/tiles/blokmap.erb b/layouts/tiles/blokmap.erb index 894aa0d..165ee40 100644 --- a/layouts/tiles/blokmap.erb +++ b/layouts/tiles/blokmap.erb @@ -1,7 +1,5 @@
-
- -
+

Zoek de beste plek om te blokken! @@ -11,5 +9,4 @@

-