added fonts, changed some content

This commit is contained in:
liyunze 2023-08-21 15:41:38 +08:00
parent 763b07cbd1
commit 6d5838a3e3
16 changed files with 144 additions and 79 deletions

Binary file not shown.

Binary file not shown.

Binary file not shown.

Binary file not shown.

Binary file not shown.

Binary file not shown.

Binary file not shown.

Binary file not shown.

Binary file not shown.

Binary file not shown.

Binary file not shown.

Binary file not shown.

View file

@ -20,20 +20,6 @@ const { title, description } = Astro.props;
<meta name="theme-color" content="#2B2D31" /> <meta name="theme-color" content="#2B2D31" />
<meta name="viewport" content="width=device-width" /> <meta name="viewport" content="width=device-width" />
<link rel="icon" type="image/x-icon" href="/favicon.ico" /> <link rel="icon" type="image/x-icon" href="/favicon.ico" />
<link rel="preconnect" href="https://fonts.googleapis.com" />
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
<link
href="https://fonts.googleapis.com/css2?family=Montserrat:wght@300;400;500;600;700&display=swap"
rel="stylesheet"
/>
<link
href="https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500&display=swap"
rel="stylesheet"
/>
<link
href="https://fonts.googleapis.com/css2?family=Fredoka:wght@300;500;700&display=swap"
rel="stylesheet"
/>
<script defer src="/_vercel/insights/script.js"></script> <script defer src="/_vercel/insights/script.js"></script>
<ViewTransitions /> <ViewTransitions />
<meta name="generator" content={Astro.generator} /> <meta name="generator" content={Astro.generator} />
@ -42,52 +28,138 @@ const { title, description } = Astro.props;
<body> <body>
<NavBar /> <NavBar />
<slot /> <slot />
</body><style is:global>
* {
box-sizing: border-box;
margin: 0;
padding: 0;
}
html { <style is:global>
font-family: "Montserrat", system-ui, sans-serif; @font-face {
background-color: #29233f; font-family: "Fredoka";
} src: url("/fonts/Fredoka-Bold.ttf") format("truetype");
font-weight: bold;
font-style: normal;
}
html, @font-face {
body { font-family: "Fredoka";
min-height: 100%; src: url("/fonts/Fredoka-Light.ttf") format("truetype");
} font-weight: normal;
font-style: normal;
}
body { @font-face {
height: 100vh; font-family: "Fredoka";
font-family: "Montserrat", system-ui, sans-serif; src: url("/fonts/Fredoka-Medium.ttf") format("truetype");
} font-weight: 500;
font-style: normal;
}
code { @font-face {
font-family: Menlo, Monaco, Lucida Console, Liberation Mono, font-family: "Fredoka";
DejaVu Sans Mono, Bitstream Vera Sans Mono, Courier New, src: url("/fonts/Fredoka-Regular.ttf") format("truetype");
monospace; font-weight: normal;
} font-style: normal;
}
nav { @font-face {
font-family: "Montserrat", system-ui, sans-serif; font-family: "Montserrat";
font-weight: 500; src: url("/fonts/Montserrat-Bold.ttf") format("truetype");
} font-weight: bold;
font-style: normal;
}
nav ul a { @font-face {
text-decoration: none; font-family: "Montserrat";
} src: url("/fonts/Montserrat-Light.ttf") format("truetype");
font-weight: 300;
font-style: normal;
}
a.preview { @font-face {
text-decoration: none; font-family: "Montserrat";
} src: url("/fonts/Montserrat-Medium.ttf") format("truetype");
font-weight: 500;
font-style: normal;
}
p code { @font-face {
word-break: break-all; /* This will allow the URL to break at any character */ font-family: "Montserrat";
display: block; /* Ensures the entire URL is on its own line */ src: url("/fonts/Montserrat-Regular.ttf") format("truetype");
width: 100%; /* Make sure the code element takes up the full width of its container */ font-weight: normal;
overflow-x: auto; font-style: normal;
} }
</style>
@font-face {
font-family: "Montserrat";
src: url("/fonts/Montserrat-SemiBold.ttf") format("truetype");
font-weight: 600;
font-style: normal;
}
@font-face {
font-family: "Poppins";
src: url("/fonts/Poppins-Light.ttf") format("truetype");
font-weight: 300;
font-style: normal;
}
@font-face {
font-family: "Poppins";
src: url("/fonts/Poppins-Medium.ttf") format("truetype");
font-weight: 500;
font-style: normal;
}
@font-face {
font-family: "Poppins";
src: url("/fonts/Poppins-Regular.ttf") format("truetype");
font-weight: normal;
font-style: normal;
}
* {
box-sizing: border-box;
margin: 0;
padding: 0;
}
html {
font-family: "Montserrat", system-ui, sans-serif;
background-color: #29233f;
}
html,
body {
min-height: 100%;
}
body {
height: 100vh;
font-family: "Montserrat", system-ui, sans-serif;
}
code {
font-family: Menlo, Monaco, Lucida Console, Liberation Mono,
DejaVu Sans Mono, Bitstream Vera Sans Mono, Courier New,
monospace;
}
nav {
font-family: "Montserrat", system-ui, sans-serif;
font-weight: 500;
}
nav ul a {
text-decoration: none;
}
a.preview {
text-decoration: none;
}
p code {
word-break: break-all; /* This will allow the URL to break at any character */
display: block; /* Ensures the entire URL is on its own line */
width: 100%; /* Make sure the code element takes up the full width of its container */
overflow-x: auto;
}
</style>
</body>
</html> </html>

