ivabus/gui
1
0
Fork 0
mirror of https://github.com/ivabus/gui synced 2025-06-08 00:00:27 +03:00
Code Issues Projects Releases Packages Wiki Activity Actions

breakapart smart components being used in each route

Browse source
This commit is contained in:
neil 2022-11-25 20:03:57 +08:00
parent faac69d2fe
commit aa31033593
20 changed files with 140 additions and 53 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

5
packages/gui/src/components/Badges/Badges.svelte Normal file
View file

@ -0,0 +1,5 @@
<script lang="ts">
import "$appcss";
import Placeholder from "$components/Placeholder/Placeholder.svelte";
</script>
<Placeholder label="Badges"/>

5
packages/gui/src/components/BigBlackSpace/BigBlackSpace.svelte Normal file
View file

@ -0,0 +1,5 @@
<script lang="ts">
import "$appcss";
import Placeholder from "$components/Placeholder/Placeholder.svelte";
</script>
<Placeholder label="BigBlackSpace"/>

5
packages/gui/src/components/CliBanner/CliBanner.svelte Normal file
View file

@ -0,0 +1,5 @@
<script lang="ts">
import "$appcss";
import Placeholder from "$components/Placeholder/Placeholder.svelte";
</script>
<Placeholder label="CLI Hero"/>

5
packages/gui/src/components/EssentialWorkshops/EssentialWorkshops.svelte Normal file
View file

@ -0,0 +1,5 @@
<script lang="ts">
import "$appcss";
import Placeholder from "$components/Placeholder/Placeholder.svelte";
</script>
<Placeholder label="EssentialWorkshops"/>

5
packages/gui/src/components/FeaturedCourses/FeaturedCourses.svelte Normal file
View file

@ -0,0 +1,5 @@
<script lang="ts">
import "$appcss";
import Placeholder from "$components/Placeholder/Placeholder.svelte";
</script>
<Placeholder label="FeaturedCourses"/>

5
packages/gui/src/components/FeaturedPackages/FeaturedPackages.svelte Normal file
View file

@ -0,0 +1,5 @@
<script lang="ts">
import "$appcss";
import Placeholder from "$components/Placeholder/Placeholder.svelte";
</script>
<Placeholder label="FeaturedPackages"/>

5
packages/gui/src/components/GettingStarted/GettingStarted.svelte Normal file
View file

@ -0,0 +1,5 @@
<script lang="ts">
import "$appcss";
import Placeholder from "$components/Placeholder/Placeholder.svelte";
</script>
<Placeholder label="GettingStarted"/>

5
packages/gui/src/components/InstalledPackages/InstalledPackages.svelte Normal file
View file

@ -0,0 +1,5 @@
<script lang="ts">
import "$appcss";
import Placeholder from "$components/Placeholder/Placeholder.svelte";
</script>
<Placeholder label="InstalledPackages"/>

5
packages/gui/src/components/PackageBanner/PackageBanner.svelte Normal file
View file

@ -0,0 +1,5 @@
<script lang="ts">
import "$appcss";
import Placeholder from "$components/Placeholder/Placeholder.svelte";
</script>
<Placeholder label="PackageBanner"/>

6
packages/gui/src/components/PackageReviews/PackageReviews.svelte Normal file
View file

@ -0,0 +1,6 @@
<script lang="ts">
import "$appcss";
import Placeholder from "$components/Placeholder/Placeholder.svelte";
</script>
<Placeholder label="PackageReviews"/>

5
packages/gui/src/components/Preflight/Preflight.svelte Normal file
View file

@ -0,0 +1,5 @@
<script lang="ts">
import "$appcss";
import Placeholder from "$components/Placeholder/Placeholder.svelte";
</script>
<Placeholder label="Preflight"/>

5
packages/gui/src/components/ProfileBanner/ProfileBanner.svelte Normal file
View file

@ -0,0 +1,5 @@
<script lang="ts">
import "$appcss";
import Placeholder from "$components/Placeholder/Placeholder.svelte";
</script>
<Placeholder label="ProfileBanner"/>

