From 4195374838267be877f5c469f1a3f419f17ed915 Mon Sep 17 00:00:00 2001 From: Devsi Date: Mon, 11 Sep 2023 22:54:07 +0530 Subject: [PATCH] steps section updated --- index.html | 116 ++++++++++++++++++++-------------------- resources/Vector28.png | Bin 0 -> 5185 bytes styles.css | 118 +++++++++++++++++++++++++++++++++++++++++ 3 files changed, 176 insertions(+), 58 deletions(-) create mode 100644 resources/Vector28.png diff --git a/index.html b/index.html index 0713992..e4ba4e6 100644 --- a/index.html +++ b/index.html @@ -90,17 +90,14 @@

Reimagining the Next Generation of App Store for Utility NFTs.

-
-
- -
-
+
+
+ +
+

Explore Possibilities
@@ -120,7 +117,8 @@

+

MyriadFlow offers individual digital marketplace where creators and organizations can buy, sell, and trade NFTs. Get your NFT @@ -156,7 +154,8 @@

+

Offering NFTs that change the concept, that is, Dynamic NFTs that provide dynamic features, changes in a DNFT smart contract are based on @@ -194,7 +193,8 @@

+

Experience both the physical and digital worlds with Myriadflow. Explore online shopping with in-store pickup or virtual reality games incorporating real-world objects. Make your NFT trading and transferring @@ -223,71 +223,71 @@

-

+

AIREX
(Augmented Interactive Reality Experiences)
- +

- -
+ +

Now offer Augmented Interactive Reality Experiences by creating modifiable single layer NFTs where users literally get to interact with it.


-

MyriadFlow makes it easier to launch AIREX integrating Chain-link VRF and algorithmic SDKs.

+

MyriadFlow makes it easier to launch AIREX integrating Chain-link VRF + and algorithmic SDKs.

-

- 3 Simple Steps
MyriadFlow + class="pt-14 m28:text-2xl text-3xl m48:text-4xl m28:font-extrabold text-center font-black lg:font-extrabold mb-20 sm:mb-24"> + You are three steps away!

-
-
-
-

- Choose NFT Experience -

-

- Select the NFT experience you would like to offer with options - ranging from NFT Store, Collection, Utilities (Rent, Lend, - Fraction, Access etc.), Physical Asset to NFT, - Subscriptions-as-NFT, Profile Picture Projects etc. -

-
-
-

- Select Authentication -

-

- Select Authentication Option for your users with options as Web3 - Authentication and Web2 login along with Custodial Wallet. -

-
-
-

- Configure Payment Options -

-

- Choose Blockchain Deployment & Payment Options ranging from - selecting Crypto (ETH, Matic, ONE, SOL, NEAR, ATOM) & Fiat (USD, - AED, INR) Integrated with Crypto On/Off Ramp Service. -

-
+ + +
+
+ +
Choose NFT Experience
+
Select the NFT experience you would like to offer + with options ranging from NFT Store, Collection, + Utilities (Rent, Lend, Fraction, Access etc.), + Physical Asset to NFT, Subscriptions-as-NFT, + Profile Picture Projects etc.
+
+ +
+ +
Select Authentication
+
Select Authentication Option for your users with + options as Web3 Authentication and Web2 + login along with Custodial Wallet.
+
+ +
+ +
Configure Payment + Options
+
Choose Blockchain Deployment & Payment Options + ranging from selecting Crypto(ETH, Matic, ONE, SOL, + NEAR, ATOM) & Fiat (USD, AED, INR) Integrated + with Crypto On/Off Ramp Service.
+
+
diff --git a/resources/Vector28.png b/resources/Vector28.png new file mode 100644 index 0000000000000000000000000000000000000000..8eef283da61547887ea6263ddd09aac45a1a6545 GIT binary patch literal 5185 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 literal 0 HcmV?d00001 diff --git a/styles.css b/styles.css index 89b78f2..dfc3fb6 100644 --- a/styles.css +++ b/styles.css @@ -50,6 +50,124 @@ body { color: white; } +.image-margin { + margin: 20px; +} + +.size{ + width: 350px; /* Set the desired width */ + height: 350px; +} + +.text-container { + position: relative; +} + +.image-text2 { + position: absolute; + top: 50%; /* Position the text vertically in the middle of the container */ + left: 50%; /* Position the text horizontally in the middle of the container */ + transform: translate(-30%, -200%); /* Center the text precisely */ + padding: 10px; /* Adjust padding as needed */ + font-size: 18px; /* Adjust font size as needed */ + width: 80%; +} +.image-text5 { + position: absolute; + top: 50%; /* Position the text vertically in the middle of the container */ + left: 50%; /* Position the text horizontally in the middle of the container */ + transform: translate(-45%, -30%); /* Center the text precisely */ + padding: 10px; /* Adjust padding as needed */ + font-size: 18px; /* Adjust font size as needed */ + width: 20%; +} + +@media (max-width: 1000px) { + .image-container { + flex-direction: column; + position: relative; + } + .image-container img { + /* position: absolute; */ + top: 50%; + left: 50%; + transform: translate(0%, 0%); + max-width: 100%; + max-height: 100%; + } + .size{ + width: 100%; /* Set the desired width */ + height: 100%; + } + .image-margin { + margin: 10px; + } + .image-text5 { + position: absolute; + top: 50%; /* Position the text vertically in the middle of the container */ + left: 50%; /* Position the text horizontally in the middle of the container */ + transform: translate(-45%, -30%); /* Center the text precisely */ + padding: 10px; /* Adjust padding as needed */ + font-size: 18px; /* Adjust font size as needed */ + width: 100%; + } +} + +@media (max-width: 1000px) and (min-width: 500px) { + .image-container { + flex-direction: column; + position: relative; + } + .image-container img { + /* position: absolute; */ + top: 50%; + left: 50%; + transform: translate(30%, 0%); + max-width: 100%; + max-height: 100%; + } + .size{ + width: 60%; /* Set the desired width */ + height: 100%; + } + .image-margin { + margin: 10px; + } + .image-text2 { + position: absolute; + top: 50%; /* Position the text vertically in the middle of the container */ + left: 50%; /* Position the text horizontally in the middle of the container */ + transform: translate(-30%, -200%); /* Center the text precisely */ + padding: 10px; /* Adjust padding as needed */ + font-size: 18px; /* Adjust font size as needed */ + width: 60%; + } + .image-text5 { + position: absolute; + top: 50%; /* Position the text vertically in the middle of the container */ + left: 50%; /* Position the text horizontally in the middle of the container */ + transform: translate(-45%, -30%); /* Center the text precisely */ + padding: 10px; /* Adjust padding as needed */ + font-size: 18px; /* Adjust font size as needed */ + width: 50%; + } +} + +@media (min-width: 999px) { + .image-container { + flex-direction: row; + } + .image-text5 { + position: absolute; + top: 50%; /* Position the text vertically in the middle of the container */ + left: 50%; /* Position the text horizontally in the middle of the container */ + transform: translate(-45%, -30%); /* Center the text precisely */ + padding: 10px; /* Adjust padding as needed */ + font-size: 18px; /* Adjust font size as needed */ + width: 80%; + } +} + /* ! tailwindcss v3.0.23 | MIT License | https://tailwindcss.com */ /*