Beispielartikel hinzugefuegt; Blogdesign; kontakt angepasst

This commit is contained in:
Leo Maroni 2018-05-07 20:56:39 +02:00
parent adef2deb5b
commit 705f924fa6
8 changed files with 89 additions and 8 deletions

View File

@ -6,7 +6,7 @@
<meta name="viewport" content="width=device-width, initial-scale=1.0" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>{{ site.title }}</title> <title>{{ site.title }}</title>
{% feed_meta %} {% feed_meta %}
<link rel="stylesheet" href='{{ "/css/post.css" | relative_url }}'> <link rel="stylesheet" href='{{ "/assets/css/post.css" | relative_url }}'>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/materialize/1.0.0-rc.1/css/materialize.min.css" integrity="sha256-qj3p6P1fJIV+Ndv7RW1ovZI2UhOuboj9GcODzcNFIN8=" crossorigin="anonymous" /> <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/materialize/1.0.0-rc.1/css/materialize.min.css" integrity="sha256-qj3p6P1fJIV+Ndv7RW1ovZI2UhOuboj9GcODzcNFIN8=" crossorigin="anonymous" />
<link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet"> <link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
@ -15,12 +15,20 @@
</head> </head>
<body> <body>
{% include header.html %} {% include header.html %}
<main> <main class="container">
{{ content }} <div id="meta" class="center">
<i>von {{ page.author }}</i>
<br>
<i>am {{ page.date | date: "%d.%m.%y" }}</i>
</div>
<h2 id="title">{{ page.title }}</h2>
<div id="content">
{{ content }}
</div>
</main> </main>
{% include footer.html %} {% include footer.html %}
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js" integrity="sha256-hwg4gsxgFZhOsEEamdOYGBf13FyQuiTwlAQgxVSNgt4=" crossorigin="anonymous"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js" integrity="sha256-hwg4gsxgFZhOsEEamdOYGBf13FyQuiTwlAQgxVSNgt4=" crossorigin="anonymous"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/materialize/1.0.0-rc.1/js/materialize.min.js" integrity="sha256-SrBfGi+Zp2LhAvy9M1bWOCXztRU9Ztztxmu5BcYPcPE=" crossorigin="anonymous"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/materialize/1.0.0-rc.1/js/materialize.min.js" integrity="sha256-SrBfGi+Zp2LhAvy9M1bWOCXztRU9Ztztxmu5BcYPcPE=" crossorigin="anonymous"></script>
<script src="{{ '/js/post.js' | relative_url }}"></script> <script src="{{ '/assets/js/post.js' | relative_url }}"></script>
</body> </body>
</html> </html>

View File

@ -0,0 +1,26 @@
---
layout: post
title: "Lorem Ipsum"
date: 2018-05-04
author: "Leo Maroni"
description: "Lorem Ipsum Beispieltext"
---
Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.
Duis autem vel eum iriure dolor in hendrerit in vulputate velit esse molestie consequat, vel illum dolore eu feugiat nulla facilisis at vero eros et accumsan et iusto odio dignissim qui blandit praesent luptatum zzril delenit augue duis dolore te feugait nulla facilisi. Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat.
Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat. Duis autem vel eum iriure dolor in hendrerit in vulputate velit esse molestie consequat, vel illum dolore eu feugiat nulla facilisis at vero eros et accumsan et iusto odio dignissim qui blandit praesent luptatum zzril delenit augue duis dolore te feugait nulla facilisi.
Nam liber tempor cum soluta nobis eleifend option congue nihil imperdiet doming id quod mazim placerat facer possim assum. Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat.
Duis autem vel eum iriure dolor in hendrerit in vulputate velit esse molestie consequat, vel illum dolore eu feugiat nulla facilisis.
At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, At accusam aliquyam diam diam dolore dolores duo eirmod eos erat, et nonumy sed tempor et et invidunt justo labore Stet clita ea et gubergren, kasd magna no rebum. sanctus sea sed takimata ut vero voluptua. est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat.
Consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus.
Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.
Duis autem vel eum iriure dolor in hendrerit in vulputate velit esse molestie consequat, vel illum dolore eu feugiat nulla facilisis at vero eros et accumsan et iusto odio dignissim qui blandit praesent luptatum zzril delenit augue duis dolore te feugait nulla facilisi. Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat.
Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat. Duis autem vel eum iriure dolor in hendrerit in vulputate velit esse molestie consequat, vel illum dolore eu feugiat nulla facilisis at vero eros et accumsan et iusto odio dignissim qui blandit praesent luptatum zzril delenit augue duis dolore te feugait nulla facilisi.

View File

@ -92,4 +92,20 @@ main {
} }
} }
} }
#section-news {
ul.collection {
.collection-item {
&.avatar {
padding: 10px 20px;
.title {
font-size: 18px;
color: rgba(0,0,0,.87);
}
a>i.material-icons {
color: $ff_magenta;
}
}
}
}
}
} }

10
_scss/_post.scss Normal file
View File

@ -0,0 +1,10 @@
main {
#meta {
margin: 1.84rem 0 1.424rem 0;
}
#title {
@extend .text-center, .thin-text;
border-bottom: $ff_yellow 2px solid;
padding-bottom: 2px;
}
}

View File

@ -3,11 +3,14 @@ body {
font-family: 'Roboto', sans-serif; font-family: 'Roboto', sans-serif;
} }
.thin-text { .thin-text {
font-weight: 100; font-weight: 100 !important;
} }
.light-text { .light-text {
font-weight: 300; font-weight: 300 !important;
} }
.text-center { .text-center {
text-align: center; text-align: center;
}
.text-right {
text-align: right;
} }

View File

@ -5,5 +5,5 @@
@import "typography"; @import "typography";
@import "general"; @import "general";
@import "header"; @import "header";
@import "main-section"; @import "post";
@import "footer"; @import "footer";

View File

@ -31,4 +31,22 @@ layout: page
Wenn die im Koalitionsvertrag angekündigte Anerkennung der Gemeinnützigkeit nun noch dazu käme, wäre dies natürlich noch hilfreicher für die Praxis. Wenn die im Koalitionsvertrag angekündigte Anerkennung der Gemeinnützigkeit nun noch dazu käme, wäre dies natürlich noch hilfreicher für die Praxis.
</p> </p>
</section> </section>
<section id="section-news">
<div class="center">
<h2 class="thin-text">Aktuelles</h2>
</div>
<ul class="collection">
{% for post in site.posts limit:5 %}
<li class="collection-item avatar">
<a href="{{ post.url }}"><span class="title">{{ post.title }}</span></a>
<p>
{{ post.description }}
<br>
<i>{{ post.date | date: "%d.%m.%y" }} von {{ post.author }}</i>
</p>
<a href="{{ post.url }}" class="secondary-content"><i class="material-icons">chrome_reader_mode</i></a>
</li>
{% endfor %}
</ul>
</section>
</div> </div>

View File

@ -41,7 +41,7 @@ permalink: '/kontakt/'
</div> </div>
<div class="row"> <div class="row">
<div class="input-field col s12"> <div class="input-field col s12">
<textarea required id="nachricht" name="nachricht" class="materialize-textarea"></textarea> <textarea required id="nachricht" name="nachricht" class="validate materialize-textarea"></textarea>
<label for="nachricht">Deine Nachricht</label> <label for="nachricht">Deine Nachricht</label>
</div> </div>
</div> </div>