nyansen/nicojensen.de
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Merge branch 'ReDesign'

Browse source
This commit is contained in:
Nico Jensen 2024-09-16 03:50:07 +02:00
commit 7fe5122d20
23 changed files with 200 additions and 45 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

1
Gemfile.lock
View file

@ -73,6 +73,7 @@ DEPENDENCIES
jekyll-mastodon_webfinger (~> 1.0) jekyll-mastodon_webfinger (~> 1.0)
jekyll-paginate jekyll-paginate
jekyll-sitemap jekyll-sitemap
kramdown-parser-gfm
webrick webrick
BUNDLED WITH BUNDLED WITH

7
_config.yaml
View file

@ -46,12 +46,13 @@ compress_html:
defaults: defaults:
- scope: - scope:
type: "posts" path: "" # An empty string here means all files in the project
type: posts
values: values:
layout: "default" layout: post
paginate: 5 paginate: 5
paginate_path: "/page/:num/" paginate_path: "/blog/page/:num/"
permalink: /:year/:month/:day/:title/ permalink: /:year/:month/:day/:title/
mastodon: mastodon:

3
_data/footer-links.yml
View file

@ -1,3 +1,6 @@
blog:
title: "Blog"
href: "/blog"
contact: contact:
title: "Kontakt" title: "Kontakt"
href: "/kontakt" href: "/kontakt"

30
_data/social-media.yml
View file

@ -6,8 +6,16 @@ mastodon:
rel: "me" rel: "me"
footer: true footer: true
logo: "Mastodon_logo.png" logo: "Mastodon_logo.png"
instagram:
id: "nyansen"
href: "https://instagram.com/nyansen"
link: "Instagram"
title: "Mein Instagram Account"
rel: "nofollow"
footer: true
logo: "Instagram_logo.png"
threema: threema:
id: PMUWTKDP id: "PMUWTKDP"
href: "https://threema.id/PMUWTKDP" href: "https://threema.id/PMUWTKDP"
link: "Threema" link: "Threema"
title: "Threema ID: PMUWTKDP" title: "Threema ID: PMUWTKDP"
@ -15,7 +23,7 @@ threema:
footer: false footer: false
logo: "threema_logo.png" logo: "threema_logo.png"
telegram: telegram:
id: nyansen id: "nyansen"
href: "https://t.me/nyansen" href: "https://t.me/nyansen"
link: "Telegram" link: "Telegram"
title: "Telegram link" title: "Telegram link"
@ -36,16 +44,8 @@ github:
link: "GitHub" link: "GitHub"
title: "Mein GitHub Account" title: "Mein GitHub Account"
rel: "nofollow" rel: "nofollow"
footer: true footer: false
logo: "GitHub_logo.png" logo: "GitHub_logo.png"
instagram:
id: "nyansen"
href: "https://instagram.com/"
link: "Instagram"
title: "Mein Instagram Account"
rel: "nofollow"
footer: true
logo: "Instagram_logo.png"
steam: steam:
id: "nyansen" id: "nyansen"
href: "https://steamcommunity.com/id/nyansen/" href: "https://steamcommunity.com/id/nyansen/"
@ -54,3 +54,11 @@ steam:
rel: "nofollow" rel: "nofollow"
footer: false footer: false
logo: "Steam_logo.png" logo: "Steam_logo.png"
linkedIn:
id: "Linkedin"
href: "https://linkedin.com/in/nicojensen"
link: "Linkedin"
title: "Mein Linkedin Account"
rel: "nofollow"
footer: true
logo: "linkedin_logo.png"

0
_includes/blog.html → _includes/blogposts.html
View file

2
_includes/footer.html
View file

