Firq/firq-dev-website
Firq/firq-dev-website
1
0
Fork 0
Code Issues Pull requests Projects Releases 119 Packages Wiki Activity Actions

Further redesign

Browse source
This commit is contained in:
Firq 2024-10-25 15:26:25 +02:00
parent 4eb390d0b1
commit b6ea7ea21c
Signed by: Firq
GPG key ID: 3ACC61C8CEC83C20
10 changed files with 128 additions and 111 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
package.json
View file

@ -1,7 +1,7 @@
{
"name": "@firq/fgosite",
"type": "module",
"version": "0.2.0-pre.34",
"version": "0.2.0-pre.35",
"private": true,
"scripts": {
"dev": "astro dev",

14
src/components/cards/blogCard.astro
View file

@ -72,9 +72,14 @@ const date = new Date(pubdate).toLocaleDateString('en-GB', options_date)
padding: 10px;
text-align: center;
min-height: 100%;
border: 2px solid var(--c-primary-background);
border-radius: 1.25rem;
}
a:hover article {
border-color: var(--c-accent-1);
}
@media (min-width: 900px) {
.circle {
margin: 1rem 0.5rem 1rem 0.5rem;
@ -98,15 +103,8 @@ const date = new Date(pubdate).toLocaleDateString('en-GB', options_date)
margin-right: 4px;
}
a:hover article {
border-color: var(--c-accent-1);
transform: none;
}
article {
border-style: solid;
border-width: 2px;
border-color: var(--c-primary-background);
border: 2px solid var(--c-primary-background);
align-items: flex-start;
align-content: flex-start;
margin-left: 0.5rem;

4
src/components/cards/favouriteCard.astro
View file

@ -41,7 +41,7 @@ const loadedImage = plsLoadImage(images, imagePath)
color: var(--c-primary-text);
max-width: 200px;
padding-bottom: 0.3rem;
font-weight: bold;
font-weight: 500;
margin: 0px;
justify-content: center;
align-items: center;
@ -88,7 +88,7 @@ const loadedImage = plsLoadImage(images, imagePath)
.subtext {
color: var(--c-primary-text);
font-size: 16px;
font-weight: 600;
font-weight: 400;
margin: 0.5rem;
line-height: 20px;
}

4
src/components/cards/taCard.astro
View file

@ -131,7 +131,7 @@ const hasuser = user !== undefined ? 'display: flex' : 'display: none'
color: var(--c-primary-text);
font-size: 1rem;
font-weight: 400;
margin: 0.5rem 0px 0.25rem 0px;
margin: 0.5rem 0px 0.625rem 0px;
}
.expand-on-hover {
@ -147,7 +147,7 @@ const hasuser = user !== undefined ? 'display: flex' : 'display: none'
transform: scaleY(0);
transform-origin: top;
position: absolute;
top: 90%;
top: 87.5%;
padding-top: 0.5rem;
margin-top: 0.2rem;
color: var(--c-primary-text);

2
src/components/titles/title.astro
View file

@ -36,7 +36,7 @@
.sub {
font-size: 1rem;
font-weight: 500;
font-weight: 400;
font-family: 'Work Sans Variable', sans-serif;
}

12
src/layouts/baseSection.astro
View file

@ -35,16 +35,24 @@ const { title } = Astro.props
line-height: 48px;
letter-spacing: -1px;
color: var(--c-primary-text);
margin-top: 2rem;
margin-bottom: 0px;
margin-left: auto;
margin-right: auto;
padding: 0.25rem 1.5rem;
border-radius: 0.5rem;
max-width: max-content;
background-color: var(--c-primary-background);
padding-bottom: 0.5rem;
}
h1:after {
content:' ';
display: block;
width: 62.5%;
margin: auto;
border: 2px solid var(--c-accent-1);
box-shadow:inset 0 1px 1px rgba(0, 0, 0, .05);
}
@media (min-width: 512px) {
div {
row-gap: 1.5em;

140
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>
</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;

28
src/layouts/contactSection.astro
View file

@ -16,17 +16,23 @@ const { title } = Astro.props
<style>
h1 {
color: var(--c-primary-text);
font-size: 26px;
font-size: 24px;
font-weight: 700;
line-height: 32px;
letter-spacing: -1px;
margin: 0.5rem 0px 0.5rem 0.5em;
padding: 0.25rem 0.75rem;
font-family: 'Work Sans Adaptive', sans-serif;
width: max-content;
background-color: var(--c-primary-background);
padding: 0.25rem 1rem;
border-radius: 0.5rem;
padding-bottom: 0.5rem;
margin: 0 auto 0.5rem auto;
&:after {
content:' ';
display: block;
width: 75%;
margin: -2px auto auto auto;
border: 1px solid var(--c-accent-1);
box-shadow:inset 0 1px 1px rgba(0, 0, 0, .05);
}
}
div {
row-gap: 1em;
column-gap: 1em;
@ -51,6 +57,14 @@ const { title } = Astro.props
margin-left: 3rem;
margin-right: 3rem;
}
h1 {
margin-left: 0;
margin-right: 0;
&:after {
margin: -2px 0 0;
}
}
}
@media (min-width: 1500px) {
.base {

11
src/layouts/servantSection.astro
View file

@ -37,17 +37,24 @@ const { title } = Astro.props
line-height: 48px;
letter-spacing: -1px;
color: var(--c-primary-text);
margin-top: 2rem;
margin-bottom: 0px;
margin-left: auto;
margin-right: auto;
padding: 0.25rem 1.5rem;
border-radius: 0.5rem;
max-width: max-content;
background-color: var(--c-primary-background);
padding-bottom: 0.5rem;
}
h1:after {
content:' ';
display: block;
width: 62.5%;
margin: auto;
border: 2px solid var(--c-accent-1);
box-shadow:inset 0 1px 1px rgba(0, 0, 0, .05);
}
@media (min-width: 1000px) {
.base div {
margin-left: 3rem;

16
src/layouts/taSection.astro
View file

@ -38,21 +38,27 @@ if (abovetext === undefined) {
line-height: 48px;
letter-spacing: -1px;
color: var(--c-primary-text);
margin-top: 2rem;
margin-bottom: 0;
margin-left: auto;
margin-right: auto;
padding: 0.25rem 0.75rem;
max-width: max-content;
background-color: var(--c-primary-background);
padding: 0.25rem 1.5rem;
border-radius: 0.5rem;
padding-bottom: 0.5rem;
}
h1:after {
content:' ';
display: block;
width: 62.5%;
margin: auto;
border: 2px solid var(--c-accent-1);
box-shadow:inset 0 1px 1px rgba(0, 0, 0, .05);
}
h2 {
color: var(--c-primary-text);
font-size: 16px;
font-weight: 600;
font-weight: 400;
margin: 5;
line-height: 20px;
text-align: center;