mirror of
https://github.com/chylex/Blog.git
synced 2025-05-21 00:34:04 +02:00
Add configuration and layout
This commit is contained in:
parent
c9d303238f
commit
20021a828e
26
_config.yml
Normal file
26
_config.yml
Normal file
@ -0,0 +1,26 @@
|
||||
title: The chylex non-periodical
|
||||
url: https://blog.chylex.com
|
||||
|
||||
theme: jekyll-theme-cayman
|
||||
permalink: /:title
|
||||
paginate: 5
|
||||
paginate_path: /page/:num
|
||||
|
||||
plugins:
|
||||
- jekyll-paginate
|
||||
|
||||
defaults:
|
||||
-
|
||||
scope:
|
||||
path: "" # all files
|
||||
values:
|
||||
layout: "default"
|
||||
-
|
||||
scope:
|
||||
path: ""
|
||||
type: "posts"
|
||||
values:
|
||||
subtitle: "%pub"
|
||||
permalink: /post/:title
|
||||
breadcrumbs:
|
||||
- type: self
|
73
_layouts/default.html
Normal file
73
_layouts/default.html
Normal file
@ -0,0 +1,73 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="{{ site.lang | default: "en-US" }}">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
{% seo %}
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||
<meta name="theme-color" content="#348fba">
|
||||
<meta name="apple-mobile-web-app-status-bar-style" content="black-translucent">
|
||||
<link rel="stylesheet" href="{{ '/assets/css/style.css?v=' | append: site.github.build_revision | relative_url }}">
|
||||
</head>
|
||||
<body>
|
||||
<header class="page-header" role="banner">
|
||||
<h1 class="project-name">
|
||||
{% if page.titleimg %}
|
||||
<a href="https://chylex.com/" class="project-name-image"><img src="{{ page.titleimg }}" alt=""></a>
|
||||
{% endif %}
|
||||
<span class="project-name-text">{{ page.title | default: site.title }}</span>
|
||||
</h1>
|
||||
{% if page.subtitle %}
|
||||
{% assign shortdate = page.date | date: '%b %Y' %}
|
||||
{% assign published = 'published ' | append: shortdate %}
|
||||
<h2 class="project-tagline">{{ page.subtitle | replace: '%pub', published }}</h2>
|
||||
{% endif %}
|
||||
</header>
|
||||
|
||||
<main id="content" class="main-content" role="main">
|
||||
{% if page.breadcrumbs %}
|
||||
<nav class="page-breadcrumbs">
|
||||
<a href="{{site.url}}">Home</a>
|
||||
{% for crumb in page.breadcrumbs %}
|
||||
<span> » </span>
|
||||
|
||||
{% if crumb.type == 'self' %}
|
||||
{% assign url = page.permalink %}
|
||||
{% assign title = page.title %}
|
||||
{% elsif crumb.revlatest %}
|
||||
{% assign url = site.url | append: crumb.revlatest %}
|
||||
{% assign title = page.title %}
|
||||
{% elsif crumb.revcurrent %}
|
||||
{% assign url = page.permalink %}
|
||||
{% assign title = 'revision ' | append: crumb.revcurrent %}
|
||||
{% endif %}
|
||||
|
||||
{% if forloop.last %}
|
||||
<span class="inactive-link">{{ title }}</span>
|
||||
{% else %}
|
||||
<a href="{{ url }}">{{ title }}</a>
|
||||
{% endif %}
|
||||
{% endfor %}
|
||||
</nav>
|
||||
<hr>
|
||||
{% endif %}
|
||||
|
||||
{{ content }}
|
||||
|
||||
{% if page.commentid %}
|
||||
<script src="https://utteranc.es/client.js" repo="chylex/Blog" issue-number="{{ page.commentid }}" theme="github-light" crossorigin="anonymous" async></script>
|
||||
{% endif %}
|
||||
|
||||
<footer class="site-footer">
|
||||
<span class="site-footer-owner">
|
||||
<a href="https://chylex.com">My Website</a>
|
||||
·
|
||||
<a href="https://twitter.com/chylexmc">Twitter</a>
|
||||
·
|
||||
<a href="https://github.com/chylex">GitHub</a>
|
||||
·
|
||||
<a href="https://patreon.com/chylex">Patreon</a>
|
||||
</span>
|
||||
</footer>
|
||||
</main>
|
||||
</body>
|
||||
</html>
|
148
assets/css/style.scss
Normal file
148
assets/css/style.scss
Normal file
@ -0,0 +1,148 @@
|
||||
---
|
||||
---
|
||||
|
||||
@import "{{ site.theme }}";
|
||||
|
||||
a {
|
||||
color: #2482ae;
|
||||
}
|
||||
|
||||
.inactive-link {
|
||||
cursor: default;
|
||||
}
|
||||
|
||||
.page-header {
|
||||
padding: 0.2rem 4vw 0.4rem;
|
||||
text-shadow: 0px 2px 3px #1b242980;
|
||||
box-shadow: 0 2px 2px #000c;
|
||||
background-color: #348fba;
|
||||
background-image: linear-gradient(120deg, #c56087, #348fba);
|
||||
}
|
||||
|
||||
.project-name {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
margin-bottom: 0;
|
||||
|
||||
@include large {
|
||||
font-size: 3rem;
|
||||
}
|
||||
|
||||
@include medium {
|
||||
font-size: 2.5rem;
|
||||
}
|
||||
|
||||
@include small {
|
||||
font-size: 1.75rem;
|
||||
}
|
||||
|
||||
.project-name-image {
|
||||
$size: 3.4rem;
|
||||
|
||||
flex: 0 0 $size;
|
||||
height: $size;
|
||||
margin: 0.25rem 1rem 0 0;
|
||||
|
||||
img {
|
||||
width: $size;
|
||||
height: $size;
|
||||
border: 3px solid white;
|
||||
border-radius: 50%;
|
||||
}
|
||||
}
|
||||
|
||||
.project-name-text {
|
||||
flex: 0 1 auto;
|
||||
}
|
||||
}
|
||||
|
||||
.project-tagline {
|
||||
margin: 0.2rem 0 0.5rem;
|
||||
opacity: 0.85;
|
||||
|
||||
@include large {
|
||||
font-size: 1.5rem;
|
||||
}
|
||||
|
||||
@include medium {
|
||||
font-size: 1.25rem;
|
||||
}
|
||||
|
||||
@include small {
|
||||
font-size: 1rem;
|
||||
}
|
||||
}
|
||||
|
||||
.main-content {
|
||||
h1 {
|
||||
font-size: 1.9em;
|
||||
}
|
||||
|
||||
h2 {
|
||||
font-size: 1.4em;
|
||||
}
|
||||
|
||||
h3 {
|
||||
font-size: 1.15em;
|
||||
}
|
||||
|
||||
h4, h5, h6 {
|
||||
font-size: 1em;
|
||||
}
|
||||
|
||||
hr {
|
||||
height: 1px;
|
||||
background-color: #eff0f1;
|
||||
margin: 1.3rem 0;
|
||||
}
|
||||
|
||||
.page-breadcrumbs {
|
||||
margin: -0.75rem 0 -0.25rem;
|
||||
font-size: 1.05rem;
|
||||
}
|
||||
|
||||
.blog-entry-header {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
justify-content: space-between;
|
||||
align-items: baseline;
|
||||
margin-bottom: 0.9rem;
|
||||
|
||||
& > h1 {
|
||||
flex: 0 1 auto;
|
||||
margin: 0 2rem 0 0;
|
||||
}
|
||||
|
||||
& > p {
|
||||
flex: 0 0 auto;
|
||||
margin: 0.4rem 0 0 0;
|
||||
}
|
||||
}
|
||||
|
||||
.blog-entry-content {
|
||||
margin-bottom: 1.75rem;
|
||||
}
|
||||
}
|
||||
|
||||
.pagination {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
padding-top: 0.55rem;
|
||||
margin: -1.1rem 0;
|
||||
|
||||
& > div {
|
||||
flex: 0 0 auto;
|
||||
}
|
||||
}
|
||||
|
||||
.utterances {
|
||||
max-width: unset;
|
||||
border-top: solid 1px #eff0f1;
|
||||
margin-top: 2rem;
|
||||
padding-top: 0.8rem;
|
||||
}
|
||||
|
||||
.site-footer-owner {
|
||||
text-align: center;
|
||||
}
|
BIN
assets/img/avatar.png
Normal file
BIN
assets/img/avatar.png
Normal file
Binary file not shown.
After ![]() (image error) Size: 54 KiB |
31
index.html
Normal file
31
index.html
Normal file
@ -0,0 +1,31 @@
|
||||
---
|
||||
titleimg: /assets/img/avatar.png
|
||||
---
|
||||
|
||||
{% for post in paginator.posts %}
|
||||
<article>
|
||||
<div class="blog-entry-header">
|
||||
<h1><a href="{{ post.url }}">{{ post.title }}</a></h1>
|
||||
<p class="date">{{ post.date | date: '%b %Y' }}</p>
|
||||
</div>
|
||||
<div class="blog-entry-content">{{ post.excerpt }}</div>
|
||||
</article>
|
||||
<hr>
|
||||
{% endfor %}
|
||||
|
||||
<nav class="pagination">
|
||||
<div>
|
||||
{% if paginator.previous_page_path %}
|
||||
<a href="{{ paginator.previous_page_path }}">‹ previous page</a>
|
||||
{% else %}
|
||||
<span class="inactive-link">‹ previous page</span>
|
||||
{% endif %}
|
||||
</div>
|
||||
<div>
|
||||
{% if paginator.next_page_path %}
|
||||
<a href="{{ paginator.next_page_path }}">next page ›</a>
|
||||
{% else %}
|
||||
<span class="inactive-link">next page ›</span>
|
||||
{% endif %}
|
||||
</div>
|
||||
</nav>
|
Loading…
Reference in New Issue
Block a user