Merge pull request #6 from onwidget/develop
Smooth scroll, canonical, astro-icons ...
This commit is contained in:
prototypa
GitHub
@ -44,7 +44,6 @@ Inside AstroWind template, you'll see the following folders and files:
|
|||||||
| | └── ...
|
| | └── ...
|
||||||
│ ├── components/
|
│ ├── components/
|
||||||
│ │ ├── core/
|
│ │ ├── core/
|
||||||
| | ├── icons/
|
|
||||||
| | └── widgets/
|
| | └── widgets/
|
||||||
| | ├── Header.astro
|
| | ├── Header.astro
|
||||||
| | ├── Footer.astro
|
| | ├── Footer.astro
|
||||||
|
|||||||
@ -1,7 +1,7 @@
|
|||||||
{
|
{
|
||||||
"name": "@onwidget/astrowind",
|
"name": "@onwidget/astrowind",
|
||||||
"description": "A template to make your website using Astro + Tailwind CSS.",
|
"description": "A template to make your website using Astro + Tailwind CSS.",
|
||||||
"version": "0.1.3",
|
"version": "0.1.5",
|
||||||
"private": true,
|
"private": true,
|
||||||
"scripts": {
|
"scripts": {
|
||||||
"dev": "astro dev",
|
"dev": "astro dev",
|
||||||
@ -17,6 +17,7 @@
|
|||||||
"@astrojs/tailwind": "^1.0.0",
|
"@astrojs/tailwind": "^1.0.0",
|
||||||
"@tailwindcss/typography": "^0.5.4",
|
"@tailwindcss/typography": "^0.5.4",
|
||||||
"astro": "^1.0.0",
|
"astro": "^1.0.0",
|
||||||
|
"astro-icon": "^0.7.3",
|
||||||
"prettier": "^2.7.1",
|
"prettier": "^2.7.1",
|
||||||
"prettier-plugin-astro": "^0.5.0",
|
"prettier-plugin-astro": "^0.5.0",
|
||||||
"reading-time": "^1.5.0",
|
"reading-time": "^1.5.0",
|
||||||
|
|||||||
@ -6,4 +6,12 @@
|
|||||||
.btn {
|
.btn {
|
||||||
@apply inline-flex items-center justify-center rounded border border-transparent font-medium text-center text-base leading-snug transition py-3 px-6 shadow-lg ease-in duration-200 focus:ring-blue-500 focus:ring-offset-blue-200 focus:ring-2 focus:ring-offset-2;
|
@apply inline-flex items-center justify-center rounded border border-transparent font-medium text-center text-base leading-snug transition py-3 px-6 shadow-lg ease-in duration-200 focus:ring-blue-500 focus:ring-offset-blue-200 focus:ring-2 focus:ring-offset-2;
|
||||||
}
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
[astro-icon] > * {
|
||||||
|
stroke-width: 1.5;
|
||||||
|
}
|
||||||
|
|
||||||
|
[astro-icon].icon-bold > * {
|
||||||
|
stroke-width: 2;
|
||||||
}
|
}
|
||||||
@ -1,20 +0,0 @@
|
|||||||
---
|
|
||||||
const { class: className = "w-5 h-5" } = Astro.props;
|
|
||||||
---
|
|
||||||
|
|
||||||
<svg
|
|
||||||
xmlns="http://www.w3.org/2000/svg"
|
|
||||||
class={className}
|
|
||||||
width="24"
|
|
||||||
height="24"
|
|
||||||
viewBox="0 0 24 24"
|
|
||||||
stroke-width="1.75"
|
|
||||||
stroke="currentColor"
|
|
||||||
fill="none"
|
|
||||||
stroke-linecap="round"
|
|
||||||
stroke-linejoin="round"
|
|
||||||
>
|
|
||||||
<path stroke="none" d="M0 0h24v24H0z" fill="none"></path>
|
|
||||||
<line x1="7" y1="7" x2="17" y2="17"></line>
|
|
||||||
<polyline points="17 8 17 17 8 17"></polyline>
|
|
||||||
</svg>
|
|
||||||
@ -1,21 +0,0 @@
|
|||||||
---
|
|
||||||
const { class: className = "w-5 h-5" } = Astro.props;
|
|
||||||
---
|
|
||||||
|
|
||||||
<svg
|
|
||||||
xmlns="http://www.w3.org/2000/svg"
|
|
||||||
class={className}
|
|
||||||
width="24"
|
|
||||||
height="24"
|
|
||||||
viewBox="0 0 24 24"
|
|
||||||
stroke-width="1.75"
|
|
||||||
stroke="currentColor"
|
|
||||||
fill="none"
|
|
||||||
stroke-linecap="round"
|
|
||||||
stroke-linejoin="round"
|
|
||||||
>
|
|
||||||
<path stroke="none" d="M0 0h24v24H0z" fill="none"></path>
|
|
||||||
<line x1="5" y1="12" x2="19" y2="12"></line>
|
|
||||||
<line x1="13" y1="18" x2="19" y2="12"></line>
|
|
||||||
<line x1="13" y1="6" x2="19" y2="12"></line>
|
|
||||||
</svg>
|
|
||||||
@ -1,21 +0,0 @@
|
|||||||
---
|
|
||||||
const { class: className = "w-5 h-5" } = Astro.props;
|
|
||||||
---
|
|
||||||
|
|
||||||
<svg
|
|
||||||
xmlns="http://www.w3.org/2000/svg"
|
|
||||||
class={className}
|
|
||||||
width="24"
|
|
||||||
height="24"
|
|
||||||
viewBox="0 0 24 24"
|
|
||||||
stroke-width="1.75"
|
|
||||||
stroke="currentColor"
|
|
||||||
fill="none"
|
|
||||||
stroke-linecap="round"
|
|
||||||
stroke-linejoin="round"
|
|
||||||
>
|
|
||||||
<path stroke="none" d="M0 0h24v24H0z" fill="none"></path>
|
|
||||||
<path
|
|
||||||
d="M7 10v4h3v7h4v-7h3l1 -4h-4v-2a1 1 0 0 1 1 -1h3v-4h-3a5 5 0 0 0 -5 5v2h-3"
|
|
||||||
></path>
|
|
||||||
</svg>
|
|
||||||
@ -1,22 +0,0 @@
|
|||||||
---
|
|
||||||
const { class: className = "w-5 h-5" } = Astro.props;
|
|
||||||
---
|
|
||||||
|
|
||||||
<svg
|
|
||||||
xmlns="http://www.w3.org/2000/svg"
|
|
||||||
class={className}
|
|
||||||
width="24"
|
|
||||||
height="24"
|
|
||||||
viewBox="0 0 24 24"
|
|
||||||
stroke-width="1.75"
|
|
||||||
stroke="currentColor"
|
|
||||||
fill="none"
|
|
||||||
stroke-linecap="round"
|
|
||||||
stroke-linejoin="round"
|
|
||||||
>
|
|
||||||
<path stroke="none" d="M0 0h24v24H0z" fill="none"></path>
|
|
||||||
<path
|
|
||||||
d="M9 19c-4.3 1.4 -4.3 -2.5 -6 -3m12 5v-3.5c0 -1 .1 -1.4 -.5 -2c2.8 -.3 5.5 -1.4 5.5 -6a4.6 4.6 0 0 0 -1.3 -3.2a4.2 4.2 0 0 0 -.1 -3.2s-1.1 -.3 -3.5 1.3a12.3 12.3 0 0 0 -6.2 0c-2.4 -1.6 -3.5 -1.3 -3.5 -1.3a4.2 4.2 0 0 0 -.1 3.2a4.6 4.6 0 0 0 -1.3 3.2c0 4.6 2.7 5.7 5.5 6c-.6 .6 -.6 1.2 -.5 2v3.5"
|
|
||||||
>
|
|
||||||
</path>
|
|
||||||
</svg>
|
|
||||||
@ -1,21 +0,0 @@
|
|||||||
---
|
|
||||||
const { class: className = "w-5 h-5" } = Astro.props;
|
|
||||||
---
|
|
||||||
|
|
||||||
<svg
|
|
||||||
xmlns="http://www.w3.org/2000/svg"
|
|
||||||
class={className}
|
|
||||||
width="24"
|
|
||||||
height="24"
|
|
||||||
viewBox="0 0 24 24"
|
|
||||||
stroke-width="1.75"
|
|
||||||
stroke="currentColor"
|
|
||||||
fill="none"
|
|
||||||
stroke-linecap="round"
|
|
||||||
stroke-linejoin="round"
|
|
||||||
>
|
|
||||||
<path stroke="none" d="M0 0h24v24H0z" fill="none"></path>
|
|
||||||
<rect x="4" y="4" width="16" height="16" rx="4"></rect>
|
|
||||||
<circle cx="12" cy="12" r="3"></circle>
|
|
||||||
<line x1="16.5" y1="7.5" x2="16.5" y2="7.501"></line>
|
|
||||||
</svg>
|
|
||||||
@ -1,20 +0,0 @@
|
|||||||
---
|
|
||||||
const { class: className = "w-5 h-5" } = Astro.props;
|
|
||||||
---
|
|
||||||
|
|
||||||
<svg
|
|
||||||
xmlns="http://www.w3.org/2000/svg"
|
|
||||||
class={className}
|
|
||||||
width="24"
|
|
||||||
height="24"
|
|
||||||
viewBox="0 0 24 24"
|
|
||||||
stroke-width="1.75"
|
|
||||||
stroke="currentColor"
|
|
||||||
fill="none"
|
|
||||||
stroke-linecap="round"
|
|
||||||
stroke-linejoin="round"
|
|
||||||
>
|
|
||||||
<path stroke="none" d="M0 0h24v24H0z" fill="none"></path>
|
|
||||||
<line class="line1 transition" x1="4" y1="8" x2="20" y2="8"></line>
|
|
||||||
<line class="line2 transition" x1="4" y1="16" x2="20" y2="16"></line>
|
|
||||||
</svg>
|
|
||||||
@ -1,21 +0,0 @@
|
|||||||
---
|
|
||||||
const { class: className = "w-5 h-5" } = Astro.props;
|
|
||||||
---
|
|
||||||
|
|
||||||
<svg
|
|
||||||
xmlns="http://www.w3.org/2000/svg"
|
|
||||||
class={className}
|
|
||||||
width="24"
|
|
||||||
height="24"
|
|
||||||
viewBox="0 0 24 24"
|
|
||||||
stroke-width="1.5"
|
|
||||||
stroke="currentColor"
|
|
||||||
fill="none"
|
|
||||||
stroke-linecap="round"
|
|
||||||
stroke-linejoin="round"
|
|
||||||
>
|
|
||||||
<path stroke="none" d="M0 0h24v24H0z" fill="none"></path>
|
|
||||||
<circle cx="5" cy="19" r="1"></circle>
|
|
||||||
<path d="M4 4a16 16 0 0 1 16 16"></path>
|
|
||||||
<path d="M4 11a9 9 0 0 1 9 9"></path>
|
|
||||||
</svg>
|
|
||||||
@ -1,22 +0,0 @@
|
|||||||
---
|
|
||||||
const { class: className = "w-5 h-5" } = Astro.props;
|
|
||||||
---
|
|
||||||
|
|
||||||
<svg
|
|
||||||
xmlns="http://www.w3.org/2000/svg"
|
|
||||||
class={className}
|
|
||||||
width="24"
|
|
||||||
height="24"
|
|
||||||
viewBox="0 0 24 24"
|
|
||||||
stroke-width="1.75"
|
|
||||||
stroke="currentColor"
|
|
||||||
fill="none"
|
|
||||||
stroke-linecap="round"
|
|
||||||
stroke-linejoin="round"
|
|
||||||
>
|
|
||||||
<path stroke="none" d="M0 0h24v24H0z" fill="none"></path>
|
|
||||||
<circle cx="12" cy="12" r="4"></circle>
|
|
||||||
<path
|
|
||||||
d="M3 12h1m8 -9v1m8 8h1m-9 8v1m-6.4 -15.4l.7 .7m12.1 -.7l-.7 .7m0 11.4l.7 .7m-12.1 -.7l-.7 .7"
|
|
||||||
></path>
|
|
||||||
</svg>
|
|
||||||
@ -1,22 +0,0 @@
|
|||||||
---
|
|
||||||
const { class: className = "w-5 h-5" } = Astro.props;
|
|
||||||
---
|
|
||||||
|
|
||||||
<svg
|
|
||||||
xmlns="http://www.w3.org/2000/svg"
|
|
||||||
class={className}
|
|
||||||
width="24"
|
|
||||||
height="24"
|
|
||||||
viewBox="0 0 24 24"
|
|
||||||
stroke-width="1.75"
|
|
||||||
stroke="currentColor"
|
|
||||||
fill="none"
|
|
||||||
stroke-linecap="round"
|
|
||||||
stroke-linejoin="round"
|
|
||||||
>
|
|
||||||
<path stroke="none" d="M0 0h24v24H0z" fill="none"></path>
|
|
||||||
<path
|
|
||||||
d="M22 4.01c-1 .49 -1.98 .689 -3 .99c-1.121 -1.265 -2.783 -1.335 -4.38 -.737s-2.643 2.06 -2.62 3.737v1c-3.245 .083 -6.135 -1.395 -8 -4c0 0 -4.182 7.433 4 11c-1.872 1.247 -3.739 2.088 -6 2c3.308 1.803 6.913 2.423 10.034 1.517c3.58 -1.04 6.522 -3.723 7.651 -7.742a13.84 13.84 0 0 0 .497 -3.753c-.002 -.249 1.51 -2.772 1.818 -4.013z"
|
|
||||||
>
|
|
||||||
</path>
|
|
||||||
</svg>
|
|
||||||
@ -1,21 +0,0 @@
|
|||||||
import IconSun from "./IconSun.astro";
|
|
||||||
import IconGithub from "./IconGithub.astro";
|
|
||||||
import IconTwitter from "./IconTwitter.astro";
|
|
||||||
import IconFacebook from "./IconFacebook.astro";
|
|
||||||
import IconInstagram from "./IconInstagram.astro";
|
|
||||||
import IconArrowRight from "./IconArrowRight.astro";
|
|
||||||
import IconMenu from "./IconMenu.astro";
|
|
||||||
import IconArrowDownRight from "./IconArrowDownRight.astro";
|
|
||||||
import IconRSS from "./IconRSS.astro";
|
|
||||||
|
|
||||||
export {
|
|
||||||
IconSun,
|
|
||||||
IconGithub,
|
|
||||||
IconTwitter,
|
|
||||||
IconFacebook,
|
|
||||||
IconInstagram,
|
|
||||||
IconArrowRight,
|
|
||||||
IconMenu,
|
|
||||||
IconArrowDownRight,
|
|
||||||
IconRSS,
|
|
||||||
};
|
|
||||||
@ -1,5 +1,5 @@
|
|||||||
---
|
---
|
||||||
import { IconArrowDownRight } from "~/components/icons";
|
import { Icon } from "astro-icon";
|
||||||
const {} = Astro.props;
|
const {} = Astro.props;
|
||||||
---
|
---
|
||||||
|
|
||||||
@ -18,7 +18,10 @@ const {} = Astro.props;
|
|||||||
<div class="space-y-8">
|
<div class="space-y-8">
|
||||||
<div>
|
<div>
|
||||||
<p class="mb-4 text-xl font-bold">
|
<p class="mb-4 text-xl font-bold">
|
||||||
<IconArrowDownRight class="w-7 h-7 text-blue-500 inline-block" />
|
<Icon
|
||||||
|
name="tabler:arrow-down-right"
|
||||||
|
class="w-7 h-7 text-blue-500 inline-block icon-bold"
|
||||||
|
/>
|
||||||
What do I need to start?
|
What do I need to start?
|
||||||
</p>
|
</p>
|
||||||
<p class="text-gray-700 dark:text-gray-400 mb-2">
|
<p class="text-gray-700 dark:text-gray-400 mb-2">
|
||||||
@ -32,7 +35,10 @@ const {} = Astro.props;
|
|||||||
</div>
|
</div>
|
||||||
<div>
|
<div>
|
||||||
<p class="mb-4 text-xl font-bold">
|
<p class="mb-4 text-xl font-bold">
|
||||||
<IconArrowDownRight class="w-7 h-7 text-blue-500 inline-block" />
|
<Icon
|
||||||
|
name="tabler:arrow-down-right"
|
||||||
|
class="w-7 h-7 text-blue-500 inline-block icon-bold"
|
||||||
|
/>
|
||||||
How to install the Astro + Tailwind CSS template?
|
How to install the Astro + Tailwind CSS template?
|
||||||
</p>
|
</p>
|
||||||
<p class="text-gray-700 dark:text-gray-400 mb-2">
|
<p class="text-gray-700 dark:text-gray-400 mb-2">
|
||||||
@ -49,7 +55,10 @@ const {} = Astro.props;
|
|||||||
</div>
|
</div>
|
||||||
<div>
|
<div>
|
||||||
<p class="mb-4 text-xl font-bold">
|
<p class="mb-4 text-xl font-bold">
|
||||||
<IconArrowDownRight class="w-7 h-7 text-blue-500 inline-block" />
|
<Icon
|
||||||
|
name="tabler:arrow-down-right"
|
||||||
|
class="w-7 h-7 text-blue-500 inline-block icon-bold"
|
||||||
|
/>
|
||||||
What's something that you completely don't understand?
|
What's something that you completely don't understand?
|
||||||
</p>
|
</p>
|
||||||
<p class="text-gray-700 dark:text-gray-400 mb-2">
|
<p class="text-gray-700 dark:text-gray-400 mb-2">
|
||||||
@ -62,7 +71,10 @@ const {} = Astro.props;
|
|||||||
<div class="space-y-8">
|
<div class="space-y-8">
|
||||||
<div>
|
<div>
|
||||||
<p class="mb-4 text-xl font-bold">
|
<p class="mb-4 text-xl font-bold">
|
||||||
<IconArrowDownRight class="w-7 h-7 text-blue-500 inline-block" />
|
<Icon
|
||||||
|
name="tabler:arrow-down-right"
|
||||||
|
class="w-7 h-7 text-blue-500 inline-block icon-bold"
|
||||||
|
/>
|
||||||
What's an example of when you changed your mind?
|
What's an example of when you changed your mind?
|
||||||
</p>
|
</p>
|
||||||
<p class="text-gray-700 dark:text-gray-400 mb-2">
|
<p class="text-gray-700 dark:text-gray-400 mb-2">
|
||||||
@ -74,7 +86,10 @@ const {} = Astro.props;
|
|||||||
</div>
|
</div>
|
||||||
<div>
|
<div>
|
||||||
<p class="mb-4 text-xl font-bold">
|
<p class="mb-4 text-xl font-bold">
|
||||||
<IconArrowDownRight class="w-7 h-7 text-blue-500 inline-block" />
|
<Icon
|
||||||
|
name="tabler:arrow-down-right"
|
||||||
|
class="w-7 h-7 text-blue-500 inline-block icon-bold"
|
||||||
|
/>
|
||||||
What is something that you would really like to try again?
|
What is something that you would really like to try again?
|
||||||
</p>
|
</p>
|
||||||
<p class="text-gray-700 dark:text-gray-400 mb-2">
|
<p class="text-gray-700 dark:text-gray-400 mb-2">
|
||||||
@ -88,7 +103,10 @@ const {} = Astro.props;
|
|||||||
</div>
|
</div>
|
||||||
<div>
|
<div>
|
||||||
<p class="mb-4 text-xl font-bold">
|
<p class="mb-4 text-xl font-bold">
|
||||||
<IconArrowDownRight class="w-7 h-7 text-blue-500 inline-block" />
|
<Icon
|
||||||
|
name="tabler:arrow-down-right"
|
||||||
|
class="w-7 h-7 text-blue-500 inline-block icon-bold"
|
||||||
|
/>
|
||||||
If you could only ask one question to each person you meet, what would
|
If you could only ask one question to each person you meet, what would
|
||||||
that question be?
|
that question be?
|
||||||
</p>
|
</p>
|
||||||
|
|||||||
@ -1,145 +1,111 @@
|
|||||||
---
|
---
|
||||||
|
import { Icon } from "astro-icon";
|
||||||
const {} = Astro.props;
|
const {} = Astro.props;
|
||||||
---
|
---
|
||||||
|
|
||||||
<section class="relative">
|
<section class="relative">
|
||||||
<div class="absolute inset-0 bg-blue-50 dark:bg-slate-800 pointer-events-none mb-32" aria-hidden="true"></div>
|
<div
|
||||||
|
class="absolute inset-0 bg-blue-50 dark:bg-slate-800 pointer-events-none mb-32"
|
||||||
|
aria-hidden="true"
|
||||||
|
>
|
||||||
|
</div>
|
||||||
<div class="relative max-w-6xl mx-auto px-4 sm:px-6">
|
<div class="relative max-w-6xl mx-auto px-4 sm:px-6">
|
||||||
<div class="py-4 pt-8 sm:py-6 lg:py-8 lg:pt-12">
|
<div class="py-4 pt-8 sm:py-6 lg:py-8 lg:pt-12">
|
||||||
<div class="mb-8 text-center">
|
<div class="mb-8 text-center">
|
||||||
<p class="text-base text-blue-600 dark:text-blue-200 font-semibold tracking-wide uppercase">Components</p>
|
<p
|
||||||
<h2 class="text-4xl md:text-5xl font-bold leading-tighter tracking-tighter mb-4">Most used widgets</h2>
|
class="text-base text-blue-600 dark:text-blue-200 font-semibold tracking-wide uppercase"
|
||||||
<p class="max-w-3xl mx-auto text-center text-xl text-gray-600 dark:text-slate-400">
|
>
|
||||||
Provides frequently used components for building websites using Tailwind CSS
|
Components
|
||||||
|
</p>
|
||||||
|
<h2
|
||||||
|
class="text-4xl md:text-5xl font-bold leading-tighter tracking-tighter mb-4"
|
||||||
|
>
|
||||||
|
Most used widgets
|
||||||
|
</h2>
|
||||||
|
<p
|
||||||
|
class="max-w-3xl mx-auto text-center text-xl text-gray-600 dark:text-slate-400"
|
||||||
|
>
|
||||||
|
Provides frequently used components for building websites using
|
||||||
|
Tailwind CSS
|
||||||
</p>
|
</p>
|
||||||
</div>
|
</div>
|
||||||
<div class="grid gap-6 md:grid-cols-2 lg:grid-cols-3 items-start my-12 dark:text-white">
|
<div
|
||||||
|
class="grid gap-6 md:grid-cols-2 lg:grid-cols-3 items-start my-12 dark:text-white"
|
||||||
|
>
|
||||||
<div
|
<div
|
||||||
class="relative flex flex-col p-6 bg-white dark:bg-slate-900 rounded shadow-xl hover:shadow-lg transition dark:border dark:border-slate-800"
|
class="relative flex flex-col p-6 bg-white dark:bg-slate-900 rounded shadow-xl hover:shadow-lg transition dark:border dark:border-slate-800"
|
||||||
>
|
>
|
||||||
<div class="flex items-center mb-4">
|
<div class="flex items-center mb-4">
|
||||||
<svg class="w-12 h-12 p-1" viewBox="0 0 64 64" xmlns="http://www.w3.org/2000/svg">
|
<Icon name="flat-color-icons:home" class="w-12 h-12" />
|
||||||
<g fill="none" fill-rule="evenodd">
|
|
||||||
<rect class="fill-current text-blue-600" width="64" height="64" rx="32"></rect>
|
|
||||||
<g stroke-linecap="square" stroke-width="2">
|
|
||||||
<path class="stroke-current text-white" d="M20.571 20.571h13.714v17.143H20.571z"></path>
|
|
||||||
<path class="stroke-current text-blue-300" d="M38.858 26.993l6.397 1.73-4.473 16.549-13.24-3.58">
|
|
||||||
</path>
|
|
||||||
</g>
|
|
||||||
</g>
|
|
||||||
</svg>
|
|
||||||
<div class="ml-4 text-xl font-bold">Headers</div>
|
<div class="ml-4 text-xl font-bold">Headers</div>
|
||||||
</div>
|
</div>
|
||||||
<p class="text-gray-500 dark:text-gray-400 text-md">
|
<p class="text-gray-500 dark:text-gray-400 text-md">
|
||||||
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et
|
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do
|
||||||
dolore.
|
eiusmod tempor incididunt ut labore et dolore.
|
||||||
</p>
|
</p>
|
||||||
</div>
|
</div>
|
||||||
<div
|
<div
|
||||||
class="relative flex flex-col p-6 bg-white dark:bg-slate-900 rounded shadow-xl hover:shadow-lg transition dark:border dark:border-slate-800"
|
class="relative flex flex-col p-6 bg-white dark:bg-slate-900 rounded shadow-xl hover:shadow-lg transition dark:border dark:border-slate-800"
|
||||||
>
|
>
|
||||||
<div class="flex items-center mb-4">
|
<div class="flex items-center mb-4">
|
||||||
<svg class="w-12 h-12 p-1" viewBox="0 0 64 64" xmlns="http://www.w3.org/2000/svg">
|
<Icon name="flat-color-icons:faq" class="w-12 h-12" />
|
||||||
<g fill="none" fill-rule="evenodd">
|
|
||||||
<rect class="fill-current text-blue-600" width="64" height="64" rx="32"></rect>
|
|
||||||
<g stroke-linecap="square" stroke-width="2">
|
|
||||||
<path class="stroke-current text-white" d="M20.571 20.571h13.714v17.143H20.571z"></path>
|
|
||||||
<path class="stroke-current text-blue-300" d="M38.858 26.993l6.397 1.73-4.473 16.549-13.24-3.58">
|
|
||||||
</path>
|
|
||||||
</g>
|
|
||||||
</g>
|
|
||||||
</svg>
|
|
||||||
|
|
||||||
<div class="ml-4 text-xl font-bold">Footers</div>
|
<div class="ml-4 text-xl font-bold">Footers</div>
|
||||||
</div>
|
</div>
|
||||||
<p class="text-gray-500 dark:text-gray-400 text-md">
|
<p class="text-gray-500 dark:text-gray-400 text-md">
|
||||||
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et
|
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do
|
||||||
dolore.
|
eiusmod tempor incididunt ut labore et dolore.
|
||||||
</p>
|
</p>
|
||||||
</div>
|
</div>
|
||||||
<div
|
<div
|
||||||
class="relative flex flex-col p-6 bg-white dark:bg-slate-900 rounded shadow-xl hover:shadow-lg transition dark:border dark:border-slate-800"
|
class="relative flex flex-col p-6 bg-white dark:bg-slate-900 rounded shadow-xl hover:shadow-lg transition dark:border dark:border-slate-800"
|
||||||
>
|
>
|
||||||
<div class="flex items-center mb-4">
|
<div class="flex items-center mb-4">
|
||||||
<svg class="w-12 h-12 p-1" viewBox="0 0 64 64" xmlns="http://www.w3.org/2000/svg">
|
<Icon name="flat-color-icons:video-projector" class="w-12 h-12" />
|
||||||
<g fill="none" fill-rule="evenodd">
|
|
||||||
<rect class="fill-current text-blue-600" width="64" height="64" rx="32"></rect>
|
|
||||||
<g stroke-linecap="square" stroke-width="2">
|
|
||||||
<path class="stroke-current text-white" d="M20.571 20.571h13.714v17.143H20.571z"></path>
|
|
||||||
<path class="stroke-current text-blue-300" d="M38.858 26.993l6.397 1.73-4.473 16.549-13.24-3.58">
|
|
||||||
</path>
|
|
||||||
</g>
|
|
||||||
</g>
|
|
||||||
</svg>
|
|
||||||
<div class="ml-4 text-xl font-bold">Features</div>
|
<div class="ml-4 text-xl font-bold">Features</div>
|
||||||
</div>
|
</div>
|
||||||
<p class="text-gray-500 dark:text-gray-400 text-md">
|
<p class="text-gray-500 dark:text-gray-400 text-md">
|
||||||
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et
|
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do
|
||||||
dolore.
|
eiusmod tempor incididunt ut labore et dolore.
|
||||||
</p>
|
</p>
|
||||||
</div>
|
</div>
|
||||||
<div
|
<div
|
||||||
class="relative flex flex-col p-6 bg-white dark:bg-slate-900 rounded shadow-xl hover:shadow-lg transition dark:border dark:border-slate-800"
|
class="relative flex flex-col p-6 bg-white dark:bg-slate-900 rounded shadow-xl hover:shadow-lg transition dark:border dark:border-slate-800"
|
||||||
>
|
>
|
||||||
<div class="flex items-center mb-4">
|
<div class="flex items-center mb-4">
|
||||||
<svg class="w-12 h-12 p-1" viewBox="0 0 64 64" xmlns="http://www.w3.org/2000/svg">
|
<Icon name="flat-color-icons:in-transit" class="w-12 h-12" />
|
||||||
<g fill="none" fill-rule="evenodd">
|
|
||||||
<rect class="fill-current text-blue-600" width="64" height="64" rx="32"></rect>
|
|
||||||
<g stroke-linecap="square" stroke-width="2">
|
|
||||||
<path class="stroke-current text-white" d="M20.571 20.571h13.714v17.143H20.571z"></path>
|
|
||||||
<path class="stroke-current text-blue-300" d="M38.858 26.993l6.397 1.73-4.473 16.549-13.24-3.58">
|
|
||||||
</path>
|
|
||||||
</g>
|
|
||||||
</g>
|
|
||||||
</svg>
|
|
||||||
|
|
||||||
<div class="ml-4 text-xl font-bold">Call-to-Action</div>
|
<div class="ml-4 text-xl font-bold">Call-to-Action</div>
|
||||||
</div>
|
</div>
|
||||||
<p class="text-gray-500 dark:text-gray-400 text-md">
|
<p class="text-gray-500 dark:text-gray-400 text-md">
|
||||||
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et
|
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do
|
||||||
dolore.
|
eiusmod tempor incididunt ut labore et dolore.
|
||||||
</p>
|
</p>
|
||||||
</div>
|
</div>
|
||||||
<div
|
<div
|
||||||
class="relative flex flex-col p-6 bg-white dark:bg-slate-900 rounded shadow-xl hover:shadow-lg transition dark:border dark:border-slate-800"
|
class="relative flex flex-col p-6 bg-white dark:bg-slate-900 rounded shadow-xl hover:shadow-lg transition dark:border dark:border-slate-800"
|
||||||
>
|
>
|
||||||
<div class="flex items-center mb-4">
|
<div class="flex items-center mb-4">
|
||||||
<svg class="w-12 h-12 p-1" viewBox="0 0 64 64" xmlns="http://www.w3.org/2000/svg">
|
<Icon name="flat-color-icons:calculator" class="w-12 h-12" />
|
||||||
<g fill="none" fill-rule="evenodd">
|
|
||||||
<rect class="fill-current text-blue-600" width="64" height="64" rx="32"></rect>
|
|
||||||
<g stroke-linecap="square" stroke-width="2">
|
|
||||||
<path class="stroke-current text-white" d="M20.571 20.571h13.714v17.143H20.571z"></path>
|
|
||||||
<path class="stroke-current text-blue-300" d="M38.858 26.993l6.397 1.73-4.473 16.549-13.24-3.58">
|
|
||||||
</path>
|
|
||||||
</g>
|
|
||||||
</g>
|
|
||||||
</svg>
|
|
||||||
<div class="ml-4 text-xl font-bold">Pricing</div>
|
<div class="ml-4 text-xl font-bold">Pricing</div>
|
||||||
</div>
|
</div>
|
||||||
<p class="text-gray-500 dark:text-gray-400 text-md">
|
<p class="text-gray-500 dark:text-gray-400 text-md">
|
||||||
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et
|
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do
|
||||||
dolore.
|
eiusmod tempor incididunt ut labore et dolore.
|
||||||
</p>
|
</p>
|
||||||
</div>
|
</div>
|
||||||
<div
|
<div
|
||||||
class="relative flex flex-col p-6 bg-white dark:bg-slate-900 rounded shadow-xl hover:shadow-lg transition dark:border dark:border-slate-800"
|
class="relative flex flex-col p-6 bg-white dark:bg-slate-900 rounded shadow-xl hover:shadow-lg transition dark:border dark:border-slate-800"
|
||||||
>
|
>
|
||||||
<div class="flex items-center mb-4">
|
<div class="flex items-center mb-4">
|
||||||
<svg class="w-12 h-12 p-1" viewBox="0 0 64 64" xmlns="http://www.w3.org/2000/svg">
|
<Icon name="flat-color-icons:voice-presentation" class="w-12 h-12"
|
||||||
<g fill="none" fill-rule="evenodd">
|
/>
|
||||||
<rect class="fill-current text-blue-600" width="64" height="64" rx="32"></rect>
|
|
||||||
<g stroke-linecap="square" stroke-width="2">
|
|
||||||
<path class="stroke-current text-white" d="M20.571 20.571h13.714v17.143H20.571z"></path>
|
|
||||||
<path class="stroke-current text-blue-300" d="M38.858 26.993l6.397 1.73-4.473 16.549-13.24-3.58">
|
|
||||||
</path>
|
|
||||||
</g>
|
|
||||||
</g>
|
|
||||||
</svg>
|
|
||||||
<div class="ml-4 text-xl font-bold">Testimonial</div>
|
<div class="ml-4 text-xl font-bold">Testimonial</div>
|
||||||
</div>
|
</div>
|
||||||
<p class="text-gray-500 dark:text-gray-400 text-md">
|
<p class="text-gray-500 dark:text-gray-400 text-md">
|
||||||
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et
|
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do
|
||||||
dolore.
|
eiusmod tempor incididunt ut labore et dolore.
|
||||||
</p>
|
</p>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|||||||
@ -1,11 +1,6 @@
|
|||||||
---
|
---
|
||||||
import {
|
import { Icon } from "astro-icon";
|
||||||
IconTwitter,
|
|
||||||
IconInstagram,
|
|
||||||
IconFacebook,
|
|
||||||
IconArrowRight,
|
|
||||||
IconRSS,
|
|
||||||
} from "~/components/icons";
|
|
||||||
const {} = Astro.props;
|
const {} = Astro.props;
|
||||||
---
|
---
|
||||||
|
|
||||||
@ -186,7 +181,8 @@ const {} = Astro.props;
|
|||||||
class="absolute inset-0 right-auto w-px -ml-px my-2 bg-gray-300 dark:bg-slate-600"
|
class="absolute inset-0 right-auto w-px -ml-px my-2 bg-gray-300 dark:bg-slate-600"
|
||||||
aria-hidden="true"></span>
|
aria-hidden="true"></span>
|
||||||
|
|
||||||
<IconArrowRight
|
<Icon
|
||||||
|
name="tabler:arrow-right"
|
||||||
class="w-5 h-5 text-blue-600 mx-3 flex-shrink-0"
|
class="w-5 h-5 text-blue-600 mx-3 flex-shrink-0"
|
||||||
/>
|
/>
|
||||||
</button>
|
</button>
|
||||||
@ -204,7 +200,7 @@ const {} = Astro.props;
|
|||||||
aria-label="Twitter"
|
aria-label="Twitter"
|
||||||
href="#"
|
href="#"
|
||||||
>
|
>
|
||||||
<IconTwitter />
|
<Icon name="tabler:brand-twitter" class="w-5 h-5" />
|
||||||
</a>
|
</a>
|
||||||
</li>
|
</li>
|
||||||
<li class="ml-4">
|
<li class="ml-4">
|
||||||
@ -213,7 +209,7 @@ const {} = Astro.props;
|
|||||||
aria-label="Instagram"
|
aria-label="Instagram"
|
||||||
href="#"
|
href="#"
|
||||||
>
|
>
|
||||||
<IconInstagram />
|
<Icon name="tabler:brand-instagram" class="w-5 h-5" />
|
||||||
</a>
|
</a>
|
||||||
</li>
|
</li>
|
||||||
<li class="ml-4">
|
<li class="ml-4">
|
||||||
@ -222,7 +218,7 @@ const {} = Astro.props;
|
|||||||
aria-label="Facebook"
|
aria-label="Facebook"
|
||||||
href="#"
|
href="#"
|
||||||
>
|
>
|
||||||
<IconFacebook />
|
<Icon name="tabler:brand-facebook" class="w-5 h-5" />
|
||||||
</a>
|
</a>
|
||||||
</li>
|
</li>
|
||||||
<li class="ml-4">
|
<li class="ml-4">
|
||||||
@ -231,7 +227,7 @@ const {} = Astro.props;
|
|||||||
aria-label="Twitter"
|
aria-label="Twitter"
|
||||||
href="/rss.xml"
|
href="/rss.xml"
|
||||||
>
|
>
|
||||||
<IconRSS />
|
<Icon name="tabler:rss" class="w-5 h-5" />
|
||||||
</a>
|
</a>
|
||||||
</li>
|
</li>
|
||||||
</ul>
|
</ul>
|
||||||
|
|||||||
@ -1,6 +1,7 @@
|
|||||||
---
|
---
|
||||||
import { IconSun, IconGithub, IconMenu, IconRSS } from "~/components/icons";
|
import { Icon } from "astro-icon";
|
||||||
import Logo from "~/components/widgets/Logo.astro";
|
import Logo from "~/components/widgets/Logo.astro";
|
||||||
|
|
||||||
const {} = Astro.props;
|
const {} = Astro.props;
|
||||||
---
|
---
|
||||||
|
|
||||||
@ -21,14 +22,14 @@ const {} = Astro.props;
|
|||||||
aria-label="Toggle between Dark and Light mode"
|
aria-label="Toggle between Dark and Light mode"
|
||||||
data-aw-toggle-color-scheme
|
data-aw-toggle-color-scheme
|
||||||
>
|
>
|
||||||
<IconSun class="w-6 h-6" />
|
<Icon name="tabler:sun" class="w-6 h-6" />
|
||||||
</button>
|
</button>
|
||||||
<button
|
<button
|
||||||
class="ml-1.5 text-gray-500 dark:text-gray-400 hover:bg-gray-100 dark:hover:bg-gray-800 focus:outline-none focus:ring-4 focus:ring-gray-200 dark:focus:ring-gray-700 rounded-lg text-sm p-2.5 inline-flex items-center transition"
|
class="ml-1.5 text-gray-500 dark:text-gray-400 hover:bg-gray-100 dark:hover:bg-gray-800 focus:outline-none focus:ring-4 focus:ring-gray-200 dark:focus:ring-gray-700 rounded-lg text-sm p-2.5 inline-flex items-center transition"
|
||||||
aria-label="Toggle Menu"
|
aria-label="Toggle Menu"
|
||||||
data-aw-toggle-menu
|
data-aw-toggle-menu
|
||||||
>
|
>
|
||||||
<IconMenu class="w-6 h-6" />
|
<Icon name="tabler:menu" class="w-6 h-6" />
|
||||||
</button>
|
</button>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
@ -80,21 +81,21 @@ const {} = Astro.props;
|
|||||||
aria-label="Toggle between Dark and Light mode"
|
aria-label="Toggle between Dark and Light mode"
|
||||||
data-aw-toggle-color-scheme
|
data-aw-toggle-color-scheme
|
||||||
>
|
>
|
||||||
<IconSun />
|
<Icon name="tabler:sun" class="w-5 h-5" />
|
||||||
</button>
|
</button>
|
||||||
<a
|
<a
|
||||||
class="text-gray-500 dark:text-gray-400 hover:bg-gray-100 dark:hover:bg-gray-700 focus:outline-none focus:ring-4 focus:ring-gray-200 dark:focus:ring-gray-700 rounded-lg text-sm p-2.5 inline-flex items-center"
|
class="text-gray-500 dark:text-gray-400 hover:bg-gray-100 dark:hover:bg-gray-700 focus:outline-none focus:ring-4 focus:ring-gray-200 dark:focus:ring-gray-700 rounded-lg text-sm p-2.5 inline-flex items-center"
|
||||||
aria-label="RSS Feed"
|
aria-label="RSS Feed"
|
||||||
href="/rss.xml"
|
href="/rss.xml"
|
||||||
>
|
>
|
||||||
<IconRSS />
|
<Icon name="tabler:rss" class="w-5 h-5" />
|
||||||
</a>
|
</a>
|
||||||
<a
|
<a
|
||||||
href="https://github.com/onwidget/astrowind"
|
href="https://github.com/onwidget/astrowind"
|
||||||
class="inline-block text-gray-500 dark:text-gray-400 hover:bg-gray-100 dark:hover:bg-gray-700 focus:outline-none focus:ring-4 focus:ring-gray-200 dark:focus:ring-gray-700 rounded-lg text-sm p-2.5 mr-1"
|
class="inline-block text-gray-500 dark:text-gray-400 hover:bg-gray-100 dark:hover:bg-gray-700 focus:outline-none focus:ring-4 focus:ring-gray-200 dark:focus:ring-gray-700 rounded-lg text-sm p-2.5 mr-1"
|
||||||
aria-label="Astrowind Github"
|
aria-label="Astrowind Github"
|
||||||
>
|
>
|
||||||
<IconGithub />
|
<Icon name="tabler:brand-github" class="w-5 h-5" />
|
||||||
</a>
|
</a>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|||||||
@ -40,7 +40,7 @@ const {} = Astro.props;
|
|||||||
<div>
|
<div>
|
||||||
<a
|
<a
|
||||||
class="btn text-white bg-gray-900 hover:bg-gray-800 dark:bg-gray-700 dark:hover:bg-gray-800 ml-4"
|
class="btn text-white bg-gray-900 hover:bg-gray-800 dark:bg-gray-700 dark:hover:bg-gray-800 ml-4"
|
||||||
href="#"
|
href="#features"
|
||||||
>Learn more
|
>Learn more
|
||||||
</a>
|
</a>
|
||||||
</div>
|
</div>
|
||||||
|
|||||||
@ -1,5 +1,7 @@
|
|||||||
---
|
---
|
||||||
|
import { Icon } from "astro-icon";
|
||||||
import Picture from "~/components/core/Picture.astro";
|
import Picture from "~/components/core/Picture.astro";
|
||||||
|
|
||||||
const {} = Astro.props;
|
const {} = Astro.props;
|
||||||
---
|
---
|
||||||
|
|
||||||
@ -12,24 +14,10 @@ const {} = Astro.props;
|
|||||||
<div
|
<div
|
||||||
class="flex items-center justify-center w-10 h-10 rounded-full border-pink-500 border-2"
|
class="flex items-center justify-center w-10 h-10 rounded-full border-pink-500 border-2"
|
||||||
>
|
>
|
||||||
<svg
|
<Icon
|
||||||
xmlns="http://www.w3.org/2000/svg"
|
name="tabler:arrow-down"
|
||||||
class="w-5 h-5 text-gray-600 dark:text-slate-200"
|
class="w-6 h-6 text-gray-600 dark:text-slate-200 icon-bold"
|
||||||
width="24"
|
/>
|
||||||
height="24"
|
|
||||||
viewBox="0 0 24 24"
|
|
||||||
stroke-width="2"
|
|
||||||
stroke="currentColor"
|
|
||||||
fill="none"
|
|
||||||
stroke-linecap="round"
|
|
||||||
stroke-linejoin="round"
|
|
||||||
>
|
|
||||||
<path stroke="none" d="M0 0h24v24H0z" fill="none"></path>
|
|
||||||
<path
|
|
||||||
d="M15 4v8h3.586a1 1 0 0 1 .707 1.707l-6.586 6.586a1 1 0 0 1 -1.414 0l-6.586 -6.586a1 1 0 0 1 .707 -1.707h3.586v-8a1 1 0 0 1 1 -1h4a1 1 0 0 1 1 1z"
|
|
||||||
>
|
|
||||||
</path>
|
|
||||||
</svg>
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="w-px h-full bg-gray-300 dark:bg-slate-500"></div>
|
<div class="w-px h-full bg-gray-300 dark:bg-slate-500"></div>
|
||||||
@ -52,24 +40,10 @@ const {} = Astro.props;
|
|||||||
<div
|
<div
|
||||||
class="flex items-center justify-center w-10 h-10 rounded-full border-pink-500 border-2"
|
class="flex items-center justify-center w-10 h-10 rounded-full border-pink-500 border-2"
|
||||||
>
|
>
|
||||||
<svg
|
<Icon
|
||||||
xmlns="http://www.w3.org/2000/svg"
|
name="tabler:arrow-down"
|
||||||
class="w-5 h-5 text-gray-600 dark:text-slate-200"
|
class="w-6 h-6 text-gray-600 dark:text-slate-200 icon-bold"
|
||||||
width="24"
|
/>
|
||||||
height="24"
|
|
||||||
viewBox="0 0 24 24"
|
|
||||||
stroke-width="2"
|
|
||||||
stroke="currentColor"
|
|
||||||
fill="none"
|
|
||||||
stroke-linecap="round"
|
|
||||||
stroke-linejoin="round"
|
|
||||||
>
|
|
||||||
<path stroke="none" d="M0 0h24v24H0z" fill="none"></path>
|
|
||||||
<path
|
|
||||||
d="M15 4v8h3.586a1 1 0 0 1 .707 1.707l-6.586 6.586a1 1 0 0 1 -1.414 0l-6.586 -6.586a1 1 0 0 1 .707 -1.707h3.586v-8a1 1 0 0 1 1 -1h4a1 1 0 0 1 1 1z"
|
|
||||||
>
|
|
||||||
</path>
|
|
||||||
</svg>
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="w-px h-full bg-gray-300 dark:bg-slate-500"></div>
|
<div class="w-px h-full bg-gray-300 dark:bg-slate-500"></div>
|
||||||
@ -91,24 +65,10 @@ const {} = Astro.props;
|
|||||||
<div
|
<div
|
||||||
class="flex items-center justify-center w-10 h-10 rounded-full border-pink-500 border-2"
|
class="flex items-center justify-center w-10 h-10 rounded-full border-pink-500 border-2"
|
||||||
>
|
>
|
||||||
<svg
|
<Icon
|
||||||
xmlns="http://www.w3.org/2000/svg"
|
name="tabler:arrow-down"
|
||||||
class="w-5 h-5 text-gray-600 dark:text-slate-200"
|
class="w-6 h-6 text-gray-600 dark:text-slate-200 icon-bold"
|
||||||
width="24"
|
/>
|
||||||
height="24"
|
|
||||||
viewBox="0 0 24 24"
|
|
||||||
stroke-width="2"
|
|
||||||
stroke="currentColor"
|
|
||||||
fill="none"
|
|
||||||
stroke-linecap="round"
|
|
||||||
stroke-linejoin="round"
|
|
||||||
>
|
|
||||||
<path stroke="none" d="M0 0h24v24H0z" fill="none"></path>
|
|
||||||
<path
|
|
||||||
d="M15 4v8h3.586a1 1 0 0 1 .707 1.707l-6.586 6.586a1 1 0 0 1 -1.414 0l-6.586 -6.586a1 1 0 0 1 .707 -1.707h3.586v-8a1 1 0 0 1 1 -1h4a1 1 0 0 1 1 1z"
|
|
||||||
>
|
|
||||||
</path>
|
|
||||||
</svg>
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="w-px h-full bg-gray-300 dark:bg-slate-500"></div>
|
<div class="w-px h-full bg-gray-300 dark:bg-slate-500"></div>
|
||||||
@ -130,21 +90,10 @@ const {} = Astro.props;
|
|||||||
<div
|
<div
|
||||||
class="flex items-center justify-center w-10 h-10 rounded-full border-blue-600 border-2"
|
class="flex items-center justify-center w-10 h-10 rounded-full border-blue-600 border-2"
|
||||||
>
|
>
|
||||||
<svg
|
<Icon
|
||||||
xmlns="http://www.w3.org/2000/svg"
|
name="tabler:check"
|
||||||
class="w-6 text-gray-600 dark:text-slate-200"
|
class="w-6 h-6 text-gray-600 dark:text-slate-200 icon-bold"
|
||||||
width="24"
|
/>
|
||||||
height="24"
|
|
||||||
viewBox="0 0 24 24"
|
|
||||||
stroke-width="2"
|
|
||||||
stroke="currentColor"
|
|
||||||
fill="none"
|
|
||||||
stroke-linecap="round"
|
|
||||||
stroke-linejoin="round"
|
|
||||||
>
|
|
||||||
<path stroke="none" d="M0 0h24v24H0z" fill="none"></path>
|
|
||||||
<path d="M5 12l5 5l10 -10"></path>
|
|
||||||
</svg>
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|||||||
@ -2,160 +2,278 @@
|
|||||||
const {} = Astro.props;
|
const {} = Astro.props;
|
||||||
---
|
---
|
||||||
|
|
||||||
<section class="px-4 py-16 mx-auto max-w-6xl lg:px-8 lg:py-20 bg-blue-50 dark:bg-slate-800">
|
<section class="scroll-mt-16" id="features">
|
||||||
<div class="max-w-xl mb-10 md:mx-auto sm:text-center lg:max-w-2xl md:mb-12">
|
<div
|
||||||
<p class="text-base text-blue-600 dark:text-blue-200 font-semibold tracking-wide uppercase">Features</p>
|
class="px-4 py-16 mx-auto max-w-6xl lg:px-8 lg:py-20 bg-blue-50 dark:bg-slate-800"
|
||||||
<h2 class="text-4xl md:text-5xl font-bold leading-tighter tracking-tighter mb-4">
|
>
|
||||||
What's interesting about <span
|
<div class="max-w-xl mb-10 md:mx-auto sm:text-center lg:max-w-2xl md:mb-12">
|
||||||
class="bg-clip-text text-transparent bg-gradient-to-r from-blue-500 to-pink-500 whitespace-nowrap"
|
<p
|
||||||
>AstroWind
|
class="text-base text-blue-600 dark:text-blue-200 font-semibold tracking-wide uppercase"
|
||||||
</span>
|
>
|
||||||
</h2>
|
Features
|
||||||
<p class="max-w-3xl mx-auto sm:text-center text-xl text-gray-600 dark:text-slate-400">
|
</p>
|
||||||
Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque rem aperiam, eaque ipsa
|
<h2
|
||||||
quae.
|
class="text-4xl md:text-5xl font-bold leading-tighter tracking-tighter mb-4"
|
||||||
</p>
|
>
|
||||||
</div>
|
What's interesting about <span
|
||||||
<div class="grid mx-auto space-y-6 md:grid-cols-2 md:space-y-0">
|
class="bg-clip-text text-transparent bg-gradient-to-r from-blue-500 to-pink-500 whitespace-nowrap"
|
||||||
<div class="space-y-8 sm:px-8">
|
>AstroWind
|
||||||
<div class="flex flex-row max-w-md">
|
</span>
|
||||||
<div class="mb-4 mr-4">
|
</h2>
|
||||||
<div class="flex items-center justify-center w-12 h-12 rounded-full bg-blue-500">
|
<p
|
||||||
<svg class="w-12 h-12 p-0.5" viewBox="0 0 64 64" xmlns="http://www.w3.org/2000/svg">
|
class="max-w-3xl mx-auto sm:text-center text-xl text-gray-600 dark:text-slate-400"
|
||||||
<g fill="none" fill-rule="evenodd">
|
>
|
||||||
<rect class="fill-current text-blue-600" width="64" height="64" rx="32"></rect>
|
Sed ut perspiciatis unde omnis iste natus error sit voluptatem
|
||||||
<g stroke-linecap="square" stroke-width="2">
|
accusantium doloremque rem aperiam, eaque ipsa quae.
|
||||||
<path class="stroke-current text-white" d="M20.571 20.571h13.714v17.143H20.571z"> </path>
|
</p>
|
||||||
<path class="stroke-current text-blue-300" d="M38.858 26.993l6.397 1.73-4.473 16.549-13.24-3.58">
|
|
||||||
</path>
|
|
||||||
</g>
|
|
||||||
</g>
|
|
||||||
</svg>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div>
|
|
||||||
<h3 class="mb-3 text-xl font-bold">Integration with Tailwind CSS</h3>
|
|
||||||
<p>
|
|
||||||
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi sagittis, quam nec venenatis lobortis, mi
|
|
||||||
risus tempus nulla.
|
|
||||||
</p>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="flex flex-row max-w-md">
|
|
||||||
<div class="mb-4 mr-4">
|
|
||||||
<div class="flex items-center justify-center w-12 h-12 rounded-full bg-blue-500">
|
|
||||||
<svg class="w-12 h-12 p-0.5" viewBox="0 0 64 64" xmlns="http://www.w3.org/2000/svg">
|
|
||||||
<g fill="none" fill-rule="evenodd">
|
|
||||||
<rect class="fill-current text-blue-600" width="64" height="64" rx="32"></rect>
|
|
||||||
<g stroke-linecap="square" stroke-width="2">
|
|
||||||
<path class="stroke-current text-white" d="M20.571 20.571h13.714v17.143H20.571z"> </path>
|
|
||||||
<path class="stroke-current text-blue-300" d="M38.858 26.993l6.397 1.73-4.473 16.549-13.24-3.58">
|
|
||||||
</path>
|
|
||||||
</g>
|
|
||||||
</g>
|
|
||||||
</svg>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div>
|
|
||||||
<h3 class="mb-3 text-xl font-bold">Ready-to-use Components</h3>
|
|
||||||
<p>
|
|
||||||
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi sagittis, quam nec venenatis lobortis, mi
|
|
||||||
risus tempus nulla.
|
|
||||||
</p>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="flex flex-row max-w-md">
|
|
||||||
<div class="mb-4 mr-4">
|
|
||||||
<div class="flex items-center justify-center w-12 h-12 rounded-full bg-blue-500">
|
|
||||||
<svg class="w-12 h-12 p-0.5" viewBox="0 0 64 64" xmlns="http://www.w3.org/2000/svg">
|
|
||||||
<g fill="none" fill-rule="evenodd">
|
|
||||||
<rect class="fill-current text-blue-600" width="64" height="64" rx="32"></rect>
|
|
||||||
<g stroke-linecap="square" stroke-width="2">
|
|
||||||
<path class="stroke-current text-white" d="M20.571 20.571h13.714v17.143H20.571z"> </path>
|
|
||||||
<path class="stroke-current text-blue-300" d="M38.858 26.993l6.397 1.73-4.473 16.549-13.24-3.58">
|
|
||||||
</path>
|
|
||||||
</g>
|
|
||||||
</g>
|
|
||||||
</svg>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div>
|
|
||||||
<h3 class="mb-3 text-xl font-bold">Best Practices</h3>
|
|
||||||
<p>
|
|
||||||
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi sagittis, quam nec venenatis lobortis, mi
|
|
||||||
risus tempus nulla.
|
|
||||||
</p>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
<div class="space-y-8 sm:px-8">
|
<div class="grid mx-auto space-y-6 md:grid-cols-2 md:space-y-0">
|
||||||
<div class="flex flex-row max-w-md">
|
<div class="space-y-8 sm:px-8">
|
||||||
<div class="mb-4 mr-4">
|
<div class="flex flex-row max-w-md">
|
||||||
<div class="flex items-center justify-center w-12 h-12 rounded-full bg-blue-500">
|
<div class="mb-4 mr-4">
|
||||||
<svg class="w-12 h-12 p-0.5" viewBox="0 0 64 64" xmlns="http://www.w3.org/2000/svg">
|
<div
|
||||||
<g fill="none" fill-rule="evenodd">
|
class="flex items-center justify-center w-12 h-12 rounded-full bg-blue-500"
|
||||||
<rect class="fill-current text-blue-600" width="64" height="64" rx="32"></rect>
|
>
|
||||||
<g stroke-linecap="square" stroke-width="2">
|
<svg
|
||||||
<path class="stroke-current text-white" d="M20.571 20.571h13.714v17.143H20.571z"> </path>
|
class="w-12 h-12 p-0.5"
|
||||||
<path class="stroke-current text-blue-300" d="M38.858 26.993l6.397 1.73-4.473 16.549-13.24-3.58">
|
viewBox="0 0 64 64"
|
||||||
</path>
|
xmlns="http://www.w3.org/2000/svg"
|
||||||
|
>
|
||||||
|
<g fill="none" fill-rule="evenodd">
|
||||||
|
<rect
|
||||||
|
class="fill-current text-blue-600"
|
||||||
|
width="64"
|
||||||
|
height="64"
|
||||||
|
rx="32"></rect>
|
||||||
|
<g stroke-linecap="square" stroke-width="2">
|
||||||
|
<path
|
||||||
|
class="stroke-current text-white"
|
||||||
|
d="M20.571 20.571h13.714v17.143H20.571z"
|
||||||
|
>
|
||||||
|
</path>
|
||||||
|
<path
|
||||||
|
class="stroke-current text-blue-300"
|
||||||
|
d="M38.858 26.993l6.397 1.73-4.473 16.549-13.24-3.58"
|
||||||
|
>
|
||||||
|
</path>
|
||||||
|
</g>
|
||||||
</g>
|
</g>
|
||||||
</g>
|
</svg>
|
||||||
</svg>
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<h3 class="mb-3 text-xl font-bold">
|
||||||
|
Integration with Tailwind CSS
|
||||||
|
</h3>
|
||||||
|
<p>
|
||||||
|
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi
|
||||||
|
sagittis, quam nec venenatis lobortis, mi risus tempus nulla.
|
||||||
|
</p>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div>
|
<div class="flex flex-row max-w-md">
|
||||||
<h3 class="mb-3 text-xl font-bold">Excelent Page Speed</h3>
|
<div class="mb-4 mr-4">
|
||||||
<p>
|
<div
|
||||||
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi sagittis, quam nec venenatis lobortis, mi
|
class="flex items-center justify-center w-12 h-12 rounded-full bg-blue-500"
|
||||||
risus tempus nulla.
|
>
|
||||||
</p>
|
<svg
|
||||||
|
class="w-12 h-12 p-0.5"
|
||||||
|
viewBox="0 0 64 64"
|
||||||
|
xmlns="http://www.w3.org/2000/svg"
|
||||||
|
>
|
||||||
|
<g fill="none" fill-rule="evenodd">
|
||||||
|
<rect
|
||||||
|
class="fill-current text-blue-600"
|
||||||
|
width="64"
|
||||||
|
height="64"
|
||||||
|
rx="32"></rect>
|
||||||
|
<g stroke-linecap="square" stroke-width="2">
|
||||||
|
<path
|
||||||
|
class="stroke-current text-white"
|
||||||
|
d="M20.571 20.571h13.714v17.143H20.571z"
|
||||||
|
>
|
||||||
|
</path>
|
||||||
|
<path
|
||||||
|
class="stroke-current text-blue-300"
|
||||||
|
d="M38.858 26.993l6.397 1.73-4.473 16.549-13.24-3.58"
|
||||||
|
>
|
||||||
|
</path>
|
||||||
|
</g>
|
||||||
|
</g>
|
||||||
|
</svg>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<h3 class="mb-3 text-xl font-bold">Ready-to-use Components</h3>
|
||||||
|
<p>
|
||||||
|
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi
|
||||||
|
sagittis, quam nec venenatis lobortis, mi risus tempus nulla.
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="flex flex-row max-w-md">
|
||||||
|
<div class="mb-4 mr-4">
|
||||||
|
<div
|
||||||
|
class="flex items-center justify-center w-12 h-12 rounded-full bg-blue-500"
|
||||||
|
>
|
||||||
|
<svg
|
||||||
|
class="w-12 h-12 p-0.5"
|
||||||
|
viewBox="0 0 64 64"
|
||||||
|
xmlns="http://www.w3.org/2000/svg"
|
||||||
|
>
|
||||||
|
<g fill="none" fill-rule="evenodd">
|
||||||
|
<rect
|
||||||
|
class="fill-current text-blue-600"
|
||||||
|
width="64"
|
||||||
|
height="64"
|
||||||
|
rx="32"></rect>
|
||||||
|
<g stroke-linecap="square" stroke-width="2">
|
||||||
|
<path
|
||||||
|
class="stroke-current text-white"
|
||||||
|
d="M20.571 20.571h13.714v17.143H20.571z"
|
||||||
|
>
|
||||||
|
</path>
|
||||||
|
<path
|
||||||
|
class="stroke-current text-blue-300"
|
||||||
|
d="M38.858 26.993l6.397 1.73-4.473 16.549-13.24-3.58"
|
||||||
|
>
|
||||||
|
</path>
|
||||||
|
</g>
|
||||||
|
</g>
|
||||||
|
</svg>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<h3 class="mb-3 text-xl font-bold">Best Practices</h3>
|
||||||
|
<p>
|
||||||
|
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi
|
||||||
|
sagittis, quam nec venenatis lobortis, mi risus tempus nulla.
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="flex flex-row max-w-md">
|
<div class="space-y-8 sm:px-8">
|
||||||
<div class="mb-4 mr-4">
|
<div class="flex flex-row max-w-md">
|
||||||
<div class="flex items-center justify-center w-12 h-12 rounded-full bg-blue-500">
|
<div class="mb-4 mr-4">
|
||||||
<svg class="w-12 h-12 p-0.5" viewBox="0 0 64 64" xmlns="http://www.w3.org/2000/svg">
|
<div
|
||||||
<g fill="none" fill-rule="evenodd">
|
class="flex items-center justify-center w-12 h-12 rounded-full bg-blue-500"
|
||||||
<rect class="fill-current text-blue-600" width="64" height="64" rx="32"></rect>
|
>
|
||||||
<g stroke-linecap="square" stroke-width="2">
|
<svg
|
||||||
<path class="stroke-current text-white" d="M20.571 20.571h13.714v17.143H20.571z"> </path>
|
class="w-12 h-12 p-0.5"
|
||||||
<path class="stroke-current text-blue-300" d="M38.858 26.993l6.397 1.73-4.473 16.549-13.24-3.58">
|
viewBox="0 0 64 64"
|
||||||
</path>
|
xmlns="http://www.w3.org/2000/svg"
|
||||||
|
>
|
||||||
|
<g fill="none" fill-rule="evenodd">
|
||||||
|
<rect
|
||||||
|
class="fill-current text-blue-600"
|
||||||
|
width="64"
|
||||||
|
height="64"
|
||||||
|
rx="32"></rect>
|
||||||
|
<g stroke-linecap="square" stroke-width="2">
|
||||||
|
<path
|
||||||
|
class="stroke-current text-white"
|
||||||
|
d="M20.571 20.571h13.714v17.143H20.571z"
|
||||||
|
>
|
||||||
|
</path>
|
||||||
|
<path
|
||||||
|
class="stroke-current text-blue-300"
|
||||||
|
d="M38.858 26.993l6.397 1.73-4.473 16.549-13.24-3.58"
|
||||||
|
>
|
||||||
|
</path>
|
||||||
|
</g>
|
||||||
</g>
|
</g>
|
||||||
</g>
|
</svg>
|
||||||
</svg>
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<h3 class="mb-3 text-xl font-bold">Excelent Page Speed</h3>
|
||||||
|
<p>
|
||||||
|
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi
|
||||||
|
sagittis, quam nec venenatis lobortis, mi risus tempus nulla.
|
||||||
|
</p>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div>
|
<div class="flex flex-row max-w-md">
|
||||||
<h3 class="mb-3 text-xl font-bold">Frequently updated</h3>
|
<div class="mb-4 mr-4">
|
||||||
<p>
|
<div
|
||||||
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi sagittis, quam nec venenatis lobortis, mi
|
class="flex items-center justify-center w-12 h-12 rounded-full bg-blue-500"
|
||||||
risus tempus nulla.
|
>
|
||||||
</p>
|
<svg
|
||||||
</div>
|
class="w-12 h-12 p-0.5"
|
||||||
</div>
|
viewBox="0 0 64 64"
|
||||||
<div class="flex flex-row max-w-md">
|
xmlns="http://www.w3.org/2000/svg"
|
||||||
<div class="mb-4 mr-4">
|
>
|
||||||
<div class="flex items-center justify-center w-12 h-12 rounded-full bg-blue-500">
|
<g fill="none" fill-rule="evenodd">
|
||||||
<svg class="w-12 h-12 p-0.5" viewBox="0 0 64 64" xmlns="http://www.w3.org/2000/svg">
|
<rect
|
||||||
<g fill="none" fill-rule="evenodd">
|
class="fill-current text-blue-600"
|
||||||
<rect class="fill-current text-blue-600" width="64" height="64" rx="32"></rect>
|
width="64"
|
||||||
<g stroke-linecap="square" stroke-width="2">
|
height="64"
|
||||||
<path class="stroke-current text-white" d="M20.571 20.571h13.714v17.143H20.571z"> </path>
|
rx="32"></rect>
|
||||||
<path class="stroke-current text-blue-300" d="M38.858 26.993l6.397 1.73-4.473 16.549-13.24-3.58">
|
<g stroke-linecap="square" stroke-width="2">
|
||||||
</path>
|
<path
|
||||||
|
class="stroke-current text-white"
|
||||||
|
d="M20.571 20.571h13.714v17.143H20.571z"
|
||||||
|
>
|
||||||
|
</path>
|
||||||
|
<path
|
||||||
|
class="stroke-current text-blue-300"
|
||||||
|
d="M38.858 26.993l6.397 1.73-4.473 16.549-13.24-3.58"
|
||||||
|
>
|
||||||
|
</path>
|
||||||
|
</g>
|
||||||
</g>
|
</g>
|
||||||
</g>
|
</svg>
|
||||||
</svg>
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<h3 class="mb-3 text-xl font-bold">Frequently updated</h3>
|
||||||
|
<p>
|
||||||
|
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi
|
||||||
|
sagittis, quam nec venenatis lobortis, mi risus tempus nulla.
|
||||||
|
</p>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div>
|
<div class="flex flex-row max-w-md">
|
||||||
<h3 class="mb-3 text-xl font-bold">Open to new ideas and contributions</h3>
|
<div class="mb-4 mr-4">
|
||||||
<p>
|
<div
|
||||||
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi sagittis, quam nec venenatis lobortis, mi
|
class="flex items-center justify-center w-12 h-12 rounded-full bg-blue-500"
|
||||||
risus tempus nulla.
|
>
|
||||||
</p>
|
<svg
|
||||||
|
class="w-12 h-12 p-0.5"
|
||||||
|
viewBox="0 0 64 64"
|
||||||
|
xmlns="http://www.w3.org/2000/svg"
|
||||||
|
>
|
||||||
|
<g fill="none" fill-rule="evenodd">
|
||||||
|
<rect
|
||||||
|
class="fill-current text-blue-600"
|
||||||
|
width="64"
|
||||||
|
height="64"
|
||||||
|
rx="32"></rect>
|
||||||
|
<g stroke-linecap="square" stroke-width="2">
|
||||||
|
<path
|
||||||
|
class="stroke-current text-white"
|
||||||
|
d="M20.571 20.571h13.714v17.143H20.571z"
|
||||||
|
>
|
||||||
|
</path>
|
||||||
|
<path
|
||||||
|
class="stroke-current text-blue-300"
|
||||||
|
d="M38.858 26.993l6.397 1.73-4.473 16.549-13.24-3.58"
|
||||||
|
>
|
||||||
|
</path>
|
||||||
|
</g>
|
||||||
|
</g>
|
||||||
|
</svg>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<h3 class="mb-3 text-xl font-bold">
|
||||||
|
Open to new ideas and contributions
|
||||||
|
</h3>
|
||||||
|
<p>
|
||||||
|
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi
|
||||||
|
sagittis, quam nec venenatis lobortis, mi risus tempus nulla.
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|||||||
@ -8,7 +8,7 @@ const { meta = {} } = Astro.props;
|
|||||||
---
|
---
|
||||||
|
|
||||||
<!DOCTYPE html>
|
<!DOCTYPE html>
|
||||||
<html lang="en" class="2xl:text-[24px]">
|
<html lang="en" class="motion-safe:scroll-smooth 2xl:text-[24px]">
|
||||||
<head>
|
<head>
|
||||||
<MetaTags {...meta} />
|
<MetaTags {...meta} />
|
||||||
</head>
|
</head>
|
||||||
|
|||||||
@ -19,7 +19,7 @@ const { post } = Astro.props;
|
|||||||
|
|
||||||
const title = `${post.title} — ${SITE.name}`;
|
const title = `${post.title} — ${SITE.name}`;
|
||||||
const description = post.description;
|
const description = post.description;
|
||||||
const canonical = new URL(`blog/${post.slug}`, Astro.site);
|
const canonical = post.canonical || new URL(`blog/${post.slug}`, Astro.site);
|
||||||
|
|
||||||
const image = await findImage(post.image);
|
const image = await findImage(post.image);
|
||||||
---
|
---
|
||||||
|
|||||||
@ -5,13 +5,19 @@ export const getNormalizedPost = async (post) => {
|
|||||||
|
|
||||||
return {
|
return {
|
||||||
pubDate: frontmatter.pubDate,
|
pubDate: frontmatter.pubDate,
|
||||||
|
|
||||||
|
canonical: frontmatter.canonical,
|
||||||
|
slug: file.split("/").pop().split(".").shift(),
|
||||||
|
|
||||||
title: frontmatter.title,
|
title: frontmatter.title,
|
||||||
description: frontmatter.description,
|
description: frontmatter.description,
|
||||||
excerpt: frontmatter.excerpt,
|
|
||||||
body: compiledContent(),
|
body: compiledContent(),
|
||||||
image: frontmatter.image,
|
image: frontmatter.image,
|
||||||
|
|
||||||
|
excerpt: frontmatter.excerpt,
|
||||||
authors: frontmatter.authors,
|
authors: frontmatter.authors,
|
||||||
slug: file.split("/").pop().split(".").shift(),
|
category: frontmatter.category,
|
||||||
|
tags: frontmatter.tags,
|
||||||
readingTime: Math.ceil(getReadingTime(rawContent()).minutes),
|
readingTime: Math.ceil(getReadingTime(rawContent()).minutes),
|
||||||
};
|
};
|
||||||
};
|
};
|
||||||
|
|||||||
Reference in New Issue
Block a user