rhpidfyre.io/wunix.rhpidfyre.io
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

astro setup for react is ready

Browse Source
This commit is contained in:
rhpidfyre
2025-02-02 03:04:26 -05:00
parent f5f335ff33
commit f0a9566c24
3 changed files with 22 additions and 6 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
src/components/header.astro
View File

@ -6,7 +6,7 @@ import { Links } from '../ts/links';
<header> <header>
<Button href={Links.Self} display="[rhpidfyre.io]" color="black"/> <Button href={Links.Self} display="[rhpidfyre.io]" color="black"/>
<section> <section>
<Button href={Links.Git} display="REPOS"/> <Button href={Links.Git} display="GIT"/>
<Button href={Links.Cloud} display="CLOUD"/> <Button href={Links.Cloud} display="CLOUD"/>
<Button href={Links.Gsm} display="GSM"/> <Button href={Links.Gsm} display="GSM"/>
</section> </section>

1
src/layouts/Webpage.astro
View File

@ -32,6 +32,7 @@ const {title} = Astro.props
font-size: 15px; font-size: 15px;
letter-spacing: 2px; letter-spacing: 2px;
cursor: text; cursor: text;
text-wrap: nowrap;
} }
:root { :root {
color-scheme: dark; color-scheme: dark;

25
src/pages/index.astro
View File

@ -1,6 +1,7 @@
--- ---
import Webpage from '../layouts/Webpage.astro'; import Webpage from '../layouts/Webpage.astro';
import { Links } from '../ts/links'; import { Links } from '../ts/links';
import Shell from '../components/react/shell';
--- ---
<Webpage title="Home"> <Webpage title="Home">
@ -22,19 +23,23 @@ import { Links } from '../ts/links';
<p><span class="red">But, you will not be limited at exploring my services which you can find by navigating towards the top-right.</span></p> <p><span class="red">But, you will not be limited at exploring my services which you can find by navigating towards the top-right.</span></p>
<p><span class="red">=================================================</span></p> <p><span class="red">=================================================</span></p>
</noscript> </noscript>
<Shell client:only/>
</main> </main>
</Webpage> </Webpage>
<style lang="scss"> <style lang="scss" is:global>
@use "../scss/variables"; @use "../scss/variables";
@mixin text-styles { @mixin text-styles {
.red { color: rgb(200,0,0); } .red { color: rgb(200, 0, 0); }
.green { color: rgb(0,200,0); } .green { color: rgb(0, 200, 0); }
.blue { color: rgb(0,0,200); } .blue { color: rgb(0, 0, 200); }
.cyan { color: rgb(18,167,148); }
} }
:global(main) { .shell-prompt { display: flex; }
main {
width: 100vw; width: 100vw;
height: calc(99.3vh - variables.$header-Y - variables.$footer-Y); height: calc(99.3vh - variables.$header-Y - variables.$footer-Y);
padding: 5px; padding: 5px;
@ -49,9 +54,19 @@ import { Links } from '../ts/links';
font-size: inherit; font-size: inherit;
&:hover { text-decoration: underline; } &:hover { text-decoration: underline; }
} }
span { font-size: inherit }
} }
.return { .return {
margin-top: 25px; margin-top: 25px;
} }
} }
input {
font-size: 1.2rem;
background-color: transparent;
border: 0;
outline: 0;
width: 90%;
/* Pester me when this gets undrafted */
caret-shape: block;
}
</style> </style>