diff --git a/package-lock.json b/package-lock.json index 4f775d2..1bd0f93 100644 --- a/package-lock.json +++ b/package-lock.json @@ -5,11 +5,15 @@ "requires": true, "packages": { "": { + "name": "website", "version": "0.0.1", "dependencies": { "@astrojs/check": "^0.7.0", "astro": "^4.8.6", "typescript": "^5.4.5" + }, + "devDependencies": { + "sass": "^1.77.2" } }, "node_modules/@ampproject/remapping": { @@ -3122,6 +3126,12 @@ "node": ">=16.17.0" } }, + "node_modules/immutable": { + "version": "4.3.6", + "resolved": "https://registry.npmjs.org/immutable/-/immutable-4.3.6.tgz", + "integrity": "sha512-Ju0+lEMyzMVZarkTn/gqRpdqd5dOPaz1mCZ0SH3JV6iFw81PldE/PEB1hWVEA288HPt4WXW8O7AWxB10M+03QQ==", + "devOptional": true + }, "node_modules/import-meta-resolve": { "version": "4.1.0", "resolved": "https://registry.npmjs.org/import-meta-resolve/-/import-meta-resolve-4.1.0.tgz", @@ -5396,6 +5406,23 @@ "queue-microtask": "^1.2.2" } }, + "node_modules/sass": { + "version": "1.77.2", + "resolved": "https://registry.npmjs.org/sass/-/sass-1.77.2.tgz", + "integrity": "sha512-eb4GZt1C3avsX3heBNlrc7I09nyT00IUuo4eFhAbeXWU2fvA7oXI53SxODVAA+zgZCk9aunAZgO+losjR3fAwA==", + "devOptional": true, + "dependencies": { + "chokidar": ">=3.0.0 <4.0.0", + "immutable": "^4.0.0", + "source-map-js": ">=0.6.2 <2.0.0" + }, + "bin": { + "sass": "sass.js" + }, + "engines": { + "node": ">=14.0.0" + } + }, "node_modules/section-matter": { "version": "1.0.0", "resolved": "https://registry.npmjs.org/section-matter/-/section-matter-1.0.0.tgz", diff --git a/package.json b/package.json index 6c67aad..fa5d0ea 100644 --- a/package.json +++ b/package.json @@ -10,8 +10,11 @@ "astro": "astro" }, "dependencies": { - "astro": "^4.8.6", "@astrojs/check": "^0.7.0", + "astro": "^4.8.6", "typescript": "^5.4.5" + }, + "devDependencies": { + "sass": "^1.77.2" } -} \ No newline at end of file +} diff --git a/src/components/Card.astro b/src/components/Card.astro index bd6d597..a038aec 100644 --- a/src/components/Card.astro +++ b/src/components/Card.astro @@ -12,50 +12,89 @@ const { href, title, body } = Astro.props;

{title} - →

{body}

+
- diff --git a/src/components/Pill.astro b/src/components/Pill.astro new file mode 100644 index 0000000..99d84fe --- /dev/null +++ b/src/components/Pill.astro @@ -0,0 +1,36 @@ +--- +interface Props { + name: string; +} + +const { name } = Astro.props; +--- + +
  • + {name} +
    • + + diff --git a/src/layouts/Layout.astro b/src/layouts/Layout.astro index 7b552be..cfa5243 100644 --- a/src/layouts/Layout.astro +++ b/src/layouts/Layout.astro @@ -1,51 +1,139 @@ --- +import { Image } from 'astro:assets'; + interface Props { - title: string; + title: string; + src?: string, + alt: string, } -const { title } = Astro.props; +const { title, src, alt } = Astro.props; --- - - - - - - - {title} - - - - + + + + + + + + + + + + {title} + + + +
    + +
    + - diff --git a/src/layouts/Markdown.astro b/src/layouts/Markdown.astro new file mode 100644 index 0000000..5043c2d --- /dev/null +++ b/src/layouts/Markdown.astro @@ -0,0 +1,58 @@ +--- +import Layout from "./Layout.astro"; +import Pill from "../components/Pill.astro"; +const { frontmatter } = Astro.props; +--- + + + Back +

    {frontmatter.title}

    +

    By {frontmatter.author}

    + +
      + {frontmatter.tags.map((item) => ( + + ))} +
    + +
    + +     + + diff --git a/src/pages/index.astro b/src/pages/index.astro index d77b03e..34b4dea 100644 --- a/src/pages/index.astro +++ b/src/pages/index.astro @@ -1,123 +1,100 @@ --- -import Layout from '../layouts/Layout.astro'; -import Card from '../components/Card.astro'; +import Layout from "../layouts/Layout.astro"; +import Card from "../components/Card.astro"; +import Pill from "../components/Pill.astro"; --- - -
    - -

    Welcome to GayBalls

    -

    - To get started, open the directory src/pages in your project.
    - Code Challenge: Tweak the "Welcome to Astro" message above. + +

    Leggy Land

    +

    Made with Coffee

    + +
    + +
    +

    Who am I

    +

    + My name is Fluffy, I'm an 18-year-old nerd, who likes to code and tinker with computers! +

    + I specialise in Front-End development, but also enjoy working with the back end. My Favorite framework currently is Flask, but this website runs on Django, lol +

    + My favorite language is Python, but I also know how to use PHP, HTML, CSS/Sass, JavaScript, Docker, SQL, Shell Scripting, and a little bit of Rust. +

    + I also have experience in a few different systems, mainly Arch, Ubuntu and Proxmox.

    -
      +
    + +
    +

    Developer tools

    +
      + + + +
    +
    + +
    +

    Languages

    +
      + + + + +
    +
    + +
    +

    Web Frameworks

    +
      + + + + +
    +
    + +
    +

    Game Frameworks

    +
      + +
    +
    + +
    +

    Projects

    +
      -
    -
    +     - diff --git a/src/pages/projects/example.md b/src/pages/projects/example.md new file mode 100644 index 0000000..035862e --- /dev/null +++ b/src/pages/projects/example.md @@ -0,0 +1,18 @@ +--- +layout: ../../layouts/Markdown.astro + +title: This is an example Post +author: GwaGwa +description: "After learning some Astro, I couldn't stop!" +image: + url: "https://docs.astro.build/assets/arc.webp" + alt: "Thumbnail of Astro arcs." +pubDate: 2022-07-08 +tags: + - "GwaGwa" + - "Gaming" + - "Urchin" + - "Fortnite" +--- + +Gay Balls even \ No newline at end of file diff --git a/src/styles/vars.scss b/src/styles/vars.scss new file mode 100644 index 0000000..a04031d --- /dev/null +++ b/src/styles/vars.scss @@ -0,0 +1,6 @@ +$dark: #312620; +$gray: #382e28; +$light: #f0e7e4; +$orange: #f2672c; + +$radius: 4px;