View file

@ -73,7 +73,7 @@ const { frontmatter } = Astro.props;
} }
ul li a { ul li a {
@apply underline underline-offset-2 hover:text-blue-400; @apply underline underline-offset-2 decoration-1 hover:text-blue-400;
} }
.hyperlink { .hyperlink {

View file

@ -21,11 +21,10 @@ import Layout from "../layouts/Layout.astro";
/> />
<h1 class="text-5xl font-bold">About</h1> <h1 class="text-5xl font-bold">About</h1>
<p class="mt-5 text-lg mb-5"> <p class="mt-5 text-lg mb-5">
Hello, I'm <span class="font-bold">Ryan</span>, a Hello, I'm <span class="font-bold">Ryan</span>, a computer
computer science student based in Malaysia. The science student based in Malaysia. The objective of this
objective of this website is to offer valuable website is to offer valuable resources to aspiring
resources to aspiring streamers, helping them enhance streamers, helping them enhance their streaming experience!
their streaming experience!
</p> </p>
<p> <p>
If you want to learn more about me, check out my <a If you want to learn more about me, check out my <a
@ -51,9 +50,9 @@ import Layout from "../layouts/Layout.astro";
What are Coworking & Study streams? What are Coworking & Study streams?
</h2> </h2>
<p class="w-4/5 lg:w-1/2"> <p class="w-4/5 lg:w-1/2">
Coworking and study streams are a type of stream where Coworking and study streams are a type of stream where people
people work or study together. It's a great way to stay work or study together. It's a great way to stay motivated and
motivated and productive, especially if you're working! productive, especially if you're working!
</p> </p>
</div> </div>
<div <div
@ -63,10 +62,9 @@ import Layout from "../layouts/Layout.astro";
How can this guide benefit me? How can this guide benefit me?
</h2> </h2>
<p class="w-4/5 lg:w-1/2"> <p class="w-4/5 lg:w-1/2">
This guide has been created to help out new (and old) This guide has been created to help out coworking and study
coworking streamers! It contains a bunch of resources that streamers by providing tips and resources to enhance the
you can use to enhance your stream, such as interactive streaming experience!
overlays and useful bots.
</p> </p>
</div> </div>
<div <div
@ -76,9 +74,9 @@ import Layout from "../layouts/Layout.astro";
Why should I stream myself working? Why should I stream myself working?
</h2> </h2>
<p class="w-4/5 lg:w-1/2"> <p class="w-4/5 lg:w-1/2">
Streaming yourself working is a great way to stay Streaming yourself working is a great way to stay accountable
accountable and productive. It's also a great way to grow and productive. It's also a great way to grow your following and
your following and meet new people! meet new people!
</p> </p>
</div> </div>
</div> </div>

View file

@ -7,7 +7,7 @@ import Layout from "../layouts/Layout.astro";
description="A guide for new and existing coworking streamers!" description="A guide for new and existing coworking streamers!"
> >
<div <div
class="flex flex-col lg:flex-row justify-center items-center h-full text-gray-100 sm:flex-col" class="flex flex-col lg:flex-row justify-center items-center text-gray-100 sm:flex-col h-fit min-h-screen"
> >
<div <div
class="w-full lg:w-2/3 flex flex-col justify-center items-center mt-40 lg:mt-0 mb-10 lg:mb-0" class="w-full lg:w-2/3 flex flex-col justify-center items-center mt-40 lg:mt-0 mb-10 lg:mb-0"
@ -46,9 +46,7 @@ import Layout from "../layouts/Layout.astro";
<div <div
class="task-list-header text-2xl flex flex-row justify-between bg-gray-900 px-5 py-3 rounded-md z-10 border border-solid border-b-white" class="task-list-header text-2xl flex flex-row justify-between bg-gray-900 px-5 py-3 rounded-md z-10 border border-solid border-b-white"
> >
<div id="widget-title" class="font-bold"> <div id="widget-title" class="font-bold">!taskhelp</div>
!taskhelp
</div>
<div>1/65</div> <div>1/65</div>
</div> </div>
<div class="task-list-body px-1"> <div class="task-list-body px-1">
@ -61,9 +59,7 @@ import Layout from "../layouts/Layout.astro";
RyanPython RyanPython
</div> </div>
<div class="mr-1">:</div> <div class="mr-1">:</div>
<span class="line-through" <span class="line-through">build this website</span>
>build this website</span
>
</div> </div>
<div <div
class="flex flex-row justify-start items-start bg-gray-700 px-5 py-2 rounded-md mt-1" class="flex flex-row justify-start items-start bg-gray-700 px-5 py-2 rounded-md mt-1"
@ -474,8 +470,7 @@ import Layout from "../layouts/Layout.astro";
</div> </div>
<div class="mr-1">:</div> <div class="mr-1">:</div>
<span class="max-w-[65%]" <span class="max-w-[65%]"
>work on the millionth AI project for >work on the millionth AI project for self.dev</span
self.dev</span
> >
</div> </div>
<div <div