Firq/firq-dev-website
Firq/firq-dev-website
1
0
Fork 0
Code Issues Pull requests Projects Releases172 Packages1 Wiki Activity Actions

Finishing Touches

Browse source
This commit is contained in:
Firq 2023-07-08 15:02:07 +02:00
parent 4da3f4323c
commit 4aa3865148
Signed by: Firq
GPG key ID: 3ACC61C8CEC83C20
6 changed files with 76 additions and 24 deletions
src/layouts
blogPost.astro

46
src/layouts/blogPost.astro
View file

@ -42,11 +42,17 @@ const date = new Date(frontmatter.pubDate).toLocaleDateString(
text-decoration: none;
}
h1 {
font-size: 34px;
line-height: 40px;
letter-spacing: -1px;
color: white;
margin: 0.5rem 3rem 0.5rem 3rem;
padding: 0.25rem 0.75rem;
max-width: max-content;
background-color: var(--c-darkgray);
padding: 0.25rem 1rem;
border-radius: 0.5rem;
padding-bottom: 0.5rem;
}
p {
color: white;
@ -54,6 +60,8 @@ const date = new Date(frontmatter.pubDate).toLocaleDateString(
padding: 0.25rem 0.75rem;
max-width: max-content;
background-color: var(--c-gray);
border-radius: 0.5rem;
padding-bottom: 0.5rem;
}
article :global(h2) {
margin-right: 3rem;
@ -62,6 +70,9 @@ const date = new Date(frontmatter.pubDate).toLocaleDateString(
padding: 0.25rem 0.75rem;
max-width: max-content;
background-color: var(--c-darkgray);
padding: 0.25rem 1rem;
border-radius: 0.5rem;
padding-bottom: 0.5rem;
}
article :global(h3) {
@ -72,6 +83,9 @@ const date = new Date(frontmatter.pubDate).toLocaleDateString(
padding: 0.25rem 0.75rem;
max-width: max-content;
background-color: var(--c-darkgray);
padding: 0.25rem 1rem;
border-radius: 0.5rem;
padding-bottom: 0.5rem;
}
article :global(h4) {
@ -82,6 +96,9 @@ const date = new Date(frontmatter.pubDate).toLocaleDateString(
padding: 0.25rem 0.75rem;
max-width: max-content;
background-color: var(--c-darkgray);
padding: 0.25rem 1rem;
border-radius: 0.5rem;
padding-bottom: 0.5rem;
}
article :global(a) {
color: #dcb7ff;
@ -103,18 +120,33 @@ const date = new Date(frontmatter.pubDate).toLocaleDateString(
color: orange;
}
@media (min-width: 1500px) {
@media (min-width: 1000px) {
article {
margin-left: 15rem;
margin-right: 15rem;
margin-left: 10rem;
margin-right: 10rem;
}
h1 {
margin-left: 15rem;
margin-right: 15rem;
margin-left: 10rem;
margin-right: 10rem;
}
p {
margin-left: 15rem;
margin-right: 15rem;
margin-left: 10rem;
margin-right: 10rem;
}
}
@media (min-width: 1500px) {
article {
margin-left: 20rem;
margin-right: 20rem;
}
h1 {
margin-left: 20rem;
margin-right: 20rem;
}
p {
margin-left: 20rem;
margin-right: 20rem;
}
}
</style>