Compare commits
107 Commits
| Author | SHA1 | Date | |
|---|---|---|---|
| d2f1c182d1 | |||
| ff17334276 | |||
| 07db62278f | |||
| deda7c4c74 | |||
| e2eea47196 | |||
| c2eda57bf3 | |||
| 528034296e | |||
| 96d18db2c3 | |||
| b9bacea543 | |||
| f23e179332 | |||
| 96b1c8d6a6 | |||
| 3cc45e39b3 | |||
| 43f858243f | |||
| 90cfa7541c | |||
| 9c82def2c2 | |||
| bf599d98e9 | |||
| 0857dd144a | |||
| 4259ddb98f | |||
| c33af79371 | |||
| 926ae7c663 | |||
| 060a600214 | |||
| 0c8d1bfd81 | |||
| 6180f50263 | |||
| 8c1fcf53b5 | |||
| fec6b84c7a | |||
| 96aed44305 | |||
| 19b4cb59f3 | |||
| 0af0f4a4b9 | |||
| 9b4a082d92 | |||
| 6b9d2e1877 | |||
| 7bcad6d033 | |||
| d4788b6517 | |||
| fc98d78742 | |||
| 4e7750d706 | |||
| ab5093b253 | |||
| d292b359d5 | |||
| 5414eca8f7 | |||
| 3a38dc293d | |||
| ce70aceff9 | |||
| d913e58f3f | |||
| 137221d0ae | |||
| 39558313b2 | |||
| 6e6a437d39 | |||
| 9ec18f41cd | |||
| 86d6c54d8a | |||
| 0fe9bce492 | |||
| 6d956309e9 | |||
| e356bf3ea1 | |||
| de29ec70a5 | |||
| 024db8e2d5 | |||
| ec1cbd9364 | |||
| 13173ddb46 | |||
| 9780468013 | |||
| 5cd0f8106c | |||
| 7633ecfafa | |||
| 04fc8d530f | |||
| 7fd72924b4 | |||
| a37c0bd2ed | |||
| 800da885a5 | |||
| 4b75e02b99 | |||
| a9626fd8f2 | |||
| 88e2ccf237 | |||
| a86b00abe8 | |||
| e066cc62fc | |||
| 4d8cd1e7f4 | |||
| 29723863de | |||
| 935ff983fc | |||
| 57171133b1 | |||
| 12b2dde302 | |||
| 7f999dfc8a | |||
| 9f5ca78913 | |||
| 492008630f | |||
| ab566937b7 | |||
| 5e974e0637 | |||
| 31ee4e01ac | |||
| f79831f0da | |||
| eab01068d2 | |||
| d49a71b97a | |||
| c0b77f911f | |||
| 46341abf2a | |||
| 7f8fc1086f | |||
| a312984df8 | |||
| 490492bd0f | |||
| e78561c93f | |||
| e13d973b30 | |||
| bd3d945f55 | |||
| 62e7cda35d | |||
| e11c35e49b | |||
| 9e23fd83a8 | |||
| 537e639a65 | |||
| 02075a95c0 | |||
| 2873b22183 | |||
| 7b01bea019 | |||
| 6dd5dbc7b2 | |||
| f8acc0a29e | |||
| d175ef8922 | |||
| 751bcd6c5d | |||
| 8a4c7d92e8 | |||
| 0c4e464c5e | |||
| 3586b01756 | |||
| 715972dbde | |||
| 9cc252b2cd | |||
| a1b56a0b81 | |||
| 87ea20bde8 | |||
| 0ebbc26104 | |||
| e323168927 | |||
| 2224472046 |
@@ -5,7 +5,7 @@ REACT_APP_USERS_ENDPOINT="https://apigate.lotus.g1.wrenchboard.com/en/wrench/api
|
||||
|
||||
REACT_APP_SITE_NAME='WrenchBoard'
|
||||
REACT_APP_DASH_URL='https://dev-users.wrenchboard.com'
|
||||
REACT_APP_DASH_URL_LOGIN="https://dev-users.wrenchboard.com/login"
|
||||
REACT_APP_DASH_URL_LOGIN="https://dev-users.wrenchboard.com/login?cnt=us"
|
||||
REACT_APP_DASH_URL_SIGNUP="https://dev-users.wrenchboard.com/signup?cnt=us"
|
||||
REACT_APP_ANDROID_APP='https://play.google.com/store/apps/details?id=com.wrenchboard.users'
|
||||
REACT_APP_APPLE_APP='https://itunes.apple.com/us/app/wrenchboard/id1435718367?ls=1&mt=8'
|
||||
@@ -17,3 +17,6 @@ REACT_APP_SUPPORT_PHONE='404 855-7966'
|
||||
REACT_APP_SUPPORT_PHONE_NG='(+420) 336 476 328'
|
||||
REACT_APP_SUPPORT_US_ADDRESS='Cumberland Pkwy, Atlanta GA 30339'
|
||||
REACT_APP_SUPPORT_NG_ADDRESS='Saka Tinubu Street, Victoria Island Lagos, Nigeria'
|
||||
|
||||
#AGENT LINK
|
||||
REACT_APP_AGENT_LINK='https://dev-agents.wrenchboard.com'
|
||||
|
||||
@@ -5,7 +5,7 @@ REACT_APP_USERS_ENDPOINT="https://apigate.lotus.g1.wrenchboard.com/en/wrench/api
|
||||
|
||||
REACT_APP_SITE_NAME='WrenchBoard'
|
||||
REACT_APP_DASH_URL='https://dev-users.wrenchboard.com'
|
||||
REACT_APP_DASH_URL_LOGIN="https://dev-users.wrenchboard.com/login"
|
||||
REACT_APP_DASH_URL_LOGIN="https://dev-users.wrenchboard.com/login?cnt=us"
|
||||
REACT_APP_DASH_URL_SIGNUP="https://dev-users.wrenchboard.com/signup?cnt=us"
|
||||
REACT_APP_ANDROID_APP='https://play.google.com/store/apps/details?id=com.wrenchboard.users'
|
||||
REACT_APP_APPLE_APP='https://itunes.apple.com/us/app/wrenchboard/id1435718367?ls=1&mt=8'
|
||||
@@ -16,4 +16,7 @@ REACT_APP_SUPPORT_EMAIL='support@wrenchboard.com'
|
||||
REACT_APP_SUPPORT_PHONE='404 855-7966'
|
||||
REACT_APP_SUPPORT_PHONE_NG='(+420) 336 476 328'
|
||||
REACT_APP_SUPPORT_US_ADDRESS='Cumberland Pkwy, Atlanta GA 30339'
|
||||
REACT_APP_SUPPORT_NG_ADDRESS='Saka Tinubu Street, Victoria Island Lagos, Nigeria'
|
||||
REACT_APP_SUPPORT_NG_ADDRESS='Saka Tinubu Street, Victoria Island Lagos, Nigeria'
|
||||
|
||||
#AGENT LINK
|
||||
REACT_APP_AGENT_LINK='https://dev-agents.wrenchboard.com'
|
||||
@@ -5,7 +5,7 @@ REACT_APP_USERS_ENDPOINT="https://apigate.lotus.g1.wrenchboard.com/en/wrench/api
|
||||
|
||||
REACT_APP_SITE_NAME='WrenchBoard'
|
||||
REACT_APP_DASH_URL='https://users.wrenchboard.com'
|
||||
REACT_APP_DASH_URL_LOGIN="https://users.wrenchboard.com/login"
|
||||
REACT_APP_DASH_URL_LOGIN="https://users.wrenchboard.com/login?cnt=us"
|
||||
REACT_APP_DASH_URL_SIGNUP="https://users.wrenchboard.com/signup?cnt=us"
|
||||
REACT_APP_ANDROID_APP='https://play.google.com/store/apps/details?id=com.wrenchboard.users'
|
||||
REACT_APP_APPLE_APP='https://itunes.apple.com/us/app/wrenchboard/id1435718367?ls=1&mt=8'
|
||||
@@ -16,4 +16,7 @@ REACT_APP_SUPPORT_EMAIL='support@wrenchboard.com'
|
||||
REACT_APP_SUPPORT_PHONE='404 855-7966'
|
||||
REACT_APP_SUPPORT_PHONE_NG='(+420) 336 476 328'
|
||||
REACT_APP_SUPPORT_US_ADDRESS='Cumberland Pkwy, Atlanta GA 30339'
|
||||
REACT_APP_SUPPORT_NG_ADDRESS='Saka Tinubu Street, Victoria Island Lagos, Nigeria'
|
||||
REACT_APP_SUPPORT_NG_ADDRESS='Saka Tinubu Street, Victoria Island Lagos, Nigeria'
|
||||
|
||||
#AGENT LINK
|
||||
REACT_APP_AGENT_LINK='https://agents.wrenchboard.com'
|
||||
@@ -18,6 +18,8 @@
|
||||
.env.test.local
|
||||
.env.production.local
|
||||
|
||||
.idea
|
||||
|
||||
|
||||
npm-debug.log*
|
||||
yarn-debug.log*
|
||||
|
||||
@@ -10,6 +10,7 @@
|
||||
"react": "^17.0.2",
|
||||
"react-countup": "^6.0.0",
|
||||
"react-dom": "^17.0.2",
|
||||
"react-owl-carousel": "^2.3.3",
|
||||
"react-router-dom": "^5.3.0",
|
||||
"react-scripts": "5.0.0",
|
||||
"react-slick": "^0.28.1",
|
||||
|
||||
|
After Width: | Height: | Size: 72 KiB |
|
After Width: | Height: | Size: 64 KiB |
|
After Width: | Height: | Size: 72 KiB |
|
After Width: | Height: | Size: 59 KiB |
|
After Width: | Height: | Size: 41 KiB |
|
After Width: | Height: | Size: 89 KiB |
|
After Width: | Height: | Size: 50 KiB |
|
After Width: | Height: | Size: 59 KiB |
|
After Width: | Height: | Size: 64 KiB |
|
After Width: | Height: | Size: 69 KiB |
|
After Width: | Height: | Size: 63 KiB |
|
After Width: | Height: | Size: 70 KiB |
|
Before Width: | Height: | Size: 57 KiB After Width: | Height: | Size: 39 KiB |
|
After Width: | Height: | Size: 32 KiB |
|
After Width: | Height: | Size: 22 KiB |
|
After Width: | Height: | Size: 14 KiB |
|
After Width: | Height: | Size: 26 KiB |
|
After Width: | Height: | Size: 23 KiB |
|
After Width: | Height: | Size: 24 KiB |
|
After Width: | Height: | Size: 20 KiB |
|
After Width: | Height: | Size: 49 KiB |
|
After Width: | Height: | Size: 121 KiB |
|
After Width: | Height: | Size: 228 KiB |
|
After Width: | Height: | Size: 32 KiB |
|
After Width: | Height: | Size: 20 KiB |
|
After Width: | Height: | Size: 17 KiB |
|
After Width: | Height: | Size: 24 KiB |
|
After Width: | Height: | Size: 15 KiB |
|
After Width: | Height: | Size: 121 KiB |
@@ -49,6 +49,16 @@
|
||||
</noscript>
|
||||
|
||||
<title>WrenchBoard</title>
|
||||
<!-- Google tag (gtag.js) -->
|
||||
<script async src="https://www.googletagmanager.com/gtag/js?id=G-WB8G0ZD483"></script>
|
||||
<script>
|
||||
window.dataLayer = window.dataLayer || [];
|
||||
function gtag(){dataLayer.push(arguments);}
|
||||
gtag('js', new Date());
|
||||
|
||||
gtag('config', 'G-WB8G0ZD483');
|
||||
</script>
|
||||
|
||||
</head>
|
||||
|
||||
<body>
|
||||
@@ -56,29 +66,29 @@
|
||||
<div id="root"></div>
|
||||
</body>
|
||||
|
||||
<script>
|
||||
(function (i, s, o, g, r, a, m) {
|
||||
i["GoogleAnalyticsObject"] = r;
|
||||
(i[r] =
|
||||
i[r] ||
|
||||
function () {
|
||||
(i[r].q = i[r].q || []).push(arguments);
|
||||
}),
|
||||
(i[r].l = 1 * new Date());
|
||||
(a = s.createElement(o)), (m = s.getElementsByTagName(o)[0]);
|
||||
a.async = 1;
|
||||
a.src = g;
|
||||
m.parentNode.insertBefore(a, m);
|
||||
})(
|
||||
window,
|
||||
document,
|
||||
"script",
|
||||
"https://www.google-analytics.com/analytics.js",
|
||||
"ga"
|
||||
);
|
||||
ga("create", "UA-54829827-4", "auto");
|
||||
ga("send", "pageview");
|
||||
</script>
|
||||
<!-- <script>-->
|
||||
<!-- (function (i, s, o, g, r, a, m) {-->
|
||||
<!-- i["GoogleAnalyticsObject"] = r;-->
|
||||
<!-- (i[r] =-->
|
||||
<!-- i[r] ||-->
|
||||
<!-- function () {-->
|
||||
<!-- (i[r].q = i[r].q || []).push(arguments);-->
|
||||
<!-- }),-->
|
||||
<!-- (i[r].l = 1 * new Date());-->
|
||||
<!-- (a = s.createElement(o)), (m = s.getElementsByTagName(o)[0]);-->
|
||||
<!-- a.async = 1;-->
|
||||
<!-- a.src = g;-->
|
||||
<!-- m.parentNode.insertBefore(a, m);-->
|
||||
<!-- })(-->
|
||||
<!-- window,-->
|
||||
<!-- document,-->
|
||||
<!-- "script",-->
|
||||
<!-- "https://www.google-analytics.com/analytics.js",-->
|
||||
<!-- "ga"-->
|
||||
<!-- );-->
|
||||
<!-- ga("create", "UA-54829827-4", "auto");-->
|
||||
<!-- ga("send", "pageview");-->
|
||||
<!-- </script>-->
|
||||
|
||||
<script>
|
||||
var LHC_API = LHC_API || {};
|
||||
@@ -105,4 +115,8 @@
|
||||
s.parentNode.insertBefore(po, s);
|
||||
})();
|
||||
</script>
|
||||
|
||||
<!-- plugins js -->
|
||||
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.7.1/jquery.min.js"></script>
|
||||
|
||||
</html>
|
||||
|
||||
@@ -6,16 +6,6 @@
|
||||
"src": "favicon.ico",
|
||||
"sizes": "64x64 32x32 24x24 16x16",
|
||||
"type": "image/x-icon"
|
||||
},
|
||||
{
|
||||
"src": "logo192.png",
|
||||
"type": "image/png",
|
||||
"sizes": "192x192"
|
||||
},
|
||||
{
|
||||
"src": "logo512.png",
|
||||
"type": "image/png",
|
||||
"sizes": "512x512"
|
||||
}
|
||||
],
|
||||
"start_url": ".",
|
||||
|
||||
@@ -0,0 +1,370 @@
|
||||
@media screen and (max-width:1200px) {
|
||||
|
||||
/* about app section */
|
||||
.about_app_section .about_text .app_statstic li {
|
||||
width: 210px;
|
||||
padding-left: 20px;
|
||||
}
|
||||
|
||||
.about_app_section .about_text .app_statstic li p:first-child {
|
||||
font-size: 30px;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
|
||||
@media screen and (max-width:992px) {
|
||||
|
||||
/* about app section */
|
||||
.about_app_section .row {
|
||||
flex-direction: column-reverse;
|
||||
}
|
||||
|
||||
.about_app_section .about_img {
|
||||
justify-content: flex-start;
|
||||
margin-top: 75px;
|
||||
margin-left: 0;
|
||||
}
|
||||
|
||||
.about_app_section .about_img::before {
|
||||
left: 50%;
|
||||
}
|
||||
|
||||
.about_app_section .about_img .screen_img {
|
||||
margin-left: -170px;
|
||||
}
|
||||
|
||||
.about_app_section .about_text .app_statstic {
|
||||
justify-content: flex-start;
|
||||
}
|
||||
|
||||
.about_app_section .about_text .app_statstic li {
|
||||
width: 35%;
|
||||
margin-right: 30px;
|
||||
}
|
||||
|
||||
.about_app_section .about_img::before {
|
||||
left: 35%;
|
||||
}
|
||||
}
|
||||
|
||||
@media screen and (max-width:767px) {
|
||||
|
||||
/* about app section */
|
||||
.about_app_section .about_text,
|
||||
.about_app_section .about_text .section_title {
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.about_app_section .about_text .app_statstic {
|
||||
margin-top: 0;
|
||||
justify-content: space-between;
|
||||
}
|
||||
|
||||
.about_app_section .about_text .app_statstic li {
|
||||
width: 48%;
|
||||
margin-right: 0;
|
||||
}
|
||||
|
||||
.about_app_section .about_text .app_statstic li p:first-child {
|
||||
font-size: 18px;
|
||||
}
|
||||
|
||||
.about_app_section .about_img {
|
||||
margin: 0;
|
||||
margin-top: 50px;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.about_app_section .about_img::before {
|
||||
width: 350px;
|
||||
height: 350px;
|
||||
}
|
||||
}
|
||||
|
||||
.row_am.about_app_section._ {
|
||||
background: #fbf4fe;
|
||||
}
|
||||
|
||||
@media screen and (max-width:479px) {
|
||||
|
||||
/* about app section */
|
||||
.about_app_section .about_img::before {
|
||||
left: 49%;
|
||||
}
|
||||
}
|
||||
|
||||
/* about app section */
|
||||
/* .about_app_section .row {
|
||||
flex-direction: column-reverse;
|
||||
} */
|
||||
|
||||
.about_app_section .about_img {
|
||||
justify-content: flex-start;
|
||||
margin-top: 75px;
|
||||
margin-left: 0;
|
||||
}
|
||||
|
||||
.about_app_section .about_img::before {
|
||||
left: 50%;
|
||||
}
|
||||
|
||||
.about_app_section .about_img .screen_img {
|
||||
margin-left: -170px;
|
||||
}
|
||||
|
||||
.about_app_section .about_text .app_statstic {
|
||||
justify-content: flex-start;
|
||||
}
|
||||
|
||||
.about_app_section .about_text .app_statstic li {
|
||||
width: 35%;
|
||||
margin-right: 30px;
|
||||
}
|
||||
|
||||
.about_app_section .about_img::before {
|
||||
left: 35%;
|
||||
}
|
||||
|
||||
/* about app section */
|
||||
.about_app_section .about_text .app_statstic {
|
||||
margin-top: 0;
|
||||
justify-content: space-between;
|
||||
}
|
||||
|
||||
.about_app_section .about_text .app_statstic li {
|
||||
width: 48%;
|
||||
margin-right: 0;
|
||||
}
|
||||
|
||||
.about_app_section .about_text .app_statstic li p:first-child {
|
||||
font-size: 18px;
|
||||
}
|
||||
|
||||
.about_app_section .about_img {
|
||||
margin: 0;
|
||||
margin-top: 50px;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.about_app_section .about_img::before {
|
||||
width: 350px;
|
||||
height: 350px;
|
||||
}
|
||||
|
||||
|
||||
@media screen and (max-width: 479px) {
|
||||
|
||||
/* about app section */
|
||||
.about_app_section .about_img::before {
|
||||
left: 49%;
|
||||
}
|
||||
}
|
||||
|
||||
.section_title h2 {
|
||||
font-size: 44px;
|
||||
letter-spacing: 2px;
|
||||
line-height: 54px;
|
||||
text-shadow: 0 4px 10px #0000004d;
|
||||
font-weight: 700;
|
||||
color: #32236F;
|
||||
}
|
||||
|
||||
.section_title h2 span {
|
||||
color: #1a3544;
|
||||
}
|
||||
|
||||
/* about us section wraper */
|
||||
.about_app_section .about_img {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
/* about us section images*/
|
||||
.about_app_section .about_img img {
|
||||
max-width: 100%;
|
||||
}
|
||||
|
||||
.about_app_section .about_img::before {
|
||||
content: "";
|
||||
position: absolute;
|
||||
left: 38%;
|
||||
top: 50%;
|
||||
transform: translate(-50%, -50%);
|
||||
width: 500px;
|
||||
height: 500px;
|
||||
background-color: #fff;
|
||||
border-radius: 100%;
|
||||
z-index: -1;
|
||||
}
|
||||
|
||||
.about_app_section .about_img .screen_img {
|
||||
margin-left: -135px;
|
||||
margin-top: 110px;
|
||||
}
|
||||
|
||||
.about_app_section .about_text .section_title {
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
.about_app_section .about_text .section_title h2 {
|
||||
margin-bottom: 15px;
|
||||
}
|
||||
|
||||
/* about us section statastics nomber */
|
||||
.about_app_section .about_text .app_statstic {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
justify-content: space-between;
|
||||
margin-bottom: 10px;
|
||||
margin-top: 40px;
|
||||
}
|
||||
|
||||
.about_app_section .about_text .app_statstic li {
|
||||
width: 248px;
|
||||
background-color: #fff;
|
||||
margin-bottom: 30px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
border-radius: 12px;
|
||||
padding: 15px 10px;
|
||||
padding-left: 35px;
|
||||
box-shadow: 0px 4px 10px #ede9fe;
|
||||
}
|
||||
|
||||
.about_app_section .about_text .app_statstic li .icon {
|
||||
margin-right: 9px;
|
||||
}
|
||||
|
||||
.about_app_section .about_text .app_statstic li p {
|
||||
margin-bottom: 0;
|
||||
line-height: 1;
|
||||
color: #32236F;
|
||||
}
|
||||
|
||||
.about_app_section .about_text .app_statstic li p:first-child {
|
||||
font-size: 40px;
|
||||
font-weight: 600;
|
||||
margin-bottom: 3px;
|
||||
}
|
||||
|
||||
.about_app_section .about_img .screen_img img {
|
||||
animation-delay: 3s;
|
||||
}
|
||||
|
||||
.row_am {
|
||||
padding: 50px 0;
|
||||
}
|
||||
|
||||
.row_am {
|
||||
padding: 30px 0;
|
||||
}
|
||||
|
||||
.puprple_btn {
|
||||
background-color: #1a3544;
|
||||
color: #fff;
|
||||
border-radius: 50px;
|
||||
padding: 10px 40px;
|
||||
position: relative;
|
||||
overflow: hidden;
|
||||
z-index: 1;
|
||||
font-weight: 500;
|
||||
}
|
||||
|
||||
.puprple_btn::before {
|
||||
content: "";
|
||||
position: absolute;
|
||||
left: 0;
|
||||
top: 0;
|
||||
width: 0%;
|
||||
height: 100%;
|
||||
background-color: #fff;
|
||||
border-radius: 50px;
|
||||
transition: .6s all;
|
||||
z-index: -1;
|
||||
}
|
||||
|
||||
.puprple_btn:hover::before {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.puprple_btn:hover {
|
||||
color: #1a3544;
|
||||
}
|
||||
|
||||
@media screen and (max-width:767px) {
|
||||
|
||||
/* modern ui section */
|
||||
.modern_ui_section .ui_images {
|
||||
margin-top: 10px;
|
||||
}
|
||||
|
||||
.modern_ui_section .section_title {
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.modern_ui_section .design_block li {
|
||||
padding-left: 0;
|
||||
margin-bottom: 30px;
|
||||
}
|
||||
|
||||
.modern_ui_section .design_block li::before {
|
||||
position: relative;
|
||||
left: auto;
|
||||
top: auto;
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
.modern_ui_section .row {
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.modern_ui_section .design_block {
|
||||
margin-top: 45px;
|
||||
}
|
||||
|
||||
/* modern ui text */
|
||||
.modern_ui_section .section_title {
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
.modern_ui_section .ui_text {
|
||||
padding-right: 75px;
|
||||
}
|
||||
|
||||
/* modern ui list */
|
||||
.modern_ui_section .design_block li {
|
||||
padding-left: 40px;
|
||||
position: relative;
|
||||
margin-bottom: 25px;
|
||||
}
|
||||
|
||||
.modern_ui_section .design_block li::before {
|
||||
content: "";
|
||||
position: absolute;
|
||||
left: 0;
|
||||
top: 5px;
|
||||
background-image: url(../../../src/assets/images/right_icon.png);
|
||||
width: 22px;
|
||||
height: 22px;
|
||||
background-repeat: no-repeat;
|
||||
background-position: center;
|
||||
background-size: contain;
|
||||
}
|
||||
|
||||
.modern_ui_section .design_block li h4 {
|
||||
font-size: 24px;
|
||||
font-weight: 700;
|
||||
padding-bottom: 7px;
|
||||
text-shadow: 3px 4px 10px #0000004d;
|
||||
|
||||
color: #32236F;
|
||||
margin-bottom: 8px;
|
||||
}
|
||||
|
||||
.modern_ui_section .design_block li p {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
@@ -1,12 +1,79 @@
|
||||
/* Deafult Margin & Padding */
|
||||
/*-- Margin Top --*/
|
||||
.height-50 {
|
||||
height: 50px;
|
||||
}
|
||||
.height-100 {
|
||||
height: 100px;
|
||||
}
|
||||
.height-150 {
|
||||
height: 150px;
|
||||
}
|
||||
.height-200 {
|
||||
height: 200px;
|
||||
}
|
||||
|
||||
.italic {
|
||||
font-style: italic;
|
||||
}
|
||||
|
||||
a {
|
||||
text-decoration: none;
|
||||
text-decoration: none;
|
||||
background-color: transparent;
|
||||
}
|
||||
.expire{
|
||||
color:red;
|
||||
}
|
||||
|
||||
.border-normal {
|
||||
border: 2px solid black
|
||||
}
|
||||
.border-thin{
|
||||
border: 4px solid black
|
||||
}
|
||||
.border-r-5 {
|
||||
border-radius: 5px;
|
||||
}
|
||||
.border-r-10 {
|
||||
border-radius: 10px;
|
||||
}
|
||||
|
||||
/* Default Width sizes */
|
||||
/*-- Width Sizes --*/
|
||||
.custom-w-80 {
|
||||
width: 80%;
|
||||
}
|
||||
.custom-w-90 {
|
||||
width: 90%;
|
||||
}
|
||||
|
||||
/* Default Font sizes */
|
||||
/*-- Font Sizes --*/
|
||||
.font-10 {
|
||||
font-size: 10px;
|
||||
}
|
||||
.font-16 {
|
||||
font-size: 16px;
|
||||
}
|
||||
.font-20 {
|
||||
font-size: 20px;
|
||||
}
|
||||
.font-25 {
|
||||
font-size: 25px;
|
||||
}
|
||||
.font-30 {
|
||||
font-size: 30px;
|
||||
}
|
||||
.font-35 {
|
||||
font-size: 35px;
|
||||
}
|
||||
.font-40 {
|
||||
font-size: 40px;
|
||||
}
|
||||
.font-45 {
|
||||
font-size: 45px;
|
||||
}
|
||||
|
||||
/* Deafult Margin & Padding */
|
||||
/*-- Margin Top --*/
|
||||
.mt-5 {
|
||||
margin-top: 5px;
|
||||
}
|
||||
@@ -815,6 +882,9 @@ a {
|
||||
.pl-125 {
|
||||
padding-left: 125px;
|
||||
}
|
||||
.pl-150 {
|
||||
padding-left: 150px;
|
||||
}
|
||||
/*-- Padding right --*/
|
||||
|
||||
.pr-0 {
|
||||
@@ -902,6 +972,21 @@ a {
|
||||
.black {
|
||||
color: #222;
|
||||
}
|
||||
.color-blue {
|
||||
color: #5086BA;
|
||||
}
|
||||
.color-purple {
|
||||
color: purple;
|
||||
}
|
||||
.bg-purple {
|
||||
color: purple;
|
||||
}
|
||||
.border-purple {
|
||||
border-color: purple;
|
||||
}
|
||||
.border-skyblue {
|
||||
border-color: #5086BA;
|
||||
}
|
||||
/* black overlay */
|
||||
|
||||
[data-overlay] {
|
||||
|
||||
@@ -1,4 +1,6 @@
|
||||
@import url("https://fonts.googleapis.com/css2?family=Roboto:wght@100;300;400;500;700;900&display=swap");
|
||||
@import url("aboutapp.css");
|
||||
|
||||
body {
|
||||
font-family: "Roboto", sans-serif;
|
||||
font-weight: normal;
|
||||
@@ -140,7 +142,6 @@ p {
|
||||
-moz-user-select: none;
|
||||
-ms-user-select: none;
|
||||
user-select: none;
|
||||
border: 1px solid #4687ba;
|
||||
padding: 0 30px;
|
||||
font-size: 15px;
|
||||
line-height: 45px;
|
||||
@@ -153,12 +154,18 @@ p {
|
||||
-ms-transition: all 0.4s ease-out 0s;
|
||||
-o-transition: all 0.4s ease-out 0s;
|
||||
transition: all 0.4s ease-out 0s;
|
||||
background-color: #4687ba;
|
||||
/* background-color: #4687ba; */
|
||||
/* border: 1px solid #4687ba; */
|
||||
border: 1px solid #89216b;
|
||||
background-image: linear-gradient(90deg, #89216b 0%, #da4453 100%);
|
||||
}
|
||||
.main-btn:hover {
|
||||
background-color: #fff;
|
||||
/* background-color: #fff;
|
||||
color: #2b70fa;
|
||||
border-color: #2b70fa;
|
||||
border-color: #2b70fa; */
|
||||
background-image: linear-gradient(90deg, #000 0%, #000 100%);
|
||||
color: #fff;
|
||||
border-color: #000;
|
||||
}
|
||||
.main-btn.main-btn-2 {
|
||||
background-color: #fff;
|
||||
@@ -181,6 +188,16 @@ p {
|
||||
letter-spacing: 2px;
|
||||
text-shadow: 0px 4px 10px rgba(0,0,0,0.3);
|
||||
}
|
||||
.generative-ai{
|
||||
padding-left: 150px;
|
||||
}
|
||||
|
||||
@media only screen and (max-width: 568px) {
|
||||
.generative-ai{
|
||||
padding-left: 50px;
|
||||
}
|
||||
}
|
||||
|
||||
@media only screen and (min-width: 992px) and (max-width: 1200px) {
|
||||
.appie-section-title .appie-title {
|
||||
font-size: 36px;
|
||||
@@ -229,17 +246,17 @@ p {
|
||||
font-size: 15px;
|
||||
}
|
||||
}
|
||||
.appie-section-title .main-btn {
|
||||
/* .appie-section-title .main-btn {
|
||||
border-radius: 30px;
|
||||
border: 2px solid #e7eaef;
|
||||
background: #fff;
|
||||
color: #0e1133;
|
||||
}
|
||||
.appie-section-title .main-btn:hover {
|
||||
} */
|
||||
/* .appie-section-title .main-btn:hover {
|
||||
background: #ff3e66;
|
||||
color: #fff;
|
||||
border-color: #ff3e66;
|
||||
}
|
||||
} */
|
||||
.appie-section-title.appie-section-title-2 .appie-title {
|
||||
color: #fff;
|
||||
}
|
||||
@@ -875,15 +892,15 @@ p {
|
||||
right: 0;
|
||||
z-index: 999;
|
||||
}
|
||||
.appie-header-area.appie-header-2-area .appie-btn-box .main-btn {
|
||||
/* .appie-header-area.appie-header-2-area .appie-btn-box .main-btn {
|
||||
background: #ff3e66;
|
||||
border-radius: 30px;
|
||||
border-color: #ff3e66;
|
||||
}
|
||||
.appie-header-area.appie-header-2-area .appie-btn-box .main-btn:hover {
|
||||
} */
|
||||
/* .appie-header-area.appie-header-2-area .appie-btn-box .main-btn:hover {
|
||||
background: transparent;
|
||||
color: #ff3e66;
|
||||
}
|
||||
} */
|
||||
.appie-header-area.appie-header-3-area.appie-sticky.sticky {
|
||||
background: #0e1133;
|
||||
}
|
||||
@@ -963,30 +980,30 @@ p {
|
||||
.header-nav-box.header-nav-box-3 .appie-btn-box .login-btn {
|
||||
color: #fff;
|
||||
}
|
||||
.header-nav-box.header-nav-box-3 .appie-btn-box .main-btn {
|
||||
/* .header-nav-box.header-nav-box-3 .appie-btn-box .main-btn {
|
||||
background: #ff6b58;
|
||||
border-color: #ff6b58;
|
||||
}
|
||||
.header-nav-box.header-nav-box-3 .appie-btn-box .main-btn:hover {
|
||||
} */
|
||||
/* .header-nav-box.header-nav-box-3 .appie-btn-box .main-btn:hover {
|
||||
background: transparent;
|
||||
color: #ff6b58;
|
||||
}
|
||||
} */
|
||||
.header-nav-box.header-nav-box-3 .toggle-btn {
|
||||
color: #fff;
|
||||
font-size: 20px;
|
||||
}
|
||||
.header-nav-box.header-nav-box-3.header-nav-box-inner-page
|
||||
/* .header-nav-box.header-nav-box-3.header-nav-box-inner-page
|
||||
.appie-btn-box
|
||||
.main-btn {
|
||||
border-color: #fff;
|
||||
background: transparent;
|
||||
}
|
||||
.header-nav-box.header-nav-box-3.header-nav-box-inner-page
|
||||
} */
|
||||
/* .header-nav-box.header-nav-box-3.header-nav-box-inner-page
|
||||
.appie-btn-box
|
||||
.main-btn:hover {
|
||||
background: #fff;
|
||||
color: #2b70fa;
|
||||
}
|
||||
} */
|
||||
.header-nav-box.header-nav-box-5 .appie-header-main-menu ul > li > a {
|
||||
color: #fff;
|
||||
}
|
||||
@@ -1002,14 +1019,14 @@ p {
|
||||
.header-nav-box.header-nav-box-5 .appie-btn-box .login-btn {
|
||||
color: #fff;
|
||||
}
|
||||
.header-nav-box.header-nav-box-5 .appie-btn-box .main-btn {
|
||||
/* .header-nav-box.header-nav-box-5 .appie-btn-box .main-btn {
|
||||
background: #f84a6e;
|
||||
border-color: #f84a6e;
|
||||
}
|
||||
.header-nav-box.header-nav-box-5 .appie-btn-box .main-btn:hover {
|
||||
} */
|
||||
/* .header-nav-box.header-nav-box-5 .appie-btn-box .main-btn:hover {
|
||||
background: transparent;
|
||||
color: #f84a6e;
|
||||
}
|
||||
} */
|
||||
.header-nav-box.header-nav-box-5 .toggle-btn {
|
||||
color: #fff;
|
||||
font-size: 20px;
|
||||
@@ -1017,14 +1034,14 @@ p {
|
||||
.header-nav-box.header-nav-4-box .appie-header-main-menu ul > li > a:hover {
|
||||
color: #801f82;
|
||||
}
|
||||
.header-nav-box.header-nav-4-box .appie-btn-box .main-btn {
|
||||
/* .header-nav-box.header-nav-4-box .appie-btn-box .main-btn {
|
||||
background: #801f82;
|
||||
border-color: #801f82;
|
||||
}
|
||||
.header-nav-box.header-nav-4-box .appie-btn-box .main-btn:hover {
|
||||
} */
|
||||
/* .header-nav-box.header-nav-4-box .appie-btn-box .main-btn:hover {
|
||||
background: transparent;
|
||||
color: #801f82;
|
||||
}
|
||||
} */
|
||||
@media (max-width: 767px) {
|
||||
.header-nav-box.header-nav-4-box .appie-btn-box ul {
|
||||
margin-right: 10px;
|
||||
@@ -1055,14 +1072,14 @@ p {
|
||||
background: #801f82;
|
||||
border-radius: 50%;
|
||||
}
|
||||
.header-nav-box.header-nav-box-6 .main-btn {
|
||||
/* .header-nav-box.header-nav-box-6 .main-btn {
|
||||
background: #9b2cfa;
|
||||
border-color: #9b2cfa;
|
||||
}
|
||||
.header-nav-box.header-nav-box-6 .main-btn:hover {
|
||||
} */
|
||||
/* .header-nav-box.header-nav-box-6 .main-btn:hover {
|
||||
background: transparent;
|
||||
color: #9b2cfa;
|
||||
}
|
||||
} */
|
||||
.header-nav-box.header-nav-box-6 .appie-header-main-menu ul > li > a:hover {
|
||||
color: #9b2cfa;
|
||||
}
|
||||
@@ -1408,14 +1425,14 @@ p {
|
||||
top: 0;
|
||||
}
|
||||
}
|
||||
.appie-header-8-area .header-nav-box .appie-btn-box .main-btn {
|
||||
/* .appie-header-8-area .header-nav-box .appie-btn-box .main-btn {
|
||||
background: #db0f30;
|
||||
border-color: #db0f30;
|
||||
}
|
||||
.appie-header-8-area .header-nav-box .appie-btn-box .main-btn:hover {
|
||||
} */
|
||||
/* .appie-header-8-area .header-nav-box .appie-btn-box .main-btn:hover {
|
||||
background: #fff;
|
||||
color: #db0f30;
|
||||
}
|
||||
} */
|
||||
.appie-header-8-area .header-nav-box .appie-header-main-menu ul > li a:hover {
|
||||
color: #db0f30;
|
||||
}
|
||||
@@ -1633,20 +1650,20 @@ p {
|
||||
i {
|
||||
border-color: rgba(255, 255, 255, 0.2);
|
||||
}
|
||||
.appie-hero-area.appie-hero-3-area.appie-hero-5-area
|
||||
/* .appie-hero-area.appie-hero-3-area.appie-hero-5-area
|
||||
.appie-hero-content
|
||||
.hero-btns
|
||||
.main-btn {
|
||||
border-color: rgba(255, 255, 255, 0.2);
|
||||
color: #fff;
|
||||
}
|
||||
.appie-hero-area.appie-hero-3-area.appie-hero-5-area
|
||||
} */
|
||||
/* .appie-hero-area.appie-hero-3-area.appie-hero-5-area
|
||||
.appie-hero-content
|
||||
.hero-btns
|
||||
.main-btn:hover {
|
||||
background: #f84a6e;
|
||||
color: #fff;
|
||||
}
|
||||
} */
|
||||
.appie-hero-area .hero-shape-1 {
|
||||
position: absolute;
|
||||
left: 0;
|
||||
@@ -1898,7 +1915,7 @@ p {
|
||||
line-height: 50px;
|
||||
}
|
||||
}
|
||||
.appie-hero-content.appie-hero-content-4 a.main-btn {
|
||||
/* .appie-hero-content.appie-hero-content-4 a.main-btn {
|
||||
border: 2px solid #801f82;
|
||||
color: #801f82;
|
||||
background: #fff;
|
||||
@@ -1906,11 +1923,11 @@ p {
|
||||
padding: 0 40px;
|
||||
font-size: 16px;
|
||||
margin-top: 40px;
|
||||
}
|
||||
.appie-hero-content.appie-hero-content-4 a.main-btn:hover {
|
||||
} */
|
||||
/* .appie-hero-content.appie-hero-content-4 a.main-btn:hover {
|
||||
background: #801f82;
|
||||
color: #fff;
|
||||
}
|
||||
} */
|
||||
.appie-hero-content.appie-hero-content-6 > span {
|
||||
color: #9b2cfa;
|
||||
}
|
||||
@@ -2367,7 +2384,7 @@ p {
|
||||
4.APPIE SERVOCE css
|
||||
===========================*/
|
||||
.appie-service-area {
|
||||
background: #fbf4fe;
|
||||
background: #fdfaf4;
|
||||
position: relative;
|
||||
background-position: 92% 100%;
|
||||
background-repeat: no-repeat;
|
||||
@@ -2547,8 +2564,8 @@ p {
|
||||
border-radius: 50%;
|
||||
}
|
||||
.appie-single-service-2 .icon img {
|
||||
height: 100px;
|
||||
width: 100px;
|
||||
height: 200px;
|
||||
/* width: 100px; */
|
||||
}
|
||||
.appie-single-service-2 .title {
|
||||
font-size: 24px;
|
||||
@@ -2657,10 +2674,10 @@ p {
|
||||
border-radius: 21% 79% 58% 42% / 50% 46% 54% 50%;
|
||||
}
|
||||
|
||||
.appie-services-6-area .appie-section-title .main-btn:hover {
|
||||
/* .appie-services-6-area .appie-section-title .main-btn:hover {
|
||||
background: #9b2cfa;
|
||||
border-color: #9b2cfa;
|
||||
}
|
||||
} */
|
||||
.appie-services-6-area .appie-single-service-2 a:hover {
|
||||
color: #9b2cfa;
|
||||
}
|
||||
@@ -3098,6 +3115,11 @@ p {
|
||||
/* box-shadow: inset 0 0 15px 25px white; */
|
||||
box-shadow: 0 0 10px 20px #fff inset;
|
||||
}
|
||||
.withFadeEdge-light-purple{
|
||||
border-radius: 10px 10px 10px 10px;
|
||||
/* box-shadow: inset 0 0 15px 25px white; */
|
||||
box-shadow: 0 0 5px 10px #fbf4fe inset;
|
||||
}
|
||||
/*===========================
|
||||
6.APPIE TRAFFICE css
|
||||
===========================*/
|
||||
@@ -3127,7 +3149,7 @@ p {
|
||||
|
||||
.appie-traffic-title {
|
||||
padding-right: 220px;
|
||||
margin-bottom: 43px;
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
@media (max-width: 767px) {
|
||||
.appie-traffic-title {
|
||||
@@ -3168,34 +3190,23 @@ p {
|
||||
}
|
||||
}
|
||||
|
||||
.appie-traffic-service {
|
||||
.appie-traffic-service, .appie-traffic-service-two {
|
||||
position: relative;
|
||||
}
|
||||
.appie-traffic-service {
|
||||
padding-left: 40px;
|
||||
padding-right: 70px;
|
||||
/* padding-right: 70px; */
|
||||
}
|
||||
@media only screen and (min-width: 992px) and (max-width: 1200px) {
|
||||
.appie-traffic-service {
|
||||
padding-right: 0;
|
||||
}
|
||||
.appie-traffic-service-two {
|
||||
padding-left: 40px;
|
||||
}
|
||||
@media only screen and (min-width: 768px) and (max-width: 991px) {
|
||||
.appie-traffic-service {
|
||||
margin-bottom: 30px;
|
||||
padding-right: 50px;
|
||||
}
|
||||
}
|
||||
@media (max-width: 767px) {
|
||||
.appie-traffic-service {
|
||||
margin-bottom: 30px;
|
||||
padding-right: 0px;
|
||||
}
|
||||
}
|
||||
.appie-traffic-service .icon {
|
||||
|
||||
.appie-traffic-service .icon, .appie-traffic-service-two .icon {
|
||||
position: absolute;
|
||||
left: 0;
|
||||
top: 5px;
|
||||
top: 0;
|
||||
}
|
||||
.appie-traffic-service .icon i {
|
||||
.appie-traffic-service .icon i, .appie-traffic-service-two .icon i {
|
||||
height: 26px;
|
||||
width: 26px;
|
||||
text-align: center;
|
||||
@@ -3206,14 +3217,14 @@ p {
|
||||
font-size: 14px;
|
||||
box-shadow: 0px 6px 10px 0px rgba(16, 73, 189, 0.3);
|
||||
}
|
||||
.appie-traffic-service .title {
|
||||
font-size: 24px;
|
||||
.appie-traffic-service .title, .appie-traffic-service-two title {
|
||||
font-size: 20px;
|
||||
font-weight: 700;
|
||||
padding-bottom: 7px;
|
||||
text-shadow: 3px 4px 10px rgba(0,0,0,0.3);
|
||||
}
|
||||
.appie-traffic-service p {
|
||||
font-size: 17px;
|
||||
.appie-traffic-service p, .appie-traffic-service-two p {
|
||||
font-size: 16px;
|
||||
margin-top: 10px;
|
||||
/*margin-bottom: 2px;*/
|
||||
}
|
||||
@@ -3227,6 +3238,63 @@ p {
|
||||
background: linear-gradient(135deg, #d8aaff 0%, #9b2cfa 100%);
|
||||
}
|
||||
|
||||
.appie-modern-design .icon i {
|
||||
height: 26px;
|
||||
width: 26px;
|
||||
text-align: center;
|
||||
line-height: 26px;
|
||||
border-radius: 50%;
|
||||
background: purple;
|
||||
color: #fff;
|
||||
font-size: 14px;
|
||||
box-shadow: 0px 6px 10px 0px rgba(16, 73, 189, 0.3);
|
||||
}
|
||||
|
||||
/* .modern_ui_section{
|
||||
margin-top: 100px;
|
||||
} */
|
||||
.modern_ui_section .section_sub_title, .title .section_sub_title{
|
||||
font-size: 30px;
|
||||
color: purple;
|
||||
}
|
||||
.modern_ui_section .ui_images{
|
||||
border-radius: 100%;
|
||||
background-color: #f9f4fe;
|
||||
width: auto;
|
||||
height: auto;
|
||||
padding: 30px 10px;
|
||||
}
|
||||
.modern_ui_section .right_img{
|
||||
left: -60px;
|
||||
top: -20px;
|
||||
}
|
||||
.modern_ui_section .left_img{
|
||||
width: 60%;
|
||||
}
|
||||
|
||||
.modern_ui_section .left_img img{
|
||||
border-radius: 10px;
|
||||
}
|
||||
.modern_ui_section .right_img{
|
||||
width: 40%;
|
||||
}
|
||||
.modern_ui_section .right_img img {
|
||||
position: relative;
|
||||
z-index: 2;
|
||||
}
|
||||
.modern_ui_section .right_img .right_img_one{
|
||||
width: 120px;
|
||||
height: auto;
|
||||
}
|
||||
.modern_ui_section .right_img .right_img_three{
|
||||
left: -20px;
|
||||
}
|
||||
@media only screen and (min-width: 0px) and (max-width: 500px) {
|
||||
.modern_ui_section .right_img{
|
||||
left: -30px;
|
||||
top: -20px;
|
||||
}
|
||||
}
|
||||
@media only screen and (min-width: 992px) and (max-width: 1200px) {
|
||||
.traffic-btn {
|
||||
margin-top: 30px;
|
||||
@@ -3250,10 +3318,10 @@ p {
|
||||
.traffic-btn a.main-btn i {
|
||||
padding-left: 6px;
|
||||
}
|
||||
.traffic-btn a.main-btn:hover {
|
||||
/* .traffic-btn a.main-btn:hover {
|
||||
background: #2b70fa;
|
||||
color: #fff;
|
||||
}
|
||||
} */
|
||||
|
||||
/*===========================
|
||||
6.APPIE TRAFFICE css
|
||||
@@ -4894,6 +4962,28 @@ p {
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.service-item{
|
||||
background: transparent;
|
||||
border-radius: 6px;
|
||||
padding: 30px 10px;
|
||||
}
|
||||
|
||||
.service-item .icon {
|
||||
display: inline-block;
|
||||
text-align: center;
|
||||
|
||||
border-radius: 20px;
|
||||
height: 80px;
|
||||
line-height: 70px;
|
||||
margin-bottom: 10px;
|
||||
position: relative;
|
||||
width: 80px;
|
||||
}
|
||||
|
||||
.service-item h4 {
|
||||
font-size: 20px;
|
||||
}
|
||||
|
||||
.tags a {
|
||||
display: inline-block;
|
||||
height: 34px;
|
||||
@@ -7152,17 +7242,17 @@ blockquote cite {
|
||||
font-weight: 700;
|
||||
margin-bottom: 8px;
|
||||
}
|
||||
.appie-download-3-box .content a.main-btn {
|
||||
/* .appie-download-3-box .content a.main-btn {
|
||||
background: #fff;
|
||||
color: #0e1133;
|
||||
border-color: #fff;
|
||||
margin-top: 33px;
|
||||
}
|
||||
.appie-download-3-box .content a.main-btn:hover {
|
||||
} */
|
||||
/* .appie-download-3-box .content a.main-btn:hover {
|
||||
background: #ff6b58;
|
||||
border-color: #ff6b58;
|
||||
color: #fff;
|
||||
}
|
||||
} */
|
||||
.appie-download-3-box .content a.main-btn i {
|
||||
padding-right: 6px;
|
||||
}
|
||||
@@ -7176,18 +7266,18 @@ blockquote cite {
|
||||
color: #0e1133;
|
||||
border-color: #fff;
|
||||
}
|
||||
.appie-download-3-box.appie-download-6-box a.main-btn:hover {
|
||||
/* .appie-download-3-box.appie-download-6-box a.main-btn:hover {
|
||||
background: #9b2cfa;
|
||||
border-color: #9b2cfa;
|
||||
}
|
||||
} */
|
||||
.appie-download-3-box.appie-download-6-box a.main-btn.main-btn-2 {
|
||||
background: #9b2cfa;
|
||||
border-color: #9b2cfa;
|
||||
}
|
||||
.appie-download-3-box.appie-download-5-box a.main-btn:hover {
|
||||
/* .appie-download-3-box.appie-download-5-box a.main-btn:hover {
|
||||
background: #801f82;
|
||||
border-color: #801f82;
|
||||
}
|
||||
} */
|
||||
.appie-download-3-box.appie-download-5-box a.main-btn.main-btn-2 {
|
||||
background: #801f82;
|
||||
border-color: #801f82;
|
||||
@@ -8515,4 +8605,32 @@ LND PAGE STYLE STARTS HERE
|
||||
.banner_text h1{
|
||||
font-size: 30px;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
/* -----------Interface_Section-Css-Start----------------- */
|
||||
|
||||
/* interface wraper */
|
||||
.interface_section .screen_slider {
|
||||
margin-top: 35px;
|
||||
/* min-height: 520px; */
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
/* interface images */
|
||||
.interface_section .owl-item .screen_frame_img img {
|
||||
transform: scale(.9);
|
||||
/* border: 2px solid #000; */
|
||||
border-radius: 20px;
|
||||
transition: 1s all;
|
||||
margin: 0 auto;
|
||||
height: 520px;
|
||||
width: auto;
|
||||
}
|
||||
|
||||
.interface_section .owl-item.center .screen_frame_img img {
|
||||
transform: scale(1);
|
||||
/* border: 3px solid #000; */
|
||||
/* padding: 5px; */
|
||||
}
|
||||
@@ -142,3 +142,94 @@
|
||||
left: 15px;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
/* -----------------About-App-Section-Css-Start------------------ */
|
||||
|
||||
/* about us section wraper */
|
||||
.about_app_section .about_img {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
/* about us section images*/
|
||||
.about_app_section .about_img img {
|
||||
max-width: 100%;
|
||||
}
|
||||
|
||||
.about_app_section .about_img::before {
|
||||
content: "";
|
||||
position: absolute;
|
||||
left: 38%;
|
||||
top: 50%;
|
||||
transform: translate(-50%, -50%);
|
||||
width: 500px;
|
||||
height: 500px;
|
||||
background-color: #ffffff;
|
||||
border-radius: 100%;
|
||||
z-index: -1;
|
||||
}
|
||||
|
||||
.about_app_section .about_img .screen_img {
|
||||
margin-left: -135px;
|
||||
margin-top: 110px;
|
||||
}
|
||||
|
||||
.about_app_section .about_text .section_title {
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
.about_app_section .about_text .section_title h2 {
|
||||
margin-bottom: 15px;
|
||||
}
|
||||
|
||||
/* about us section statastics nomber */
|
||||
.about_app_section .about_text .app_statstic {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
justify-content: space-between;
|
||||
margin-bottom: 10px;
|
||||
margin-top: 40px;
|
||||
}
|
||||
|
||||
.about_app_section .about_text .app_statstic li {
|
||||
width: 248px;
|
||||
background-color: #fff;
|
||||
margin-bottom: 30px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
border-radius: 12px;
|
||||
padding: 15px 10px;
|
||||
padding-left: 35px;
|
||||
box-shadow: 0px 4px 10px #EDE9FE;
|
||||
}
|
||||
|
||||
.about_app_section .about_text .app_statstic li .icon {
|
||||
margin-right: 9px;
|
||||
}
|
||||
|
||||
.about_app_section .about_text .app_statstic li p {
|
||||
margin-bottom: 0;
|
||||
line-height: 1;
|
||||
color: #32236F;
|
||||
}
|
||||
|
||||
.about_app_section .about_text .app_statstic li p:first-child {
|
||||
font-size: 40px;
|
||||
font-weight: 600;
|
||||
margin-bottom: 3px;
|
||||
}
|
||||
|
||||
.about_app_section .about_img .screen_img img {
|
||||
animation-delay: 3s;
|
||||
}
|
||||
|
||||
.about_app_section .about_text .list {
|
||||
margin-top: 45px;
|
||||
margin-bottom: 45px;
|
||||
}
|
||||
|
||||
.about_text{
|
||||
margin-top: 2rem;
|
||||
}
|
||||
|
||||
|
After Width: | Height: | Size: 124 KiB |
|
After Width: | Height: | Size: 81 KiB |
|
After Width: | Height: | Size: 98 KiB |
|
After Width: | Height: | Size: 56 KiB |
|
After Width: | Height: | Size: 38 KiB |
|
After Width: | Height: | Size: 33 KiB |
|
After Width: | Height: | Size: 30 KiB |
|
After Width: | Height: | Size: 26 KiB |
|
After Width: | Height: | Size: 69 KiB |
|
After Width: | Height: | Size: 76 KiB |
|
After Width: | Height: | Size: 73 KiB |
|
After Width: | Height: | Size: 422 KiB |
|
After Width: | Height: | Size: 600 KiB |
|
After Width: | Height: | Size: 629 KiB |
|
After Width: | Height: | Size: 639 KiB |
|
After Width: | Height: | Size: 391 KiB |
|
After Width: | Height: | Size: 378 KiB |
|
After Width: | Height: | Size: 9.3 KiB |
|
After Width: | Height: | Size: 10 KiB |
|
After Width: | Height: | Size: 10 KiB |
|
After Width: | Height: | Size: 10 KiB |
|
After Width: | Height: | Size: 163 KiB |
|
After Width: | Height: | Size: 151 KiB |
|
After Width: | Height: | Size: 151 KiB |
|
After Width: | Height: | Size: 113 KiB |
|
Before Width: | Height: | Size: 2.8 KiB After Width: | Height: | Size: 123 KiB |
|
After Width: | Height: | Size: 611 B |
|
After Width: | Height: | Size: 52 KiB |
|
After Width: | Height: | Size: 629 KiB |
|
After Width: | Height: | Size: 422 KiB |
|
After Width: | Height: | Size: 600 KiB |
|
After Width: | Height: | Size: 406 KiB |
|
After Width: | Height: | Size: 545 KiB |
|
After Width: | Height: | Size: 547 KiB |
|
After Width: | Height: | Size: 595 KiB |
|
After Width: | Height: | Size: 443 KiB |
|
After Width: | Height: | Size: 399 KiB |
|
After Width: | Height: | Size: 396 KiB |
|
After Width: | Height: | Size: 524 KiB |
|
After Width: | Height: | Size: 478 KiB |
|
After Width: | Height: | Size: 188 KiB |
|
After Width: | Height: | Size: 181 KiB |
|
After Width: | Height: | Size: 162 KiB |
|
After Width: | Height: | Size: 582 KiB |
|
After Width: | Height: | Size: 626 KiB |
|
After Width: | Height: | Size: 2.6 MiB |
|
After Width: | Height: | Size: 1.4 MiB |
|
After Width: | Height: | Size: 765 KiB |
|
After Width: | Height: | Size: 2.1 MiB |
|
After Width: | Height: | Size: 690 KiB |
|
After Width: | Height: | Size: 485 KiB |
|
After Width: | Height: | Size: 47 KiB |
|
After Width: | Height: | Size: 242 KiB |
@@ -19,12 +19,12 @@ function Blog({ blogItem, imgUrl, loader }) {
|
||||
|
||||
const headerLoaderStyles = {
|
||||
"--text-container-width": "300px",
|
||||
"--text-container-height": "34px",
|
||||
"--text-container-height": "18px",
|
||||
};
|
||||
|
||||
const bodyTextLoaderStyles = {
|
||||
"--text-container-width": "770px",
|
||||
"--text-container-height": "150px",
|
||||
"--text-container-height": "15px",
|
||||
};
|
||||
|
||||
return (
|
||||
|
||||
@@ -26,7 +26,7 @@ function Blog() {
|
||||
<section className="blogpage-section">
|
||||
<div className="container">
|
||||
<div className="row">
|
||||
<div className="col-lg-12 col-md-7">
|
||||
<div className="col-12">
|
||||
<Blogs />
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -0,0 +1,95 @@
|
||||
import React from 'react'
|
||||
import OwlCarousel from 'react-owl-carousel'
|
||||
import localImgLoad from '../../lib/localImgLoad'
|
||||
|
||||
import 'owl.carousel/dist/assets/owl.carousel.css'
|
||||
import 'owl.carousel/dist/assets/owl.theme.default.css'
|
||||
import LazyImage from '../../lib/LazyImage'
|
||||
|
||||
export default function FeaturedScreen() {
|
||||
|
||||
const screen_slider = {
|
||||
loop:true,
|
||||
margin:10,
|
||||
nav:false,
|
||||
autoplay: true,
|
||||
smartSpeed: 1500,
|
||||
center: true,
|
||||
dots: true,
|
||||
responsive:{
|
||||
0:{
|
||||
items:1
|
||||
},
|
||||
600:{
|
||||
items:2
|
||||
},
|
||||
800:{
|
||||
items:3
|
||||
},
|
||||
1200:{
|
||||
items:4
|
||||
},
|
||||
1400:{
|
||||
items:5
|
||||
}
|
||||
}
|
||||
}
|
||||
return (
|
||||
<>
|
||||
<section className="appie-service-area pt-50 pb-50 interface_section">
|
||||
<div className="container-fluid">
|
||||
<div className="appie-traffic-title section_title text-center" data-aos="fade-up" data-aos-duration="1500" data-aos-delay="100" style={{padding: '0'}}>
|
||||
<h3 className='title'>App Screens <div className='section_sub_title'></div></h3>
|
||||
<p>Simplicity of use is our goal always. Here are some of our featured screens.</p>
|
||||
</div>
|
||||
<div className="screen_slider" >
|
||||
<OwlCarousel id="screen_slider" {...screen_slider} className="owl-carousel owl-theme owl-loaded owl-drag">
|
||||
<div className="item">
|
||||
<div className="screen_frame_img">
|
||||
{/* <img src={localImgLoad('images/slider/slider_1.png')} alt="image" /> */}
|
||||
<img src={localImgLoad('images/slider/app_sliders/screen_1.png')} alt="image" />
|
||||
</div>
|
||||
</div>
|
||||
<div className="item">
|
||||
<div className="screen_frame_img">
|
||||
{/* <img src={localImgLoad('images/slider/slider_2.png')} alt="image" /> */}
|
||||
<img src={localImgLoad('images/slider/app_sliders/screen_2.png')} alt="image" />
|
||||
</div>
|
||||
</div>
|
||||
<div className="item">
|
||||
<div className="screen_frame_img">
|
||||
{/* <img src={localImgLoad('images/slider/slider_3.png')} alt="image" /> */}
|
||||
<img src={localImgLoad('images/slider/app_sliders/screen_3.png')} alt="image" />
|
||||
</div>
|
||||
</div>
|
||||
<div className="item">
|
||||
<div className="screen_frame_img">
|
||||
{/* <img src={localImgLoad('images/slider/slider_4.png')} alt="image" /> */}
|
||||
<img src={localImgLoad('images/slider/app_sliders/screen_6.png')} alt="image" />
|
||||
</div>
|
||||
</div>
|
||||
<div className="item">
|
||||
<div className="screen_frame_img">
|
||||
{/* <img src={localImgLoad('images/slider/slider_5.png')} alt="image" /> */}
|
||||
<img src={localImgLoad('images/slider/app_sliders/screen_4.png')} alt="image" />
|
||||
</div>
|
||||
</div>
|
||||
<div className="item">
|
||||
<div className="screen_frame_img">
|
||||
{/* <img src={localImgLoad('images/slider/slider_7.png')} alt="image" /> */}
|
||||
<img src={localImgLoad('images/slider/app_sliders/screen_7.png')} alt="image" />
|
||||
</div>
|
||||
</div>
|
||||
<div className="item">
|
||||
<div className="screen_frame_img">
|
||||
{/* <img src={localImgLoad('images/slider/slider_7.png')} alt="image" /> */}
|
||||
<img src={localImgLoad('images/slider/app_sliders/screen_5.png')} alt="image" />
|
||||
</div>
|
||||
</div>
|
||||
</OwlCarousel>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
</>
|
||||
)
|
||||
}
|
||||
@@ -55,6 +55,9 @@ function FooterHomeOne({ className }) {
|
||||
<li>
|
||||
<a href="/use-cases">Use Cases</a>
|
||||
</li>
|
||||
<li>
|
||||
<a target='_blank' href={process.env.REACT_APP_AGENT_LINK}>Agent</a>
|
||||
</li>
|
||||
<li>
|
||||
<Link to="/blog">Blog</Link>
|
||||
</li>
|
||||
|
||||
@@ -1,30 +1,40 @@
|
||||
import React from 'react';
|
||||
import heroThumbOne from '../../assets/images/app-thumb-1.png';
|
||||
import heroThumbOne1 from '../../assets/images/app-thumb-2.png';
|
||||
|
||||
import heroThumbTwo from '../../assets/images/app-pic.png';
|
||||
import shapeTwo from '../../assets/images/shape/shape-2.png';
|
||||
import shapeThree from '../../assets/images/shape/shape-3.png';
|
||||
import shapeFour from '../../assets/images/shape/shape-4.png';
|
||||
|
||||
import getConfig from './../../Config/config'
|
||||
import CustomSlider from '../customSlider/CustomSlider';
|
||||
|
||||
// import SliderOne from '../../assets/images/home/app-slide-home-0.png'
|
||||
|
||||
import SliderOne from '../../assets/images/home/top_sliders/slide_1.png'
|
||||
import SliderTwo from '../../assets/images/home/top_sliders/slide_2.png'
|
||||
import SliderThree from '../../assets/images/home/top_sliders/slide_3.png'
|
||||
import SliderFour from '../../assets/images/home/top_sliders/slide_4.png'
|
||||
// import SliderFive from '../../assets/images/home/top_sliders/slide_5.png'
|
||||
|
||||
|
||||
function HeroHomeOne() {
|
||||
var site = getConfig()[0];
|
||||
|
||||
const sliders = [
|
||||
SliderOne, SliderTwo, SliderThree, SliderFour
|
||||
]
|
||||
|
||||
return (
|
||||
<>
|
||||
<section className="appie-hero-area">
|
||||
<div className="container">
|
||||
<div className="row align-items-center">
|
||||
<div className="row">
|
||||
<div className="col-lg-6">
|
||||
<div className="appie-hero-content appie-hero-content-6">
|
||||
<div className="appie-hero-content appie-hero-content-6 d-flex flex-column h-100">
|
||||
{/*<span>Welcome To WrenchBoard..</span>*/}
|
||||
<h1 className="appie-title">
|
||||
Turn Chores into Exciting Challenges and Earn <span className='earn-rewards px-2'>Rewards!</span>
|
||||
</h1>
|
||||
<p>Your place to set family goals and reward achievements. Find tasks to earn from, or build a tasks portfolio and find others to perform tasks for you.</p>
|
||||
<ul>
|
||||
<ul className='d-flex justify-content-center justify-content-lg-start'>
|
||||
<li className=''>
|
||||
<a className="item-2" target='_blank' href={process.env.REACT_APP_APPLE_APP}>
|
||||
<i className="fab fa-apple"></i>
|
||||
@@ -52,9 +62,9 @@ function HeroHomeOne() {
|
||||
data-wow-delay="200ms"
|
||||
>
|
||||
{/* <img src={heroThumbOne} alt="WrenchBoard" /> */}
|
||||
<div style={{ width: '350px', margin: 'auto' }}>
|
||||
<div style={{ width: '350px', height:'auto', margin: 'auto' }}>
|
||||
<CustomSlider
|
||||
images={[heroThumbOne, heroThumbOne1, heroThumbOne]}
|
||||
images={sliders}
|
||||
speed='5'
|
||||
indicatorColor='#333'
|
||||
/>
|
||||
|
||||
@@ -1,13 +1,14 @@
|
||||
import React from "react";
|
||||
import IconOne from "../../assets/images/icon/account_login.png";
|
||||
import IconTwo from "../../assets/images/icon/task.png";
|
||||
import IconThree from "../../assets/images/icon/target.png";
|
||||
import IconFour from "../../assets/images/icon/reward.png";
|
||||
import React from 'react';
|
||||
import IconOne from '../../assets/images/icon/reward.png';
|
||||
import IconTwo from '../../assets/images/icon/assign-chores.png';
|
||||
import IconThree from '../../assets/images/icon/financial-education.png';
|
||||
import IconFour from '../../assets/images/icon/family-connect.png';
|
||||
import Main from '../lnd/LndParts/Design/Main';
|
||||
|
||||
function ServiceItem({ icon, title, description, index }) {
|
||||
return (
|
||||
<div
|
||||
className="appie-single-service text-center mt-30 wow animated fadeInUp"
|
||||
className="service-item text-center mt-30 wow animated fadeInUp"
|
||||
data-wow-duration="2000ms"
|
||||
data-wow-delay={`${200 * (index + 1)}ms`}
|
||||
style={{ cursor: "default" }}
|
||||
@@ -22,58 +23,39 @@ function ServiceItem({ icon, title, description, index }) {
|
||||
}
|
||||
|
||||
function ServicesHomeOne({ className }) {
|
||||
const serviceTitle = "Set Goals and Rewards to Inspire";
|
||||
const serviceItems = [
|
||||
{
|
||||
icon: IconOne,
|
||||
title: "Free Account",
|
||||
description: "Join WrenchBoard. Get your free account.",
|
||||
},
|
||||
{
|
||||
icon: IconTwo,
|
||||
title: "Set Goals",
|
||||
description: "Suggest or find what you want to get rewarded for.",
|
||||
},
|
||||
{
|
||||
icon: IconThree,
|
||||
title: "Complete",
|
||||
description: "Complete task, and notify assigner with ease.",
|
||||
},
|
||||
{
|
||||
icon: IconFour,
|
||||
title: "Reward",
|
||||
description: "Task completed. Find your reward.",
|
||||
},
|
||||
];
|
||||
|
||||
return (
|
||||
<section
|
||||
className={`appie-service-area pt-10 pb-50 ${className}`}
|
||||
className={`appie-service-area pt-50 pb-50 ${className}`}
|
||||
id="service"
|
||||
>
|
||||
<div className="container">
|
||||
<div className="row justify-content-center">
|
||||
<div className="col-lg-8">
|
||||
<div className="appie-section-title text-center">
|
||||
<h3 className="appie-title">{serviceTitle}</h3>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div className="row">
|
||||
{serviceItems.map(({ icon, title, description }, index) => (
|
||||
<div key={index} className="col-lg-3 col-md-6">
|
||||
<ServiceItem
|
||||
icon={icon}
|
||||
title={title}
|
||||
description={description}
|
||||
index={index}
|
||||
/>
|
||||
</div>
|
||||
))}
|
||||
</div>
|
||||
</div>
|
||||
>
|
||||
<Main />
|
||||
</section>
|
||||
);
|
||||
}
|
||||
|
||||
export default ServicesHomeOne;
|
||||
|
||||
const serviceTitle = `Set Chores, Set Goals and Rewards Accomplishments`;
|
||||
const serviceItems = [
|
||||
{
|
||||
icon: IconOne,
|
||||
title: 'Reward Goals Met',
|
||||
description: 'Set goals together and reward accomplishment',
|
||||
},
|
||||
{
|
||||
icon: IconTwo,
|
||||
title: 'Assign Regular Chores',
|
||||
description: 'Organize essential regular chores to be done',
|
||||
},
|
||||
{
|
||||
icon: IconThree,
|
||||
title: 'Financial Education',
|
||||
description: 'Get Kids start early on money management',
|
||||
},
|
||||
{
|
||||
icon: IconFour,
|
||||
title: 'Family Connect',
|
||||
description: 'Connect family, share accomplishments with friends',
|
||||
},
|
||||
];
|
||||
@@ -18,6 +18,7 @@ import TrafficHomeTwo from './TrafficHomeTwo';
|
||||
import WrenchBoardHome from './WrenchBoardHome';
|
||||
import RecentJobsOne from './RecentJobsOne';
|
||||
import StickyHeaderNav from '../StickyHeader/StickyHeaderNav';
|
||||
import FeaturedScreen from './FeaturedScreen';
|
||||
//import BlogData from './../../Services/BlogData';
|
||||
|
||||
function HomeOne() {
|
||||
@@ -35,6 +36,7 @@ function HomeOne() {
|
||||
{/*<FaqHomeOne />*/}
|
||||
{/*<TrafficHomeOne />*/}
|
||||
<TrafficHomeTwo />
|
||||
<FeaturedScreen />
|
||||
{/*<TestimonialHomeOne />*/}
|
||||
{/*<TeamHomeOne />*/}
|
||||
{/*<PricingHomeOne />*/}
|
||||
|
||||