Fluffy/WebsiteFluffy
1
0
Fork 0
mirror of https://github.com/Fluffy-Bean/website.git synced 2025-05-31 15:53:15 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

Post, Project and index pages

Browse source 
Example posts
This commit is contained in:
Michał Gdula 2024-05-22 22:05:26 +01:00
parent 5970f11bcc
commit d3dafddf74
21 changed files with 625 additions and 168 deletions
Download patch file Download diff file Expand all files Collapse all files

80
src/layouts/Layout.astro
View file

@ -1,5 +1,5 @@
---
import { Image } from 'astro:assets';
import "../styles/styles.scss";
interface Props {
title: string;
@ -27,7 +27,7 @@ const { title, src, alt } = Astro.props;
</head>
<body>
<div class="banner">
{src && <Image src={src} alt={alt} inferSize={true} />}
{src && <img src={src} alt={alt} />}
</div>
<main>
<slot />
@ -37,33 +37,11 @@ const { title, src, alt } = Astro.props;
<style is:global lang="scss">
@import "../styles/vars";
*, *::before, *::after {
margin: 0;
padding: 0;
box-sizing: border-box;
font-family: 'IBM Plex Mono', monospace;
}
html {
min-height: 100vh;
font-size: 100%;
}
body {
min-height: 100vh;
display: flex;
flex-direction: column;
/*border-top: 2px solid $orange;*/
/*border-bottom: 2px solid $orange;*/
background-color: #261f1b;
color: $light
}
.banner {
margin: 0 -16px;
background-color: $gray;
height: 400px;
height: 700px;
> img {
width: 100%;
@ -75,45 +53,6 @@ const { title, src, alt } = Astro.props;
}
}
main {
margin: -300px auto 0;
padding: 32px;
width: 100%;
max-width: 800px;
flex-grow: 1;
border-top-left-radius: $radius;
border-top-right-radius: $radius;
background-color: $dark;
box-shadow: 0 8px 8px rgba(#000, 0.3);
animation: mainSlide 1s cubic-bezier(0,1,0,1) forwards;
> h1 {
padding-bottom: 8px;
}
> hr {
margin: 32px 0;
height: 2px;
border: 0 solid transparent;
background-color: $gray;
}
}
@keyframes mainSlide {
0% {
transform: translateY(100px);
}
100% {
transform: translateY(0);
}
}
footer {
padding: 0 32px;
@ -125,11 +64,18 @@ const { title, src, alt } = Astro.props;
align-items: center;
}
hr {
margin: 32px 0;
border: 0 solid transparent;
border-bottom: 2px solid $gray;
}
section {
padding-bottom: 32px;
> h2 {
padding-bottom: 8px;
padding-bottom: 10px;
}
&:last-of-type {