31
packages/gui/src/components/SearchPackages/SearchPackages.svelte Normal file
View file

@ -0,0 +1,31 @@
<script>
import "$appcss";
import Placeholder from "$components/Placeholder/Placeholder.svelte";
</script>
<div class="bg-black border border-gray">
<section class="flex">
<h2>Filter Packages</h2>
<input type="search" class="text-white bg-black border border-gray"/>
</section>
<ul class="grid grid-cols-3 gap-8 mt-8">
<li>
<a href="/packages/pkg-a"><Placeholder label="Pkg A"></Placeholder></a>
</li>
<li>
<a href="/packages/pkg-b"><Placeholder label="Pkg B"></Placeholder></a>
</li>
<li>
<a href="/packages/pkg-c"><Placeholder label="Pkg C"></Placeholder></a>
</li>
<li>
<a href="/packages/pkg-a"><Placeholder label="Pkg D"></Placeholder></a>
</li>
<li>
<a href="/packages/pkg-b"><Placeholder label="Pkg E"></Placeholder></a>
</li>
<li>
<a href="/packages/pkg-c"><Placeholder label="Pkg F"></Placeholder></a>
</li>
</ul>
</div>

15
packages/gui/src/routes/+layout.svelte
View file

@ -11,7 +11,7 @@
});
</script>
<div>
<div id="main-layout">
<nav class="">
<NavBar/>
</nav>
@ -22,12 +22,14 @@
</header>
{/if}
<figure></figure>
<div>
<slot></slot>
</div>
</section>
</div>
<style>
div {
#main-layout {
width: 100vh;
height: 100vh;
}
@ -44,6 +46,7 @@
}
figure {
position: absolute;
z-index: 0;
top: 180px;
left: 0px;
right: 0px;
@ -58,4 +61,12 @@
height: 50px;
border-bottom: #CCC 1px solid;
}
slot {
z-index: 1;
}
div {
position: relative;
}
</style>

12
packages/gui/src/routes/+page.svelte
View file

@ -2,20 +2,20 @@
<script lang="ts">
import "$appcss";
import { backLink } from '$libs/stores';
import Placeholder from "$components/Placeholder/Placeholder.svelte";
import PageHeader from "$components/PageHeader/PageHeader.svelte";
import FeaturedPackages from "$components/FeaturedPackages/FeaturedPackages.svelte";
import GettingStarted from "$components/GettingStarted/GettingStarted.svelte";
backLink.set('');
</script>
<div>
<PageHeader>Discover</PageHeader>
<header>
<Placeholder label="featured packages"/>
</header>
<section>
<FeaturedPackages/>
</section>
<section class="mt-8">
<Placeholder label="Getting started with tea"/>
<GettingStarted/>
</section>
</div>

11
packages/gui/src/routes/cli/+page.svelte
View file

@ -1,7 +1,8 @@
<script>
import "$appcss";
import PageHeader from "$components/PageHeader/PageHeader.svelte";
import Placeholder from "$components/Placeholder/Placeholder.svelte";
import CliBanner from "$components/CliBanner/CliBanner.svelte";
import BigBlackSpace from "$components/BigBlackSpace/BigBlackSpace.svelte";
import { backLink } from '$libs/stores';
backLink.set('/');
</script>
@ -10,11 +11,11 @@
<div>
<PageHeader>INSTALL TEA</PageHeader>
<header>
<Placeholder label="big tea icon version with copy curl"/>
</header>
<section>
<CliBanner/>
</section>
<section class="mt-8">
<Placeholder label="big black blank space"/>
<BigBlackSpace/>
</section>
</div>

11
packages/gui/src/routes/documentation/+page.svelte
View file

