jalil/achat-maison-albi-fr
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity

Add new ContactSection_fr component and update related Icons

Browse source 
Introduced a new ContactSection_fr.astro component to handle the Contact Us section of the application and expanded the Icon component to encompass new icons used in the ContactSection.
This commit is contained in:
Emil Gulamov 2024-03-25 22:40:28 +04:00
parent 5a7150cc05
commit a7abaee69f
2 changed files with 68 additions and 56 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

61
src/components/sections/ContactSection.astro
View file

@ -6,6 +6,7 @@ import TextInput from "../ui/forms/input/TextInput.astro";
import EmailContactInput from "../ui/forms/input/EmailContactInput.astro";
import PhoneInput from "../ui/forms/input/PhoneInput.astro";
import TextAreaInput from "../ui/forms/input/TextAreaInput.astro";
import Icon from "../ui/icons/Icon.astro";
// Define the variables that will be used in this component
const title: string = "Contact us";
@ -82,19 +83,7 @@ const formSubTitle: string = "We'll get back to you in 1-2 business days.";
linkTitle="Visit guides & tutorials"
linkURL="#"
isArrowVisible={true}
><svg
class="mt-1.5 h-6 w-6 flex-shrink-0 text-neutral-600 dark:text-neutral-400"
fill="none"
viewBox="0 0 24 24"
stroke-width="1.5"
stroke="currentColor"
>
<path
stroke-linecap="round"
stroke-linejoin="round"
d="M9.879 7.519c1.171-1.025 3.071-1.025 4.242 0 1.172 1.025 1.172 2.687 0 3.712-.203.179-.43.326-.67.442-.745.361-1.45.999-1.45 1.827v.75M21 12a9 9 0 1 1-18 0 9 9 0 0 1 18 0Zm-9 5.25h.008v.008H12v-.008Z"
></path>
</svg>
><Icon name="question" />
</ContactIconBlock>
<ContactIconBlock
@ -104,19 +93,7 @@ const formSubTitle: string = "We'll get back to you in 1-2 business days.";
linkTitle="Visit FAQ"
linkURL="#"
isArrowVisible={true}
><svg
class="mt-1.5 h-6 w-6 flex-shrink-0 text-neutral-600 dark:text-neutral-400"
fill="none"
viewBox="0 0 24 24"
stroke-width="1.5"
stroke="currentColor"
>
<path
stroke-linecap="round"
stroke-linejoin="round"
d="M20.25 8.511c.884.284 1.5 1.128 1.5 2.097v4.286c0 1.136-.847 2.1-1.98 2.193-.34.027-.68.052-1.02.072v3.091l-3-3c-1.354 0-2.694-.055-4.02-.163a2.115 2.115 0 0 1-.825-.242m9.345-8.334a2.126 2.126 0 0 0-.476-.095 48.64 48.64 0 0 0-8.048 0c-1.131.094-1.976 1.057-1.976 2.192v4.286c0 .837.46 1.58 1.155 1.951m9.345-8.334V6.637c0-1.621-1.152-3.026-2.76-3.235A48.455 48.455 0 0 0 11.25 3c-2.115 0-4.198.137-6.24.402-1.608.209-2.76 1.614-2.76 3.235v6.226c0 1.621 1.152 3.026 2.76 3.235.577.075 1.157.14 1.74.194V21l4.155-4.155"
></path>
</svg>
><Icon name="chatBubble" />
</ContactIconBlock>
<ContactIconBlock
@ -124,23 +101,7 @@ const formSubTitle: string = "We'll get back to you in 1-2 business days.";
content="UK ScrewFast"
isAddressVisible={true}
addressContent="72 Union Terrace, E10 4PE London"
><svg
class="mt-1.5 h-6 w-6 flex-shrink-0 text-neutral-600 dark:text-neutral-400"
fill="none"
viewBox="0 0 24 24"
stroke-width="1.5"
stroke="currentColor"
>
<path
stroke-linecap="round"
stroke-linejoin="round"
d="M15 10.5a3 3 0 1 1-6 0 3 3 0 0 1 6 0Z"></path>
<path
stroke-linecap="round"
stroke-linejoin="round"
d="M19.5 10.5c0 7.142-7.5 11.25-7.5 11.25S4.5 17.642 4.5 10.5a7.5 7.5 0 1 1 15 0Z"
></path>
</svg>
><Icon name="mapPin" />
</ContactIconBlock>
<ContactIconBlock
@ -149,19 +110,7 @@ const formSubTitle: string = "We'll get back to you in 1-2 business days.";
isLinkVisible={true}
linkTitle="support@screwfast.uk"
linkURL="#"
><svg
class="mt-1.5 h-6 w-6 flex-shrink-0 text-neutral-600 dark:text-neutral-400"
fill="none"
viewBox="0 0 24 24"
stroke-width="1.5"
stroke="currentColor"
>
<path
stroke-linecap="round"
stroke-linejoin="round"
d="M21.75 9v.906a2.25 2.25 0 0 1-1.183 1.981l-6.478 3.488M2.25 9v.906a2.25 2.25 0 0 0 1.183 1.981l6.478 3.488m8.839 2.51-4.66-2.51m0 0-1.023-.55a2.25 2.25 0 0 0-2.134 0l-1.022.55m0 0-4.661 2.51m16.5 1.615a2.25 2.25 0 0 1-2.25 2.25h-15a2.25 2.25 0 0 1-2.25-2.25V8.844a2.25 2.25 0 0 1 1.183-1.981l7.5-4.039a2.25 2.25 0 0 1 2.134 0l7.5 4.039a2.25 2.25 0 0 1 1.183 1.98V19.5Z"
></path>
</svg>
><Icon name="envelopeOpen" />
</ContactIconBlock>
</div>
</div>

