RevelaNetwork/Revelav3
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Style package page better

Browse source
This commit is contained in:
rift 2024-08-14 23:17:51 -05:00
parent 607adcf737
commit 088071fa38
1 changed files with 8 additions and 8 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

16
src/pages/assets/[...package_name].astro
View file

@ -9,7 +9,7 @@ const assets_json = await response.json();
<Layout title="Package"> <Layout title="Package">
<div <div
class="flex flex-wrap mt-16 w-full fixed inset-0 h-[calc(100%-4rem)] z-0 bg-primary flex-col items-center" class="flex flex-wrap mt-16 w-full fixed inset-0 h-[calc(100%-4rem)] z-0 bg-primary flex-col items-center content-center justify-center pb-64 roboto"
> >
{ {
assets_json.error ? ( assets_json.error ? (
@ -17,13 +17,13 @@ const assets_json = await response.json();
Unexpected error. Are you sure you typed the name right? Unexpected error. Are you sure you typed the name right?
</h1> </h1>
) : ( ) : (
<div class="flex flex-row items-center text-text-color"> <div class="flex flex-row items-center text-text-color bg-navbar-color rounded-2xl">
{assets_json.background_video ? ( {assets_json.background_video ? (
// Background video // Background video
<video <video
src={`/videos/${assets_json.background_video}`} src={`/videos/${assets_json.background_video}`}
controls controls
class="w-96 h-72 object-cover rounded-xl" class="w-[44rem] h-[25rem] object-cover rounded-xl"
> >
Your browser does not support the video tag. Your browser does not support the video tag.
</video> </video>
@ -33,25 +33,25 @@ const assets_json = await response.json();
style={{ style={{
backgroundImage: `url(/images/${assets_json.backgroundImage})`, backgroundImage: `url(/images/${assets_json.backgroundImage})`,
}} }}
class="w-96 h-72 bg-cover bg-center rounded-xl" class="w-[44rem] h-[25rem] bg-cover bg-center rounded-xl"
/> />
) : ( ) : (
// Fallback to cover image // Fallback to cover image
<img <img
src={`/images/${assets_json.image}`} src={`/images/${assets_json.image}`}
alt={assets_json.title} alt={assets_json.title}
class="w-96 h-72 object-cover rounded-xl" class="w-[44rem] h-[25rem] object-cover rounded-xl"
/> />
)} )}
<div class="flex flex-col ml-7"> <div class="flex flex-col ml-7 p-16">
<div class="text-xl">{assets_json.type}</div> <div class="text-xl">{assets_json.type}</div>
<div class="text-3xl">{assets_json.title}</div> <div class="text-4xl roboto font-semibold">{assets_json.title}</div>
<div class="text-xl"> <div class="text-xl">
By <strong>{assets_json.author}</strong> By <strong>{assets_json.author}</strong>
</div> </div>
<div class="text-xl">{assets_json.description}</div> <div class="text-xl">{assets_json.description}</div>
<button <button
class="border-text-color border-2 rounded-lg w-40" class="bg-primary text-text-color border border-transparent rounded-lg px-6 py-3 hover:bg-navbar-color transition-colors duration-300 mt-9"
id="install" id="install"
> >
Install Install