@ -13,7 +13,7 @@
{% assign sm = site.data.social-media %} {% for entry in sm%} {% assign {% assign sm = site.data.social-media %} {% for entry in sm%} {% assign
key = entry | first %} {% if sm[key].footer %} {% if sm[key].id %} key = entry | first %} {% if sm[key].footer %} {% if sm[key].id %}
<a <a
href="{{sm[key].href}}{{sm[key].id}}" href="{{sm[key].href}}"
title="{{sm[key].title}}" title="{{sm[key].title}}"
target="_blank" target="_blank"
rel="noopener {{sm[key].rel}}" rel="noopener {{sm[key].rel}}"

0
_includes/head.html → _includes/htmlheader.html
View file

12
_includes/note.html Normal file
View file

@ -0,0 +1,12 @@
{% if include.type == "note" or include.type == "info" or include.type == "danger" or include.type == "warning" %}
<div class="alert alert-{{ include.type }}">
{% if include.type == "note" %}<span class="material-icons alert-note-icon">info</span><b>Info:&nbsp;</b>
{% elsif include.type == "info" %}<span class="material-icons alert-note-icon">check_box</span><b>Tip:&nbsp;</b>
{% elsif include.type == "danger" %}<span class="material-icons alert-note-icon">warning</span><b>Warnung:&nbsp;</b>
{% elsif include.type == "warning" %}<span class="material-icons alert-note-icon">error</span><b>Wichtig:&nbsp;</b>
{% endif %}
{{ include.content }}
</div>
{% else %}
<div class="alert alert-info"><span class="material-icons alert-note-icon">info</span><b>Info:&nbsp;</b>{{ include.content }}</div>
{% endif %}

10
_layouts/default.html
View file

@ -4,11 +4,9 @@ layout: compress
<!DOCTYPE html> <!DOCTYPE html>
<html lang="de" class="no-js page-home"> <html lang="de" class="no-js page-home">
{% include head.html %} {% include htmlheader.html %}
<body> <body>
{% include header.html %} {% include header.html %} {% include navigation.html %} {{content}} {%
{% include navigation.html %} include footer.html %}
{{content}}
{% include footer.html %}
</body> </body>
</html> </html>

2
_posts/2024-02-15-app-defaults.md
View file

