From 212331215b8ad25d18a50b1760901634e7ec34ea Mon Sep 17 00:00:00 2001 From: prototypa Date: Sat, 27 Aug 2022 01:52:23 -0400 Subject: [PATCH] Reorganize duplicated tailwind code and formatting --- .vscode/settings.json | 4 +- src/components/core/BasicScripts.astro | 4 +- src/components/core/MetaTags.astro | 32 +- src/components/widgets/BasicCTA.astro | 23 +- src/components/widgets/BasicFAQs.astro | 122 ------- src/components/widgets/BasicFeatures.astro | 135 +++----- src/components/widgets/BlogList.astro | 28 +- src/components/widgets/BlogListItem.astro | 36 +-- src/components/widgets/BlogPost.astro | 34 +- src/components/widgets/Error404.astro | 18 +- src/components/widgets/FAQs.astro | 73 +++++ src/components/widgets/Footer.astro | 170 +++------- src/components/widgets/Header.astro | 80 ++--- src/components/widgets/Hero.astro | 41 +-- src/components/widgets/HighlightedPosts.astro | 79 ++--- src/components/widgets/Logo.astro | 6 +- src/components/widgets/Pagination.astro | 38 +-- src/components/widgets/Stats.astro | 24 +- src/components/widgets/StepsFeatures.astro | 21 +- src/components/widgets/StepsLeft.astro | 48 +-- src/components/widgets/TwoColsFeatures.astro | 302 ++++-------------- src/layouts/BaseLayout.astro | 20 +- src/layouts/PageLayout.astro | 2 +- src/pages/404.astro | 2 +- src/pages/blog/[...page].astro | 7 +- src/pages/blog/[slug].astro | 11 +- src/pages/index.astro | 6 +- src/utils/getFormatedDate.js | 8 + 28 files changed, 424 insertions(+), 950 deletions(-) delete mode 100644 src/components/widgets/BasicFAQs.astro create mode 100644 src/components/widgets/FAQs.astro create mode 100644 src/utils/getFormatedDate.js diff --git a/.vscode/settings.json b/.vscode/settings.json index 18d6eb4..59460d8 100644 --- a/.vscode/settings.json +++ b/.vscode/settings.json @@ -2,11 +2,11 @@ "prettier.documentSelectors": ["**/*.astro"], "editor.defaultFormatter": "esbenp.prettier-vscode", "[astro]": { - "editor.formatOnSave": true, + "editor.formatOnSave": false, "editor.defaultFormatter": "esbenp.prettier-vscode" }, "[javascript]": { - "editor.formatOnSave": true, + "editor.formatOnSave": false, "editor.defaultFormatter": "esbenp.prettier-vscode" } } diff --git a/src/components/core/BasicScripts.astro b/src/components/core/BasicScripts.astro index 9c0fb83..2d7b485 100644 --- a/src/components/core/BasicScripts.astro +++ b/src/components/core/BasicScripts.astro @@ -1,5 +1,5 @@ --- -const {} = Astro.props; +const { } = Astro.props; --- + \ No newline at end of file diff --git a/src/components/core/MetaTags.astro b/src/components/core/MetaTags.astro index 04a92d5..6a13c49 100644 --- a/src/components/core/MetaTags.astro +++ b/src/components/core/MetaTags.astro @@ -19,8 +19,8 @@ const image = typeof _image === "string" ? new URL(_image, Astro.site) : _image && typeof _image["src"] !== "undefined" - ? new URL(getRelativeUrlByFilePath(_image.src), Astro.site) - : null; + ? new URL(getRelativeUrlByFilePath(_image.src), Astro.site) + : null; --- @@ -29,35 +29,35 @@ const image = {title} -{canonical && } +{canonical && +} -{image && } +{image && +} -{canonical && } +{canonical && +} -{image && } +{image && +} -{canonical && } +{canonical && +} -{image && } +{image && +} - + - + \ No newline at end of file diff --git a/src/components/widgets/BasicCTA.astro b/src/components/widgets/BasicCTA.astro index bd5cd8d..89e0cd9 100644 --- a/src/components/widgets/BasicCTA.astro +++ b/src/components/widgets/BasicCTA.astro @@ -1,18 +1,13 @@ --- -const {} = Astro.props; +const { } = Astro.props; ---
-
-

- Astro + Tailwind CSS +
+

+ Astro + Tailwind CSS

@@ -21,15 +16,11 @@ const {} = Astro.props;

- Get template + Get template

-
+ \ No newline at end of file diff --git a/src/components/widgets/BasicFAQs.astro b/src/components/widgets/BasicFAQs.astro deleted file mode 100644 index cb4db4b..0000000 --- a/src/components/widgets/BasicFAQs.astro +++ /dev/null @@ -1,122 +0,0 @@ ---- -import { Icon } from "astro-icon"; -const {} = Astro.props; ---- - -
-
-
-

- Frequently Asked Questions -

-
-
-
-
-
-
-

- - What do I need to start? -

-

- Space, the final frontier. These are the voyages of the Starship - Enterprise. Its five-year mission: to explore strange new worlds. -

-

- Many say exploration is part of our destiny, but it’s actually our - duty to future generations. -

-
-
-

- - How to install the Astro + Tailwind CSS template? -

-

- Well, the way they make shows is, they make one show. That show's - called a pilot. -

-

- Then they show that show to the people who make shows, and on the - strength of that one show they decide if they're going to make more - shows. Some pilots get picked and become television programs.Some - don't, become nothing. She starred in one of the ones that became - nothing. -

-
-
-

- - What's something that you completely don't understand? -

-

- A flower in my garden, a mystery in my panties. Heart attack never - stopped old Big Bear. I didn't even know we were calling him Big - Bear. -

-
-
-
-
-

- - What's an example of when you changed your mind? -

-

- Michael Knight a young loner on a crusade to champion the cause of - the innocent. The helpless. The powerless in a world of criminals - who operate above the law. Here he comes Here comes Speed Racer. - He's a demon on wheels. -

-
-
-

- - What is something that you would really like to try again? -

-

- A business big enough that it could be listed on the NASDAQ goes - belly up. Disappears! -

-

- It ceases to exist without me. No, you clearly don't know who you're - talking to, so let me clue you in. -

-
-
-

- - If you could only ask one question to each person you meet, what would - that question be? -

-

- This is not about revenge. This is about justice. A lot of things - can change in twelve years, Admiral. Well, that's certainly good to - know. About four years. I got tired of hearing how young I looked. -

-
-
-
-
-
diff --git a/src/components/widgets/BasicFeatures.astro b/src/components/widgets/BasicFeatures.astro index 20f7fe2..c676822 100644 --- a/src/components/widgets/BasicFeatures.astro +++ b/src/components/widgets/BasicFeatures.astro @@ -1,114 +1,73 @@ --- import { Icon } from "astro-icon"; -const {} = Astro.props; +const { } = Astro.props; + +const items = [ + { + title: "Headers", + description: "Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore.", + icon: "flat-color-icons:home" + }, + { + title: "Footers", + description: "Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore.", + icon: "flat-color-icons:faq" + }, + { + title: "Features", + description: "Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore.", + icon: "flat-color-icons:video-projector" + }, + { + title: "Call-to-Action", + description: "Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore.", + icon: "flat-color-icons:video-projector" + }, + { + title: "Pricing", + description: "Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore.", + icon: "flat-color-icons:calculator" + }, + { + title: "Testimonial", + description: "Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore.", + icon: "flat-color-icons:voice-presentation" + } +] ---
-
+ \ No newline at end of file diff --git a/src/components/widgets/BlogList.astro b/src/components/widgets/BlogList.astro index ec332e2..efabee8 100644 --- a/src/components/widgets/BlogList.astro +++ b/src/components/widgets/BlogList.astro @@ -7,31 +7,25 @@ const { page } = Astro.props;
-

+

News and step-by-step guides about - AstroWind + AstroWind

{ - (page.url.prev || page.url.next) && ( - - ) + (page.url.prev || page.url.next) && ( + + ) } -
+ \ No newline at end of file diff --git a/src/components/widgets/BlogListItem.astro b/src/components/widgets/BlogListItem.astro index 9f5df4d..fb1091d 100644 --- a/src/components/widgets/BlogListItem.astro +++ b/src/components/widgets/BlogListItem.astro @@ -1,36 +1,26 @@ --- import Picture from "~/components/core/Picture.astro"; import { findImage } from "~/utils/findImage"; +import { getFormattedDate } from "~/utils/getFormatedDate"; const { post } = Astro.props; const image = await findImage(post.image); --- -
+ +
\ No newline at end of file diff --git a/src/components/widgets/BlogPost.astro b/src/components/widgets/BlogPost.astro index d857db8..76b2b2d 100644 --- a/src/components/widgets/BlogPost.astro +++ b/src/components/widgets/BlogPost.astro @@ -1,5 +1,6 @@ --- import Picture from "~/components/core/Picture.astro"; +import { getFormattedDate } from "~/utils/getFormatedDate"; const { post } = Astro.props; --- @@ -8,39 +9,24 @@ const { post } = Astro.props;

- ~ {Math.ceil(post.readingTime)} min + ~ {Math.ceil(post.readingTime)} min

+ class="px-4 sm:px-6 max-w-3xl mx-auto text-center text-5xl md:text-[3.50rem] font-bold leading-tighter tracking-tighter mb-6 md:mb-8"> {post.title}

{ - post.image && ( - - ) + post.image && ( + + ) }
+ class="container mx-auto px-4 sm:px-6 max-w-3xl prose prose-lg lg:prose-xl dark:prose-invert dark:prose-headings:text-slate-300 prose-md prose-headings:leading-tighter prose-headings:tracking-tighter prose-headings:font-bold prose-a:text-blue-600 dark:prose-a:text-blue-400 prose-img:rounded-md prose-img:shadow-lg mt-8">
- + \ No newline at end of file diff --git a/src/components/widgets/Error404.astro b/src/components/widgets/Error404.astro index 00831ff..c430ddc 100644 --- a/src/components/widgets/Error404.astro +++ b/src/components/widgets/Error404.astro @@ -2,15 +2,11 @@ ---
-
+

Error - 404 + 404

@@ -19,12 +15,10 @@

But dont worry, you can find plenty of other things on our homepage.

- Back to homepage + Back to + homepage
-
+ \ No newline at end of file diff --git a/src/components/widgets/FAQs.astro b/src/components/widgets/FAQs.astro new file mode 100644 index 0000000..7d497e7 --- /dev/null +++ b/src/components/widgets/FAQs.astro @@ -0,0 +1,73 @@ +--- +import { Icon } from "astro-icon"; +const { } = Astro.props; + +const items = [ + [ + { + question: "What do I need to start?", + answer: `Space, the final frontier. These are the voyages of the Starship Enterprise. Its five-year mission: to explore strange new worlds. + + Many say exploration is part of our destiny, but it’s actually our duty to future generations.`, + }, + { + question: "How to install the Astro + Tailwind CSS template?", + answer: `Well, the way they make shows is, they make one show. That show's called a pilot. + + Then they show that show to the people who make shows, and on the strength of that one show they decide if they're going to make more shows. Some pilots get picked and become television programs. Some don't, become nothing. She starred in one of the ones that became nothing.`, + }, + { + question: "What's something that you completely don't understand?", + answer: `A flower in my garden, a mystery in my panties. Heart attack never stopped old Big Bear. I didn't even know we were calling him Big Bear.`, + }, + ], + [ + { + question: "What's an example of when you changed your mind?", + answer: `Michael Knight a young loner on a crusade to champion the cause of the innocent. The helpless. The powerless in a world of criminals who operate above the law. Here he comes Here comes Speed Racer. He's a demon on wheels.`, + }, + { + question: "What is something that you would really like to try again?", + answer: `A business big enough that it could be listed on the NASDAQ goes belly up. Disappears! + + It ceases to exist without me. No, you clearly don't know who you're talking to, so let me clue you in.`, + }, + { + question: + "If you could only ask one question to each person you meet, what would that question be?", + answer: `This is not about revenge. This is about justice. A lot of things can change in twelve years, Admiral. Well, that's certainly good to know. About four years. I got tired of hearing how young I looked.`, + }, + ], +]; +--- + +
+
+
+

+ Frequently Asked Questions +

+
+
+
+
+ { + items.map((subitems) => ( +
+ {subitems.map(({ question, answer }) => ( +
+

+ + {question} +

+ {answer.split("\n\n").map((paragraph) => ( +

+ ))} +

+ ))} +
+ )) + } +
+
+
\ No newline at end of file diff --git a/src/components/widgets/Footer.astro b/src/components/widgets/Footer.astro index 6d9115d..9068ee1 100644 --- a/src/components/widgets/Footer.astro +++ b/src/components/widgets/Footer.astro @@ -1,28 +1,22 @@ --- import { Icon } from "astro-icon"; -const {} = Astro.props; +const { } = Astro.props; --- + \ No newline at end of file diff --git a/src/components/widgets/Header.astro b/src/components/widgets/Header.astro index 56612d7..568c87b 100644 --- a/src/components/widgets/Header.astro +++ b/src/components/widgets/Header.astro @@ -2,99 +2,69 @@ import { Icon } from "astro-icon"; import Logo from "~/components/widgets/Logo.astro"; -const {} = Astro.props; +const { } = Astro.props; ---
-
+ class="sticky top-0 z-40 flex-none mx-auto w-full bg-white/90 dark:bg-slate-900/90 backdrop-blur-sm border-b dark:border-b-0"> +
-
-
+
\ No newline at end of file diff --git a/src/components/widgets/StepsFeatures.astro b/src/components/widgets/StepsFeatures.astro index 3cf0380..eb829dc 100644 --- a/src/components/widgets/StepsFeatures.astro +++ b/src/components/widgets/StepsFeatures.astro @@ -1,5 +1,5 @@ --- -const {} = Astro.props; +const { } = Astro.props; ---
@@ -20,12 +20,8 @@ const {} = Astro.props; tincidunt vehicula. Fusce sit amet dui tellus.

