tracker#309

fixes
2023-07-10 11:39:04 +05:30 · 2023-02-10 12:07:54 +05:30 · 2023-01-24 17:37:47 +05:30 · 2023-01-24 17:21:08 +05:30 · 2022-07-18 11:08:50 +05:30 · 2022-07-14 14:13:00 +05:30
257 changed files with 43394 additions and 0 deletions
--- a/.env.custom
+++ b/.env.custom
@ -0,0 +1,21 @@
+VUE_APP_MAGENTO_API_URL=https://customapi-r5bdena-kkhydudga4ihy.us.magentosite.cloud
+VUE_APP_CRANE_URL=/shop
+VUE_APP_GATE_URL=/gate
+VUE_APP_ME_URL=/retailer
+VUE_APP_LOGIN_URL=/gate/sign-in
+VUE_APP_PERSONALIZE_URL=https://personalize-daily.crane.com/personalize
+VUE_APP_PROVISION_URL=http://manager-daily.crane.com/manager
+VUE_APP_IMAGE_PATH_URL=https://staging.crane.com/media/catalog/product
+VUE_APP_RETAILOR_ID=449057567-f789-420c-98b6-2e0443af73f5
+VUE_APP_IMAGE_CATEGORY_PATH_URL=https://staging.crane.com
+VUE_APP_NODESLS_API_URL=https://imagelib-sls-stg.crane.com
+VUE_APP_HOME_PAGE_URL=https://next.crane.com
+VUE_APP_CC_CONNECTION_URL=https://www.personalized-stationery.com/CranesConnectionRedesign/Personalize.aspx?
+VUE_APP_MAINTENANCE_MODE=false
+VUE_APP_MAINTENANCE_PAGE_URL=/maintenance
+VUE_APP_ASSETS_NODESLS_URL=https://assets-sls.crane.com
+VUE_APP_IMAGE_CATEGORY_PARAMS=?height=600&width=600
+VUE_APP_IMAGE_LIB_URL=https://imagelib-api.crane.com
+VUE_APP_CRANE_ORDER_URL=https://order.crane.com
+VUE_APP_BASE_URL=https://www.crane.com
+VUE_APP_RP_AUTH_NAME=rp_auth_stg
--- a/.env.daily
+++ b/.env.daily
@ -0,0 +1,25 @@
+VUE_APP_MAGENTO_API_URL=https://m2-stg.crane.com
+VUE_APP_CRANE_URL=/shop
+VUE_APP_GATE_URL=/gate
+VUE_APP_ME_URL=/retailer
+VUE_APP_LOGIN_URL=/gate/sign-in
+VUE_APP_PERSONALIZE_URL=https://personalize-daily.crane.com/personalize
+VUE_APP_PROVISION_URL=http://manager-daily.crane.com/manager
+VUE_APP_IMAGE_PATH_URL=https://m2-stg.crane.com/media/catalog/product
+VUE_APP_RETAILOR_ID=49057567-f789-420c-98b6-2e0443af73f5
+VUE_APP_IMAGE_CATEGORY_PATH_URL=https://m2-stg.crane.com
+VUE_APP_NODESLS_API_URL=https://imagelib-sls-stg.crane.com
+VUE_APP_HOME_PAGE_URL=https://www-daily.crane.com
+VUE_APP_CC_CONNECTION_URL=https://www.personalized-stationery.com/CranesConnectionRedesign/Personalize.aspx?
+VUE_APP_MAINTENANCE_MODE=false
+VUE_APP_MAINTENANCE_PAGE_URL=/maintenance
+VUE_APP_IMAGE_CATEGORY_PARAMS=?height=600&width=600
+VUE_APP_CRANE_ORDER_URL=https://order.crane.com
+
+DEPLOY_S3_REGION=us-east-2
+DEPLOY_S3_BUCKET=www-daily.crane.com
+DEPLOY_CLOUDFRONT_ID=E28QEVKG98ZHYU
+VUE_APP_ASSETS_NODESLS_URL=https://assets-sls.crane.com
+VUE_APP_IMAGE_LIB_URL=https://imagelib-api.crane.com
+VUE_APP_BASE_URL=https://www.crane.com
+VUE_APP_RP_AUTH_NAME=rp_auth_stg
--- a/.env.development
+++ b/.env.development
@ -0,0 +1,25 @@
+VUE_APP_MAGENTO_API_URL=https://m2-stg.crane.com
+VUE_APP_CRANE_URL=/shop
+VUE_APP_GATE_URL=/gate
+VUE_APP_ME_URL=/b2b
+VUE_APP_LOGIN_URL=/gate/sign-in
+VUE_APP_PERSONALIZE_URL=https://studio-stg.crane.com/personalize
+VUE_APP_IMAGE_PATH_URL=https://m2-stg.crane.com/media/catalog/product
+VUE_APP_RETAILOR_ID=49057567-f789-420c-98b6-2e0443af73f5
+VUE_APP_IMAGE_CATEGORY_PATH_URL=https://m2-stg.crane.com
+VUE_APP_NODESLS_API_URL=https://imagelib-sls-stg.crane.com
+
+VUE_APP_HOME_PAGE_URL=https://www-stg.crane.com
+VUE_APP_CC_CONNECTION_URL=https://www.staging.personalized-stationery.com/CranesConnectionRedesign/Personalize.aspx?
+VUE_APP_MAINTENANCE_MODE=false
+VUE_APP_MAINTENANCE_PAGE_URL=/maintenance
+VUE_APP_IMAGE_CATEGORY_PARAMS=?height=600&width=600
+VUE_APP_CRANE_ORDER_URL=https://ordertest.crane.com
+
+DEPLOY_S3_REGION=us-east-1
+DEPLOY_S3_BUCKET=retailer-edge-staging-website-bucket
+DEPLOY_CLOUDFRONT_ID=E1QLFKCOZUDC8P
+VUE_APP_ASSETS_NODESLS_URL=https://assets-stg-sls.crane.com
+VUE_APP_IMAGE_LIB_URL=https://imagelib-stg-api.crane.com
+VUE_APP_BASE_URL=https://retailer-stg.crane.com
+VUE_APP_RP_AUTH_NAME=rp_auth_stg
--- a/.env.production
+++ b/.env.production
@ -0,0 +1,26 @@
+NODE_ENV=production
+VUE_APP_MAGENTO_API_URL=https://m2.crane.com
+VUE_APP_CRANE_URL=/shop
+VUE_APP_GATE_URL=/gate
+VUE_APP_ME_URL=/b2b
+VUE_APP_LOGIN_URL=/gate/sign-in
+VUE_APP_PERSONALIZE_URL=https://studio.crane.com/personalize
+VUE_APP_IMAGE_PATH_URL=https://m2.crane.com/media/catalog/product
+VUE_APP_RETAILOR_ID=49057567-f789-420c-98b6-2e0443af73f5
+VUE_APP_IMAGE_CATEGORY_PATH_URL=https://m2.crane.com
+VUE_APP_NODESLS_API_URL=https://imagelib-sls.crane.com
+
+VUE_APP_HOME_PAGE_URL=https://retailer.crane.com
+VUE_APP_CC_CONNECTION_URL=https://www.staging.personalized-stationery.com/CranesConnectionRedesign/Personalize.aspx?
+VUE_APP_MAINTENANCE_MODE=false
+VUE_APP_MAINTENANCE_PAGE_URL=/maintenance
+VUE_APP_IMAGE_CATEGORY_PARAMS=?height=600&width=600
+VUE_APP_CRANE_ORDER_URL=https://ordertest.crane.com
+
+DEPLOY_S3_REGION=us-east-1
+DEPLOY_S3_BUCKET=retailer-edge-production-website-bucket
+DEPLOY_CLOUDFRONT_ID=E1WSOW180GVD3S
+VUE_APP_ASSETS_NODESLS_URL=https://assets-sls.crane.com
+VUE_APP_IMAGE_LIB_URL=https://imagelib-api.crane.com
+VUE_APP_BASE_URL=https://retailer.crane.com
+VUE_APP_RP_AUTH_NAME=rp_auth_prod
--- a/.env.staging
+++ b/.env.staging
@ -0,0 +1,26 @@
+NODE_ENV=production
+VUE_APP_MAGENTO_API_URL=https://m2-stg.crane.com
+VUE_APP_CRANE_URL=/shop
+VUE_APP_GATE_URL=/gate
+VUE_APP_ME_URL=/b2b
+VUE_APP_LOGIN_URL=/gate/sign-in
+VUE_APP_PERSONALIZE_URL=https://studio-stg.crane.com/personalize
+VUE_APP_IMAGE_PATH_URL=https://m2-stg.crane.com/media/catalog/product
+VUE_APP_RETAILOR_ID=49057567-f789-420c-98b6-2e0443af73f5
+VUE_APP_IMAGE_CATEGORY_PATH_URL=https://m2-stg.crane.com
+VUE_APP_NODESLS_API_URL=https://imagelib-sls-stg.crane.com
+
+VUE_APP_HOME_PAGE_URL=https://www-stg.crane.com
+VUE_APP_CC_CONNECTION_URL=https://www.staging.personalized-stationery.com/CranesConnectionRedesign/Personalize.aspx?
+VUE_APP_MAINTENANCE_MODE=false
+VUE_APP_MAINTENANCE_PAGE_URL=/maintenance
+VUE_APP_IMAGE_CATEGORY_PARAMS=?height=600&width=600
+VUE_APP_CRANE_ORDER_URL=https://ordertest.crane.com
+
+DEPLOY_S3_REGION=us-east-1
+DEPLOY_S3_BUCKET=retailer-edge-staging-website-bucket
+DEPLOY_CLOUDFRONT_ID=E1QLFKCOZUDC8P
+VUE_APP_ASSETS_NODESLS_URL=https://assets-stg-sls.crane.com
+VUE_APP_IMAGE_LIB_URL=https://imagelib-stg-api.crane.com
+VUE_APP_BASE_URL=https://retailer-stg.crane.com
+VUE_APP_RP_AUTH_NAME=rp_auth_stg
--- a/.gitignore
+++ b/.gitignore
@ -0,0 +1,23 @@
+.DS_Store
+node_modules
+/dist
+
+
+# local env files
+.env.local
+.env.*.local
+
+# Log files
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*
+git_info.json
+
+# Editor directories and files
+.idea
+.vscode
+*.suo
+*.ntvs*
+*.njsproj
+*.sln
+*.sw?
--- a/babel.config.js
+++ b/babel.config.js
@ -0,0 +1,5 @@
+module.exports = {
+  presets: [
+    '@vue/cli-plugin-babel/preset'
+  ]
+}
--- a/copyGitInfo.js
+++ b/copyGitInfo.js
@ -0,0 +1,8 @@
+const fs = require('fs');
+
+console.log("coping git info files ...");
+
+fs.copyFile('git_info.json', './dist/static/js/git_info.json', (err) => {
+    if (err) throw err;
+    console.log('git_info.json was copied to dist folder');
+});
--- a/deploy_daily.sh
+++ b/deploy_daily.sh
@ -0,0 +1,6 @@
+rm -Rf dist/*
+yarn
+yarn build:daily
+yarn copy:seo-files
+yarn copy:cache-files
+yarn deploy:daily
--- a/deploy_production.sh
+++ b/deploy_production.sh
@ -0,0 +1,10 @@
+rm -Rf dist/*
+rm -Rf git_info.json
+yarn
+yarn build:production
+yarn copy:git-info
+rm dist/static/js/craneRetailerCatalog.js
+rm dist/static/js/magentoCmsCache.js
+# yarn copy:seo-files
+# yarn copy:cache-files
+yarn deploy:production
--- a/deploy_staging.sh
+++ b/deploy_staging.sh
@ -0,0 +1,10 @@
+rm -Rf dist/*
+rm -Rf git_info.json
+yarn
+yarn build:staging
+yarn copy:git-info
+rm dist/static/js/craneRetailerCatalog.js
+rm dist/static/js/magentoCmsCache.js
+# yarn copy:seo-files
+# yarn copy:cache-files
+yarn deploy:staging
--- a/package.json
+++ b/package.json
@ -0,0 +1,78 @@
+{
+    "name": "my_vuetify",
+    "version": "0.1.0",
+    "private": true,
+    "scripts": {
+        "serve": "vue-cli-service serve  --port 8092",
+        "serve:daily": "vue-cli-service serve --mode daily --port 8092",
+        "serve:custom": "vue-cli-service serve --mode custom --port 8092",
+        "serve:development": "vue-cli-service serve --mode development --port 8092",
+        "serve:staging": "vue-cli-service serve --mode staging --port 8092",
+        "serve:production": "vue-cli-service serve --mode production --port 8092",
+        "copy:seo-files": "node copySeoFiles.js",
+        "copy:cache-files": "node copyCacheFiles.js",
+        "copy:git-info": "node copyGitInfo.js",
+        "index-catalog": "node indexCatalog.js",
+        "build": "vue-cli-service build",
+        "build:daily": "NODE_ENV=production vue-cli-service build --mode daily",
+        "build:staging": "NODE_ENV=production vue-cli-service build --mode staging",
+        "build:production": "NODE_ENV=production vue-cli-service build --mode production",
+        "deploy:daily": "AWS_PROFILE=crane vue-cli-service s3-deploy --mode daily",
+        "deploy:production": "AWS_PROFILE=crane vue-cli-service s3-deploy --mode production",
+        "deploy:staging": "AWS_PROFILE=crane vue-cli-service s3-deploy --mode staging",
+        "lint": "vue-cli-service lint"
+    },
+    "dependencies": {    
+        "core-js": "^3.4.4",
+        "fuse.js": "^6.4.2",
+        "js-base64": "^2.5.1",
+        "lodash-humps": "^3.1.5",
+        "vue": "^2.6.10",
+        "vue-cookies": "^1.5.13",
+        "vue-meta": "^2.4.0",
+        "vue-router": "^3.2.0",
+        "vue-tel-input": "^4.4.0",
+        "vue2-google-maps": "^0.10.7",
+        "vueperslides": "^2.8.2",
+        "vuetify": "^2.1.0",
+        "vuex": "^3.1.2",
+        "vuex-map-fields": "^1.3.6"
+    },
+    "devDependencies": {
+        "@vue/cli-plugin-babel": "^4.1.0",
+        "@vue/cli-plugin-eslint": "^4.1.0",
+        "@vue/cli-service": "^4.1.0",
+        "babel-eslint": "^10.0.3",
+        "eslint": "^5.16.0",
+        "eslint-plugin-vue": "^5.0.0",
+        "git-commit-info-webpack-plugin": "^1.0.3",
+        "sass": "^1.19.0",
+        "sass-loader": "^8.0.0",
+        "vue-cli-plugin-critical": "^1.1.0",
+        "vue-cli-plugin-s3-deploy": "^3.0.0",
+        "vue-cli-plugin-vuetify": "^2.0.3",
+        "vue-template-compiler": "^2.6.10",
+        "vuetify-loader": "^1.3.0"
+    },
+    "eslintConfig": {
+        "root": true,
+        "env": {
+            "node": true
+        },
+        "extends": [
+            "plugin:vue/essential",
+            "eslint:recommended"
+        ],
+        "rules": {
+            "no-useless-catch": "off",
+            "no-console": "off"
+        },
+        "parserOptions": {
+            "parser": "babel-eslint"
+        }
+    },
+    "browserslist": [
+        "> 1%",
+        "last 2 versions"
+    ]
+}
--- a/plan.md
+++ b/plan.md
@ -0,0 +1,61 @@
+```mermaid
+gantt
+       dateFormat  YYYY-MM-DD
+       title Project Zenas roadmap January to June
+
+       section Storefront
+       Sketching                :done,    storefront1, 2020-01-06, 14d
+       UI development           :active,  storefront2, 2020-01-09, 60d
+       Magento wiring           :         storefront3, 2020-01-25, 60d
+       Polishing                :         storefront4, after storefront3, 14d
+       Alpha                    :         store_alpha, after storefront4, 14d
+       Beta                     :         store_alpha, after store_alpha,  40d
+
+       section Provisioning
+       Sketching                :done,    prov_sketching, 2020-01-20, 14d
+       UI development           :active,  prov_ui_dev, after prov_sketching, 28d
+       Backend & wiring         :         prov_backend, 2020-01-03, 28d
+       QA                       :         prov_qa, after prov_backend, 14d
+
+       section Builder
+       Sketching                :done,    builder_sketching, 2020-01-06, 21d
+       UI development - P1      :         builder_ui_dev_p1,  2020-01-20, 28d
+       Backend & wiring - P1    :         builder_backend_p1, 2020-02-02, 28d 
+       Alpha                    :         builer_alpha1, after builder_backend_p1, 14d
+       UI development - P2      :         builder_ui_dev_p2,  after builer_alpha1, 30d
+       Backend & wiring - P2    :         builder_backend_p2, after builer_alpha1, 30d 
+       Beta                     :         builder_beta, after builder_backend_p1, 21d
+
+       section Integration
+       Content - set 1          :         int_content_set1, after builer_alpha1, 21d
+       Content - set 2          :         int_content_set2, after int_content_set1, 21d
+       Content - set 2          :         int_content_set3, after int_content_set3, 21d
+       Pricing                  :         int_pricing after prov_backend, 14d        
+       Order workflow           :         int_order_workflow,  after builer_alpha1, 21d
+       Alpha                    :         int_alpha, after int_order_workflow, 21d
+       Beta                     :         int_beta, after int_alpha, 40d
+
+       
+
+
+```
+
+```mermaid
+gantt
+       dateFormat  YYYY-MM-DD
+       title Project Zenas high-level roadmap June to September
+
+       section CMS              
+       Image Library            :         cms_image_lib, 2020-06-01, 14d
+       Page Editor              :         cms_page_editor, after cms_image_lib, 14d
+       Blog                     :         cms_blog, after cms_page_editor, 14d
+       Alpha                    :         cms_alpha, after cms_blog, 14d
+       Beta                     :         cms_beta, after cms_alpha,  28d
+
+       section Builder Plus
+       Acceptable choices       :         builder_plus_acceptable_choices, 2020-06-01, 28d
+       Alpha                    :         builder_plus_alpha, after builder_plus_acceptable_choices, 21d
+       Beta                     :         builder_plus_beta, after builder_plus_alpha, 21d
+
+       
+```
--- a/public/favicon.ico
+++ b/public/favicon.ico
--- a/public/index.html
+++ b/public/index.html
@ -0,0 +1,82 @@
+<!DOCTYPE html>
+<html lang="en">
+
+<head>
+    <meta charset="utf-8">
+    <meta http-equiv="X-UA-Compatible" content="IE=edge">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0" />
+    <meta http-equiv="cache-control" content="max-age=0" />
+    <meta http-equiv="cache-control" content="no-cache" />
+    <meta http-equiv="expires" content="-1" />
+    <meta http-equiv="expires" content="Tue, 01 Jan 1980 1:00:00 GMT" />
+    <meta http-equiv="pragma" content="no-cache" />
+    <!-- <link rel="icon" href="<%= BASE_URL %>favicon.ico"> -->
+    <title>Crane Stationery</title>
+    <link rel="preload" href="https://fonts.googleapis.com/css?family=Roboto:100,300,400,500,700,900&display=swap" as="style" onload="this.onload=null;this.rel='stylesheet'">
+    <link rel="preload"  href="https://cdn.jsdelivr.net/npm/@mdi/font@latest/css/materialdesignicons.min.css" as="style" onload="this.onload=null;this.rel='stylesheet'">
+</head>
+
+<body>
+    <!-- <img src="https://fp.listrakbi.com/fp/yJ3fjhPTdCKx.jpg" height="1" width="1" hidden /> -->
+    <noscript>
+        <strong>We're sorry but my_vuetify doesn't work properly without JavaScript enabled. Please enable it to
+            continue.</strong>
+    </noscript>
+    <div id="app"></div>
+    <script src="/static/js/magentoCmsCache.js"></script>
+    <script src="/static/js/craneRetailerCatalog.js"></script>    
+
+    <script>
+        // if (location.hash) {
+        //   history.pushState({}, "Application entry", location.hash.substring(2))
+        // };
+
+        // if (location.hash) {
+        //   console.log("url change to :",location.hash.substring(2)+window.location.search)
+        //   history.pushState({}, "Application entry", location.hash.substring(2)+window.location.search)
+        // };
+    </script>
+    <!-- built files will be auto injected -->
+
+    <!-- Listrak Analytics – Javascript Framework -->
+   <!-- <script type="text/javascript">
+        var biJsHost = (("https:" == document.location.protocol) ? "https://" : "http://");
+        (function (d, s, id, tid, vid) {
+            var js, ljs = d.getElementsByTagName(s)[0];
+            if (d.getElementById(id)) return;
+            js = d.createElement(s);
+            js.id = id;
+            js.src = biJsHost + "cdn.listrakbi.com/scripts/script.js?m=" + tid + "&v=" + vid;
+            ljs.parentNode.insertBefore(js, ljs);
+        })(document, 'script', 'ltkSDK', 'yJ3fjhPTdCKx', '1');
+    </script>-->
+    <!--START Pepperjam CODE-->
+    <!--<script>
+        (function () {
+            var a = document.createElement("script");
+            a.type = "text/javascript", a.async = !0, a.src = "//container.pepperjam.com/4135755510.js";
+            var b = document.getElementsByTagName("head")[0];
+            if (b) b.appendChild(a, b);
+            else {
+                var b = document.getElementsByTagName("script")[0];
+                b.parentNode.insertBefore(a, b)
+            }
+        })();
+    </script>-->
+    <!--END Pepperjam CODE-->
+    <!-- Criteo Homepage Tag -->
+    <!--<script type="text/javascript" src="//static.criteo.net/js/ld/ld.js" async="true"></script>
+    <script type="text/javascript">
+        window.criteo_q = window.criteo_q || [];
+        var deviceType = /iPad/.test(navigator.userAgent) ? "t" : /Mobile|iP(hone|od)|Android|BlackBerry|IEMobile|Silk/.test(navigator.userAgent) ? "m" : "d";
+        window.criteo_q.push(
+            { event: "setAccount", account: 51127 }, // You should never update this line
+         //   { event: "setEmail", email: "" }, // Can be an empty string
+            { event: "setSiteType", type: deviceType },
+         //   { event: "viewHome" }
+        );
+    </script>-->
+    <!-- END Criteo Home Page Tag -->
+</body>
+
+</html>
--- a/public/static/js/craneRetailerCatalog.js
+++ b/public/static/js/craneRetailerCatalog.js
--- a/public/static/js/magentoCmsCache.js
+++ b/public/static/js/magentoCmsCache.js
--- a/server.cert
+++ b/server.cert
@ -0,0 +1,21 @@
+-----BEGIN CERTIFICATE-----
+MIIDaDCCAlACCQCOfHBFrAiV7zANBgkqhkiG9w0BAQsFADB2MQswCQYDVQQGEwJS
+TzESMBAGA1UECAwJQnVjaGFyZXN0MRIwEAYDVQQHDAlCdWNoYXJlc3QxDjAMBgNV
+BAoMBUF6b3RoMRIwEAYDVQQDDAlsb2NhbGhvc3QxGzAZBgkqhkiG9w0BCQEWDHJh
+cmVzQGF4ei5ybzAeFw0xOTA3MjMwNTEzMzZaFw0xOTA4MjIwNTEzMzZaMHYxCzAJ
+BgNVBAYTAlJPMRIwEAYDVQQIDAlCdWNoYXJlc3QxEjAQBgNVBAcMCUJ1Y2hhcmVz
+dDEOMAwGA1UECgwFQXpvdGgxEjAQBgNVBAMMCWxvY2FsaG9zdDEbMBkGCSqGSIb3
+DQEJARYMcmFyZXNAYXh6LnJvMIIBIjANBgkqhkiG9w0BAQEFAAOCAQ8AMIIBCgKC
+AQEA1JQI9I+wy48akRcT43OF9m3WEVz7Rn2ILjVkl7O+kmzXi1+gbchqmTmFcgMj
+C2ekjX/z0kEC+wrs4v7/5U8oTVOpkdSmOdbYxFRRVpAW+sC4rFEcIdGaIIBk8kcv
+FnmxBeOEkz25fPrg+Pkt1mPLNEnEVpmyEY9ZhtsbA0tK7kRr1aiVCvvblx459c9r
+TcqoL3t1Db0MxoNvNXUgf/ypotLtBWAkJDdSG9nlZi6jDpHWjfm0UDrT9OMhm9Vz
+xWjzYT8t74lWR7JuzYS0L3hZn60ZukcfmO0FuGrAfEgh03Acit0393x5q0w0LTSu
+5B82ILUJSqhlnkdA3Bk9LD57IwIDAQABMA0GCSqGSIb3DQEBCwUAA4IBAQAYR5Ix
+nr7ZBLtwOt66oJIJCcAI28pKmSZsZCiyS1WkjTmD0ewQbtirZ7BrQEv4IT98eGc5
+2Pn9VwAoJeOXx7Mky3sDJ3Bkv6Usfb2LTW3V6Mdbu2GB7wXYMzg0RjKhEQipIopD
+/TkduLNsCez53r54EpuPp5V3uYUqbwM1WflDIpd/Mx+T6UariJLy18J/o6FAqyAP
+W8F3qFEmv6SWvQqXfZWuA9UpMx88nugcsjUxW9KXLceQ4Si8iyFyQW5+jJ8MPc6m
+IRmIRBQGaMf/6JSrFcaQ5ThqPbRWPIHyROdC66rNzKz9yjUNo7ICBgGWmUvOW0tL
+X1BLZcGo6UJtf6Gh
+-----END CERTIFICATE-----
--- a/server.key
+++ b/server.key
@ -0,0 +1,28 @@
+-----BEGIN PRIVATE KEY-----
+MIIEvgIBADANBgkqhkiG9w0BAQEFAASCBKgwggSkAgEAAoIBAQDUlAj0j7DLjxqR
+FxPjc4X2bdYRXPtGfYguNWSXs76SbNeLX6BtyGqZOYVyAyMLZ6SNf/PSQQL7Cuzi
+/v/lTyhNU6mR1KY51tjEVFFWkBb6wLisURwh0ZoggGTyRy8WebEF44STPbl8+uD4
+S3WY8s0ScRWmbIRj1mG2xsDS0ruRGvVqJUK+9uXHjn1z2tNyqgve3UNvQzGg281
+dSB//Kmi0u0FYCQkN1Ib2eVmLqMOkdaN+bRQOtP04yGb1XPFaPNhPy3viVZHsm7N
+hLQveFmfrRm6Rx+Y7QW4asB8SCHTcByK3Tf3fHmrTDQtNK7kHzYgtQlKqGWeR0Dc
+GT0sPnsjAgMBAAECggEAW/x+74zqHPucrGIHGipYMq2Or07D8NnLPuudzsNZ2LS+
+hLHpkvfhoNIyO4a9+GZt30kZ8cZuCsHMheGAS/L35pYoT1FsaKTegf5WgBWzy+fv
+QamLedrgTeYhSHGjH5+jCYBNUwWnqTxKc5In0pi2SrcM/cheNJkKTX+sbb17/CPW
+/4KRngKLknVj4xwHimGHGLUMArMZ5xAfI0F/hDltU0zbdLwmwYjerp6BKVrazq2+
+reLuUL/olnEXyJO7fIxZCC50lIbuXinsCc6NoqIFFlmv43aRvdW5FL98tGw/FpyV
+LlpRERLTunenku4T7e4rJ0sLvttMqP5E7VP2DexAYQKBgQD6IickrVl/NVwjxkAt
+wxNUfDibtexIiysw0XkCbCGcesFajYip/hk0N5bGBcgUlWBQVwtiPt8sTUVtZjro
+EFxJKKsJGG4DkwccHHlaQYXRl0dkYYABhH7CyRSG+QM5m0qbUAFBEcc73s9zrpGV
+kxYtLhc1dIfXOKByvXYFwb3fswKBgQDZkGTgQGvHFRUIoa5cKssZ3tMfd8ws4bbY
+mO6iDneMr1/bhOzwbx1B2eyprqpig/wiei+8/zPVT4zktw6SGIw/u3xL4fiD9PLe
+v+8Jy0lPw3Dx6tm4dTlq4CqHggPMhoE9gALwkyWc3FXhe8dVwxU/dVPOBhsbtHV9
+oOZdoPy+0QKBgDlnHRSNs7w9wqdzF8dovUbmOxeA6Hi9d2v8poinyA7hHP5q/LIG
+XkJdf3xyVzhiD3hggXxKcWz5TrWMgHhBSOyBKL8tnBG17CvHXRIZd1xiG0AuH/I5
+Nd39x3gyLUtLGBQMiD0ml1JmD7W8mix5VN2JdkoONB5wIGI0mKE5lRmBAoGBAMck
+mHF8BitQbNRdyg+rTAT+JRnkugtK/+b69VN5Eoy/6moxHgBmdM1WAH7A1k0eqqeU
+WCYTIwrZqgmgVcH8nkOoBXof+S4wBC9IWDEK1qwgJT4Kzgc9pbTiQ4uNwpRvedUl
+W4uB5SfTtviSKD+kNcrERlWK2T1ezTyVDsgdF7xBAoGBAIBo0+0ImlxeGXqK8z5g
+a4s/TbIYH7fpSoTcmFPVaO2bhFasLF0J0CmWkCmKgKKnHFTfLqS/Z93wUgCYTQ/Y
+N+ppSCTTZfcUPd3wNcppB6wQUnHg6nmaOjIgQMQT5WlCEOOydkjcfQN0d4tDoc3g
+z3ObQxDxd4XP9mtZ8VQWMXEU
+-----END PRIVATE KEY-----
--- a/src/App.vue
+++ b/src/App.vue
@ -0,0 +1,28 @@
+<template>
+  <v-app color="white">
+    <router-view/>   
+  </v-app>
+</template>
+
+<script>
+export default {
+  name: "App",
+  created() {
+    // const currentPath = this.$router.history.current.path;
+    // if (window.localStorage.getItem('cr_authenticated') === 'false') {
+    //   this.$router.push('/login');
+    // }
+    //
+    // if (currentPath === '/' || currentPath === '/app') {
+    //   this.$router.push('/app/main/analytics');
+    // }
+  },
+  computed: {
+    
+  },
+ 
+};
+</script>
+ <style src="@/styles/_app.scss" lang="scss" /> 
+
+
--- a/src/assets/006bef2459371ccf7f1d2c4d13e1b9af943fd817.png
+++ b/src/assets/006bef2459371ccf7f1d2c4d13e1b9af943fd817.png
--- a/src/assets/32d33cfd6ead3276031a1281a4ddf1ad3a627cde.png
+++ b/src/assets/32d33cfd6ead3276031a1281a4ddf1ad3a627cde.png
--- a/src/assets/3c75d46ae8685185bce31e5663ae5bed29fd76f1.png
+++ b/src/assets/3c75d46ae8685185bce31e5663ae5bed29fd76f1.png
--- a/src/assets/6f4d1edb176c99ca986a6137983251bab93e35d0.png
+++ b/src/assets/6f4d1edb176c99ca986a6137983251bab93e35d0.png
--- a/src/assets/7759b06dbbaeae16992820fc921950c243c8d122.png
+++ b/src/assets/7759b06dbbaeae16992820fc921950c243c8d122.png
--- a/src/assets/Craft_bordering_256x370.jpg
+++ b/src/assets/Craft_bordering_256x370.jpg
--- a/src/assets/Craft_engraving_brushes_256x.jpg
+++ b/src/assets/Craft_engraving_brushes_256x.jpg
--- a/src/assets/CraneStationary-062_BnW.png
+++ b/src/assets/CraneStationary-062_BnW.png
--- a/src/assets/CraneStationary-Store-locator.jpg
+++ b/src/assets/CraneStationary-Store-locator.jpg
--- a/src/assets/CraneStationaryx256.jpg
+++ b/src/assets/CraneStationaryx256.jpg
--- a/src/assets/Crane_Log_In_Page.jpg
+++ b/src/assets/Crane_Log_In_Page.jpg
--- a/src/assets/Crane_Logo_blue.png
+++ b/src/assets/Crane_Logo_blue.png
--- a/src/assets/Crane_Logo_white.png
+++ b/src/assets/Crane_Logo_white.png
--- a/src/assets/Holding
+++ b/src/assets/Holding
--- a/src/assets/Home
+++ b/src/assets/Home
--- a/Page_Mobile.jpg
+++ b/Page_Mobile.jpg
--- a/src/assets/Home_Page_Wedding_Block_EA.jpg
+++ b/src/assets/Home_Page_Wedding_Block_EA.jpg
--- a/src/assets/Homepage-Desktop-Hero.png
+++ b/src/assets/Homepage-Desktop-Hero.png
--- a/src/assets/Homepage-Mobile-Hero.png
+++ b/src/assets/Homepage-Mobile-Hero.png
--- a/src/assets/Image
+++ b/src/assets/Image
--- a/src/assets/Image
+++ b/src/assets/Image
--- a/src/assets/Image
+++ b/src/assets/Image
--- a/src/assets/ImageBlock-01.png
+++ b/src/assets/ImageBlock-01.png
--- a/src/assets/ImageBlock-02_Option1_BnW.png
+++ b/src/assets/ImageBlock-02_Option1_BnW.png
--- a/src/assets/Liberty__Mill_Site_569x434.png
+++ b/src/assets/Liberty__Mill_Site_569x434.png
--- a/src/assets/Mask_Group_27@2x.png
+++ b/src/assets/Mask_Group_27@2x.png
--- a/src/assets/Shipping_Map_@2x.png
+++ b/src/assets/Shipping_Map_@2x.png
--- a/src/assets/Thickness
+++ b/src/assets/Thickness
--- a/src/assets/Whiplash
+++ b/src/assets/Whiplash
--- a/src/assets/blue-arrow.png
+++ b/src/assets/blue-arrow.png
--- a/src/assets/c4aa164d9b01387a88228c67620f7faf861b5544.png
+++ b/src/assets/c4aa164d9b01387a88228c67620f7faf861b5544.png
--- a/src/assets/cd3983401dbf31b8feaf4a4a75f277ccbb24a7e4.png
+++ b/src/assets/cd3983401dbf31b8feaf4a4a75f277ccbb24a7e4.png
--- a/src/assets/cloud-arrow.png
+++ b/src/assets/cloud-arrow.png
--- a/src/assets/cvv.png
+++ b/src/assets/cvv.png
--- a/src/assets/defaultProduct.jpg
+++ b/src/assets/defaultProduct.jpg
--- a/src/assets/f7757a212511f41c6aa27088dc8db4841bcc1478.png
+++ b/src/assets/f7757a212511f41c6aa27088dc8db4841bcc1478.png
--- a/src/assets/font/Whyte-Book.otf
+++ b/src/assets/font/Whyte-Book.otf
--- a/src/assets/font/Whyte-Book.woff
+++ b/src/assets/font/Whyte-Book.woff
--- a/src/assets/font/Whyte-Book.woff2
+++ b/src/assets/font/Whyte-Book.woff2
--- a/src/assets/font/Whyte-Regular.otf
+++ b/src/assets/font/Whyte-Regular.otf
--- a/src/assets/font/Whyte-Regular.woff
+++ b/src/assets/font/Whyte-Regular.woff
--- a/src/assets/font/Whyte-Regular.woff2
+++ b/src/assets/font/Whyte-Regular.woff2
--- a/src/assets/hover-arrow.png
+++ b/src/assets/hover-arrow.png
--- a/src/assets/image_4.png
+++ b/src/assets/image_4.png
--- a/src/assets/landing-page-arrow.png
+++ b/src/assets/landing-page-arrow.png
--- a/src/assets/landing-page-hover-arrow.png
+++ b/src/assets/landing-page-hover-arrow.png
--- a/src/assets/orange-arrow.png
+++ b/src/assets/orange-arrow.png
--- a/src/assets/pay-with-paypal.png
+++ b/src/assets/pay-with-paypal.png
--- a/src/assets/pmtImage1.png
+++ b/src/assets/pmtImage1.png
--- a/src/assets/pmtImage2.png
+++ b/src/assets/pmtImage2.png
--- a/src/assets/pmtImage3.png
+++ b/src/assets/pmtImage3.png
--- a/src/assets/pmtImage4.png
+++ b/src/assets/pmtImage4.png
--- a/src/assets/red-arrow.png
+++ b/src/assets/red-arrow.png
--- a/src/assets/right-arrow-dark.png
+++ b/src/assets/right-arrow-dark.png
--- a/src/assets/right-arrow-white.png
+++ b/src/assets/right-arrow-white.png
--- a/src/assets/right-arrow.png
+++ b/src/assets/right-arrow.png
--- a/src/assets/right-hover-arrow.png
+++ b/src/assets/right-hover-arrow.png
--- a/src/assets/shipment-transit-map-us.png
+++ b/src/assets/shipment-transit-map-us.png
--- a/src/assets/strong-blue-arrow.png
+++ b/src/assets/strong-blue-arrow.png
--- a/src/assets/white-arrow.png
+++ b/src/assets/white-arrow.png
--- a/src/components/common/ConfirmationDialog.vue
+++ b/src/components/common/ConfirmationDialog.vue
@ -0,0 +1,76 @@
+<template>
+  <v-container class="py-0 my-0">
+    <v-dialog
+      v-model="confirmationDialog"
+      origin="left top"
+      hide-overlay
+      persistent
+      max-width="1100px"
+      flat
+    >
+      <v-card tile>
+        <v-card-title>
+          <v-row no-gutters>
+            <v-col cols="11">
+              <p
+                class="body mt-7 mb-0 fontcolor-black-light"
+              >{{confirmationDetails.confirmationMessage}}</p>
+            </v-col>
+            <v-col cols="1" class="text-right">
+              <router-link to class="text-decoration-none black--text fontcolor-black-light">
+                <div @click="onAction(false)">X</div>
+              </router-link>
+            </v-col>
+          </v-row>
+        </v-card-title>
+        <v-card-actions class="px-4">
+          <v-row no-gutters>
+            <v-col cols="12">
+              <v-hover v-slot:default="{ hover }">
+                <v-btn
+                  class="text-uppercase body-font ma-2 button-background"
+                  tile
+                  large
+                  depressed
+                  :outlined="hover"
+                  :color="hover?'white':'primary'"
+                  :class="hover?'primary--text':'white--text'"
+                  @click="onAction(false)"
+                >CANCEL</v-btn>
+              </v-hover>
+              <v-hover v-slot:default="{ hover }">
+                <v-btn
+                  class="text-uppercase body-font ma-2 button-background"
+                  :outlined="hover"
+                  :color="hover?'white':'error'"
+                  :class="hover?'error--text':'white--text'"
+                  tile
+                  large
+                  depressed
+                  @click="onAction(true)"
+                >OK</v-btn>
+              </v-hover>
+            </v-col>
+          </v-row>
+        </v-card-actions>
+      </v-card>
+    </v-dialog>
+  </v-container>
+</template>
+<script>
+export default {
+  name: "ConfirmationDialog",
+  props: ["confirmationDialog", "confirmationDetails"],
+  data: () => ({
+    //confirmationDialog:false
+  }),
+  components: {},
+  computed: {},
+  methods: {
+    onAction: function(action) {
+      this.$emit("actionRemove", { submit: action });
+    }
+  },
+  created() {}
+};
+</script>
--- a/src/components/common/SnackbarComponent.vue
+++ b/src/components/common/SnackbarComponent.vue
@ -0,0 +1,26 @@
+<template>
+  <v-container class="py-0 my-0">
+    <v-snackbar
+      :color="snackbar.color"
+      v-model="snackbar.show"
+      right
+      top
+      :timeout="snackbar.timeout"
+    >{{ snackbar.message }}</v-snackbar>
+  </v-container>
+</template>
+<script>
+export default {
+  name: "SnackbarComponent",
+  props:["snackbar"],
+  data: () => ({
+  }),
+  components: {},
+  computed: {
+  },
+  methods: {
+  },
+  created() {
+  }
+};
+</script>
--- a/src/components/common/SubscriptionDialog.vue
+++ b/src/components/common/SubscriptionDialog.vue
@ -0,0 +1,221 @@
+<template>
+  <v-container class="py-0 my-0">
+    <v-dialog
+      v-model="subscriptionDialog"
+      :max-width="$vuetify.breakpoint.xlOnly?1100:800"
+      :scrollable="false"
+      :overlay-opacity="0.5"
+    >
+      <v-card
+        flat
+        tile
+        :img="isDesktop? `http://media.crane.com/9441/popup_v3.jpg` : ''"
+        :class="isDesktop?'':'dialog-background'"
+      >
+        <v-card-title class="px-2 px-sm-4 pb-0 pt-0 pt-sm-4">
+          <v-row no-gutters>
+            <v-col cols="12" class="d-flex justify-end">
+              <v-btn @click="subscriptionDialog=false" class="dailog-close-button" icon>
+                <v-icon :large="isDesktop" :small="!isDesktop">mdi-window-close</v-icon>
+              </v-btn>
+            </v-col>
+          </v-row>
+        </v-card-title>
+        <v-card-text class="pb-1 pb-sm-3 px-2 px-sm-4">
+          <v-row no-gutters class="mx-0">
+            <v-col cols="12" sm="6">
+              <v-row align="center" class="px-sm-6 px-2 pa-0 ma-0">
+                <v-form ref="subscribeForm" v-model="footerFormValid">
+                  <div class="pa-md-1">
+                    <v-col cols="12" class="pt-0 mb-sm-4">
+                      <span
+                        class="primary--text h3 font-weight-regular text-uppercase"
+                      >{{stayInTouch}}</span>
+                      <p
+                        class="subscribe-fontcolor-black-darken body-font ls-n10 mb-0 pt-2 pt-sm-4"
+                      >Be the first to know about special promotions, new collections and more when you sign up for our emails!</p>
+                    </v-col>
+                    <v-col cols="12" class="pb-0 pt-2 pt-sm-3 d-md-block">
+                      <v-row no-gutters>
+                        <v-col cols="12">
+                          <v-text-field
+                            @blur="resetEmailValidation"
+                            label="Your Email"
+                            id="emailTextBox"
+                            class="footerpage_email_textbox fontsize-14 regular-font"
+                            solo
+                            flat
+                            dense
+                            :rules="emailRules"
+                            tile
+                            v-model="email"
+                          ></v-text-field>
+                        </v-col>
+                        <v-col cols="12">
+                          <v-btn
+                            depressed
+                            :block="!isDesktop"
+                            color="primary"
+                            class="white--text mr-n3 text-uppercase footerpage_submit_email_btn body-font"
+                            @click="submit()"
+                          >SUBMIT</v-btn>
+                        </v-col>
+                      </v-row>
+                    </v-col>
+                  </div>
+                </v-form>
+              </v-row>
+            </v-col>
+          </v-row>
+          <v-row v-if="!isDesktop"  class="regular-font subscribe-fontcolor-black-darken mx-0 px-sm-6 px-2">
+            <v-col cols="12" sm="3">
+              <router-link to class="subscribe-fontcolor-black-darken">
+                <span @click="subscriptionDialog=false">No, thank you</span>
+              </router-link>
+            </v-col>
+            <v-col cols="12" sm="9" class="pt-0 pt-sm-3">
+              By signing up, you agree to our and
+              <router-link
+                to
+                @click.native="goToLink('https://www.crane.com/privacy-policy')"
+                title="Privacy Policy"
+                class="subscribe-fontcolor-black-darken"
+              >
+                <span>Privacy Policy</span>
+              </router-link>and
+              <router-link
+                to
+                @click.native="goToLink('https://www.crane.com/terms-of-use')"
+                title="Terms of Service"
+                class="subscribe-fontcolor-black-darken"
+              >
+                <span>Terms of Service</span>
+              </router-link>.
+            </v-col>
+          </v-row>
+        </v-card-text>
+        </v-card>
+        <v-row v-if="isDesktop"  class="regular-font subscribe-fontcolor-black-darken bottom-div-background mx-0">
+          <v-col cols="12" sm="3">
+              <router-link to class="subscribe-fontcolor-black-darken">
+                <span @click="subscriptionDialog=false">No, thank you</span>
+              </router-link>
+          </v-col>
+          <v-col cols="12" sm="9" class="pt-0 pt-sm-3">
+              By signing up, you agree to our  and 
+              <router-link to
+                  @click.native="goToLink('https://www.crane.com/privacy-policy')"   title="Privacy Policy" class="subscribe-fontcolor-black-darken">
+                <span>Privacy Policy</span>
+              </router-link>
+              and
+              <router-link to
+                  @click.native="goToLink('https://www.crane.com/terms-of-use')" title="Terms of Service" class="subscribe-fontcolor-black-darken">
+                <span>Terms of Service</span>
+              </router-link>.
+          </v-col>
+      </v-row>
+    </v-dialog>
+    <SnackbarComponent :snackbar="snackbar"></SnackbarComponent>
+  </v-container>
+</template>
+<script>
+/*eslint-disable*/
+import SnackbarComponent from "@/components/common/SnackbarComponent";
+export default {
+  name: "SubscriptionDialog",
+  data: () => ({
+    subscriptionDialog: false,
+    footerFormValid: false,
+    emailRules: [
+      (v) => !!v || "Email is required",
+      (v) => /.+@.+\..+/.test(v) || "Email must be valid",
+    ],
+    stayInTouch: "LET'S STAY IN TOUCH",
+    email: null,
+    snackbar: {
+      show: false,
+      message: null,
+      color: null,
+      timeout: 0,
+    },
+  }),
+  components: { SnackbarComponent },
+  computed: {
+    isDesktop: function () {
+      return this.$vuetify.breakpoint.xsOnly ? false : true;
+    },
+  },
+  methods: {
+    goToLink(pageLink) {
+      window.location.replace(pageLink);
+      //} else {
+      //window.open(routeSecond, "_self");
+      //}
+    },
+    submit: function () {
+      if (this.$refs.subscribeForm.validate()) {
+        this.$store
+          .dispatch("emailSubscriber/fetchEmailSubscriber", {
+            email: this.email,
+          })
+          .then((status) => {
+            if (status === "you have successfully subscribed.") {
+              this.snackbar = {
+                message: status,
+                color: "success",
+                show: true,
+                timeout: 5000,
+              };
+            } else {
+              this.snackbar = {
+                message: status,
+                color: "error",
+                show: true,
+                timeout: 5000,
+              };
+            }
+          })
+          .catch((error) => {
+            this.snackbar = {
+              message: error.message,
+              color: "error",
+              show: true,
+              timeout: 5000,
+            };
+          });
+        this.email = null;
+        this.$refs.subscribeForm.resetValidation();
+        this.subscriptionDialog = false;
+      }
+    },
+
+    resetEmailValidation() {
+      this.$refs.subscribeForm.resetValidation();
+    },
+  },
+  mounted() {          
+    // setTimeout(() => {    
+    //  let userVisitCount= localStorage.getItem("cr_userVisitCount");     
+    //   if (!userVisitCount||userVisitCount == 1) this.subscriptionDialog = true;
+    //   else this.subscriptionDialog = false;
+    // }, 4000);
+  },
+};
+</script>
+<style>
+.bottom-div-background {
+  background: rgba(217 218 221 / 20%);
+}
+.dialog-background {
+  background-color: #97cfe3 !important;
+}
+.dailog-close-button.v-btn:not(.v-btn--text):not(.v-btn--outlined):focus:before {
+  opacity: 0 !important;
+}
+.dailog-close-button.v-btn:not(.v-btn--text):not(.v-btn--outlined):hover:before {
+  opacity: 0 !important;
+}
+.subscribe-fontcolor-black-darken {
+  color: #1d1d1d !important;
+}
+</style>
--- a/src/components/gate/ForgotPasswordComponent.vue
+++ b/src/components/gate/ForgotPasswordComponent.vue
@ -0,0 +1,98 @@
+<template>
+  <v-card>
+    <v-toolbar color="primary" class="white--text" flat>
+      <v-toolbar-title text-center>Forgot Password</v-toolbar-title>
+    </v-toolbar>
+    <v-card-text>
+      <v-alert type="error" v-if="!!forgotPasswordError">{{forgotPasswordError}}</v-alert>
+      <v-alert type="success" v-if="!!forgotPasswordMessage">{{forgotPasswordMessage}}</v-alert>
+      <v-form ref="forgotPassword" v-on:submit.prevent="resetPassword">
+        <v-text-field
+          label="Your Registered Email"
+          type="email"
+          class="textfield-border"
+          ref="email"
+          v-model="email"
+          :rules="emailRules"
+          prepend-icon="mdi-email-outline"
+        >
+        </v-text-field>
+
+        <div class="mt-5 text-center">
+           <v-hover v-slot:default="{ hover }">
+            <v-btn
+              large
+              block
+              :outlined="hover ? false:true"
+              :color="hover ? 'primary' : 'primary'"
+              class="mt-6 body"
+              tile
+              @click="resetPassword"
+              :disabled="inProgress"
+            ><v-progress-circular :size="20" color="primary" indeterminate v-if="inProgress"></v-progress-circular>Reset Password</v-btn>
+          </v-hover>
+        </div>
+      </v-form>
+      <v-row>
+        <v-col cols="12">
+          Already have a account sign in here
+          <v-hover v-slot:default="{ hover }">
+          <router-link class="text-decoration-none" :to="{name:'LoginPage'}" :class="hover ? 'content-link-hover-color' : 'primary--text'">Sign In</router-link>
+          </v-hover>
+        </v-col>
+      </v-row>
+    </v-card-text>
+  </v-card>
+</template>
+<script>
+import { createHelpers } from "vuex-map-fields";
+const { mapFields } = createHelpers({
+  getterType: "registration/getField",
+  mutationType: "registration/updateField"
+});
+
+export default {
+  name: "ForgotPasswordComponent",
+  data: () => ({
+    valid: true,
+    emailRules: [
+      v => !!v || "E-mail is required",
+      v => /.+@.+\..+/.test(v) || "E-mail must be valid"
+    ]
+  }),
+  computed: {
+  ...mapFields([
+      "forgotOne",
+      "forgotOne.email",
+      "spinLogin",
+      "forgotPasswordError",
+      "forgotPasswordMessage",
+      "inProgress"
+    ])
+  },
+  methods: {
+    resetPassword(e) {
+      e.preventDefault();
+      if (this.$refs.forgotPassword.validate()) {
+        this.$store
+          .dispatch("registration/forgotPassword")
+          .then(data => {
+            if (data) {
+              this.$store.dispatch(
+                "auth/prepare",
+                "If there is an account associated with" +' '+ this.email +' '+ "you will receive an email with a link to reset your password."
+              );
+              this.$router.push({
+                name: "SignInPage"
+              });
+            }
+          });
+      }
+    }
+  },
+  created() {
+    this.$store.dispatch("registration/newForgotPassword");
+    this.$store.dispatch("registration/resetState");
+  }
+};
+</script>
--- a/src/components/gate/GateLayout.scss
+++ b/src/components/gate/GateLayout.scss
@ -0,0 +1,29 @@
+.gatelayout-background-image {
+    background-size: cover;
+    background-image: url("../../assets/Crane_Log_In_Page.jpg");
+    background-repeat: no-repeat;
+    height: 100%;
+    -webkit-background-size: cover;
+    -moz-background-size: cover;
+    -o-background-size: cover;
+    background-position: center;
+  }
+  
+.mobile-header-list :before {
+    color:#fff;
+}
+.mobile-header-list-subcategory :before {
+    color:#fff;
+}
+.active-menu-nav-link{
+    color: #000000!important;    
+}
+.active-menu-nav-link.mobile-header-list :before {
+    color: #000000;    
+}
+.active-menu-nav-link.mobile-header-list-subcategory :before {
+    color: #000000!important;     
+}
+.active-menu-nav-link .mobile-header-list-subcategory :before {
+    color:#fff;
+}
--- a/src/components/gate/GateLayout.vue
+++ b/src/components/gate/GateLayout.vue
@ -0,0 +1,406 @@
+<template>
+  <div
+    class="gatelayout-background-image"
+    ref="divOne"
+    v-scroll="onScroll"
+    v-resize="OnResize"
+  >
+    <v-navigation-drawer
+      v-model="showMenu"
+      v-if="showMenu"
+      width="320"
+      :app="showMenu"
+      :absolute="!showMenu"
+      color="primary"
+      tile
+    >
+      <v-icon
+        @click.stop="showMenu = !showMenu"
+        class="white--text pa-4 pl-4 cursor-pointer"
+        >mdi-close</v-icon
+      >
+      <div class="px-4 pb-3">
+      
+        <v-text-field
+          v-model="search"
+          autofocus
+          single-line
+          type="text"
+          color="white"
+          class="mobile-header-search-field white--text background-transparent"
+          @blur="showSearchInput = false"
+          v-on:keyup.enter="GotoPage"
+        >
+          <template v-slot:prepend>
+            <v-icon @click="GotoPage()" class="white--text">mdi-magnify</v-icon>
+          </template>
+        </v-text-field>
+      </div>
+
+      <v-row class="mt-12" justify="center" v-if="inProgress">
+        <v-progress-circular
+          :size="60"
+          color="white"
+          indeterminate
+        ></v-progress-circular>
+      </v-row>
+    
+
+      <v-list class="pl-4 mobile-header-list background-transparent">
+        <v-list-group v-if="userAuth">
+          <template v-slot:activator>
+            <v-list-item-content>
+              <v-list-item-title class="white--text text-uppercase h3 my-2"
+                >Hi {{ userName }}</v-list-item-title
+              >
+            </v-list-item-content>
+          </template>
+          <v-list-item>
+            <span
+              class="white--text text-uppercase h4 my-2"
+              @click="goToDashboard()"
+              >My Account</span
+            >
+          </v-list-item>
+          <v-list-item>
+            <span
+              @click="goToLogout()"
+              class="white--text text-uppercase h4 my-2"
+              >Logout</span
+            >
+          </v-list-item>
+        </v-list-group>
+        <v-list-item v-if="!userAuth">
+          <v-list-item-content class="pa-0">
+            <v-list-item-title
+              class="white--text text-uppercase h3 my-2"
+              @click="goToLogin()"
+              >Sign-In</v-list-item-title
+            >
+          </v-list-item-content>
+        </v-list-item>
+      </v-list>
+    </v-navigation-drawer>
+    <Header
+      v-bind:heroData="heroData"
+      v-bind:offsetTop="offsetTop"
+      @action="onAction"
+      @actionScroll="onActionScroll"
+    />
+    <v-container fill-height class="ios-fill-height py-0">
+      <v-row align="center" align-content="center" justify="center">
+        <v-col cols="12" sm="8" md="6" class="mr-sm-0">
+          <router-view />
+        </v-col>
+      </v-row>
+    </v-container>
+  </div>
+</template>
+<script>
+import Header from "@/components/layout/header/Header";
+import {
+  customAttributeValueNew,
+  getCategoryOne,
+} from "@/services/util.service";
+import { doFetchCatelogProducts } from "@/services/product.service";
+import humps from "lodash-humps";
+export default {
+  name: "GateLayout",
+  components: {
+    Header,
+  },
+  data: () => ({
+    activeMainMenu: "",
+    activeSubMenu: "",
+    activeSubMenuItem: "",
+    offsetTop: 0,
+    showMenu: false,
+    heroData: null,
+    pageNo: 1,
+    pageSize: 9,
+    // categoryList: [],
+    sortSelect: { label: "Position", value: "position" },
+    blockId: "30",
+    search: null,
+    searchResultList: [],
+    lookupCatelog: null,
+    searchInProgress: false,
+  }),
+  watch: {
+    lookupCatelog: {
+      handler: function (newVal) {
+        clearTimeout(this.lookupCatelogProductTimeoutId);
+        this.lookupCatelogProductTimeoutId = setTimeout(async () => {
+          try {
+            if (!newVal) this.searchResultList = [];
+            else {
+              this.searchInProgress = true;
+              let results = await doFetchCatelogProducts(newVal);
+              if (results != null) {
+                this.searchResultList = humps(results);
+              } else {
+                this.searchResultList = [];
+              }
+              this.searchInProgress = false;
+            }
+          } catch (error) {
+            this.searchResultList = [];
+          }
+        }, 500);
+      },
+    },
+  },
+  computed: {
+    easingOptions() {
+      return {
+        duration: this.duration,
+        //  offset: this.offset,
+        easing: this.easing,
+      };
+    },
+    isDesktop: function () {
+      return this.$vuetify.breakpoint.xsOnly ? true : false;
+    },
+    userAuth: function () {
+      return this.$store.state.auth.userAuth;
+    },
+    
+    userName: function () {
+      return this.$store.state.accountOne.one.firstname;
+    },
+    inProgress: function () {
+      return this.$store.state.headerCategoryList.inProgress;
+    },
+    categoryList: {
+      get: function () {
+        return this.$store.state.headerCategoryList.categoryList;
+      },
+      set: function () {},
+      //return this.$store.state.headerCategoryList.categoryList;
+    },
+    categoryDetailsList: function () {
+      return this.$store.state.headerCategoryList.categoryDetails;
+    },
+  },
+  methods: {
+    OnResize() {
+      setTimeout(() => {
+        if (this.$vuetify.breakpoint.mdAndUp) {
+          this.showMenu = false;
+        }
+      }, 200);
+    },
+    GotoPage() {
+      if (this.search) {
+        this.showSearchInput = false;
+        this.searchResultList = [];
+        let searchKeywords = this.search;
+        let pagePath = this.$route.path;
+        let isGateModulePage = pagePath.includes("/gate/");
+        if (isGateModulePage) {
+          window.open(
+            `/search?pageNumber=${this.pageNo}&pageSize=${this.pageSize}&sortBy=relevance&q=${searchKeywords}&filter=e30=`,
+            "_self"
+          );
+        } else {
+          this.$router
+            .push({
+              name: "SearchPage",
+              query: {
+                pageNumber: this.pageNo,
+                pageSize: this.pageSize,
+                sortBy: "relevance",
+                q: searchKeywords,
+                filter: "e30=",
+              },
+            })
+            .catch((error) => {
+              error;
+            });
+          this.$store.dispatch("catalogBrowser/search", {
+            fullCatalog: window.craneCatalog,
+            keywords: searchKeywords,
+            filters: [],
+            pageNumber: 1,
+            pageSize: 9,
+            sortBy: "relevance",
+          });
+        }
+        localStorage.removeItem("cr_subCategoryItemId");
+        localStorage.removeItem("cr_subCategoryId");
+        localStorage.removeItem("cr_mainCategoryId");
+        this.search = null;
+      }
+    },
+    onAction(action) {
+      this.showMenu = action.showMenu;
+      this.categoryList = action.categoryList;
+    },
+    onActionScroll() {
+      if (this.$refs.divOne) {
+        this.$vuetify.goTo(this.$refs.divOne, this.easingOptions);
+      }
+    },
+    onScroll() {
+      this.offsetTop = window.pageYOffset || document.documentElement.scrollTop;
+    },
+    goToStoreLocator() {
+      // window.open(`/store-locator`, "_self");
+    },
+    goToLogin() {
+      window.open("/gate/sign-in", "_self");
+    },
+    getCustomAttributeValue(customAttributes, attributeCode) {
+      return customAttributeValueNew(customAttributes, attributeCode);
+    },
+    /* eslint-disable no-alert, no-console ,  no-debugger */
+    async categoryProducts(flag, category, subcategorys, items) {
+      let mainCat = "";
+      switch (flag) {
+        case "main":
+          mainCat = category;
+          localStorage.setItem("cr_mainCategoryId", category);
+          localStorage.setItem("cr_subCategoryItemId", items);
+          localStorage.setItem("cr_subCategoryId", subcategorys);
+          break;
+        case "subManu":
+          mainCat = subcategorys;
+          localStorage.setItem("cr_mainCategoryId", category);
+          localStorage.setItem("cr_subCategoryItemId", items);
+          localStorage.setItem("cr_subCategoryId", subcategorys);
+          break;
+        case "subManuChild":
+          mainCat = items;
+          localStorage.setItem("cr_mainCategoryId", category);
+          localStorage.setItem("cr_subCategoryItemId", items);
+          localStorage.setItem("cr_subCategoryId", subcategorys);
+          break;
+        default:
+      }
+      if (this.categoryDetailsList) {
+        let categoryOne = await getCategoryOne(
+          this.categoryDetailsList,
+          mainCat
+        );
+        if (categoryOne) {
+          this.$store.dispatch("layout/setHeroContent", categoryOne);
+          let path = this.getCustomAttributeValue(
+            categoryOne.customAttributes,
+            "url_path"
+          );
+         // console.log(categoryOne.name, categoryOne);
+          /*googleAanalyticsEventCategory(
+            "browse_category",
+            "ecommerce",
+            categoryOne
+          );*/
+          let pagePath = this.$route.path;
+          let isGateModulePage = pagePath.includes("/gate/");
+          if (isGateModulePage) {
+            window.open(`/${path}`, "_self");
+          }
+         this.$store.dispatch("catalogBrowser/search", {
+          fullCatalog: window.craneCatalog,
+          keywords: "",
+          filters: [{ label: "Category", prop: "ci", value: mainCat }],
+          pageNumber: 1,
+          pageSize: 9,
+          sortBy: "position",
+        })
+        .catch((error) => {
+          error;
+        });
+
+        }
+      }
+    },
+    goToLogout() {
+      this.$store.dispatch("auth/logout");
+    },
+    goToDashboard() {
+      window.open("/b2b", "_self");
+    },
+  },
+  created() {
+    if (!this.categoryList.id) {
+      this.$store.dispatch("headerCategoryList/fetchCategoryList");
+    }
+
+   // this.$store.dispatch("block/fetchHeaderPromoBanner", this.blockId);
+    if (this.userAuth) {
+      this.$store.dispatch("userCartProduct/cartProductList");
+      // this.$store.dispatch("userCartProduct/productTotalAmt");
+      this.$store.dispatch("accountOne/basicInfo");
+    }
+  },
+};
+</script>
+<style lang="scss">
+.header-input-custom {
+  .v-input__control {
+    background-color: transparent !important;
+  }
+  .v-input__slot {
+    &:before {
+      border-color: #ffffff !important;
+      border-style: solid;
+      border-width: 1px;
+    }
+    &:after {
+      border-color: #ffffff !important;
+      border-style: solid;
+      border-width: 1px;
+    }
+  }
+  .v-text-field__slot {
+    input {
+      color: #ffffff !important;
+      border-bottom-color: #ffffff !important;
+    }
+    input::placeholder {
+      color: #ffffff !important;
+    }
+    input:-ms-input-placeholder {
+      color: #ffffff !important;
+    }
+
+    input ::-ms-input-placeholder {
+      color: #ffffff !important;
+    }
+  }
+  .v-icon {
+    color: #ffffff !important;
+  }
+  .mobile-header-list.theme--light.v-list {
+    background: #2805da;
+  }
+  .v-list-item__icon {
+    color: #ffffff !important;
+  }
+}
+.mobile-header-autocomplete .v-input__append-inner .v-input__icon {
+  display: none !important;
+}
+.mobile-header-autocomplete .theme--light.v-icon {
+  color: #ffffff !important;
+}
+.mobile-header-autocomplete.theme--light.v-input input {
+  color: #ffffff !important;
+}
+.mobile-header-autocomplete.theme--light.v-text-field--filled
+  > .v-input__control
+  > .v-input__slot {
+  background-color: transparent !important;
+}
+.mobile-header-search-field.theme--light.v-text-field--solo
+  > .v-input__control
+  > .v-input__slot {
+  background-color: transparent !important;
+}
+.mobile-header-search-field.theme--light.v-input input {
+  color: #fff;
+}
+</style>
+
+<style  src="./GateLayout.scss" lang="scss" scoped>
+</style>
--- a/src/components/gate/ResetPasswordComponent.vue
+++ b/src/components/gate/ResetPasswordComponent.vue
@ -0,0 +1,137 @@
+<template>
+  <v-card>
+    <v-toolbar color="primary" class="white--text" flat>
+      <v-toolbar-title text-center>Reset Password</v-toolbar-title>
+    </v-toolbar>
+    <v-card-text>
+      <v-alert type="error" v-if="!!resetPasswordError">{{resetPasswordError}}</v-alert>
+      <v-alert type="success" v-if="!!resetPasswordMessage">{{resetPasswordMessage}}</v-alert>
+      <v-form ref="resetPassword"  v-on:submit.prevent="resetPassword" >
+          <v-text-field v-if="emailTextfield" label="Email Id" class="textfield-border" placeholder="Enter your email id" type="email" ref="email" v-model="email" :rules="emailRules" prepend-icon="mdi-email-outline">
+        </v-text-field>
+
+        <v-text-field
+          type="password"
+          class="textfield-border"
+          label="New Password"
+          ref="newPassword"
+          v-model="newPassword"
+          @click="clear()"
+          :rules="commonValidationRules.passwordRule"
+          required
+          prepend-icon="mdi-lock"
+        >
+        </v-text-field>
+
+        <v-text-field
+          type="password"
+          class="textfield-border"
+          label="Confirm Password"
+          ref="confirmPassword"
+          v-model="confirmPassword"
+          :rules="[passwordConfirmationRule]"
+          prepend-icon="mdi-lock"
+          required
+        >
+        </v-text-field>
+
+        <div class="mt-5 text-center">
+           <v-hover v-slot:default="{ hover }">
+            <v-btn
+              large
+              block
+              :outlined="hover ? false:true"
+              :color="hover ? 'primary' : 'primary'"
+              class="mt-6 body"
+              tile
+              @click="resetPassword"
+              :disabled="inProgress"
+            ><v-progress-circular :size="20" color="primary" indeterminate v-if="inProgress"></v-progress-circular>Reset Password</v-btn>
+          </v-hover>
+        </div>
+      </v-form>
+       <v-row>
+        <v-col cols="12">
+          Already have an account sign in here
+          <v-hover v-slot:default="{ hover }">
+           <router-link class="text-decoration-none" :to="{name:'LoginPage'}" :class="hover ? 'content-link-hover-color' : 'primary--text'">Sign In</router-link>
+          </v-hover>
+        </v-col>
+      </v-row>
+    </v-card-text>
+  </v-card>
+</template>
+<script>
+import { createHelpers } from "vuex-map-fields";
+import { commonValidationRules } from "@/services/util.service";
+const { mapFields } = createHelpers({
+  getterType: "registration/getField",
+  mutationType: "registration/updateField"
+});
+
+export default {
+  name: "ResetPasswordComponent",
+  data: () => ({
+    valid: true,
+    confirmPassword: "",
+    commonValidationRules: commonValidationRules,
+     emailRules: [
+      v => !!v || "Email Id is required",
+      v => /.+@.+\..+/.test(v) || "Email Id must be valid"
+    ],
+        emailTextfield:false
+
+  }),
+  computed: {
+    ...mapFields([
+      "resetOne",
+      "resetOne.newPassword",
+        "resetOne.email",
+      "resetPasswordError",
+      "inProgress",
+      "resetPasswordMessage"
+    ]),
+    passwordConfirmationRule() {
+      return () =>
+        this.newPassword === this.confirmPassword || "Password must match";
+    },
+  },
+  methods: {
+    resetPassword(e) {
+      e.preventDefault();
+      if (this.$refs.resetPassword.validate()) {
+
+        this.$store
+          .dispatch("registration/resetPassword")
+          .then(data => {
+            if (data) {
+              this.$store.dispatch(
+                "auth/prepare",
+                "You updated your password."
+              );
+              this.$router.push({
+                name: "SignInPage"
+              });
+            }
+          });
+      }
+    },
+    clear() {
+      return (this.confirmPassword = "");
+    }
+  },
+  created() {
+    this.token = this.$route.params.token;   
+     this.email = this.$route.params.emailId;
+      if(!this.email || this.email=='null' || this.email== 'undefined' ) 
+     {
+      this.emailTextfield =true;
+     }
+    let userIdAndToken = {
+      token : this.token,
+      email:this.email
+      }
+    this.$store.dispatch("registration/newResetPassword",{userIdAndToken});
+  }
+};
+</script>
--- a/src/components/gate/SignInComponent.vue
+++ b/src/components/gate/SignInComponent.vue
@ -0,0 +1,102 @@
+<template>
+  <v-card>
+    <v-toolbar color="primary" class="white--text" flat>
+      <v-toolbar-title text-center>Login</v-toolbar-title>
+    </v-toolbar>
+    <v-card-text>
+      <v-alert class="word-break" type="error" v-if="!!errorMessage">{{errorMessage}}</v-alert>
+      <v-alert class="word-break" type="success" v-if="!!signInMessage">{{signInMessage}}</v-alert>
+      <v-form ref="siginForm" id=signin-form  @submit.prevent="signIn">
+        <v-text-field label="Email Id" class="textfield-border" placeholder="Enter your email id" type="email" ref="email" v-model="email" :rules="emailRules" prepend-icon="mdi-email-outline">
+        </v-text-field>
+
+        <v-text-field
+          type="password"
+          class="textfield-border"
+          label="Password"
+          placeholder="Enter your password"
+          ref="password"
+          v-model="password"
+          :rules="passwordRules"
+          prepend-icon="mdi-lock"
+        >
+        </v-text-field>
+         <v-checkbox v-model="logged" label="Keep me logged in" color="indigo"></v-checkbox>
+        <div class="text-right mt-4">
+          <v-hover v-slot:default="{ hover }">
+            <v-btn
+              :disabled="inProgress"
+              large
+              block
+              :outlined="hover ? false:true"
+              :color="hover ? 'primary' : 'primary'"
+              class="mt-6 body"
+              tile
+              type="submit"
+              form="signin-form"
+              @click="signIn"
+            ><v-progress-circular :size="20" :color="hover ? 'primary' : 'primary'" indeterminate v-if="inProgress"></v-progress-circular> Login</v-btn>
+          </v-hover>
+        </div>
+      </v-form>
+
+      <v-row >
+      <!--  <v-col cols="12">
+          Create an account ?
+          <v-hover v-slot:default="{ hover }">
+            <router-link class="text-decoration-none" :to="{name:'SignUpPage'}" :class="hover ? 'content-link-hover-color' : 'primary--text'">Sign Up</router-link>
+          </v-hover>
+        </v-col>-->
+        <v-col cols="12"  >
+          Forgot your password?
+          <v-hover v-slot:default="{ hover }">
+            <router-link class="text-decoration-none" :to="{name:'forgot-password'}" :class="hover ? 'content-link-hover-color' : 'primary--text'">Forgot Password</router-link>
+          </v-hover>
+        </v-col>
+      </v-row>
+    </v-card-text>
+  </v-card>
+</template>
+<script>
+import { createHelpers } from "vuex-map-fields";
+const { mapFields } = createHelpers({
+  getterType: "auth/getField",
+  mutationType: "auth/updateField"
+});
+
+export default {
+  name: "SignInComponent",
+  data: () => ({
+    valid: true,
+    passwordRules: [
+      v => !!v || "Password is required",
+      v => (v && v.length >= 8) || "Password must be at least 8 characters"
+    ],
+    emailRules: [
+      v => !!v || "Email Id is required",
+      v => /.+@.+\..+/.test(v) || "Email Id must be valid"
+    ]
+  }),
+  computed: {
+    ...mapFields([
+      "one",
+      "one.email",
+      "one.password",
+      "one.logged",
+      "errorMessage",
+      "inProgress",
+      "signInMessage"
+    ])
+  },
+  methods: {
+    signIn() {
+      if (this.$refs.siginForm.validate()) {
+        this.$store.dispatch("auth/login");
+      }
+    }
+  },
+  created() {
+      this.$store.dispatch("auth/newUserLogin");
+  }
+};
+</script>
--- a/src/components/gate/SignUpComponent.vue
+++ b/src/components/gate/SignUpComponent.vue
@ -0,0 +1,155 @@
+<template>
+  <v-card class="mx-auto my-auto" elevation="10">
+    <v-toolbar color="primary" class="white--text" flat>
+      <v-toolbar-title>Signup</v-toolbar-title>
+    </v-toolbar>
+    <v-card-text>
+      <v-alert type="error" v-if="!!errorMessage">{{errorMessage}}</v-alert>
+      <v-alert type="success" v-if="!!signUpMessage">{{signUpMessage}}</v-alert>
+      <v-form ref="signUpForm" id="signup-form" @submit.prevent="signUp">
+        <v-text-field
+          label="First Name"
+          class="textfield-border"
+          type="text"
+          ref="firstName"
+          placeholder="Enter your First Name"
+          v-model="firstname"
+          :rules="firstNameRules"
+          prepend-icon="mdi-account"
+        ></v-text-field>
+        <v-text-field
+          label="Last Name"
+          class="textfield-border"
+          type="text"
+          ref="lastName"
+          placeholder="Enter your Last Name"
+          v-model="lastname"
+          :rules="lastNameRules"
+          prepend-icon="mdi-account"
+        ></v-text-field>
+
+        <v-text-field
+          label="Email Id"
+          class="textfield-border"
+          placeholder="Enter your email"
+          type="email"
+          ref="email"
+          id="userEmail"
+          v-model="email"
+          :rules="emailRules"
+          prepend-icon="mdi-email-outline"
+        ></v-text-field>
+
+        <v-text-field
+          type="password"
+          class="textfield-border"
+          label="Password"
+          ref="password"
+          placeholder="Enter your password"
+          v-model="password"
+          :rules="commonValidationRules.passwordRule"
+          prepend-icon="mdi-lock"
+        ></v-text-field>
+         <v-checkbox v-model="newsletter" label="Subscribe to our newsletter" color="indigo"></v-checkbox>
+        <div class="text-right mt-4">
+          <v-hover v-slot:default="{ hover }">
+            <v-btn
+              large
+              block
+              :disabled="inProgress"
+              :outlined="hover ? false:true"
+              :color="hover ? 'primary' : 'primary'"
+              class="mt-6 body"
+              tile
+              type="submit"
+              form="signup-form"
+              @click="signUp"
+            >
+              <v-progress-circular :size="20" color="primary" indeterminate v-if="inProgress"></v-progress-circular>Signup
+            </v-btn>
+          </v-hover>
+        </div>
+      </v-form>
+      <v-row>
+        <v-col cols="12">
+          Already have an account sign in here
+          <v-hover v-slot:default="{ hover }">
+            <router-link
+              class="text-decoration-none"
+              :to="{name:'LoginPage'}"
+              :class="hover ? 'content-link-hover-color' : 'primary--text'"
+            >Sign In</router-link>
+          </v-hover>
+        </v-col>
+      </v-row>
+    </v-card-text>
+  </v-card>
+</template>
+<script>
+import { createHelpers } from "vuex-map-fields";
+import { commonValidationRules } from "@/services/util.service";
+const { mapFields } = createHelpers({
+  getterType: "registration/getField",
+  mutationType: "registration/updateField"
+});
+
+export default {
+  name: "SignUpComponent",
+  components: {},
+  computed: {
+    ...mapFields([
+      "one",
+      "one.email",
+      "one.firstname",
+      "one.lastname",
+      "one.password",
+      "one.newsletter",
+      "errorMessage",
+      "inProgress",
+      "signUpMessage"
+    ])
+  },
+  data: () => ({
+    valid: true,
+    commonValidationRules: commonValidationRules,
+    firstNameRules: [
+      v => !!v || "First Name is required",
+      v => (v && v.length >= 3) || "First Name must be at least 3 characters"
+    ],
+    lastNameRules: [
+      v => !!v || "Last Name is required",
+      v => (v && v.length >= 3) || "Last Name must be at least 3 characters"
+    ],
+    // passwordRules: [
+    //   v => !!v || "Password is required",
+    //   v => (v && v.length >= 8) || "Password must be at least 8 characters"
+    // ],
+    emailRules: [
+      v => !!v || "Email Id is required",
+      v => /.+@.+\..+/.test(v) || "Email Id must be valid"
+    ]
+  }),
+  methods: {
+    signUp(e) {
+      e.preventDefault();
+      if (this.$refs.signUpForm.validate()) {
+        this.$store.dispatch("registration/signUp");
+        // .then(data => {
+        //   if (data) {
+        //     this.$store.dispatch(
+        //       "auth/prepare",
+        //       "You must confirm your account.Please check your email for the confirmation."
+        //     );
+        //     this.$router.push({
+        //       name: "LoginPage"
+        //     });
+        //   }
+        // });
+      }
+    }
+  },
+  created() {
+    this.$store.dispatch("registration/resetState");
+  }
+};
+</script>
--- a/src/components/layout/Layout.scss
+++ b/src/components/layout/Layout.scss
@ -0,0 +1,50 @@
+.background-transparent {
+    background: transparent !important;
+}
+
+.mobile-header-list :before {
+    //  display: none;
+    color: #fff;
+}
+
+.mobile-header-list-subcategory :before {
+    color: #fff;
+}
+
+.active-menu-nav-link {
+    color: #000000!important;
+}
+
+.active-menu-nav-link.mobile-header-list :before {
+    color: #000000;
+}
+
+.active-menu-nav-link.mobile-header-list-subcategory :before {
+    color: #000000!important;
+}
+
+.active-menu-nav-link .mobile-header-list-subcategory :before {
+    color: #fff;
+}
+
+.mobile-header-autocomplete .v-input__control.v-select__slot.v-input__append-inner {
+    display: none !important;
+}
+.page-height{
+   height: calc(100vh - 50px);
+}
+.mobile-header-search-field.theme--light.v-text-field--solo>.v-input__control>.v-input__slot {
+    background-color: transparent !important;
+}
+.mobile-header-search-field.theme--light.v-input input{
+    color:#fff;
+}
+.mobile-header-search-field.theme--light.v-text-field>.v-input__control>.v-input__slot:before{
+    border-color: #fff;
+}
+.mobile-header-search-field.theme--light.v-text-field:not(.v-input--has-state):hover>.v-input__control>.v-input__slot:before {
+    border-color: #fff;
+}
+.mobile-header-search-field .v-text-field__details{
+    display: none;
+}
--- a/src/components/layout/Layout.vue
+++ b/src/components/layout/Layout.vue
@ -0,0 +1,769 @@
+<template>
+  <div
+    v-scroll="onScroll"
+    v-resize="OnResize"
+    v-bind:class="!heroData ? 'mt-12 page-height' : 'height-100'"
+  >
+    <v-navigation-drawer
+      v-model="showMenu"
+      v-if="showMenu"
+      width="320"
+      :app="showMenu"
+      :absolute="!showMenu"
+      color="primary"
+      tile
+    >
+      <v-icon
+        @click.stop="showMenu = !showMenu"
+        class="white--text pa-4 pl-4 cursor-pointer"
+        >mdi-close</v-icon
+      >
+      <div class="px-4 pb-3">
+        <!--<v-autocomplete
+          v-model="search"
+         
+          color="white"
+          class="mt-0 py-0 white--text header-input-custom background-transparent search-catalog mobile-header-autocomplete"
+          height="30"
+          :items="searchResultList"
+          :loading="searchInProgress"
+          :search-input.sync="lookupCatelog"
+          @change="GotoPage(search)"
+          @blur="showSearchInput = false"
+          hide-details
+          :no-filter="true"
+          hide-no-data
+          flat
+          filled
+          dense
+          clearable
+          item-text="title"
+          item-value="title"
+          prepend-icon="mdi-magnify"
+          return-object
+        >
+          <template v-slot:selection="data">
+            <span class="ml-2" v-text="data.item.title"></span>
+          </template>
+          <template v-slot:item="data">
+            <template>
+              <v-list-item-content>
+                <div class="d-flex justify-space-between">
+                  <v-list-item-title class="d-block text-truncate">{{
+                    data.item.title
+                  }}</v-list-item-title>
+                 
+                </div>
+              </v-list-item-content>
+            </template>
+          </template>
+        </v-autocomplete>-->
+        <v-text-field
+          v-model="search"
+          autofocus
+          single-line
+          type="text"
+          color="white"
+          class="mobile-header-search-field white--text background-transparent mb-0"
+          @blur="showSearchInput = false"
+          v-on:keyup.enter="GotoPage"
+        >
+          <template v-slot:prepend>
+            <v-icon @click="GotoPage()" class="white--text">mdi-magnify</v-icon>
+          </template>
+        </v-text-field>
+        <!--<v-text-field
+          prepend-icon="mdi-magnify"
+          color="white"
+          class="h4 px-4 pl-3 header-input-custom white--text"
+          single-line
+          placeholder
+        ></v-text-field>-->
+      </div>
+      <v-row class="mt-12" justify="center" v-if="inProgress">
+        <v-progress-circular
+          :size="60"
+          color="white"
+          indeterminate
+        ></v-progress-circular>
+      </v-row>
+      <v-list
+        v-else
+        class="pl-4 mobile-header-list background-transparent"
+        v-for="(categories, index) in categoryList.childrenData"
+        v-bind:key="index"
+        v-show="index === 0"
+        dense
+      >
+        <v-list-group
+          class="mobile-header-list"
+          v-for="(category, i) in categories.childrenData"
+          v-bind:key="i"
+          :class="
+            category.id == activeMainMenu && categoryId
+              ? 'active-menu-nav-link'
+              : 'mobile-header-list'
+          "
+          v-show="
+            category.name !== 'Baby' &&
+            category.name !== 'Gifts' &&
+            category.isActive
+          "
+        >
+          <template v-slot:activator>
+            <v-list-item-title>
+              <span
+                @click="categoryProducts('main', category.id, '', '')"
+                :class="
+                  category.id == activeMainMenu && categoryId
+                    ? 'active-menu-nav-link'
+                    : 'white--text'
+                "
+                class="text-uppercase h2 my-2"
+                >{{ category.name }}</span
+              >
+            </v-list-item-title>
+          </template>
+          <v-list-group
+            no-action
+            sub-group
+            flat
+            class="mobile-header-list-subcategory"
+            v-for="(subcategorys, index) in category.childrenData"
+            v-bind:key="index"
+            v-show="subcategorys.isActive"
+            :class="
+              subcategorys.id == activeSubMenu
+                ? 'active-menu-nav-link'
+                : 'mobile-header-list-subcategory'
+            "
+          >
+            <template v-slot:activator>
+              <v-list-item-title>
+                <span
+                  @click="
+                    categoryProducts(
+                      'subManu',
+                      category.id,
+                      subcategorys.id,
+                      ''
+                    )
+                  "
+                  :class="
+                    subcategorys.id == activeSubMenu && categoryId
+                      ? 'active-menu-nav-link'
+                      : 'white--text'
+                  "
+                  class="text-uppercase h4"
+                  >{{ subcategorys.name }}</span
+                >
+              </v-list-item-title>
+            </template>
+            <v-list-item
+              v-for="(items, index) in subcategorys.childrenData"
+              v-bind:key="index"
+            >
+              <span
+                @click="
+                  categoryProducts(
+                    'subManuChild',
+                    category.id,
+                    subcategorys.id,
+                    items.id
+                  )
+                "
+                :class="
+                  items.id == activeSubMenuItem && categoryId
+                    ? 'active-menu-nav-link'
+                    : 'white--text'
+                "
+                class="text-uppercase h5 pa-0"
+                >{{ items.name }}</span
+              >
+            </v-list-item>
+          </v-list-group>
+        </v-list-group>
+      </v-list>
+
+      <v-list class="pl-4 mobile-header-list background-transparent">
+        <v-list-item>
+          <v-list-item-content class="pa-0">
+            <router-link
+              class="text-decoration-none"
+              :to="{ name: 'StoreLocatore' }"
+            >
+              <v-list-item-title class="white--text text-uppercase h2 my-2"
+                >Store Locator</v-list-item-title
+              >
+            </router-link>
+          </v-list-item-content>
+        </v-list-item>
+      </v-list>
+
+      <v-list class="pl-4 mobile-header-list background-transparent">
+        <v-list-group v-if="userAuth">
+          <template v-slot:activator>
+            <v-list-item-content>
+              <v-list-item-title class="white--text text-uppercase h3 my-2"
+                >Hi {{ userName }}</v-list-item-title
+              >
+            </v-list-item-content>
+          </template>
+          <v-list-item>
+            <span
+              class="white--text text-uppercase h4 my-2"
+              @click="goToDashboard()"
+              >My Account</span
+            >
+          </v-list-item>
+          <v-list-item>
+            <span
+              @click="goToLogout()"
+              class="white--text text-uppercase h4 my-2"
+              >Logout</span
+            >
+          </v-list-item>
+        </v-list-group>
+        <v-list-item v-if="!userAuth">
+          <v-list-item-content class="pa-0">
+            <v-list-item-title
+              class="white--text text-uppercase h3 my-2"
+              @click="goToLogin()"
+              >Sign-In</v-list-item-title
+            >
+          </v-list-item-content>
+        </v-list-item>
+      </v-list>
+    </v-navigation-drawer>
+    <Header
+      v-bind:heroData="heroData"
+      v-bind:offsetTop="offsetTop"
+      @action="onAction"
+      @actionScroll="onActionScroll"
+      v-show="!maintainanceFlag"
+    />
+    <HeroContainer
+      v-if="heroData"
+      v-show="!maintainanceFlag"
+      v-bind:heroData="heroData"
+      ref="divOne"
+    >
+      <Header
+        v-bind:heroData="heroData"
+        v-bind:offsetTop="offsetTop"
+        @action="onAction"
+        @actionScroll="onActionScroll"
+        v-show="!maintainanceFlag"
+      />
+    </HeroContainer>
+    <div></div>
+    <router-view />
+    
+  </div>
+</template>
+
+<script>
+import * as easings from "vuetify/es5/services/goto/easing-patterns";
+import Header from "@/components/layout/header/Header";
+import {
+  customAttributeValue,
+  goToCategoryPageRouting,
+  getCategoryOne,
+} from "@/services/util.service";
+import HeroContainer from "@/components/layout/hero-image/HeroContainer";
+import { doFetchCatelogProducts } from "@/services/product.service";
+import humps from "lodash-humps";
+import { createHelpers } from "vuex-map-fields";
+const { mapFields } = createHelpers({
+  getterType: "layout/getField",
+  mutationType: "layout/updateField",
+});
+export default {
+  name: "Layout",
+  components: {
+    Header,
+    HeroContainer,
+  },
+  props: ["activeMainMenu1"],
+  data: () => ({
+    search: null,
+    searchResultList: [],
+    lookupCatelog: null,
+    searchInProgress: false,
+    easing: "easeInOutCubic",
+    easings: Object.keys(easings),
+    selector: "#scroll-with-options",
+    duration: 100,
+    activeMainMenu: "",
+    activeSubMenu: "",
+    activeSubMenuItem: "",
+    offsetTop: 0,
+    showMenu: false,
+    heroData: null,
+    pageNo: 1,
+    pageSize: 9,
+    //categoryList: [],
+    blockId: "30",
+    sortSelect: { label: "Position", value: "position" },
+    aboutContentDescription: `
+      <v-list flat class="content-description">
+        <v-list-item class="d-block mb-4 fontsize-16 line-height-18pt body-font ls-n016">We believe everyone has a second voice. A voice only found on paper.</v-list-item>
+        <v-list-item class="d-block mb-4 fontsize-16 line-height-18pt body-font ls-n016">It may take a moment to come to you, but what you say with it will never fade.</v-list-item>
+        <v-list-item class="d-block mb-4 fontsize-16 line-height-18pt body-font ls-n016">Our aim has always been to help you reach beyond limitation and stir your senses in discovering and sharing this voice.</v-list-item>
+        <v-list-item class="d-block mb-4 fontsize-16 line-height-18pt body-font ls-n016">By giving it color, shape, weight, and texture.</v-list-item>
+        <v-list-item class="d-block mb-4 fontsize-16 line-height-18pt body-font ls-n016">By adding a formal or friendly accent, an inviting or insightful tone.</v-list-item>
+        <v-list-item class="d-none d-sm-block mb-4 fontsize-16 line-height-18pt body-font ls-n016">By making it simple to say anything you wish, in a way that’s impossible for anyone to forget.</v-list-item>
+        <v-list-item class="d-none d-sm-block mb-4 fontsize-16 line-height-18pt body-font ls-n016">People across the world choose Crane stationery to find their second voice; to express themselves authentically and memorably by putting pen to thoughtfully crafted paper.  </v-list-item>
+        <v-list-item class="d-none d-sm-block mb-4 fontsize-16 line-height-18pt body-font ls-n016">With each invitation you send or letter you write, you’ll see that our craftsmanship is second-to-none—because it’s been 250 years in the making.</v-list-item>
+
+      </v-list>`,
+    etiquetteContentDescription: `
+      <v-list flat class="content-description">
+        <v-list-item class="d-block mb-4 fontsize-16 line-height-18pt body-font ls-n016">The word etiquette originates from Old French, translating to “a ticket,” or a token representing a right to enter or participate. Since that time, the definition has evolved to center around conventional —and often intimidating—requirements around social behavior.</v-list-item>
+        <v-list-item class="mb-4 fontsize-16 line-height-18pt body-font ls-n016 d-none d-sm-block">But we believe in the original intent of the word: a ticket. At its core, etiquette is about bringing people together. An invitation or thank- you note isn’t a duty or formality—it’s an authentic expression of inclusivity. A ticket that welcomes recipients into your life, where they will feel acknowledged, appreciated, and significant.</v-list-item>
+        <v-list-item class="mb-4 fontsize-16 line-height-18pt body-font ls-n016 d-none d-sm-block">That perspective gives etiquette a new meaning. Yes, there are guidelines to help you know when to send a wedding save-the-date or how to address an invitation, and there’s also plenty of flexibility to incorporate your own unique style, tastes, and customs. You can turn to classic options if you prefer, or you can forgo traditional templates and forge your own path.</v-list-item>
+        <v-list-item class="mb-4 fontsize-16 line-height-18pt body-font ls-n016 d-none d-sm-block">After all, no matter what you’re writing, the most effective expression can’t be dictated by someone else—it must come from a place that’s truly, authentically you. There’s no right or wrong way to share your message, as long as you find a way to express it.</v-list-item>
+         <v-list-item class="mb-4 fontsize-16 line-height-18pt body-font ls-n016 d-none d-sm-block">Yes, when your options for what to say are limitless, the words may take a while to surface. But as you tuck your card into the envelope and envision it in the hands of your recipient, you’ll know: The time you invested was well spent.</v-list-item>
+      </v-list>`,
+    papersContentDescription: `
+      <v-list flat class="content-description">
+        <v-list-item class="d-block mb-4 fontsize-16 line-height-18pt body-font ls-n016">The sheen of glossy ink. The crisp tearing of the envelope as you reveal what’s inside. The silky softness of the card, accented by subtle ridges of an embossed design.</v-list-item>
+        <v-list-item class="d-block mb-4 fontsize-16 line-height-18pt body-font ls-n016">The paper you choose for your stationery touches every sense. It precedes your message, conveying care and luxury long before the recipient reads the greeting.</v-list-item>
+        <v-list-item class="d-block mb-4 fontsize-16 line-height-18pt body-font ls-n016">The quality and finish of your paper can transform any thank you note or invitation, elevating it from an everyday message to a treasured memory that will be kept for years to come.</v-list-item>
+         <v-list-item class="d-none d-sm-block mb-4 fontsize-16 line-height-18pt body-font ls-n016">At Crane, we combine time-honored traditions and meticulous craftsmanship to create products ranging from premium business papers to high-end stationery. Our signature paper is crafted from 100 percent cotton for softness and texture, making it the perfect canvas for a variety of printing techniques—or your own handwriting.</v-list-item>
+          <v-list-item class="d-none d-sm-block mb-4 fontsize-16 line-height-18pt body-font ls-n016">Ultimately, our core paper types, available in a multitude of sizes, format, colors, and weights, are carefully handcrafted by us to be hand-made by you.</v-list-item>
+      </v-list>`,
+    printingProcessesContentDescription: `
+      <v-list flat class="content-description">
+        <v-list-item class="d-block mb-4 fontsize-16 line-height-18pt body-font ls-n016">Like the elegant decor at a party, where you know the host has thought of every detail, your stationery sets the tone for your correspondence.</v-list-item>
+        <v-list-item class="d-block mb-4 fontsize-16 line-height-18pt body-font ls-n016">Professionalism and sophistication for your company’s letterhead. Joyful anticipation for your wedding invitations. Sincerity and gratitude for the thank you notes you’ll send following significant life events and small, thoughtful gestures alike.</v-list-item>
+        <v-list-item class="d-block mb-4 fontsize-16 line-height-18pt body-font ls-n016">Rather than starting from a blank canvas, you can convey that tone from first glance through Crane’s masterful printing processes. The way the ink is pressed onto the paper, the raised design you can feel underneath your fingers, an array of colors or a sleek, monochromatic finish — every detail works together to give you a distinctive voice before you even begin writing.</v-list-item>
+      </v-list>`,
+  }),
+  computed: {
+    categoryId() {
+      return this.$route.meta.id;
+    },
+    easingOptions() {
+      return {
+        duration: this.duration,
+        //  offset: this.offset,
+        easing: this.easing,
+      };
+    },
+    isDesktop: function () {
+      return this.$vuetify.breakpoint.xsOnly ? true : false;
+    },
+    ...mapFields(["user", "user.userVisits"]),
+
+    userAuth: function () {
+      return this.$store.state.auth.userAuth;
+    },
+    
+    userName: function () {
+      return this.$store.state.accountOne.one.firstname;
+    },
+    inProgress: function () {
+      return this.$store.state.headerCategoryList.inProgress;
+    },
+    categoryList: {
+      get: function () {
+        return this.$store.state.headerCategoryList.categoryList;
+      },
+      set: function () {},
+      //return this.$store.state.headerCategoryList.categoryList;
+    },
+    footerBlock: function () {
+      return this.$store.state.block.footerBlock;
+    },
+    maintainanceFlag: function () {
+      return this.$route.name == "Maintenance" ? true : false;
+    },
+    categoryDetailsList: function () {
+      return this.$store.state.headerCategoryList.categoryDetails;
+    },
+  },
+  watch: {
+    $route() {
+      this.heroData = this.getHeroData();
+    },
+    lookupCatelog: {
+      handler: function (newVal) {
+        clearTimeout(this.lookupCatelogProductTimeoutId);
+        this.lookupCatelogProductTimeoutId = setTimeout(async () => {
+          try {
+            if (!newVal) this.searchResultList = [];
+            else {
+              this.searchInProgress = true;
+              let results = await doFetchCatelogProducts(newVal);
+              if (results != null) {
+                this.searchResultList = humps(results);
+              } else {
+                this.searchResultList = [];
+              }
+              this.searchInProgress = false;
+            }
+          } catch (error) {
+            this.searchResultList = [];
+          }
+        }, 500);
+      },
+    },
+  },
+  methods: {
+    GotoPage() {
+      if (this.search) {
+        //this.search = null;
+        this.showSearchInput = false;
+        this.searchResultList = [];
+        let searchKeywords = this.search;
+        let pagePath = this.$route.path;
+        let isGateModulePage = pagePath.includes("/gate/");
+        if (isGateModulePage) {
+          window.open(
+            `/search?pageNumber=${this.pageNo}&pageSize=${this.pageSize}&sortBy=relevance&q=${searchKeywords}&filter=e30=`,
+            "_self"
+          );
+        } else {
+          this.$router
+            .push({
+              name: "SearchPage",
+              query: {
+                pageNumber: this.pageNo,
+                pageSize: this.pageSize,
+                sortBy: "relevance",
+                q: searchKeywords,
+                filter: "W10=",
+              },
+            })
+            .catch((error) => {
+              error;
+            });
+          this.$store.dispatch("catalogBrowser/search", {
+            fullCatalog: window.craneCatalog,
+            keywords: searchKeywords,
+            filters: [],
+            pageNumber: 1,
+            pageSize: 9,
+            sortBy: "relevance",
+          });
+        }
+        localStorage.removeItem("cr_subCategoryItemId");
+        localStorage.removeItem("cr_subCategoryId");
+        localStorage.removeItem("cr_mainCategoryId");
+        this.search = null;
+      }
+    },
+    pageName() {
+      return this.$route.name;
+    },
+    onScroll() {
+      this.offsetTop = window.pageYOffset || document.documentElement.scrollTop;
+    },
+    onAction(action) {
+      this.showMenu = action.showMenu;
+      this.categoryList = action.categoryList;
+      this.activeMainMenu = localStorage.getItem("cr_mainCategoryId");
+      this.activeSubMenuItem = localStorage.getItem("cr_subCategoryItemId");
+      this.activeSubMenu = localStorage.getItem("cr_subCategoryId");
+      this.search = null;
+    },
+    onActionScroll() {
+      if (this.$refs.divOne) {
+        this.$vuetify.goTo(this.$refs.divOne, this.easingOptions);
+      }
+    },
+    OnResize() {
+      setTimeout(() => {
+        if (this.$vuetify.breakpoint.mdAndUp) {
+          this.showMenu = false;
+        }
+      }, 200);
+    },
+    //Homepage-Desktop-Hero
+    getHeroData() {
+      let currentPage = this.$router.history.current.name;
+      if (currentPage === "HomePage") {
+        return {
+          //Homepage-Mobile-Hero
+          image: require("@/assets/Home Page_Hero.jpg"),
+          mobileViewImage: require("@/assets/Home Page_Mobile.jpg"),
+          title: "Joyful Greetings",
+          content:
+            "Personalized holiday greeting cards are here, and 10% off for a limited time",
+          buttonText: "Shop the Collection",
+        };
+      } else if (currentPage === "CategoryPage") {
+        /*else if (currentPage === "LandingPage" ) {
+        return {
+          //Homepage-Mobile-Hero
+          image: require("@/assets/Homepage-Desktop-Hero.png"),
+          mobileViewImage: require("@/assets/Homepage-Desktop-Hero.png"),
+          title: "SARAH FLINT",
+           content:'',
+          buttonText: null
+        };
+      }*/
+        return {
+          image: "",
+          //  image: require("@/assets/c4aa164d9b01387a88228c67620f7faf861b5544.png"),
+          title: "Boxed Stationery Sets",
+          content: `Find the perfect stationery box set to suit your taste and personality at Crane.
+               Explore a variety of engraved designs, from whimsical images to classic text for
+                thank you notes or general correspondence. Each Crane boxed stationery set
+               comes with heavyweight note cards and matching fully lined envelopes for a
+               complete, polished look.`,
+          buttonText: null,
+        };
+      } /*else if (currentPage === "FaqPage") {
+        return {
+          image: require("@/assets/c4aa164d9b01387a88228c67620f7faf861b5544.png"),
+          mobileViewImage: require("@/assets/c4aa164d9b01387a88228c67620f7faf861b5544.png"),
+          title: "FREQUENTLY ASKED QUESTIONS",
+          content: ``,
+          buttonText: null,
+        };
+      } */else if (currentPage === "StoreLocatore") {
+        return {
+          image: require("@/assets/CraneStationary-Store-locator.jpg"),
+          mobileViewImage: require("@/assets/CraneStationary-Store-locator.jpg"),
+          title: "Store Locator",
+          content: ``,
+          buttonText: null,
+        };
+      } else if (currentPage === "AboutUs") {
+        return {
+          header: "About Us",
+          headerDescription: `The history of Crane encompasses 250 years of experience and craftsmanship. Learn more about Crane, Crane heritage, and how it expanded worldwide.`,
+          contentHeader: "Share Your Voice",
+          contentDescription: this.aboutContentDescription,
+        };
+      } else if (currentPage === "EtiquetteGuide") {
+        return {
+          header: "Crane's Etiquette Guide",
+          headerDescription: `Etiquette rules have changed over the years, and today, etiquette looks different. Learn the rules of modern etiquette from the experts at Crane Stationery.`,
+          contentHeader: "The Spirit of Modern Etiquette",
+          contentDescription: this.etiquetteContentDescription,
+        };
+      } else if (currentPage === "PrintingProcesses") {
+        return {
+          header: "Our Printing Processes",
+          headerDescription: `Various printing techniques can add personality to your correspondence. Learn about different printing processes and techniques from the experts at Crane.`,
+          contentHeader: "Set the Tone",
+          contentDescription: this.printingProcessesContentDescription,
+        };
+      } else if (currentPage === "OurPapers") {
+        return {
+          header: "Our Papers",
+          headerDescription: `Crane’s high quality paper is made from cotton for premium softness and texture. Explore our options, from plain paper to high-end stationery.`,
+          contentHeader: "The perfect canvas",
+          contentDescription: this.papersContentDescription,
+        };
+      } else if (currentPage === "Accessibility") {
+        return {
+          header: "accessibility & compliance",
+          headerDescription: `Explore a variety of engraved designs, from whimsical images to classic text for thank you notes or general correspondence. Each Crane boxed stationery set comes with heavyweight note cards and matching fully lined envelopes for a complete, polished look.`,
+          firstContentHeader: "accessibility notice",
+          secondContentHeader: "contact us with your accessibility questions",
+          firstContentDescriptionFirst:
+            "Crane is committed to accessibility. That commitment means Crane embraces WCAG guidlines and supports assitive technologies such as screen readers.",
+          firstContentDescriptionSecond:
+            "If you are using a screen reader, magnifier, or other assitive technologies and are experiencing difficulties using this website please call us at (800.555.1212) for assistance.",
+
+          secondContentDescriptionFirst:
+            "Please be aware that our efforts are ongoing. if you have questions or concerns about the accessibility website please contact us at CustomerSupports@Crane.com.",
+          secondContentDescriptionSecond:
+            "If you do encounter an accessiblity issue, please be sure to specify the web page and issue you are having in your email, and we will make all reasonable efforts to make that page accessible for you in the best way possible.",
+        };
+      } else if (currentPage === "ShippingAndDelivery") {
+        return {
+          header: "Shipping & Delivery",
+          //headerDescription: `The history of Crane encompasesses 250 years of experience and craftsmanship. Learn more about Crane, Crane heritage, and how it expanded worldwide.`,
+          //contentHeader: "Share Your Voice",
+          contentDescription:
+            "Crane products are exclusively crafted in the United States of America and have been for over 219 years. We are inextricably connected to the wellbeing of our community, family and partners, and their wellbeing will always be our top priority.",
+        };
+      } else if (currentPage === "Maintenance") {
+        return {
+          header: "Maintenance",
+          //headerDescription: `The history of Crane encompasesses 250 years of experience and craftsmanship. Learn more about Crane, Crane heritage, and how it expanded worldwide.`,
+          //contentHeader: "Share Your Voice",
+          contentDescription: "Maintenance",
+        };
+      }
+      return null;
+    },
+    getCustomAttributeValue(customAttributes, attributeCode) {
+      return customAttributeValue(customAttributes, attributeCode);
+    },
+    /* eslint-disable no-alert, no-console ,  no-debugger */
+    async categoryProducts(flag, category, subcategorys, items) {
+      let mainCat = "";
+      switch (flag) {
+        case "main":
+          mainCat = category;
+          localStorage.setItem("cr_mainCategoryId", category);
+          localStorage.setItem("cr_subCategoryItemId", items);
+          localStorage.setItem("cr_subCategoryId", subcategorys);
+          break;
+        case "subManu":
+          mainCat = subcategorys;
+          localStorage.setItem("cr_mainCategoryId", category);
+          localStorage.setItem("cr_subCategoryItemId", items);
+          localStorage.setItem("cr_subCategoryId", subcategorys);
+          break;
+        case "subManuChild":
+          mainCat = items;
+          localStorage.setItem("cr_mainCategoryId", category);
+          localStorage.setItem("cr_subCategoryItemId", items);
+          localStorage.setItem("cr_subCategoryId", subcategorys);
+          break;
+        default:
+      }
+      if (this.categoryDetailsList) {
+        let categoryOne = await getCategoryOne(
+          this.categoryDetailsList,
+          mainCat
+        );
+        if (categoryOne) {
+          this.$store.dispatch("layout/setHeroContent", categoryOne);
+          /*  let path = this.getCustomAttributeValue(
+             categoryOne.customAttributes,
+            "url_path"
+          );*/
+        // console.log(categoryOne.n, categoryOne);
+          let vm = this;
+          goToCategoryPageRouting(vm, categoryOne);
+          this.$store
+            .dispatch("catalogBrowser/search", {
+              fullCatalog: window.craneCatalog,
+              keywords: "",
+              filters: [{ label: "Category", prop: "ci", value: mainCat }],
+              pageNumber: 1,
+              pageSize: 9,
+              sortBy: "position",
+            })
+            .catch((error) => {
+              error;
+            });
+        }
+      }
+    },
+    subCategory(subCategoryId) {
+      this.$emit("onActionScrollSub");
+      this.$emit("action", {
+        mainMenu: this.mainMenu,
+        subMenu: subCategoryId,
+        subMenuItem: subCategoryId,
+      });
+      this.$store
+        .dispatch("catalogBrowser/search", {
+          fullCatalog: window.craneCatalog,
+          keywords: "",
+          filters: [{ label: "Category", prop: "ci", value: subCategoryId }],
+          pageNumber: 1,
+          pageSize: 9,
+          sortBy: "position",
+        })
+        .catch((error) => {
+          error;
+        });
+    },
+    goToLogout() {
+      this.$store.dispatch("auth/logout");
+    },
+    goToLogin() {
+      window.open("/gate/sign-in", "_self");
+    },
+    goToDashboard() {
+      window.open("/b2b", "_self");
+    },
+  },
+  created() {
+    this.$store.dispatch("catalogBrowser/index", {
+      productsCatalog: window.craneCatalog.products,
+    });
+    this.$store.dispatch("layout/fetchCmsBlock");
+    this.$store.dispatch("layout/fetchPageContent");
+    this.$store.dispatch("headerCategoryList/fetchCategoryList");
+    this.$store.dispatch("productList/fetchAttributeList");
+    //this.$store.dispatch("headerCategoryList/fetchCategoryListIdWise");
+    if (this.userAuth) {
+      this.$store.dispatch("userCartProduct/checkUserToken");
+      this.$store.dispatch("userCartProduct/cartProductList");
+      // this.$store.dispatch("userCartProduct/productTotalAmt");
+      this.$store.dispatch("accountOne/basicInfo");
+    }  
+    if (this.userVisits) {
+      let userVisits = Number(this.userVisits) + 1;
+      localStorage.setItem("cr_userVisitCount", userVisits);
+      this.userVisits = userVisits;
+    } else {
+      localStorage.setItem("cr_userVisitCount", 1);
+      this.userVisits = 1;
+    }
+    this.heroData = this.getHeroData();
+    //this.$store.dispatch("block/fetchHeaderPromoBanner", this.blockId);
+    // if (!this.footerBlock.id) this.$store.dispatch("block/fetchOne", "10"); // for footer
+  },
+};
+</script>
+<style lang="scss">
+.header-input-custom {
+  .v-input__control {
+    background-color: transparent !important;
+  }
+  .v-input__slot {
+    &:before {
+      border-color: #ffffff !important;
+      border-style: solid;
+      border-width: 1px;
+    }
+    &:after {
+      border-color: #ffffff !important;
+      border-style: solid;
+      border-width: 1px;
+    }
+  }
+  .v-text-field__slot {
+    input {
+      color: #ffffff !important;
+      border-bottom-color: #ffffff !important;
+    }
+    input::placeholder {
+      color: #ffffff !important;
+    }
+    input:-ms-input-placeholder {
+      color: #ffffff !important;
+    }
+
+    input ::-ms-input-placeholder {
+      color: #ffffff !important;
+    }
+  }
+  .v-icon {
+    color: #ffffff !important;
+  }
+  .mobile-header-list.theme--light.v-list {
+    background: #2805da;
+  }
+  .v-list-item__icon {
+    color: #ffffff !important;
+  }
+}
+.mobile-header-autocomplete .v-input__append-inner .v-input__icon {
+  display: none !important;
+}
+.mobile-header-autocomplete .theme--light.v-icon {
+  color: #ffffff !important;
+}
+.mobile-header-autocomplete.theme--light.v-input input {
+  color: #ffffff !important;
+}
+.mobile-header-autocomplete.theme--light.v-text-field--filled
+  > .v-input__control
+  > .v-input__slot {
+  background-color: transparent !important;
+}
+</style>
+<style src="./Layout.scss" lang="scss"/>
--- a/src/components/layout/MobileNavigationBar.scss
+++ b/src/components/layout/MobileNavigationBar.scss
@ -0,0 +1,30 @@
+.bg-blue-darken {
+    background: #2850da !important;
+}
+
+.no-background {
+    background: transparent !important;
+}
+
+.line-height-48px {
+    line-height: 3rem !important;
+}
+
+.font-28px {
+    font-size: 1.75rem !important;
+}
+
+.font-weight-500 {
+    font-weight: 400 !important;
+}
+
+
+/************  Override the vuetify css  *********/
+
+.v-navigation-drawer {
+    letter-spacing: -0.00625rem;
+}
+
+.theme--light.v-text-field>.v-input__control>.v-input__slot:before {
+    border-color: rgba(247, 245, 245, 0.42) !important;
+}
--- a/src/components/layout/MobileNavigationBar.vue
+++ b/src/components/layout/MobileNavigationBar.vue
@ -0,0 +1,43 @@
+<template>
+  <v-card class="mx-auto overflow-hidden" height="500">
+    <v-app-bar prominent>
+      <v-app-bar-nav-icon @click.stop="drawer = !drawer"></v-app-bar-nav-icon>
+    </v-app-bar>
+
+    <v-navigation-drawer v-model="drawer" v-if="drawer" absolute left temporary color="bg-blue-darken" width="auto">
+        <v-icon class="mdi mdi-close pa-5 white--text subtitle-2" @click.stop="drawer = !drawer"></v-icon>
+        <div class="py-0 px-8">
+            <v-text-field>
+                <v-icon slot="prepend" color="white" class="title">mdi mdi-magnify</v-icon>
+            </v-text-field>
+        </div>
+        
+        <v-list nav dense class="no-background pa-6">
+            <v-list-item-group v-model="group">
+            <v-list-item v-for="(menu, index) in menuItems" v-bind:key="index">
+                <v-list-item-title class="white--text font-28px font-weight-500 line-height-48px text-uppercase " href="#">{{ menu }}</v-list-item-title>
+            </v-list-item>
+            </v-list-item-group>
+        </v-list>
+    </v-navigation-drawer>
+  </v-card>
+</template>
+    
+ 
+<script>
+export default {
+  name: "MobileNavigationBar",
+  data: () => ({
+    drawer: false,
+    group: null,
+    menuItems:['Notes & Cards','Wedding','Business','For the Desk','For the Home','Occasions','Crane & Co','','Store Locator','Sign-In'],
+  }),
+  watch: {
+    group() {
+      this.drawer = false;
+    }
+  }
+};
+</script>
+
+<style src="./MobileNavigationBar.scss" lang="scss"/>
--- a/src/components/layout/NavigationBar.vue
+++ b/src/components/layout/NavigationBar.vue
@ -0,0 +1,59 @@
+    <template>
+  <v-navigation-drawer v-model="showMenuBar" v-if="showMenuBar" app :clipped="$vuetify.breakpoint.mdAndUp">
+    <v-list dense>
+      <v-list-item link>
+        <v-list-item-action>
+          <v-icon>mdi-home</v-icon>
+        </v-list-item-action>
+        <v-list-item-content>
+          <v-list-item-title>Home</v-list-item-title>
+        </v-list-item-content>
+      </v-list-item>
+      <v-list-item link>
+        <v-list-item-action>
+          <v-icon>mdi-contact-mail</v-icon>
+        </v-list-item-action>
+        <v-list-item-content>
+          <v-list-item-title>Contact</v-list-item-title>
+        </v-list-item-content>
+      </v-list-item>
+    </v-list>
+  </v-navigation-drawer>
+</template>
+    
+ 
+<script>
+export default {
+  name: "NavigationBar",
+  props: ["showMenu"],
+  data: () => ({
+    drawer: false,
+    group: null,
+    menuItems: [
+      "Notes & Cards",
+      "Wedding",
+      "Business",
+      "For the Desk",
+      "For the Home",
+      "Occasions",
+      "Crane & Co",
+      "",
+      "Store Locator",
+      "Sign-In"
+    ]
+  }),
+  computed: {
+    showMenuBar: {
+      get: function() {
+        return this.showMenu;
+      },
+      set: function(value) {
+        this.showMenu = value;
+      }
+    }
+  },
+  watch: {}
+};
+</script>
+
+<style src="./MobileNavigationBar.scss" lang="scss"/>
--- a/src/components/layout/footer/FooterComponent.scss
+++ b/src/components/layout/footer/FooterComponent.scss
@ -0,0 +1,139 @@
+.footer-component-border {
+    background: #FFFFFF!important;
+    border-top: 1px solid rgba(0, 0, 0, 0.10)!important;
+}
+
+.footer-fontcolor-black-darken {
+    color: #1D1D1D!important;
+}
+
+.footer-component-lighten-5 {
+    color: #dcdddd !important;
+}
+
+a.footer-link {
+    text-decoration: none;
+}
+
+@media screen and (max-width:600px) {
+    .footer-fontcolor-black-darken {
+        color: rgba(0, 0, 0, 0.50) !important
+    }
+}
+
+
+/*************************    Override the Vuetify classes values ***** */
+
+.footerpage_page_footer.v-footer {
+    font-size: 0.875rem !important;
+}
+
+.footerpage_email_textbox .v-input__slot {
+    border: 1px solid rgba(0, 0, 0, 0.10) !important;
+    border-radius: 2px !important;
+}
+
+.footerpage_submit_email_btn.v-btn {
+    border-top-left-radius: 0px !important;
+    border-bottom-left-radius: 0px !important;
+}
+
+.footerpage_min_height {
+    min-height: 1.5625rem !important;
+}
+
+.footerpage_word_break.v-list-item__title {
+    white-space: unset !important; //for word break
+}
+
+.footer-list_subheader {
+    height: 1.875rem !important;
+    padding: 0 0.5rem !important;
+}
+
+.footerpage_email_textbox.v-text-field.v-text-field--enclosed:not(.v-text-field--rounded)>.v-input__control>.v-input__slot {
+    min-height: 0.625rem !important;
+    height: 2.3125rem !important;
+}
+.footer-links{
+      display:flex;
+      color:#ffffff;
+      justify-content: space-between;
+     // margin:60px 0px;
+   }
+   .footer-bottom-link{
+       display:inline-flex;
+   }   
+.footer-bottom-link a{
+    font-size: 14px !important;
+}   
+   .link-col{
+            color:#ffffff !important;
+   }
+   /*.link-col:nth-child(3) .title{
+    margin-bottom: -4px;
+   }
+   .link-col:nth-child(4) a:nth-child(1){
+        margin-top: 4px;
+        text-transform: uppercase !important;
+   }*/
+   .link-col a{
+            color:#ffffff !important;
+            text-decoration: none;
+            font-size: 14px !important;
+            padding-bottom:12px;
+            word-break: break-word!important; 
+            display: flex;
+            align-content: space-between;
+
+   }
+   /*.title{
+        color:#dcdddd !important;
+        display: block;
+        font-size: 1rem !important;
+   }*/
+   .v-application .title {
+       color:#dcdddd !important;
+       font-size: 0.625rem !important;
+       font-weight: 500;
+       letter-spacing: .0125em!important;
+       text-transform: uppercase !important;
+       padding-bottom:14px;
+   }
+   @media (min-width: 600px) and (max-width: 960px) {
+    .footer-links{
+        display:grid;
+        grid-template-columns: auto auto;
+        grid-gap: 50px;
+        padding-left:10px;
+       }
+       .footer-bottom-link{
+        display:flex;
+        padding-left:10px;
+        flex-direction:  column-reverse;
+    } 
+}
+   @media screen and (max-width: 600px) {
+    .footer-links{
+        display:block;
+        padding-left:10px;
+        margin:20px 0px;
+       }
+       .link-col{
+        margin-bottom:40px;
+}
+
+.v-application .title {
+    font-size: 0.825rem !important;
+    padding-bottom:7px;
+}
+.link-col a{
+    padding-bottom:7px;
+}
+.footer-bottom-link{
+    display:flex;
+    padding-left:10px;
+    flex-direction:  column-reverse;
+
+}  
+}
--- a/src/components/layout/footer/FooterComponent.vue
+++ b/src/components/layout/footer/FooterComponent.vue
@ -0,0 +1,199 @@
+<template>
+  <div>
+    <v-footer
+      class="py-sm-0 px-sm-0 pb-0 px-0 page-footer footer-component-border"
+    >
+      <v-row
+        align="center"
+        justify="center"
+        class="d-flex flex-column-reverse flex-sm-row pa-0 ma-0"
+      >
+        <v-col
+          class="primary pb-md-0 px-sm-10 px-md-6 pt-md-5 pt-sm-4 pt-6 pl-lg-12 pr-lg-12"
+          cols="12"
+          md="8"
+          sm="7"
+          lg="8"
+          xl="9"
+        >
+          <v-container class="px-lg-12 pb-md-0">
+            <v-row>
+              <v-col class="regular-font pr-lg-8">
+                <div v-html="footerContent()"></div>
+              </v-col>
+            </v-row>
+          </v-container>
+        </v-col>
+        <v-col
+          md="4"
+          sm="5"
+          lg="4"
+          xl="3"
+          class="pb-0 pt-md-0 d-sm-flex align-center white"
+        >
+          <v-row align="center" class="px-sm-6 px-2 pa-0 ma-0">
+            <v-form ref="footerForm" v-model="footerFormValid">
+              <div class="pa-md-1">
+                <v-col cols="12" class="pt-md-0 mb-4 mb-sm-0">
+                  <span
+                    class="primary--text h3 font-weight-regular text-uppercase"
+                    >{{ stayInTouch }}</span
+                  >
+                  <p
+                    class="footer-fontcolor-black-darken body-font ls-n10 mb-0 pt-4 mt-md-4 mt-sm-4 pt-sm-0"
+                  >
+                    Be the first to know about special promotions, new
+                    collections and more when you sign up for our emails!
+                  </p>
+                </v-col>
+                <v-col cols="12" class="pb-0 pt-2 pt-sm-3 d-sm-none d-md-block">
+                  <v-row no-gutters>
+                    <v-col cols="12">
+                      <v-text-field
+                        @blur="resetEmailValidation"
+                        label="Your Email"
+                        id="subscriberEmailId"
+                        name="subscriberEmailId"
+                        class="footerpage_email_textbox fontsize-14 regular-font"
+                        single-line
+                        solo
+                        flat
+                        :rules="emailRules"
+                        tile
+                        v-model="email"
+                      >
+                        <v-btn
+                          color="primary"
+                          class="white--text mr-n3 text-uppercase footerpage_submit_email_btn body-font"
+                          slot="append"
+                          id="subscriberSubmitId"
+                          name="subscriberSubmitId"
+                          @click="submit()"
+                          >SUBMIT</v-btn
+                        >
+                      </v-text-field>
+                    </v-col>
+                  </v-row>
+                </v-col>
+                <v-col
+                  cols="12"
+                  class="pb-0 pt-2 pt-sm-3 d-none d-sm-block d-md-none"
+                >
+                  <v-row no-gutters>
+                    <v-col cols="12">
+                      <v-text-field
+                        label="Your Email"
+                        id="emailTextBox"
+                        class="footerpage_email_textbox regular-font"
+                        single-line
+                        solo
+                        flat
+                        tile
+                        :rules="emailRules"
+                        dense
+                        v-model="email"
+                      ></v-text-field>
+                      <v-btn
+                        color="primary"
+                        class="white--text mr-n3 text-uppercase footerpage_submit_email_btn body-font"
+                        slot="append"
+                        @click="submit()"
+                        type="submit"
+                        >SUBMIT</v-btn
+                      >
+                    </v-col>
+                  </v-row>
+                </v-col>
+              </div>
+            </v-form>
+          </v-row>
+        </v-col>
+      </v-row>
+    </v-footer>
+    <SnackbarComponent :snackbar="snackbar"></SnackbarComponent>
+    <SubscriptionDialog />
+  </div>
+</template>
+
+<script>
+import SnackbarComponent from "@/components/common/SnackbarComponent";
+import SubscriptionDialog from "@/components/common/SubscriptionDialog";
+//import { listrakSubscribe } from "@/services/util.service";
+export default {
+  name: "FooterComponent",
+  components: { SnackbarComponent, SubscriptionDialog },
+  data() {
+    return {
+      footerBlockId: 10,
+      listSubHeaderColor: "red",
+      footerFormValid: false,
+      emailRules: [
+        (v) => !!v || "Email is required",
+        (v) => /.+@.+\..+/.test(v) || "Email must be valid",
+      ],
+      stayInTouch: "LET'S STAY IN TOUCH",
+      email: null,
+      snackbar: {
+        show: false,
+        message: null,
+        color: null,
+        timeout: 0,
+      },
+    };
+  },
+  /* eslint-disable no-alert, no-console ,  no-debugger */
+  computed: {
+    userAuth: function () {
+      return this.$store.state.auth.userAuth;
+    },
+    footerBlockContent: function () {
+      return this.$store.state.layout.cmsBlockContent;
+    },
+  },
+  methods: {
+    footerContent() {
+      if (this.footerBlockContent.length) {
+        let data = this.footerBlockContent.filter((element) => {
+          return element.id === this.footerBlockId;
+        });
+        if (data.length > 0) {
+          return data[0].content;
+        }
+      }
+    },
+    submit: function () {
+      if (this.$refs.footerForm.validate()) {
+        // listrakSubscribe(this.email);
+        this.snackbar = {
+          message: "you have successfully subscribed.",
+          color: "success",
+          show: true,
+          timeout: 5000,
+        };
+
+        // this.email = null;
+        // this.$refs.footerForm.resetValidation();
+      }
+    },
+
+    resetEmailValidation() {
+      this.$refs.footerForm.resetValidation();
+    },
+  },
+  mounted() {
+    // if (window._ltk) {
+    //   window._ltk.Signup.New(
+    //     "Footer",
+    //     "subscriberEmailId",
+    //     window._ltk.Signup.TYPE.CLICK,
+    //     "subscriberSubmitId",
+    //     "email"
+    //   );
+    // }
+  },
+  created() {
+    //this.$store.dispatch("block/fetchOne", "10");
+  },
+};
+</script>
+<style src="./FooterComponent.scss" lang="scss"/>
--- a/src/components/layout/footer/SeoFooterContent.scss
+++ b/src/components/layout/footer/SeoFooterContent.scss
@ -0,0 +1,12 @@
+.seofootercontent-image-background{
+  background-color:#F2F2F2;
+}
+.content{
+  display: flex !important;
+}
+/*.left-side-content{
+  display:block;
+}
+.right-side-content{
+  display:block;
+}*/
--- a/src/components/layout/footer/SeoFooterContent.vue
+++ b/src/components/layout/footer/SeoFooterContent.vue
@ -0,0 +1,152 @@
+<template>
+  <div>
+    <v-row class="seofootercontent-image-background ma-0" v-if="getSeoBlock()">
+      <v-container class="px-lg-12 pb-md-0 px-6">
+        <v-row>
+          <v-col class="regular-font pr-lg-8">
+            <div v-html="getSeoBlock()"></div>
+          </v-col>
+        </v-row>
+      </v-container>
+      <!--<v-container>
+        <v-col class="text-center">
+          <h2
+            class="text-uppercase py-4 mb-0 fontsize-28 font-weight-400 line-height-36"
+          >More to Discover</h2>
+        </v-col>
+        <v-row>
+          <v-col cols="12" sm="4" md="4" class="text-center px-6">
+            <v-img :src="image18"></v-img>
+            <h3
+              class="pt-5 text-uppercase fontsize-18 font-weight-regular line-height-21 ls-n015"
+            >Finding the one:</h3>
+            <p class="fontsize-18 line-height-21 ls-n015">Wedding Invitation: Kate and Kevin</p>
+          </v-col>
+          <v-col cols="12" sm="4" md="4" class="text-center px-6">
+            <v-img :src="image19"></v-img>
+            <h3
+              class="pt-5 text-uppercase fontsize-18 font-weight-regular line-height-21 ls-n015"
+            >Wedding etiquette:</h3>
+            <p class="fontsize-18 line-height-21 ls-n015">in the Age of Social Media</p>
+          </v-col>
+          <v-col cols="12" sm="4" md="4" class="text-center px-6">
+            <v-img :src="image20"></v-img>
+            <h3
+              class="pt-5 text-uppercase fontsize-18 font-weight-regular line-height-21 ls-n015"
+            >Real weddings:</h3>
+            <p class="fontsize-18 line-height-21 ls-n015">Invitation Inspired by Something Borrowed</p>
+          </v-col>
+        </v-row>
+      </v-container>-->
+    </v-row>
+    <!--<v-container>
+      <v-row class="py-12 mb-12">
+        <v-col cols="12" sm="6" md="6" lg="6" class="px-6">
+          <p
+            class="text-uppercase fontsize-18 mb-0 line-height-21 ls-n03"
+          >WEDDING Couple’s Stationery Style?</p>
+          <p
+            class="fontsize-18 line-height-21 ls-n03"
+          >Most people don’t consider what an elegant touch couple’s stationery can provide until they begin writing thank you notes for their wedding gifts. Beautiful, personalized stationery oes in factplay a part in maintaining meaningful relationships with those who participated in your wedding experience and continue encouraging thoughtful communication beyond the wedding day. The following ideas can inspire you to enhance your connections with unique and personalized stationery options.</p>
+
+          <p
+            class="text-uppercase fontsize-18 mb-0 pt-6 line-height-21 ls-n03"
+          >When to Send Save the Dates & Wedding Invitations?</p>
+          <p
+            class="fontsize-18 line-height-21 ls-n03"
+          >As you plan for your special day, you might feel like you’re entering a whole new world — one with its own unique rules and customs that are different from any event you’ve planned before. Oftentimes, this is most noticeable when you’re not sure about how to approach a specific detail, like when to take a particular planning step or send out information to guests. Luckily, you can use this guide as your resource for each step of the way. We break down the standard timeline for all wedding invitation-related correspondence so you know what to expect and how to prepare in the time leading up to your big day.</p>
+        </v-col>
+        <v-col cols="12" sm="6" md="6" lg="6" class="px-6">
+          <p
+            class="text-uppercase fontsize-18 mb-0 line-height-21 ls-n03"
+          >What to Write in a Wedding Thank You Card?</p>
+          <p
+            class="fontsize-18 line-height-21 ls-n03"
+          >Once your wedding’s over, you get the opportunity to show your gratitude to all the special people who gave gifts, dedicated time and attention to your big day, and played a part in your celebration. Start off your new life together by writing and mailing thoughtful thank you notes in a timely manner. This guide can help you find the right words to express your gratitude.</p>
+
+          <p
+            class="text-uppercase fontsize-18 mb-0 pt-6 line-height-21 ls-n03"
+          >Who Receives a Thank You Card?</p>
+          <p
+            class="mb-0 fontsize-18 line-height-21 ls-n03"
+          >Newlyweds write wedding thank you cards to acknowledge the thought, time, and attention others have devoted to their wedding. That means you have the opportunity to write wedding thanks for people who:</p>
+          <p
+            class="mb-0 fontsize-18 line-height-21 ls-n03"
+          >1) Attend pre-wedding events, such as showers or engagement parties.</p>
+          <p
+            class="mb-0 fontsize-18 line-height-21 ls-n03"
+          >2) Attend the wedding ceremony and reception.</p>
+          <p
+            class="mb-0 fontsize-18 line-height-21 ls-n03"
+          >3) Give gifts or money, even if they couldn’t attend the events.</p>
+        </v-col>
+      </v-row>
+    </v-container>-->
+  </div>
+</template>
+<script>
+export default {
+  name: "SeoFooterContent",
+  //props:["categoryList" ,"blockId"],
+  components: {},
+  computed: {
+    /* categorySeoContent: function() {
+      return this.$store.state.block.categorySeoContent;
+    },*/
+    categoryList: function () {
+      return this.$store.state.headerCategoryList.categoryListIdWise;
+    },
+    categoryId: function () {
+      return this.$route.meta.id;
+    },
+    categorySeoContent: function () {
+      return this.$store.state.layout.cmsBlockContent;
+    },
+  },
+  data: () => ({
+    image18: require("@/assets/Image 18.png"),
+    image19: require("@/assets/Image 19.png"),
+    image20: require("@/assets/Image 20.png"),
+    //blockId:'178'
+  }),
+  watch: {
+    categoryId() {
+      this.getSeoBlock();
+    },
+    categoryList() {
+      this.getSeoBlock();
+    },
+  },
+  methods: {
+    getSeoBlock() {
+      if (this.categoryList) {
+        let attributes = this.categoryList.filter(
+          (data) => data.id == this.categoryId
+        );
+        if (attributes.length > 0) {
+          let code = attributes[0].ca.filter(
+            (data) => data.ac == "landing_page"
+          );
+          if (code.length > 0) {
+            let cId = parseInt(code[0].v);
+            if (this.categorySeoContent.length) {
+              let data = this.categorySeoContent.filter((element) => {
+                return element.id === cId;
+              });
+              if (data.length > 0) {
+                return data[0].content;
+              }
+            }
+          }
+        }
+      }
+    },
+  },
+  async created() {
+    if (this.categoryId) {
+      await this.getSeoBlock();
+    }
+  },
+};
+</script>
+<style src="./SeoFooterContent.scss" lang="scss" scoped /> 
--- a/src/components/layout/header/Header.scss
+++ b/src/components/layout/header/Header.scss
@ -0,0 +1,167 @@
+.content-color {
+    color: #1d1d1d !important;
+}
+
+.menu-nav-link:hover {
+    color: #2850da!important;
+}
+.active-menu-nav-link {
+    color: #2850da!important;
+}
+.header-menu-content {
+    box-shadow: none;
+}
+.header-menu-content.v-menu__content{
+    outline: none !important;
+}
+.header-category-text{
+    color: #2850da!important;
+}
+.header-category-text:hover, .header-action-icons:hover{
+    color: #CCB7FF!important;
+}
+.header-category-text-active{
+    color: #404040!important;
+
+}
+.header-category-text-active:hover{
+    color: #CCB7FF!important;
+}
+.header-category-page-text{
+    color: #2850da;
+}
+.header-category-page-text:hover{
+    color: #CCB7FF;
+}
+.header-category-icon{
+    color: #CCB7FF!important;
+}
+.header-background-white {
+    background: #fff !important;
+}
+.header-hover-links{
+    background: #fff !important;
+    color: #2850da!important;
+}
+.header-buttons.v-btn:not(.v-btn--text):not(.v-btn--outlined):focus:before {
+    opacity: 0 !important;
+}
+
+.header-buttons.v-btn:not(.v-btn--text):not(.v-btn--outlined):hover:before {
+    opacity: 0 !important;
+}
+
+// .custom-menu:hover::after {
+//   content: "";
+//   width: 0;
+//   height: 0;
+//   position: absolute;
+//   bottom: -84%;
+//   right: 54px;
+//   border-width: 0 11px 11px 11px;
+//   border-style: solid;
+//   border-color: white #a5161600;
+// }
+//.custom-menu:hover::after {
+// content: "";
+// width: 0;
+// height: 0;
+//  position: absolute;
+// border-width: 0 11px 11px 11px;
+// border-style: solid;
+// border-color: #fff #a5161600;
+//  margin-top: 17px;
+
+/* align-items: flex-start; */
+
+// display: flex;
+
+/* align-items: center; */
+
+
+/* justify-items: center; */
+
+
+/* justify-content: end;*/
+
+//}
+.headerpage-cart-list{
+    //max-height:300px !important; 
+    overflow-y:auto;
+}
+.headerpage-cart-drawer .v-navigation-drawer__content{
+  overflow-y:hidden !important; 
+}
+.headerpage-cart-drawer{
+    z-index:9 !important; 
+  }
+.header-autocomplete.v-select.v-select--is-menu-active
+  .v-input__icon--append
+  .v-icon {
+  -webkit-transform: rotate(360deg) !important;
+  transform: rotate(360deg) !important;
+}
+.header-buttons .v-ripple__container{
+    opacity:0;
+}
+.header-menu-button.v-btn:not(.v-btn--text):not(.v-btn--outlined):hover:before {
+    opacity:0 !important;
+}
+.header-menu-button .v-ripple__container{
+    opacity:0;
+}
+.header-top-margin{
+    margin-top:56px !important;
+}
+
+.promo-banner{
+    display:flex;
+    justify-content: center;
+    align-content: center;
+}
+.promo-banner a{
+    text-decoration: none;
+    color:#ffffff !important;
+    text-transform: uppercase;
+    font-size:12px;
+    align-self: center;
+    
+}
+.promo-link{
+    text-decoration: none;
+    color:#ffffff;
+    text-transform: uppercase;
+    font-size:10px;
+    align-self: center;
+    
+}
+.promo-banner:hover a{
+    color:#CCB7FF !important;
+   }
+   .promo-banner:active a{
+    color: #2850da !important;
+   }
+@media screen and (max-width: 600px) {
+    .promo-banner{
+        font-size: 8px;
+       }
+}
+
+/*.header-checkoutpage-button:active{
+    background-color: #2850da !important;
+    color:#ffffff !important;
+}*/
+.header-checkoutpage-button.v-btn:before{
+    background-color: transparent !important;
+}
+.header-closedrawer-button.v-btn:before{
+    background-color: transparent !important;
+}
+.header-search-field.v-text-field.v-text-field--solo:not(.v-text-field--solo-flat)>.v-input__control>.v-input__slot{
+    height:56px;
+    margin-bottom: 0px !important;
+}
+.header-search-field.v-text-field.v-text-field--enclosed .v-text-field__details {
+display: none;
+margin-bottom: 0px !important;
+}
--- a/src/components/layout/header/Header.vue
+++ b/src/components/layout/header/Header.vue
--- a/Show More
+++ b/Show More
Author	SHA1	Message	Date
rakesh	6224ded42f	tracker#309	2023-07-10 11:39:04 +05:30
rakesh	2f48c35a6f	fixes	2023-02-10 12:07:54 +05:30
rakesh	fa858f2021	fixes	2023-01-24 17:37:47 +05:30
rakesh	9227bf9827	fixes	2023-01-24 17:21:08 +05:30
User	51b3779ad1	custom attribute added	2022-07-18 11:08:50 +05:30
rakesh	b435ce7b18	fixes	2022-07-14 14:13:00 +05:30
rakesh	42fa2b55dc	new route added	2022-07-13 12:42:06 +05:30
sidharth	f08b8edf81	MAINTENANCE mode off	2022-06-14 12:09:05 +05:30
rakesh	6f96a1edcf	ui fixes	2022-06-09 13:50:49 +05:30
rakesh	ac35b2550f	fixes	2022-06-09 13:47:07 +05:30
User	0838f84c96	tracker#164 Retailer Portal Product Search Results fixes	2022-06-09 13:22:06 +05:30
User	dc6884f641	tracker#164 Retailer Portal Product Search Results changes	2022-06-09 12:36:31 +05:30
sidharth	ab1e54c728	Merge branch 'migration_2.4.3' of git.treelet.net:crane/retailer-vue into beta_merge-migration_2.4.3	2022-03-28 12:10:41 +05:30
sidharth	c225e0d93b	MAINTENANCE	2022-03-28 12:10:10 +05:30
rakesh	396f3ae742	migration_2.4.3 cart item	2022-03-26 10:10:57 +05:30
rakesh	e5cb471f33	fixes	2022-03-11 13:42:29 +05:30
sidharth	8896390400	retailer dashboard with cms block	2022-02-28 12:48:07 +05:30
sidharth	d59fe3c7fc	Merge branch 'code-cleanup' of git.treelet.net:crane/retailer-vue into beta	2022-02-28 10:13:52 +05:30
sidharth	9e47211cea	removed debugger	2022-02-24 12:52:13 +05:30
sidharth	f1bad5cf21	add to cart error handling	2022-02-24 12:46:06 +05:30
sidharth	e59452ddf3	removed unneeded files	2022-02-24 11:46:49 +05:30
Rares Pop	c8a1f478c0	link fix	2022-02-24 00:08:25 +02:00
sidharth	7af242454a	production fixes	2022-02-23 15:44:14 +05:30
sidharth	f97590a6b3	Added git info in git ignore	2022-02-16 17:18:20 +05:30
rakesh	c682b354f4	fixes	2022-02-16 15:42:29 +05:30
rakesh	f387e947a5	fixes	2022-02-16 14:05:12 +05:30
anjujangid	8100579231	created filter data for date in order page	2022-02-16 12:46:41 +05:30
anjujangid	19d58cff7a	created filter data for date in order page	2022-02-16 12:01:09 +05:30
anjujangid	f2f7e950c2	created filter data for date in order page	2022-02-16 11:23:00 +05:30
rakesh	e1488fc8d5	fixes	2022-02-15 14:31:49 +05:30
rakesh	22ea1e7a62	fixes	2022-02-14 17:55:45 +05:30
rakesh	e987740c1e	fixes	2022-02-14 17:03:50 +05:30
anjujangid	8c3f940308	postman code-pending	2022-02-14 16:00:18 +05:30
sidharth	09613fb631	Merge branch 'dev' of git.treelet.net:crane/retailer-vue into beta	2022-02-12 18:28:29 +05:30
anjujangid	a57b07eaa8	Added New postman api code	2022-02-12 17:50:27 +05:30
sidharth	c9f3457b33	Merge branch 'dev' of git.treelet.net:crane/retailer-vue into beta	2022-02-12 16:24:19 +05:30
anjujangid	05692cdd9e	Added postman api code	2022-02-12 15:02:16 +05:30
sidharth	f416251faf	removed git info	2022-02-12 14:28:47 +05:30
sidharth	a5ff8e51ae	resource handing	2022-02-12 13:29:41 +05:30
sidharth	455f464f48	resource page using cms page	2022-02-12 13:23:52 +05:30
rakesh	baa64dab9d	fixes	2022-02-11 13:47:53 +05:30
rakesh	ccc0c77a54	fixes	2022-02-11 13:23:18 +05:30
anjujangid	66e790b4c9	Merge branch 'beta' of git.treelet.net:crane/retailer-vue into dev	2022-02-11 13:01:45 +05:30
anjujangid	1a7f74b26a	added ponumber in order page table	2022-02-11 12:55:46 +05:30
rakesh	2c3eacbade	fixes	2022-02-09 15:33:33 +05:30
rakesh	de31262762	fixes	2022-02-09 13:36:59 +05:30
anjujangid	74d3d0c4fa	created table in order page	2022-02-05 15:49:06 +05:30
rakesh	d5f0c96eb7	fixes	2022-02-03 13:21:08 +05:30
sidharth	cae143cacd	Added Bearer in user auth	2022-02-03 11:49:18 +05:30
rakesh	610a4dc1fa	Merge branch 'beta' of git.treelet.net:crane/retailer-vue into dev	2022-02-02 17:02:24 +05:30
rakesh	10046af243	fixes	2022-02-02 17:01:34 +05:30
anju j	d1c2677c55	changes in BoxedOrderHistoryPage's path and added fetch api	2022-02-02 14:03:21 +05:30
sidharth	0254ae8669	env based token	2022-02-01 11:36:43 +05:30
anju j	ce10ce4d3c	Merge branch 'beta' of git.treelet.net:crane/retailer-vue into dev	2022-01-31 13:07:00 +05:30
anju j	fb207eef2c	added Order Information in myorders	2022-01-31 13:06:22 +05:30
rakesh	f761e502e8	fixes	2022-01-31 12:38:16 +05:30
rakesh	df18b3bcef	remove extra code	2022-01-28 18:20:14 +05:30
anju j	defccce142	Merge branch 'beta' of git.treelet.net:crane/retailer-vue into dev	2022-01-28 17:32:56 +05:30
sidharth	bb6a9d39dd	nav fixes	2022-01-28 17:05:44 +05:30
anju j	5c28f24978	created form in order page	2022-01-28 16:50:43 +05:30
sidharth	e6c648f4fb	personalize order bug fixes	2022-01-27 21:36:03 +05:30
sidharth	b1bc4dbba2	removed guest cart call	2022-01-27 17:32:59 +05:30
sidharth	925836ff0c	payment fixes	2022-01-27 15:51:50 +05:30
rakesh	d5144d80e2	fixes	2022-01-27 12:55:38 +05:30
rakesh	31d3fe75d8	fixes	2022-01-27 11:55:25 +05:30
sidharth	ee1df7fee0	Added upc in ui	2022-01-26 11:02:28 +05:30
sidharth	79cb86c2e6	personalized order with customer numer	2022-01-26 10:45:50 +05:30
sidharth	245c7a820f	.gitignore is now working	2022-01-25 15:00:11 +05:30
sidharth	d68b7135bf	formatted file	2022-01-25 14:55:30 +05:30
rakesh	e550b17649	fixes	2022-01-25 14:03:21 +05:30
sidharth	c3b1962bf6	login interrupt fixes	2022-01-25 12:53:33 +05:30
rakesh	fa1d5ed97b	fixes	2022-01-24 19:33:34 +05:30
rakesh	dc8b7fdbd5	fixes	2022-01-24 19:25:04 +05:30
rakesh	4ffb843e46	fixes	2022-01-24 18:24:49 +05:30
anju j	29509c005a	card products issue resolved	2022-01-24 18:16:48 +05:30
rakesh	e1f84cc625	Merge branch 'dev' of git.treelet.net:crane/retailer-vue into beta	2022-01-24 17:50:04 +05:30
anju j	e02c9caeb1	added pdf links and components	2022-01-24 17:47:42 +05:30
rakesh	aa8e69ef45	Merge branch 'beta' of git.treelet.net:crane/retailer-vue into beta	2022-01-24 12:50:19 +05:30
rakesh	92939af82e	fixes	2022-01-24 12:49:26 +05:30
anju j	d591bed396	still woring on components-incomplte in header part	2022-01-21 18:59:42 +05:30
sidharth	fbaf3668e4	undo criteo script	2022-01-21 17:39:47 +05:30
sidharth	55224926d9	debounce with product search	2022-01-21 17:33:32 +05:30
anju j	ec3b6b80d1	Merge branch 'beta' of git.treelet.net:crane/retailer-vue into dev	2022-01-21 11:41:48 +05:30
anju j	934b913728	git changes	2022-01-21 11:39:37 +05:30
rakesh	ad63d7d012	fixes	2022-01-20 15:08:46 +05:30
rakesh	aecadf3107	fixes	2022-01-20 14:50:12 +05:30
sidharth	7f61304766	Merge branch 'beta' of git.treelet.net:crane/retailer-vue into beta	2022-01-19 22:15:44 +05:30
sidharth	4231ca5b9b	url fixes	2022-01-19 22:12:16 +05:30
rakesh	fee2391422	Merge branch 'dev' of git.treelet.net:crane/retailer-vue into beta	2022-01-19 18:58:19 +05:30
rakesh	fdf968604d	fixes	2022-01-19 18:57:47 +05:30
rakesh	aba7cd3dad	Merge branch 'beta' of git.treelet.net:crane/retailer-vue into dev	2022-01-19 18:55:20 +05:30
rakesh	7e0bb1a971	fixes	2022-01-19 18:54:39 +05:30
rakesh	08860a919b	fixes	2022-01-19 18:52:40 +05:30
anju j	b1151481d0	modification in header and footer part	2022-01-19 18:51:02 +05:30
sidharth	45f251918c	forgot password fixes	2022-01-19 18:10:55 +05:30
rakesh	a66b164c8f	fixes	2022-01-19 18:09:33 +05:30
rakesh	01fa863735	fixes	2022-01-19 18:08:15 +05:30
sidharth	e84cb9c52b	env updates	2022-01-19 17:49:54 +05:30
sidharth	e4e8a8dac8	Merge branch 'dev' of git.treelet.net:crane/retailer-vue into beta	2022-01-19 17:47:18 +05:30
sidharth	fb32a560be	Merge branch 'beta' of git.treelet.net:crane/retailer-vue into beta	2022-01-18 18:54:24 +05:30
sidharth	d6168f61e9	crane retailer catalog updated	2022-01-18 18:54:03 +05:30
rakesh	ddedd2d942	fixes	2022-01-18 18:37:25 +05:30
sidharth	10dcca315f	Added crane retailer catalog js	2022-01-18 17:09:58 +05:30
anju j	3d4f38fdc3	initial code	2022-01-17 18:16:19 +05:30
rakesh	a01c4a865d	fixes	2022-01-14 12:57:45 +05:30
rakesh	4bdc1d9abf	fixes	2022-01-13 19:24:00 +05:30
rakesh	ee7c6f3a49	changes	2022-01-13 17:48:47 +05:30
rakesh	56e9907bc5	fixes	2022-01-13 17:47:16 +05:30
sidharth	72055c92e6	code cleanup	2022-01-11 19:48:17 +05:30
sidharth	25ae333143	basic setup	2022-01-10 21:41:16 +05:30