92 lines
2.6 KiB
Plaintext
92 lines
2.6 KiB
Plaintext
---
|
|
import Code from 'astro/components/Code.astro'
|
|
|
|
import Confettis from '../widgets/ConfettiLauncher.astro'
|
|
|
|
import AstroLogo from '../assets/astro-icon.svg?raw'
|
|
import FlowbiteLogo from '../assets/flowbite-logo.svg?raw'
|
|
|
|
import * as readMe from '../../README.md'
|
|
import { SITE_TITLE } from '../app/constants.js'
|
|
---
|
|
|
|
<div
|
|
class="bg-gradient-to-r from-slate-100 to-slate-200 dark:from-slate-900 dark:to-slate-800 text-slate-800 dark:text-slate-100 mb-20 p-4 lg:p-16 shadow-xl shadow-slate-200 dark:shadow-slate-900"
|
|
>
|
|
<header
|
|
class="p-8 flex justify-center items-center flex-wrap flex-col w-full mt-16"
|
|
>
|
|
<div class="flex justify-center w-full">
|
|
<div
|
|
set:html={AstroLogo}
|
|
class="svg-inline w-16 h-16 text-violet-700 dark:text-violet-100"
|
|
/>
|
|
</div>
|
|
|
|
<div class="format dark:format-invert lg:format-lg mt-32">
|
|
<p
|
|
class="text-4xl lg:text-8xl dark:text-slate-200 text-slate-600 leading-tight"
|
|
>
|
|
Hello <a
|
|
rel="noopener nofollow"
|
|
href="https://astro.build"
|
|
class="font-bold text-transparent bg-clip-text bg-gradient-to-br from-pink-400 to-violet-800 dark:from-pink-300 dark:to-violet-700 no-underline"
|
|
>Astro</a
|
|
>…
|
|
<br />meet <a
|
|
rel="noopener nofollow"
|
|
href="https://flowbite.com"
|
|
class="font-bold text-blue-600 dark:text-blue-500 no-underline"
|
|
>Flowbite</a
|
|
>!
|
|
</p>
|
|
|
|
<div class="flex justify-center w-full">
|
|
<Confettis>
|
|
<button
|
|
type="button"
|
|
class="text-blue-800 hover:text-white border border-blue-700 hover:bg-blue-700 focus:ring-4 focus:outline-none focus:ring-blue-300 font-medium rounded-lg text-sm px-5 py-2.5 text-center mr-2 mb-2 dark:border-blue-500 dark:text-blue-100 dark:hover:text-white dark:hover:bg-blue-600 dark:focus:ring-blue-800"
|
|
>Click me!</button
|
|
>
|
|
</Confettis>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="flex justify-center w-full my-16">
|
|
<div set:html={FlowbiteLogo} class="svg-inline w-16 h-16" />
|
|
</div>
|
|
</header>
|
|
|
|
<section class="flex justify-center w-full pb-24">
|
|
<div class="w-full format dark:format-invert">
|
|
<Code
|
|
lang={'powershell' /* Looks cool */}
|
|
code={`git clone \\
|
|
https://github.com/themesberg/flowbite-astro-admin-dashboard.git`}
|
|
/>
|
|
</div>
|
|
</section>
|
|
|
|
<article class="flex justify-center pt-32 pb-32">
|
|
<div class="w-full readme format dark:format-invert lg:format-lg">
|
|
<h1 class="text-center">
|
|
<!-- {readMe.getHeadings()[0].text} -->
|
|
{SITE_TITLE}
|
|
</h1>
|
|
<readMe.Content />
|
|
</div>
|
|
</article>
|
|
</div>
|
|
|
|
<style>
|
|
/* Override in Markdown H1 title */
|
|
.readme :global(h1:nth-of-type(2)) {
|
|
display: none;
|
|
}
|
|
|
|
.svg-inline :global(svg) {
|
|
height: 100%;
|
|
width: 100%;
|
|
}
|
|
</style>
|