@ -1,7 +1,8 @@
<script>
import "$appcss";
import PageHeader from "$components/PageHeader/PageHeader.svelte";
import Placeholder from "$components/Placeholder/Placeholder.svelte";
import FeaturedCourses from "$components/FeaturedCourses/FeaturedCourses.svelte";
import EssentialWorkshops from "$components/EssentialWorkshops/EssentialWorkshops.svelte";
import { backLink } from '$libs/stores';
backLink.set('/');
</script>
@ -10,11 +11,11 @@
<div>
<PageHeader>Documentation</PageHeader>
<header>
<Placeholder label="featured courses"/>
</header>
<section>
<FeaturedCourses/>
</section>
<section class="mt-8">
<Placeholder label="Essential workshops"/>
<EssentialWorkshops/>
</section>
</div>

26
packages/gui/src/routes/packages/+page.svelte
View file

@ -1,7 +1,7 @@
<script>
import "$appcss";
import PageHeader from "$components/PageHeader/PageHeader.svelte";
import Placeholder from "$components/Placeholder/Placeholder.svelte";
import SearchPackages from "$components/SearchPackages/SearchPackages.svelte";
import { backLink } from '$libs/stores';
backLink.set('/');
</script>
@ -9,27 +9,5 @@
<div>
<PageHeader>Packages</PageHeader>
<section>
<Placeholder label="filter packages"/>
</section>
<ul class="grid grid-cols-3 gap-8 mt-8">
<li>
<a href="/packages/pkg-a"><Placeholder label="Pkg A"></Placeholder></a>
</li>
<li>
<a href="/packages/pkg-b"><Placeholder label="Pkg B"></Placeholder></a>
</li>
<li>
<a href="/packages/pkg-c"><Placeholder label="Pkg C"></Placeholder></a>
</li>
<li>
<a href="/packages/pkg-a"><Placeholder label="Pkg D"></Placeholder></a>
</li>
<li>
<a href="/packages/pkg-b"><Placeholder label="Pkg E"></Placeholder></a>
</li>
<li>
<a href="/packages/pkg-c"><Placeholder label="Pkg F"></Placeholder></a>
</li>
</ul>
<SearchPackages/>
</div>

8
packages/gui/src/routes/packages/[slug]/+page.svelte
View file

@ -1,9 +1,9 @@
<script>
import "$appcss";
import PageHeader from "$components/PageHeader/PageHeader.svelte";
import Placeholder from "$components/Placeholder/Placeholder.svelte";
import { page } from '$app/stores';
import { backLink } from '$libs/stores';
import PackageBanner from '$components/PackageBanner/PackageBanner.svelte';
import PackageReviews from '$components/PackageReviews/PackageReviews.svelte';
backLink.set('/packages');
/** @type {import('./$types').PageData} */
@ -13,9 +13,9 @@
<div>
<PageHeader>{data.title}</PageHeader>
<section>
<Placeholder label="package cover w/ copy link" />
<PackageBanner/>
</section>
<section class="mt-8">
<Placeholder label="reviews" />
<PackageReviews/>
</section>
</div>

16
packages/gui/src/routes/profile/+page.svelte
View file

@ -2,6 +2,10 @@
import "$appcss";
import PageHeader from "$components/PageHeader/PageHeader.svelte";
import Placeholder from "$components/Placeholder/Placeholder.svelte";
import ProfileBanner from "$components/ProfileBanner/ProfileBanner.svelte";
import Preflight from "$components/Preflight/Preflight.svelte";
import Badges from "$components/Badges/Badges.svelte";
import InstalledPackages from "$components/InstalledPackages/InstalledPackages.svelte";
import { backLink } from '$libs/stores';
backLink.set('/');
</script>
@ -10,21 +14,21 @@
<div>
<PageHeader>PROFILE</PageHeader>
<header>
<Placeholder label="github username and wallet address"/>
</header>
<section>
<ProfileBanner/>
</section>
<section class="mt-8 grid grid-cols-2 gap-8">
<div>
<Placeholder label="pre-flight"/>
<Preflight/>
</div>
<div>
<Placeholder label="badges"/>
<Badges/>
</div>
</section>
<section class="mt-8">
<Placeholder label="my installs"/>
<InstalledPackages/>
</section>
</div>