Further redesign
All checks were successful
/ get-version (push) Successful in 3s
/ astro-check (push) Successful in 12s
/ checking (push) Successful in 14s
/ build-site (push) Successful in 1m20s
/ check-tag (push) Successful in 2s
/ run-unlighthouse (push) Successful in 0s
/ create-release (push) Successful in 7s
/ auto-deploy-dockge (push) Successful in 28s
All checks were successful
/ get-version (push) Successful in 3s
/ astro-check (push) Successful in 12s
/ checking (push) Successful in 14s
/ build-site (push) Successful in 1m20s
/ check-tag (push) Successful in 2s
/ run-unlighthouse (push) Successful in 0s
/ create-release (push) Successful in 7s
/ auto-deploy-dockge (push) Successful in 28s
This commit is contained in:
parent
4eb390d0b1
commit
afe18e37b6
10 changed files with 128 additions and 111 deletions
|
@ -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",
|
||||
|
|
|
@ -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;
|
||||
|
|
|
@ -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;
|
||||
}
|
||||
|
|
|
@ -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);
|
||||
|
|
|
@ -36,7 +36,7 @@
|
|||
|
||||
.sub {
|
||||
font-size: 1rem;
|
||||
font-weight: 500;
|
||||
font-weight: 400;
|
||||
font-family: 'Work Sans Variable', sans-serif;
|
||||
}
|
||||
|
||||
|
|
|
@ -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;
|
||||
|
|
|
@ -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;
|
||||
|
|
|
@ -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 {
|
||||
|
|
|
@ -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;
|
||||
|
|
|
@ -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;
|
||||
|
|
Loading…
Reference in a new issue