summaryrefslogtreecommitdiff
diff options
context:
space:
mode:
-rw-r--r--source/_article.html.erb11
-rw-r--r--source/aktuelles/blog.html.erb20
-rw-r--r--source/layouts/layout.erb8
-rw-r--r--source/stylesheets/_blog.scss17
-rw-r--r--source/stylesheets/_variables.scss38
-rw-r--r--source/stylesheets/base.css.scss6
6 files changed, 85 insertions, 15 deletions
diff --git a/source/_article.html.erb b/source/_article.html.erb
index 4420bd9..bc462f8 100644
--- a/source/_article.html.erb
+++ b/source/_article.html.erb
@@ -1,4 +1,7 @@
-<div>
- <h3><%= link_to article.title, article %> <span><%= article.date.strftime('%b %e') %></span></h3>
- <%= article.body %>
-</div>
+<article>
+ <aside class="blog-date"><%= article.date.strftime('%e %b %Y') %></aside>
+ <div class="blog-inner">
+ <h3 class="blog-article-heading"><%= link_to article.title, article %></h3>
+ <%= article.body %>
+ </div>
+</article>
diff --git a/source/aktuelles/blog.html.erb b/source/aktuelles/blog.html.erb
index 3045c41..18666b9 100644
--- a/source/aktuelles/blog.html.erb
+++ b/source/aktuelles/blog.html.erb
@@ -4,17 +4,21 @@ per_page: 10
section: "aktuelles"
---
<% if paginate && num_pages > 1 %>
- <p>Seite <%= page_number %> von <%= num_pages %></p>
- <% if prev_page %>
- <p><%= link_to 'Vorherige Seite', prev_page %></p>
- <% end %>
+ <ul class="pager">
+ <li class="previous <%= prev_page ? "" : "disabled" %>"><%= link_to 'Vorherige Seite', prev_page %></li>
+ <li class="next <%= next_page ? "" : "disabled" %>"><%= link_to 'Nächste Seite', next_page %></li>
+ </ul>
+
<% end %>
<%= partial "article", collection: page_articles %>
-<% if paginate %>
- <% if next_page %>
- <p><%= link_to 'Nächste Seite', next_page %></p>
- <% end %>
+<% if paginate && num_pages > 1 %>
+
+ <ul class="pager">
+ <li class="previous <%= prev_page ? "" : "disabled" %>"><%= link_to 'Vorherige Seite', prev_page %></li>
+ <li class="next <%= next_page ? "" : "disabled" %>"><%= link_to 'Nächste Seite', next_page %></li>
+ </ul>
+
<% end %>
diff --git a/source/layouts/layout.erb b/source/layouts/layout.erb
index b2835f2..8c4fea3 100644
--- a/source/layouts/layout.erb
+++ b/source/layouts/layout.erb
@@ -35,9 +35,11 @@
</nav>
<!-- content -->
- <section id="main">
- <%= yield %>
- </section>
+ <div id="content">
+ <section id="main">
+ <%= yield %>
+ </section>
+ </div>
</body>
</html>
diff --git a/source/stylesheets/_blog.scss b/source/stylesheets/_blog.scss
new file mode 100644
index 0000000..13db407
--- /dev/null
+++ b/source/stylesheets/_blog.scss
@@ -0,0 +1,17 @@
+article {
+ @extend .container-fluid;
+ margin-bottom: 30px;
+}
+
+aside.blog-date {
+ @extend .col-md-2;
+}
+
+div.blog-inner {
+ @extend .col-md-8;
+}
+
+h3.blog-article-heading {
+ margin-top: 0px;
+}
+
diff --git a/source/stylesheets/_variables.scss b/source/stylesheets/_variables.scss
index c254708..4374425 100644
--- a/source/stylesheets/_variables.scss
+++ b/source/stylesheets/_variables.scss
@@ -139,3 +139,41 @@ $panel-warning-heading-bg: $state-warning-bg;
$panel-danger-text: $state-danger-text;
$panel-danger-border: $state-danger-border;
$panel-danger-heading-bg: $state-danger-bg;
+
+
+//== Pagination
+//
+//##
+
+$pagination-color: #fff;
+$pagination-bg: $gray-darker;
+$pagination-border: $gray-dark;
+
+$pagination-hover-color: #fff;
+$pagination-hover-bg: $component-active-bg;
+$pagination-hover-border: transparent;
+
+$pagination-active-color: #fff;
+$pagination-active-bg: $brand-primary;
+$pagination-active-border: transparent;
+
+$pagination-disabled-color: $gray-light;
+$pagination-disabled-bg: $gray-darker;
+$pagination-disabled-border: $gray-dark;
+
+
+//== Pager
+//
+//##
+
+$pager-bg: $pagination-bg;
+$pager-border: $pagination-border;
+$pager-border-radius: 15px;
+
+$pager-hover-bg: $pagination-hover-bg;
+
+$pager-active-bg: $pagination-active-bg;
+$pager-active-color: $pagination-active-color;
+
+$pager-disabled-color: $gray-light;
+
diff --git a/source/stylesheets/base.css.scss b/source/stylesheets/base.css.scss
index 4f954be..6125efa 100644
--- a/source/stylesheets/base.css.scss
+++ b/source/stylesheets/base.css.scss
@@ -9,6 +9,10 @@ header {
@extend .row;
}
+#content {
+ @extend .row;
+}
+
#main {
@extend .col-sm-8;
@extend .col-sm-offset-2;
@@ -35,3 +39,5 @@ nav ul {
.navbar-collapse {
@extend .col-sm-offset-2;
}
+
+@import "blog";