fixed fonts, updated README

This commit is contained in:
liyunze 2023-10-06 23:02:45 +08:00
parent f3071be9e5
commit 90422e7bbc
2 changed files with 45 additions and 52 deletions

View file

@ -1,54 +1,47 @@
# Astro Starter Kit: Basics <div align="center">
<img src="./public/images/logo_circle.webp" width="100">
<h1>ryanpython.me</h1>
<p>The 4th iteration of Ryan's personal website</p>
</div>
```sh <div align="center">
npm create astro@latest -- --template basics <a href="https://astro.js.org/" target="_blank"><img src="https://img.shields.io/badge/Astro-0C1222?style=for-the-badge&logo=astro&logoColor=FDFDFE"></a>
``` <a href="https://svelte.dev/" target="_blank"><img src="https://img.shields.io/badge/Svelte-4A4A55?style=for-the-badge&logo=svelte&logoColor=FF3E00"></a>
<a href="https://tailwindcss.com/" target="_blank"><img src="https://img.shields.io/badge/Tailwind_CSS-38B2AC?style=for-the-badge&logo=tailwind-css&logoColor=white" target="_blank"></a>
<a href="https://www.typescriptlang.org/"><img src="https://img.shields.io/badge/TypeScript-007ACC?style=for-the-badge&logo=typescript&logoColor=white" target="_blank"></a>
<a href="https://react.dev/" target="_blank"><img src="https://img.shields.io/badge/React-20232A?style=for-the-badge&logo=react&logoColor=61DAFB"></a>
<a href="https://vercel.com/" target="_blank"><img src="https://img.shields.io/badge/Vercel-000000?style=for-the-badge&logo=vercel&logoColor=white"></a>
</div>
[![Open in StackBlitz](https://developer.stackblitz.com/img/open_in_stackblitz.svg)](https://stackblitz.com/github/withastro/astro/tree/latest/examples/basics) <br>
[![Open with CodeSandbox](https://assets.codesandbox.io/github/button-edit-lime.svg)](https://codesandbox.io/p/sandbox/github/withastro/astro/tree/latest/examples/basics)
[![Open in GitHub Codespaces](https://github.com/codespaces/badge.svg)](https://codespaces.new/withastro/astro?devcontainer_path=.devcontainer/basics/devcontainer.json)
> 🧑‍🚀 **Seasoned astronaut?** Delete this file. Have fun! <div align="center">
<img src="./src/images/homepage.png" height="250px">
</div>
![just-the-basics](https://github.com/withastro/astro/assets/2244813/a0a5533c-a856-4198-8470-2d67b1d7c554) ---
## 🚀 Project Structure ## 📝 About
Inside of your Astro project, you'll see the following folders and files: This is the third iteration of my personal website.
```text Previous iterations: [v1](https://liyunze-coding.github.io/old-portfolio), [v2](https://liyunze-coding.github.io/old-portfolio-2)
/
├── public/
│ └── favicon.svg
├── src/
│ ├── components/
│ │ └── Card.astro
│ ├── layouts/
│ │ └── Layout.astro
│ └── pages/
│ └── index.astro
└── package.json
```
Astro looks for `.astro` or `.md` files in the `src/pages/` directory. Each page is exposed as a route based on its file name. ## 🚨 Forking this repo
There's nothing special about `src/components/`, but that's where we like to put any Astro/React/Vue/Svelte/Preact components. If you want to fork this repo, feel free to do so. However, I ask that you please give me credit by linking back to my website - https://ryanpython.me . Thanks!
Any static assets, like images, can be placed in the `public/` directory. ## 📚 License
## 🧞 Commands This project is licensed under the MIT License - see the [LICENSE](./LICENSE) file for details.
All commands are run from the root of the project, from a terminal: <!-- socials -->
| Command | Action | ## 📱 Socials
| :------------------------ | :----------------------------------------------- |
| `npm install` | Installs dependencies |
| `npm run dev` | Starts local dev server at `localhost:4321` |
| `npm run build` | Build your production site to `./dist/` |
| `npm run preview` | Preview your build locally, before deploying |
| `npm run astro ...` | Run CLI commands like `astro add`, `astro check` |
| `npm run astro -- --help` | Get help using the Astro CLI |
## 👀 Want to learn more? <a href="https://www.youtube.com/channel/UC0ZQZ1XZ1Z0ZQZ1X" target="_blank">
<img src="https://img.shields.io/badge/YouTube-FF0000?style=for-the-badge&logo=youtube&logoColor=white">
Feel free to check [our documentation](https://docs.astro.build) or jump into our [Discord server](https://astro.build/chat). </a>
<a href="https://www.twitch.tv/RythonDev" target="_blank">
<img src="https://img.shields.io/twitch/status/rythondev?color=9146FF&label=Twitch&logo=twitch&logoColor=white&style=for-the-badge">
</a>

View file

@ -24,28 +24,28 @@ const { title } = Astro.props;
/* Fredoka Fonts */ /* Fredoka Fonts */
@font-face { @font-face {
font-family: "Fredoka"; font-family: "Fredoka";
src: url("fonts/Fredoka-Bold.ttf") format("truetype"); src: url("/fonts/Fredoka-Bold.ttf") format("truetype");
font-weight: bold; font-weight: bold;
font-style: normal; font-style: normal;
} }
@font-face { @font-face {
font-family: "Fredoka"; font-family: "Fredoka";
src: url("fonts/Fredoka-Light.ttf") format("truetype"); src: url("/fonts/Fredoka-Light.ttf") format("truetype");
font-weight: lighter; font-weight: lighter;
font-style: normal; font-style: normal;
} }
@font-face { @font-face {
font-family: "Fredoka"; font-family: "Fredoka";
src: url("fonts/Fredoka-Medium.ttf") format("truetype"); src: url("/fonts/Fredoka-Medium.ttf") format("truetype");
font-weight: normal; font-weight: normal;
font-style: normal; font-style: normal;
} }
@font-face { @font-face {
font-family: "Fredoka"; font-family: "Fredoka";
src: url("fonts/Fredoka-Regular.ttf") format("truetype"); src: url("/fonts/Fredoka-Regular.ttf") format("truetype");
font-weight: normal; font-weight: normal;
font-style: normal; font-style: normal;
} }
@ -53,35 +53,35 @@ const { title } = Astro.props;
/* Montserrat Fonts */ /* Montserrat Fonts */
@font-face { @font-face {
font-family: "Montserrat"; font-family: "Montserrat";
src: url("fonts/Montserrat-Bold.ttf") format("truetype"); src: url("/fonts/Montserrat-Bold.ttf") format("truetype");
font-weight: bold; font-weight: bold;
font-style: normal; font-style: normal;
} }
@font-face { @font-face {
font-family: "Montserrat"; font-family: "Montserrat";
src: url("fonts/Montserrat-Light.ttf") format("truetype"); src: url("/fonts/Montserrat-Light.ttf") format("truetype");
font-weight: lighter; font-weight: lighter;
font-style: normal; font-style: normal;
} }
@font-face { @font-face {
font-family: "Montserrat"; font-family: "Montserrat";
src: url("fonts/Montserrat-Medium.ttf") format("truetype"); src: url("/fonts/Montserrat-Medium.ttf") format("truetype");
font-weight: normal; font-weight: normal;
font-style: normal; font-style: normal;
} }
@font-face { @font-face {
font-family: "Montserrat"; font-family: "Montserrat";
src: url("fonts/Montserrat-Regular.ttf") format("truetype"); src: url("/fonts/Montserrat-Regular.ttf") format("truetype");
font-weight: normal; font-weight: normal;
font-style: normal; font-style: normal;
} }
@font-face { @font-face {
font-family: "Montserrat"; font-family: "Montserrat";
src: url("fonts/Montserrat-SemiBold.ttf") format("truetype"); src: url("/fonts/Montserrat-SemiBold.ttf") format("truetype");
font-weight: 600; /* You can adjust this value if needed */ font-weight: 600; /* You can adjust this value if needed */
font-style: normal; font-style: normal;
} }
@ -89,21 +89,21 @@ const { title } = Astro.props;
/* Poppins Fonts */ /* Poppins Fonts */
@font-face { @font-face {
font-family: "Poppins-Light"; font-family: "Poppins-Light";
src: url("fonts/Poppins-Light.ttf") format("truetype"); src: url("/fonts/Poppins-Light.ttf") format("truetype");
font-weight: lighter; font-weight: lighter;
font-style: normal; font-style: normal;
} }
@font-face { @font-face {
font-family: "Poppins-Medium"; font-family: "Poppins-Medium";
src: url("fonts/Poppins-Medium.ttf") format("truetype"); src: url("/fonts/Poppins-Medium.ttf") format("truetype");
font-weight: normal; font-weight: normal;
font-style: normal; font-style: normal;
} }
@font-face { @font-face {
font-family: "Poppins-Regular"; font-family: "Poppins-Regular";
src: url("fonts/Poppins-Regular.ttf") format("truetype"); src: url("/fonts/Poppins-Regular.ttf") format("truetype");
font-weight: normal; font-weight: normal;
font-style: normal; font-style: normal;
} }