From 6610a27857e6c714c88046bf4d34b853faa75bc0 Mon Sep 17 00:00:00 2001 From: Emil Gulamov <125820963+mearashadowfax@users.noreply.github.com> Date: Tue, 13 Feb 2024 05:50:53 +0400 Subject: [PATCH] Update image handling and responsive button text sizing Simplified image handling configuration in the "astro.config.mjs" by removing explicit sizing. Updated text sizing of PrimaryCTA and SecondaryCTA components to scale responsively in 2xl views. Aimed to improve the user interface and experience on larger screens. --- package-lock.json | 22 ++++ package.json | 1 + src/components/ClientsSection.astro | 11 +- src/components/FeaturesGeneral.astro | 12 +-- src/components/FeaturesNavs.astro | 8 +- src/components/HeroSection.astro | 10 +- src/components/Meta.astro | 30 +++--- src/components/Navbar.astro | 27 +---- src/components/PricingSection.astro | 14 ++- src/components/TestimonialsSection.astro | 7 +- src/components/ThemeIcon.astro | 104 +++++++------------ src/components/ui/blocks/AccordionItem.astro | 4 +- src/components/ui/blocks/IconBlock.astro | 2 +- src/components/ui/blocks/TabNav.astro | 2 +- src/components/ui/buttons/PrimaryCTA.astro | 2 +- src/components/ui/buttons/SecondaryCTA.astro | 2 +- src/components/ui/links/NavLink.astro | 7 +- src/layouts/MainLayout.astro | 5 + src/pages/contact.astro | 10 ++ src/pages/index.astro | 5 +- src/pages/robots.txt.ts | 1 + tailwind.config.mjs | 5 +- 22 files changed, 145 insertions(+), 146 deletions(-) diff --git a/package-lock.json b/package-lock.json index 8d5449e..738a0ac 100644 --- a/package-lock.json +++ b/package-lock.json @@ -17,6 +17,7 @@ "typescript": "^5.3.3" }, "devDependencies": { + "@tailwindcss/forms": "^0.5.7", "prettier": "^3.2.5", "prettier-plugin-astro": "^0.13.0", "prettier-plugin-tailwindcss": "^0.5.11" @@ -1236,6 +1237,18 @@ "win32" ] }, + "node_modules/@tailwindcss/forms": { + "version": "0.5.7", + "resolved": "https://registry.npmjs.org/@tailwindcss/forms/-/forms-0.5.7.tgz", + "integrity": "sha512-QE7X69iQI+ZXwldE+rzasvbJiyV/ju1FGHH0Qn2W3FKbuYtqp8LKcy6iSw79fVUT5/Vvf+0XgLCeYVG+UV6hOw==", + "dev": true, + "dependencies": { + "mini-svg-data-uri": "^1.2.3" + }, + "peerDependencies": { + "tailwindcss": ">=3.0.0 || >= 3.0.0-alpha.1" + } + }, "node_modules/@types/babel__core": { "version": "7.20.5", "resolved": "https://registry.npmjs.org/@types/babel__core/-/babel__core-7.20.5.tgz", @@ -4591,6 +4604,15 @@ "url": "https://github.com/sponsors/sindresorhus" } }, + "node_modules/mini-svg-data-uri": { + "version": "1.4.4", + "resolved": "https://registry.npmjs.org/mini-svg-data-uri/-/mini-svg-data-uri-1.4.4.tgz", + "integrity": "sha512-r9deDe9p5FJUPZAk3A59wGH7Ii9YrjjWw0jmw/liSbHl2CHiyXj6FcDXDu2K3TjVAXqiJdaw3xxwlZZr9E6nHg==", + "dev": true, + "bin": { + "mini-svg-data-uri": "cli.js" + } + }, "node_modules/minimatch": { "version": "9.0.3", "resolved": "https://registry.npmjs.org/minimatch/-/minimatch-9.0.3.tgz", diff --git a/package.json b/package.json index 3395f29..013ddba 100644 --- a/package.json +++ b/package.json @@ -20,6 +20,7 @@ "typescript": "^5.3.3" }, "devDependencies": { + "@tailwindcss/forms": "^0.5.7", "prettier": "^3.2.5", "prettier-plugin-astro": "^0.13.0", "prettier-plugin-tailwindcss": "^0.5.11" diff --git a/src/components/ClientsSection.astro b/src/components/ClientsSection.astro index 68dc1c1..3822cfb 100644 --- a/src/components/ClientsSection.astro +++ b/src/components/ClientsSection.astro @@ -1,14 +1,11 @@ --- -/* `title` variable used to customise the heading. */ +// Variables for customization of the LoginModal Component +// Main heading const title: string = "Trusted by Industry Leaders"; -/* `subTitle` variable used to customise the sub-heading text. */ +// Sub-heading text const subTitle: string = "Experience the reliability chosen by industry giants."; - -/* - In the above, the title and subTitle attributes are variables part of the ClientsSection component. -*/ ---

{title}

diff --git a/src/components/FeaturesGeneral.astro b/src/components/FeaturesGeneral.astro index 02dd9c1..26044bc 100644 --- a/src/components/FeaturesGeneral.astro +++ b/src/components/FeaturesGeneral.astro @@ -1,19 +1,15 @@ --- -// import necessary dependencies +// Import the necessary dependencies from individual component files import { Image } from "astro:assets"; import featureImage from "../images/features-image.avif"; import IconBlock from "./ui/blocks/IconBlock.astro"; -/* `title` variable used to customise the heading. */ +// Main heading const title: string = "Meeting Industry Demands"; -/* `subTitle` variable used to customise the sub-heading text. */ +// Sub-heading text const subTitle: string = "At ScrewFast, we tackle the unique challenges encountered in the hardware and construction sectors. From cutting-edge tools to expert services, we're dedicated to helping you overcome obstacles and achieve your goals."; - -/* - In the above, the title and subTitle attributes are variables part of the FeaturesGeneral component. -*/ ---

{title}

diff --git a/src/components/FeaturesNavs.astro b/src/components/FeaturesNavs.astro index ff0eaf8..7d16874 100644 --- a/src/components/FeaturesNavs.astro +++ b/src/components/FeaturesNavs.astro @@ -1,17 +1,13 @@ --- +// Import the necessary dependencies from individual component files import TabNav from "./ui/blocks/TabNav.astro"; import TabContent from "./ui/blocks/TabContent.astro"; -import { Image } from "astro:assets"; import construction from "../images/construction-image.avif"; import tools from "../images/automated-tools.avif"; import dashboard from "../images/dashboard-image.avif"; -/* `title` variable used to customise the heading. */ +// Main heading const title: string = `Customize ScrewFast's offerings to perfectly suit your hardware and construction needs.`; - -/* - In the above, the title attribute is a variable part of the FeaturesNavs component. -*/ ---

@@ -126,9 +126,11 @@ const reviews:string = "12.8k";

diff --git a/src/components/Meta.astro b/src/components/Meta.astro index 44cb457..65fa26e 100644 --- a/src/components/Meta.astro +++ b/src/components/Meta.astro @@ -1,19 +1,22 @@ --- -const title: string = "ScrewFast"; -const author:string = "Emil Gulamov" -const description:string = ""; -const URL:string = "https://screw-fast.vercel.app"; -const socialImage:string = "https://screw-fast.vercel.app/social.png"; +// Customize the following metadata for your landing page + +const title: string = "ScrewFast"; // Replace with your website title +const ogTitle: string = "ScrewFast: Hardware Tools & Construction Services"; // Replace with your Open Graph title +const author:string = "Emil Gulamov" // Replace with the author's name +const description:string = "ScrewFast offers top-tier hardware tools and expert construction services to meet all your project needs. Start exploring and contact our sales team for superior quality and reliability."; // Replace with your site description +const URL:string = "https://screw-fast.vercel.app"; // Replace with your website URL +const socialImage:string = "https://screw-fast.vercel.app/social.png"; // Replace with the URL to your social media image --- - + @@ -41,13 +44,16 @@ const socialImage:string = "https://screw-fast.vercel.app/social.png"; - + + + + diff --git a/src/components/Navbar.astro b/src/components/Navbar.astro index c3435d8..afec18a 100644 --- a/src/components/Navbar.astro +++ b/src/components/Navbar.astro @@ -1,6 +1,8 @@ --- +// Import the necessary dependencies from individual component files import ThemeIcon from "./ThemeIcon.astro"; import NavLink from "./ui/links/NavLink.astro"; +import Authentication from "./Authentication.astro"; ---
@@ -126,27 +128,8 @@ import NavLink from "./ui/links/NavLink.astro"; - - - - - - - Log in - + + diff --git a/src/components/PricingSection.astro b/src/components/PricingSection.astro index f94e635..9005ab5 100644 --- a/src/components/PricingSection.astro +++ b/src/components/PricingSection.astro @@ -1,17 +1,15 @@ --- -// import necessary dependencies +// Import the necessary dependencies from individual component files import SecondaryCTA from "./ui/buttons/SecondaryCTA.astro"; -/* `title` variable used to customise the heading. */ + +// Variables for customization of the LoginModal Component +// Main heading const title: string = "Simple, Transparent Pricing"; -/* `subTitle` variable used to customise the sub-heading text. */ +// Sub-heading text const subTitle: string = "Boost efficiency with ScrewFast's clear, value-driven plans."; -/* - In the above, the title and subTitle attributes are variables part of the PricingSection component. -*/ - /* TypeScript type for product. */ type Product = { name: string; @@ -62,7 +60,7 @@ const professionalToolbox: Product = {

{title}

diff --git a/src/components/TestimonialsSection.astro b/src/components/TestimonialsSection.astro index c5c33fb..828e509 100644 --- a/src/components/TestimonialsSection.astro +++ b/src/components/TestimonialsSection.astro @@ -1,8 +1,9 @@ --- -/* `title` variable used to customise the main heading. */ +// Variables for customization of the LoginModal Component +// Main heading const title: string = "Fast-Track Your Projects"; -/* `subTitle` variable used to customise the sub-heading text. */ +// Sub-heading text const subTitle: string = "At ScrewFast, we ensure a swift start with instant account setup. Experience the speed of construction redefined."; @@ -22,7 +23,7 @@ const testimonials: Testimonial[] = [ author: "Samantha Ruiz", role: "Chief Operating Officer | ConstructIt Inc.", avatarSrc: - "https://images.unsplash.com/photo-1542206395-9feb3edaa68d?q=80&w=1528&auto=format&fit=crop&ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D", + "https://images.unsplash.com/photo-1669837401587-f9a4cfe3126e?ixlib=rb-4.0.3&ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&auto=format&fit=facearea&facepad=2&w=320&h=320&q=80", }, ]; diff --git a/src/components/ThemeIcon.astro b/src/components/ThemeIcon.astro index c2d8766..9af55bc 100644 --- a/src/components/ThemeIcon.astro +++ b/src/components/ThemeIcon.astro @@ -1,67 +1,43 @@ -
- - - -
+ diff --git a/src/components/ui/blocks/AccordionItem.astro b/src/components/ui/blocks/AccordionItem.astro index fe1cc0c..2e55267 100644 --- a/src/components/ui/blocks/AccordionItem.astro +++ b/src/components/ui/blocks/AccordionItem.astro @@ -15,7 +15,7 @@ interface Props { id={id} >
diff --git a/src/components/ui/blocks/IconBlock.astro b/src/components/ui/blocks/IconBlock.astro index a40a610..7b91698 100644 --- a/src/components/ui/blocks/IconBlock.astro +++ b/src/components/ui/blocks/IconBlock.astro @@ -11,7 +11,7 @@ interface Props {

{heading}

diff --git a/src/components/ui/blocks/TabNav.astro b/src/components/ui/blocks/TabNav.astro index 8f8cfa4..6d10da2 100644 --- a/src/components/ui/blocks/TabNav.astro +++ b/src/components/ui/blocks/TabNav.astro @@ -22,7 +22,7 @@ Example: