Anri/mylloon.fr
1
0
Fork 0
Code Issues 21 Pull requests 2 Releases Packages 1 Activity Actions

index blog css done!
Some checks are pending
ci/woodpecker/push/publish Pipeline is pending
Details

Browse source
This commit is contained in:
Mylloon 2023-04-24 19:11:00 +02:00
parent 76a79bf192
commit 4da4bb2e58
Signed by: Anri
GPG key ID: A82D63DFF8D1317F
2 changed files with 52 additions and 24 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

72
static/css/blog/index.css
View file

@ -19,40 +19,68 @@
--point: #515f70;
--bg-hover: #071f2a;
--point-hover: #ff00ff;
--font-color: #ffffff;
--font-color: #a1a1aa;
--title-color: #a25add;
--font-size: 20px;
}
}
* {
/* padding: 0px; */
margin: 0px;
box-sizing: border-box;
html {
background-color: var(--bg);
font-family: "Segoe UI", Arial, sans-serif, "Segoe UI Emoji",
"Segoe UI Symbol";
/* perspective: 800px; */
}
body {
background-color: var(--bg);
/* width: 100%; */
/* min-height: 100vh; */
display: flex;
justify-content: center;
/* align-items: center; */
/* Title of page */
h1 {
color: var(--font-color);
text-transform: uppercase;
letter-spacing: 0.3cap;
}
h2,
p {
margin: 0px;
}
h1,
footer {
text-align: center;
font-size: calc(var(--font-size) * 2);
}
footer > * {
color: var(--font-color);
font-weight: bold;
text-decoration: none;
font-size: calc(var(--font-size) / 1.5);
text-transform: uppercase;
opacity: 0.7;
letter-spacing: 0.15rem;
}
footer > *::before {
content: "> ";
}
a:hover {
color: var(--title-color);
}
.timeline {
box-sizing: border-box;
width: 800px;
color: var(--font-color);
padding: 30px 20px;
display: flex;
width: 100%;
justify-content: center;
}
/* Barre */
.timeline ul {
list-style-type: none;
border-left: 2px solid var(--line);
padding: 10px 5px;
padding: 0px 5px;
}
/* Card */
@ -68,15 +96,15 @@ body {
display: inline-block;
background-color: var(--date);
border-radius: 25px;
padding: 2px 5px;
font-size: 15px;
padding: 2px 8px;
font-size: calc(var(--font-size) - 2px);
/* text-align: center; */
}
/* Titles */
.timeline ul li .content h3 > a {
.timeline ul li .content h2 > a {
color: var(--title-color);
font-size: 17px;
font-size: var(--font-size);
padding-top: 5px;
text-decoration: none;
}
@ -84,7 +112,7 @@ body {
/* Descriptions */
.timeline ul li .content p {
padding: 5px 0px 15px 0px;
font-size: 15px;
font-size: calc(var(--font-size) - 2px);
}
/* Points côté */
@ -96,7 +124,7 @@ body {
background-color: var(--point);
border-radius: 50%;
left: -11px;
top: 28px;
top: 59px;
transition: 0.2s;
}
@ -116,8 +144,8 @@ body {
/* width: 100%; */
padding: 30px 5px 30px 10px;
}
.timeline ul li .content h3 > a {
.timeline ul li .content h2 > a {
color: var(--title-color);
font-size: 15px;
font-size: calc(var(--font-size) - 2px);
}
}

4
templates/blog/index.html
View file

@ -7,7 +7,7 @@
<body class="index">
{{#data}}
<h1 id="title">Blog</h1>
<h1>Blog</h1>
{{#no_posts}}
<h2 class="subtitle">Aucun posts</h2>
{{/no_posts}} {{^no_posts}}
@ -33,7 +33,7 @@
{{/date}}</span
>
<div class="content">
<h3><a href="/blog/{{url}}">{{title}}</a></h3>
<h2><a href="/blog/{{url}}">{{title}}</a></h3>
{{#desc}}
<p>{{desc}}</p>
{{/desc}}