63
src/components/ui/icons/icons.ts
View file

@ -343,4 +343,67 @@ export const Icons = {
viewBox: "0 0 16 16",
fill: "currentColor",
},
question: {
paths: [
{
d: "M9.879 7.519c1.171-1.025 3.071-1.025 4.242 0 1.172 1.025 1.172 2.687 0 3.712-.203.179-.43.326-.67.442-.745.361-1.45.999-1.45 1.827v.75M21 12a9 9 0 1 1-18 0 9 9 0 0 1 18 0Zm-9 5.25h.008v.008H12v-.008Z",
},
],
class:
"mt-1.5 h-6 w-6 flex-shrink-0 text-neutral-600 dark:text-neutral-400",
viewBox: "0 0 24 24",
fill: "none",
strokeWidth: "1.5",
strokeLinecap: "round",
strokeLinejoin: "round",
stroke: "currentColor",
},
chatBubble: {
paths: [
{
d: "M20.25 8.511c.884.284 1.5 1.128 1.5 2.097v4.286c0 1.136-.847 2.1-1.98 2.193-.34.027-.68.052-1.02.072v3.091l-3-3c-1.354 0-2.694-.055-4.02-.163a2.115 2.115 0 0 1-.825-.242m9.345-8.334a2.126 2.126 0 0 0-.476-.095 48.64 48.64 0 0 0-8.048 0c-1.131.094-1.976 1.057-1.976 2.192v4.286c0 .837.46 1.58 1.155 1.951m9.345-8.334V6.637c0-1.621-1.152-3.026-2.76-3.235A48.455 48.455 0 0 0 11.25 3c-2.115 0-4.198.137-6.24.402-1.608.209-2.76 1.614-2.76 3.235v6.226c0 1.621 1.152 3.026 2.76 3.235.577.075 1.157.14 1.74.194V21l4.155-4.155",
},
],
class:
"mt-1.5 h-6 w-6 flex-shrink-0 text-neutral-600 dark:text-neutral-400",
viewBox: "0 0 24 24",
fill: "none",
strokeWidth: "1.5",
strokeLinecap: "round",
strokeLinejoin: "round",
stroke: "currentColor",
},
mapPin: {
paths: [
{
d: "M15 10.5a3 3 0 1 1-6 0 3 3 0 0 1 6 0Z",
},
{
d: "M19.5 10.5c0 7.142-7.5 11.25-7.5 11.25S4.5 17.642 4.5 10.5a7.5 7.5 0 1 1 15 0Z",
},
],
class:
"mt-1.5 h-6 w-6 flex-shrink-0 text-neutral-600 dark:text-neutral-400",
viewBox: "0 0 24 24",
fill: "none",
strokeWidth: "1.5",
strokeLinecap: "round",
strokeLinejoin: "round",
stroke: "currentColor",
},
envelopeOpen: {
paths: [
{
d: "M21.75 9v.906a2.25 2.25 0 0 1-1.183 1.981l-6.478 3.488M2.25 9v.906a2.25 2.25 0 0 0 1.183 1.981l6.478 3.488m8.839 2.51-4.66-2.51m0 0-1.023-.55a2.25 2.25 0 0 0-2.134 0l-1.022.55m0 0-4.661 2.51m16.5 1.615a2.25 2.25 0 0 1-2.25 2.25h-15a2.25 2.25 0 0 1-2.25-2.25V8.844a2.25 2.25 0 0 1 1.183-1.981l7.5-4.039a2.25 2.25 0 0 1 2.134 0l7.5 4.039a2.25 2.25 0 0 1 1.183 1.98V19.5Z",
},
],
class:
"mt-1.5 h-6 w-6 flex-shrink-0 text-neutral-600 dark:text-neutral-400",
viewBox: "0 0 24 24",
fill: "none",
strokeWidth: "1.5",
strokeLinecap: "round",
strokeLinejoin: "round",
stroke: "currentColor",
},
};