@ -8,7 +8,7 @@ featured-image: mobile_device.jpg
featured-image-alt: a picture of an old iphone. featured-image-alt: a picture of an old iphone.
--- ---
**This is followed by the English version.** {% include note.html content="This is followed by the English version." type="note" %}
Da will ich mir Inspiration holen und stoße über den Blog von [Jens Comiotto-Mayer](https://coma.photography/blog/) darauf, dass es ein _Duel of the Defaults!_ gibt, was die Frage nach unseren Standardapps stellt. Geile Idee! Ich liebe es zu sehen, was andere so für Apps nutzen. So stoße ich immer wieder auf tolle neue Apps. Da mache ich sofort mit! Da will ich mir Inspiration holen und stoße über den Blog von [Jens Comiotto-Mayer](https://coma.photography/blog/) darauf, dass es ein _Duel of the Defaults!_ gibt, was die Frage nach unseren Standardapps stellt. Geile Idee! Ich liebe es zu sehen, was andere so für Apps nutzen. So stoße ich immer wieder auf tolle neue Apps. Da mache ich sofort mit!

34
_sass/fonts.scss
View file

@ -78,6 +78,40 @@
url('../fonts/open-sans-v15-latin-800.svg#OpenSans') format('svg'); /* Legacy iOS */ url('../fonts/open-sans-v15-latin-800.svg#OpenSans') format('svg'); /* Legacy iOS */
} }
@font-face {
font-family: 'Material Icons';
font-style: normal;
font-weight: 400;
src: local('Material Icons'),
local('MaterialIcons-Regular'),
url(../fonts/MaterialIconsOutlined-Regular.otf) format('truetype');
}
.material-icons {
font-family: 'Material Icons';
font-weight: normal;
font-style: normal;
font-size: 24px; /* Preferred icon size */
display: inline-block;
line-height: 1;
text-transform: none;
letter-spacing: normal;
word-wrap: normal;
white-space: nowrap;
direction: ltr;
/* Support for all WebKit browsers. */
-webkit-font-smoothing: antialiased;
/* Support for Safari and Chrome. */
text-rendering: optimizeLegibility;
/* Support for Firefox. */
-moz-osx-font-smoothing: grayscale;
/* Support for IE. */
font-feature-settings: 'liga';
}
.entypo { font-family: entypo; } .entypo { font-family: entypo; }
h1, h2, h3, h4, h5, h6 { h1, h2, h3, h4, h5, h6 {

61
_sass/main.scss
View file

@ -83,6 +83,10 @@ a:hover {
background: url(/assets/images/background/moeve.jpg) no-repeat -1300px -550px; background: url(/assets/images/background/moeve.jpg) no-repeat -1300px -550px;
} }
.content {
padding-top: 10rem;
}
.post:not(:first-child) { .post:not(:first-child) {
margin-top: 3.6rem; margin-top: 3.6rem;
} }
@ -141,6 +145,57 @@ blockquote {
border-left: #FFC0CB 0.4rem solid; border-left: #FFC0CB 0.4rem solid;
} }
.alert {
-moz-box-sizing: border-box;
box-sizing: border-box;
margin: 1.75rem 0.4rem 1.75rem 0.4rem;
padding: 1.25rem 0 1.25rem 1.25rem;
}
.alert-note {
color: #3c763d;
background-color: #dff0d8;
border-left-width: 0.3125rem;
border-radius: 0.3125rem 0.1875rem 0.1875rem 0.3125rem;
border-color: #d6e9c6;
border-left: #d6e9c6 0.4rem solid;
}
.alert-note-icon {
display: block;
float: left;
padding-top: 0.20rem;
padding-right: 1rem;
font-family: 'Material Icons';
}
.alert-info {
color: #31708f;
background-color: #d9edf7;
border-left-width: 0.3125rem;
border-radius: 0.3125rem 0.1875rem 0.1875rem 0.3125rem;
border-color: #bce8f1;
border-left: #bce8f1 0.4rem solid;
}
.alert-danger {
color: #a94442;
background-color: #f2dede;
border-left-width: 0.3125rem;
border-radius: 0.3125rem 0.1875rem 0.1875rem 0.3125rem;
border-color: #ebccd1;
border-left: #ebccd1 0.4rem solid;
}
.alert-warning {
color: #3A4145;
background-color: #fcf8e3;
border-left-width: 0.3125rem;
border-radius: 0.3125rem 0.1875rem 0.1875rem 0.3125rem;
border-color: #faebcc;
border-left: #faebcc 0.4rem solid;
}
.post .post-content { .post .post-content {
padding-bottom: 0.1rem; padding-bottom: 0.1rem;
} }
@ -275,3 +330,9 @@ div#social-media {
div#social-media a { div#social-media a {
margin: 0 6px; margin: 0 6px;
} }
.center {
display: block;
margin-left: auto;
margin-right: auto;
}

BIN
assets/fonts/MaterialIcons-Regular.ttf Executable file
View file

Binary file not shown.

BIN
assets/fonts/MaterialIconsOutlined-Regular.otf Executable file
View file

Binary file not shown.

BIN
assets/fonts/MaterialIconsRound-Regular.otf Executable file
View file

Binary file not shown.

BIN
assets/fonts/MaterialIconsSharp-Regular.otf Executable file
View file

Binary file not shown.

BIN
assets/fonts/MaterialIconsTwoTone-Regular.otf Executable file
View file

Binary file not shown.

BIN
assets/images/me.png Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 1.4 MiB

BIN
assets/images/sm_logos/facebook_logo.png Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 54 KiB

BIN
assets/images/sm_logos/linkedin_logo.png Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 8.2 KiB

6
blog/index.html Normal file
View file