- + Get template
@@ -36,8 +32,7 @@ const {} = Astro.props;
  • + class="flex w-16 h-16 mx-auto items-center justify-center text-2xl font-bold font-heading rounded-full bg-blue-50 text-blue-600"> 1
    @@ -55,8 +50,7 @@ const {} = Astro.props;
  • + class="flex w-16 h-16 mx-auto items-center justify-center text-2xl font-bold font-heading rounded-full bg-blue-50 text-blue-600"> 2
    @@ -72,8 +66,7 @@ const {} = Astro.props;
  • + class="flex w-16 h-16 mx-auto items-center justify-center text-2xl font-bold font-heading rounded-full bg-blue-50 text-blue-600"> 3
    @@ -92,4 +85,4 @@ const {} = Astro.props; -
    • + \ No newline at end of file diff --git a/src/components/widgets/StepsLeft.astro b/src/components/widgets/StepsLeft.astro index 598af18..1de9ebd 100644 --- a/src/components/widgets/StepsLeft.astro +++ b/src/components/widgets/StepsLeft.astro @@ -2,7 +2,7 @@ import { Icon } from "astro-icon"; import Picture from "~/components/core/Picture.astro"; -const {} = Astro.props; +const { } = Astro.props; ---
    @@ -11,13 +11,8 @@ const {} = Astro.props;
    -
    - +
    +
    @@ -37,13 +32,8 @@ const {} = Astro.props;
    -
    - +
    +
    @@ -62,13 +52,8 @@ const {} = Astro.props;
    -
    - +
    +
    @@ -87,13 +72,8 @@ const {} = Astro.props;
    -
    - +
    +
    @@ -108,12 +88,8 @@ const {} = Astro.props;
    + src={import("~/assets/images/astronaut.jpg")} widths={[400, 768]} sizes="(max-width: 768px) 100vw, 432px" + alt="Astronaut" aspectRatio="432:768" />
    -
    + \ No newline at end of file diff --git a/src/components/widgets/TwoColsFeatures.astro b/src/components/widgets/TwoColsFeatures.astro index 1d8bd98..cff96f1 100644 --- a/src/components/widgets/TwoColsFeatures.astro +++ b/src/components/widgets/TwoColsFeatures.astro @@ -1,60 +1,74 @@ --- -const {} = Astro.props; +const { } = Astro.props; + +const items = [ + [ + { + title: "Integration with Tailwind CSS", + description: + "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi sagittis, quam nec venenatis lobortis, mi risus tempus nulla.", + }, + { + title: "Ready-to-use Components", + description: + "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi sagittis, quam nec venenatis lobortis, mi risus tempus nulla.", + }, + { + title: "Best Practices", + description: + "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi sagittis, quam nec venenatis lobortis, mi risus tempus nulla.", + }, + ], + [ + { + title: "Excelent Page Speed", + description: + "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi sagittis, quam nec venenatis lobortis, mi risus tempus nulla.", + }, + { + title: "Frequently updated", + description: + "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi sagittis, quam nec venenatis lobortis, mi risus tempus nulla.", + }, + { + title: "Open to new ideas and contributions", + description: + "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi sagittis, quam nec venenatis lobortis, mi risus tempus nulla.", + }, + ], +]; ---
    -
    +
    -

    +

    Features

    -

    +

    What's interesting about AstroWind + class="bg-clip-text text-transparent bg-gradient-to-r from-blue-500 to-pink-500 whitespace-nowrap">AstroWind

    -

    +

    Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque rem aperiam, eaque ipsa quae.

    + { + items.map((subitems) => (
    + {subitems.map(({ title, description }) => (
    -
    - +
    + - + - - - + + @@ -63,219 +77,17 @@ const {} = Astro.props;

    - Integration with Tailwind CSS + {title}

    - Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi - sagittis, quam nec venenatis lobortis, mi risus tempus nulla. -

    -
    -
    -
    -
    -
    - - - - - - - - - - - -
    -
    -
    -

    Ready-to-use Components

    -

    - Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi - sagittis, quam nec venenatis lobortis, mi risus tempus nulla. -

    -
    -
    -
    -
    -
    - - - - - - - - - - - -
    -
    -
    -

    Best Practices

    -

    - Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi - sagittis, quam nec venenatis lobortis, mi risus tempus nulla. -

    -
    -
    -
    -
    -
    -
    -
    - - - - - - - - - - - -
    -
    -
    -

    Excelent Page Speed

    -

    - Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi - sagittis, quam nec venenatis lobortis, mi risus tempus nulla. -

    -
    -
    -
    -
    -
    - - - - - - - - - - - -
    -
    -
    -

    Frequently updated

    -

    - Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi - sagittis, quam nec venenatis lobortis, mi risus tempus nulla. -

    -
    -
    -
    -
    -
    - - - - - - - - - - - -
    -
    -
    -

    - Open to new ideas and contributions -

    -

    - Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi - sagittis, quam nec venenatis lobortis, mi risus tempus nulla. + {description}

    + ))}
    + )) + }
    -
    + \ No newline at end of file diff --git a/src/layouts/BaseLayout.astro b/src/layouts/BaseLayout.astro index 7f9939b..a48bf25 100644 --- a/src/layouts/BaseLayout.astro +++ b/src/layouts/BaseLayout.astro @@ -9,14 +9,14 @@ const { meta = {} } = Astro.props; - - - - - - - - + + + + + + + + + + \ No newline at end of file diff --git a/src/layouts/PageLayout.astro b/src/layouts/PageLayout.astro index d07a1bb..0c6c1cd 100644 --- a/src/layouts/PageLayout.astro +++ b/src/layouts/PageLayout.astro @@ -11,4 +11,4 @@ const { meta } = Astro.props;