#13 package page metas

This commit is contained in:
neil 2023-02-08 20:06:00 +08:00
parent f3169760d5
commit 6c490fd16c

View file

@ -1,41 +1,75 @@
<script lang="ts">
const data = {
last_modified: new Date(), // convert this to time ago
license: 'MIT',
byte_size: 22700000,
homepage_url: 'homepage.org',
documentation_url: 'https://docs.org',
repo_url: 'https://github.orm/owner/repo',
contributors: [
{
login: 'optimus_prime',
avatar_url: '',
owner: true
},
{
login: 'batman_suparman',
avatar_url: '',
owner: false
}
],
categories: [
{
name: 'utility'
},
{
name: 'design'
},
{
name: 'gaming'
}
]
};
</script>
<section class="bg-black"> <section class="bg-black">
<h1 class="border border-gray p-4 text-primary">METADATA</h1> <h1 class="border border-gray p-4 text-primary">METADATA</h1>
<ul class="border border-t-0 border-gray p-4"> <ul class="border border-t-0 border-gray p-4">
<li class="border border-gray p-4"> <li class="border border-gray p-4">
<i class="icon-calendar" /> <i class="icon-calendar" />
<span class="ml-4">4 months ago</span> <span class="ml-4">{data.last_modified}</span>
</li> </li>
<li class="border border-gray p-4"> <li class="border border-gray p-4">
<i class="icon-calendar" /> <i class="icon-calendar" />
<span class="ml-4">MIT or Apache-2.0</span> <span class="ml-4">{data.license}</span>
</li> </li>
<li class="border border-gray p-4"> <li class="border border-gray p-4">
<i class="icon-calendar" /> <i class="icon-calendar" />
<span class="ml-4">22.7 kB</span> <span class="ml-4">{data.byte_size}</span>
</li> </li>
</ul> </ul>
<h1 class="border border-t-0 border-gray p-4 text-primary">HOMEPAGE</h1> <h1 class="border border-t-0 border-gray p-4 text-primary">HOMEPAGE</h1>
<ul class="border border-t-0 border-gray p-4"> <ul class="border border-t-0 border-gray p-4">
<li class="border border-gray p-4"> <li class="border border-gray p-4">
<i class="icon-calendar" /> <i class="icon-calendar" />
<span class="ml-4">https://homepage.org</span> <span class="ml-4">{data.homepage_url}</span>
</li> </li>
</ul> </ul>
<h1 class="border border-t-0 border-gray p-4 text-primary">DOCUMENTATION</h1> <h1 class="border border-t-0 border-gray p-4 text-primary">DOCUMENTATION</h1>
<ul class="border border-t-0 border-gray p-4"> <ul class="border border-t-0 border-gray p-4">
<li class="border border-gray p-4"> <li class="border border-gray p-4">
<i class="icon-calendar" /> <i class="icon-calendar" />
<span class="ml-4">https://docs.org</span> <span class="ml-4">{data.documentation_url}</span>
</li> </li>
</ul> </ul>
<h1 class="border border-t-0 border-gray p-4 text-primary">GITHUB REPOSITORY</h1> <h1 class="border border-t-0 border-gray p-4 text-primary">GITHUB REPOSITORY</h1>
<ul class="border border-t-0 border-gray p-4"> <ul class="border border-t-0 border-gray p-4">
<li class="border border-gray p-4"> <li class="border border-gray p-4">
<i class="icon-calendar" /> <i class="icon-calendar" />
<span class="ml-4">https://github.orm/owner/repo</span> <span class="ml-4">{data.repo_url}</span>
</li> </li>
</ul> </ul>
<h1 class="border border-t-0 border-gray p-4 text-primary">OWNERS</h1> <h1 class="border border-t-0 border-gray p-4 text-primary">CONTRIBUTORS</h1>
<ul class="border border-t-0 border-gray p-4"> <ul class="border border-t-0 border-gray p-4">
<li class="flex items-center border border-gray p-4"> <li class="flex items-center border border-gray p-4">
<figure class="h-5 w-5 bg-gray" /> <figure class="h-5 w-5 bg-gray" />