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

Further redesign

Browse source
This commit is contained in:
Firq 2024-10-25 15:26:25 +02:00
parent 4eb390d0b1
commit afe18e37b6
Signed by: Firq
GPG key ID: 3ACC61C8CEC83C20
10 changed files with 128 additions and 111 deletions
src/layouts
blogPost.astro

146
src/layouts/blogPost.astro
View file

@ -19,90 +19,12 @@ const subtext = `Written by ${frontmatter.author} • Published on ${date}`
<Layout title={title} currentpage="blog" descriptionOverride={description}>
<SmallTitle maintext={frontmatter.title} subtext={subtext} fadeout={true} returnbutton={true} baseurl='blog'/>
<div>
<article>
<slot />
</article>
</div>
<article>
<slot />
</article>
</Layout>
<style>
a {
display: flex;
align-items: center;
justify-content: center;
width: 100%;
text-align: center;
color: var(--c-primary-text);
background-color: var(--c-secondary-background);
padding: 0.5rem 0px;
margin-bottom: 2rem;
text-decoration: none;
}
h1 {
font-size: 34px;
line-height: 40px;
letter-spacing: -1px;
color: var(--c-primary-text);
margin: 0.5rem 3rem 0.5rem 3rem;
padding: 0.25rem 0.75rem;
max-width: max-content;
background-color: var(--c-primary-background);
padding: 0.25rem 1rem;
border-radius: 0.5rem;
padding-bottom: 0.5rem;
}
p {
color: var(--c-primary-text);
margin: 0.5rem 3rem 0.5rem 3rem;
padding: 0.25rem 0.75rem;
max-width: max-content;
background-color: var(--c-secondary-background);
border-radius: 0.5rem;
padding-bottom: 0.5rem;
}
article :global(h2) {
margin-right: 3rem;
word-wrap: normal;
color: var(--c-primary-text);
padding: 0.25rem 0.75rem;
max-width: max-content;
background-color: var(--c-primary-background);
padding: 0.25rem 1rem;
border-radius: 0.5rem;
padding-bottom: 0.5rem;
}
article :global(h3) {
margin-bottom: 0.5rem;
margin-right: 3rem;
word-wrap: normal;
color: var(--c-primary-text);
padding: 0.25rem 0.75rem;
max-width: max-content;
background-color: var(--c-primary-background);
padding: 0.25rem 1rem;
border-radius: 0.5rem;
padding-bottom: 0.5rem;
}
article :global(h4) {
margin-bottom: 0.5rem;
margin-right: 3rem;
word-wrap: normal;
color: var(--c-primary-text);
padding: 0.25rem 0.75rem;
max-width: max-content;
background-color: var(--c-primary-background);
padding: 0.25rem 1rem;
border-radius: 0.5rem;
padding-bottom: 0.5rem;
}
article :global(a) {
color: #dcb7ff;
text-decoration: none;
font-style: italic;
}
article {
color: var(--c-primary-text);
margin: 0.5rem 3rem 0.5rem 3rem;
@ -110,10 +32,72 @@ const subtext = `Written by ${frontmatter.author} • Published on ${date}`
text-align: justify;
padding-bottom: 5rem;
}
article :global(h2) {
font-size: 32px;
word-wrap: normal;
color: var(--c-primary-text);
max-width: max-content;
padding-bottom: 0.5rem;
text-align: left;
line-height: 32px;
&:after {
content:' ';
display: block;
width: 75%;
margin-top: 2px;
border: 1px solid var(--c-accent-1);
box-shadow:inset 0 1px 1px rgba(0, 0, 0, .05);
}
}
article :global(h3) {
font-size: 24px;
word-wrap: normal;
color: var(--c-primary-text);
max-width: max-content;
padding-bottom: 0.5rem;
text-align: left;
line-height: 32px;
&:after {
content:' ';
display: block;
width: 75%;
margin-top: 2px;
border: 1px solid var(--c-accent-1);
box-shadow:inset 0 1px 1px rgba(0, 0, 0, .05);
}
}
article :global(h4) {
font-size: 18px;
word-wrap: normal;
color: var(--c-primary-text);
max-width: max-content;
margin-bottom: 0px;
text-align: left;
line-height: 32px;
&:after {
content:' ';
display: block;
width: 75%;
margin-top: 1px;
border: 1px solid var(--c-accent-1);
box-shadow:inset 0 1px 1px rgba(0, 0, 0, .05);
}
}
article :global(a) {
color: #dcb7ff;
text-decoration: none;
font-style: italic;
}
article :global(.astro-code) {
width: auto;
padding: 1rem 1rem 1rem 2rem;
}
article :global(code) {
font-weight: bold;
color: orange;