@ -0,0 +1,6 @@
---
layout: default
title: Blog
---
<main id="posts">{% include blogposts.html %}</main>

22
index.html
View file

@ -3,4 +3,24 @@ layout: default
title: Home title: Home
--- ---
<main id="posts">{% include blog.html %}</main> <main id="main">
<div class="content">
<div class="wrapper">
<div class="post-content">
<h2>Moin!</h2>
<p>
Ich heiße Nico, wohne in
<a href="https://www.stadt-stade.info/" target="_blank" rel="noopener noreferrer">Stade</a> und ich arbeite als Programmier in <a href="https://www.hamburg.de/" target="_blank" rel="noopener noreferrer">Hamburg</a>.
</p>
<p>
Sicherlich k&ouml;nnte ich hier noch mehr &uuml;ber mich und was ich so mache
schreibe, aber warum fragt ihr mich nicht einfach danach. Wie ihr mich
erreichen k&ouml;nnt, seht ihr <a href="/kontakt.html">hier</a>.
</p>
<p>
<img src="assets/images/me.png" alt="Ein Bild von mir entspannt in einem Stuhl. Ich träge eine Brille und halte ein Smartphone in den Händen, auf das ich mich fokussiere. Meine Beine sind locker übereinandergelegt, ich trage bequeme Kleidung, darunter ein T-Shirt und eine Jogginghose. Der Hintergrund ist dunkel gehalten, was mich in den Vordergrund rückt. Die gesamte Atmosphäre des Bildes wirkt ruhig und introspektiv." class="center"/>
</p>
</div>
</div>
</div>
</main>

55
kontakt.html
View file

@ -2,27 +2,38 @@
layout: default layout: default
title: Kontakt title: Kontakt
--- ---
<main id="post-container" class="single-post"> <main id="post-container" class="single-post">
<article class="post" id="contact"> <article class="post" id="contact">
<header class="post-header wrapper"> <header class="post-header wrapper">
<h2 class="post-title">Kontakt</h2> <h2 class="post-title">Kontakt</h2>
<p>Wenn Du Anregungen und / oder Kritiken zu mir oder meinen Betr&auml;gen hast oder einfach nur etwas Lob loswerden willst, kannst Du dies am besten auf eins meiner Social-Media Accounts machen:</p> <p>
</header> Wenn Du Anregungen und / oder Kritiken zu mir oder meinen Betr&auml;gen
<div class="post-content wrapper"> hast oder einfach nur etwas Lob loswerden willst, kannst Du dies am
{% if site.data.social-media %} besten auf eins meiner Social-Media Accounts machen:
<div id="social-media-block "> </p>
{% assign sm = site.data.social-media %} </header>
{% for entry in sm%} <div class="post-content wrapper">
{% assign key = entry | first %} {% if site.data.social-media %}
{% if sm[key].id %} <div id="social-media-block ">
<div class="smbtn"> {% assign sm = site.data.social-media %} {% for entry in sm%} {% assign
<a href="{{sm[key].href}}" title="{{sm[key].title}}" target="_blank" rel="noopener {{sm[key].rel}}">{{sm[key].link}}</a> key = entry | first %} {% if sm[key].id %}
{% if sm[key].logo != "" %}<img src="/assets/images/sm_logos/{{sm[key].logo}}" alt="{{sm[key].title}} Logo">{% endif %} <div class="smbtn">
</div> <a
{% endif %} href="{{sm[key].href}}"
{% endfor %} title="{{sm[key].title}}"
</div> target="_blank"
{% endif %} rel="noopener {{sm[key].rel}}"
>{{sm[key].link}}</a
>
{% if sm[key].logo != "" %}<img
src="/assets/images/sm_logos/{{sm[key].logo}}"
alt="{{sm[key].title}} Logo"
/>{% endif %}
</div> </div>
</article> {% endif %} {% endfor %}
</main> </div>
{% endif %}
</div>
</article>
</main>