From 2ca4d4a02d617eccbfd500cdd69e1336928e1bf6 Mon Sep 17 00:00:00 2001 From: Peter Papp Date: Mon, 5 Apr 2021 18:00:54 +0200 Subject: [PATCH] - homepage mobile --- public/mix-manifest.json | 103 +++++++++++++++++- resources/js/Oasis/Auth/SignUp.vue | 8 +- .../Homepage/Components/OasisAboutUs.vue | 35 +++++- .../Homepage/Components/OasisContact.vue | 42 +++++-- .../Homepage/Components/OasisFeatures.vue | 5 + .../Oasis/Homepage/Components/OasisHeader.vue | 86 +++++++++++++++ .../Homepage/Components/OasisPricing.vue | 88 ++++++++++++++- resources/sass/oasis/_responsive.scss | 68 +++++++----- 8 files changed, 381 insertions(+), 54 deletions(-) diff --git a/public/mix-manifest.json b/public/mix-manifest.json index 5382863a..16f86a7e 100644 --- a/public/mix-manifest.json +++ b/public/mix-manifest.json @@ -30,8 +30,8 @@ "/chunks/dashboard.js": "/chunks/dashboard.js?id=74bd69ac9feddf058188", "/chunks/dashboard~chunks/invoices~chunks/oasis/users~chunks/pages~chunks/plan-subscribers~chunks/plan~a9770c87.js": "/chunks/dashboard~chunks/invoices~chunks/oasis/users~chunks/pages~chunks/plan-subscribers~chunks/plan~a9770c87.js?id=1b4f56e56644c4aaf2bf", "/chunks/database.js": "/chunks/database.js?id=7374830dc3cbddf41abb", - "/chunks/dynamic-page.js": "/chunks/dynamic-page.js?id=fee26cda739ff4c59b41", - "/chunks/dynamic-page~chunks/oasis/homepage.js": "/chunks/dynamic-page~chunks/oasis/homepage.js?id=e76d72d620110f2ef1f6", + "/chunks/dynamic-page.js": "/chunks/dynamic-page.js?id=ecb87bb1a140b6cbe724", + "/chunks/dynamic-page~chunks/oasis/homepage.js": "/chunks/dynamic-page~chunks/oasis/homepage.js?id=9ca5283f538ace83f1c9", "/chunks/environment-setup.js": "/chunks/environment-setup.js?id=208de84df68177288a2a", "/chunks/files.js": "/chunks/files.js?id=40b4464ce393cb112111", "/chunks/files~chunks/oasis/platba~chunks/settings-subscription~chunks/shared-files~chunks/shared/file~9d1352fd.js": "/chunks/files~chunks/oasis/platba~chunks/settings-subscription~chunks/shared-files~chunks/shared/file~9d1352fd.js?id=4030b241faac6b31341f", @@ -46,10 +46,10 @@ "/chunks/installation-disclaimer.js": "/chunks/installation-disclaimer.js?id=fa49cb6f6c1027d24d57", "/chunks/invoices.js": "/chunks/invoices.js?id=81df0d453a53fd224e13", "/chunks/not-found-shared.js": "/chunks/not-found-shared.js?id=7fc7f9b6f10bdfac770e", - "/chunks/oasis/homepage.js": "/chunks/oasis/homepage.js?id=0ca4b352cbe74d2eddf1", + "/chunks/oasis/homepage.js": "/chunks/oasis/homepage.js?id=21d920a6227ee5e676ef", "/chunks/oasis/platba.js": "/chunks/oasis/platba.js?id=caf1edc9b2ee500b4eee", "/chunks/oasis/platba~chunks/oasis/upgrade-billing~chunks/oasis/upgrade-plan~chunks/upgrade-billing~ch~6880400b.js": "/chunks/oasis/platba~chunks/oasis/upgrade-billing~chunks/oasis/upgrade-plan~chunks/upgrade-billing~ch~6880400b.js?id=ee29561e2ed219ec0580", - "/chunks/oasis/sign-up.js": "/chunks/oasis/sign-up.js?id=80c72880037d6ffe11e4", + "/chunks/oasis/sign-up.js": "/chunks/oasis/sign-up.js?id=e53eeb48ebabae259f9c", "/chunks/oasis/upgrade-billing.js": "/chunks/oasis/upgrade-billing.js?id=a72e9ed72b7051e690a0", "/chunks/oasis/upgrade-plan.js": "/chunks/oasis/upgrade-plan.js?id=178d0ff676d80a801283", "/chunks/oasis/user-create.js": "/chunks/oasis/user-create.js?id=b8d9990b3e70402c3dda", @@ -498,5 +498,98 @@ "/chunks/dynamic-page~chunks/oasis/homepage.29f7ff4897e697df1f10.hot-update.js": "/chunks/dynamic-page~chunks/oasis/homepage.29f7ff4897e697df1f10.hot-update.js", "/chunks/oasis/homepage.29f7ff4897e697df1f10.hot-update.js": "/chunks/oasis/homepage.29f7ff4897e697df1f10.hot-update.js", "/chunks/oasis/homepage.4ff874de0a7bde9209bf.hot-update.js": "/chunks/oasis/homepage.4ff874de0a7bde9209bf.hot-update.js", - "/chunks/oasis/homepage.c2190fb78b2e20b7a198.hot-update.js": "/chunks/oasis/homepage.c2190fb78b2e20b7a198.hot-update.js" + "/chunks/oasis/homepage.c2190fb78b2e20b7a198.hot-update.js": "/chunks/oasis/homepage.c2190fb78b2e20b7a198.hot-update.js", + "/chunks/oasis/sign-up.3c054e649a89d8eea74f.hot-update.js": "/chunks/oasis/sign-up.3c054e649a89d8eea74f.hot-update.js", + "/chunks/oasis/homepage.dbafc54cfad6753261c8.hot-update.js": "/chunks/oasis/homepage.dbafc54cfad6753261c8.hot-update.js", + "/chunks/oasis/homepage.299fa247c9abe1a870c9.hot-update.js": "/chunks/oasis/homepage.299fa247c9abe1a870c9.hot-update.js", + "/chunks/oasis/homepage.dc67df42e7833c3510ea.hot-update.js": "/chunks/oasis/homepage.dc67df42e7833c3510ea.hot-update.js", + "/chunks/dynamic-page.97d2770668a49b14e44e.hot-update.js": "/chunks/dynamic-page.97d2770668a49b14e44e.hot-update.js", + "/chunks/dynamic-page~chunks/oasis/homepage.97d2770668a49b14e44e.hot-update.js": "/chunks/dynamic-page~chunks/oasis/homepage.97d2770668a49b14e44e.hot-update.js", + "/chunks/oasis/homepage.97d2770668a49b14e44e.hot-update.js": "/chunks/oasis/homepage.97d2770668a49b14e44e.hot-update.js", + "/chunks/dynamic-page.4071454d238ae034f82c.hot-update.js": "/chunks/dynamic-page.4071454d238ae034f82c.hot-update.js", + "/chunks/dynamic-page~chunks/oasis/homepage.4071454d238ae034f82c.hot-update.js": "/chunks/dynamic-page~chunks/oasis/homepage.4071454d238ae034f82c.hot-update.js", + "/chunks/oasis/homepage.4071454d238ae034f82c.hot-update.js": "/chunks/oasis/homepage.4071454d238ae034f82c.hot-update.js", + "/chunks/oasis/homepage.d7407893438a0406892a.hot-update.js": "/chunks/oasis/homepage.d7407893438a0406892a.hot-update.js", + "/chunks/oasis/homepage.bb84adf724e12db46771.hot-update.js": "/chunks/oasis/homepage.bb84adf724e12db46771.hot-update.js", + "/chunks/dynamic-page.2f7bafb39dcd5522c4bc.hot-update.js": "/chunks/dynamic-page.2f7bafb39dcd5522c4bc.hot-update.js", + "/chunks/dynamic-page~chunks/oasis/homepage.2f7bafb39dcd5522c4bc.hot-update.js": "/chunks/dynamic-page~chunks/oasis/homepage.2f7bafb39dcd5522c4bc.hot-update.js", + "/chunks/oasis/homepage.2f7bafb39dcd5522c4bc.hot-update.js": "/chunks/oasis/homepage.2f7bafb39dcd5522c4bc.hot-update.js", + "/chunks/dynamic-page.099f7f2623cd500d0fc1.hot-update.js": "/chunks/dynamic-page.099f7f2623cd500d0fc1.hot-update.js", + "/chunks/dynamic-page~chunks/oasis/homepage.099f7f2623cd500d0fc1.hot-update.js": "/chunks/dynamic-page~chunks/oasis/homepage.099f7f2623cd500d0fc1.hot-update.js", + "/chunks/oasis/homepage.099f7f2623cd500d0fc1.hot-update.js": "/chunks/oasis/homepage.099f7f2623cd500d0fc1.hot-update.js", + "/chunks/dynamic-page.af43f4ecbd092e4e0646.hot-update.js": "/chunks/dynamic-page.af43f4ecbd092e4e0646.hot-update.js", + "/chunks/dynamic-page~chunks/oasis/homepage.af43f4ecbd092e4e0646.hot-update.js": "/chunks/dynamic-page~chunks/oasis/homepage.af43f4ecbd092e4e0646.hot-update.js", + "/chunks/oasis/homepage.af43f4ecbd092e4e0646.hot-update.js": "/chunks/oasis/homepage.af43f4ecbd092e4e0646.hot-update.js", + "/chunks/oasis/homepage.ba3d4eb5aad190cb3a1f.hot-update.js": "/chunks/oasis/homepage.ba3d4eb5aad190cb3a1f.hot-update.js", + "/chunks/oasis/homepage.dde8bf7a0b8c93cf5d96.hot-update.js": "/chunks/oasis/homepage.dde8bf7a0b8c93cf5d96.hot-update.js", + "/chunks/oasis/homepage.fbe04e74c357188de4e1.hot-update.js": "/chunks/oasis/homepage.fbe04e74c357188de4e1.hot-update.js", + "/chunks/oasis/homepage.891769f6b879ac7ec8fc.hot-update.js": "/chunks/oasis/homepage.891769f6b879ac7ec8fc.hot-update.js", + "/chunks/oasis/homepage.b6ad6b67cc8bc6284e50.hot-update.js": "/chunks/oasis/homepage.b6ad6b67cc8bc6284e50.hot-update.js", + "/chunks/oasis/homepage.18bcd183356c332392d7.hot-update.js": "/chunks/oasis/homepage.18bcd183356c332392d7.hot-update.js", + "/chunks/oasis/homepage.04f68550da3ef4d583fa.hot-update.js": "/chunks/oasis/homepage.04f68550da3ef4d583fa.hot-update.js", + "/chunks/oasis/homepage.5a91b84ff272afa6777c.hot-update.js": "/chunks/oasis/homepage.5a91b84ff272afa6777c.hot-update.js", + "/chunks/oasis/homepage.43a7735cf2816243fecc.hot-update.js": "/chunks/oasis/homepage.43a7735cf2816243fecc.hot-update.js", + "/chunks/oasis/homepage.6326be02d56634ca2855.hot-update.js": "/chunks/oasis/homepage.6326be02d56634ca2855.hot-update.js", + "/chunks/oasis/homepage.b260a115f5f38a82629e.hot-update.js": "/chunks/oasis/homepage.b260a115f5f38a82629e.hot-update.js", + "/chunks/oasis/homepage.4bd2950261bab8a3d6c0.hot-update.js": "/chunks/oasis/homepage.4bd2950261bab8a3d6c0.hot-update.js", + "/chunks/oasis/homepage.4a45f42a3c94d351c246.hot-update.js": "/chunks/oasis/homepage.4a45f42a3c94d351c246.hot-update.js", + "/chunks/oasis/homepage.ccd7124ddc4d5cd94814.hot-update.js": "/chunks/oasis/homepage.ccd7124ddc4d5cd94814.hot-update.js", + "/chunks/oasis/homepage.c4c2288d7039226ee534.hot-update.js": "/chunks/oasis/homepage.c4c2288d7039226ee534.hot-update.js", + "/chunks/oasis/homepage.b5962a0fea4a9e16c1c6.hot-update.js": "/chunks/oasis/homepage.b5962a0fea4a9e16c1c6.hot-update.js", + "/chunks/oasis/homepage.47df596fc85daed559b1.hot-update.js": "/chunks/oasis/homepage.47df596fc85daed559b1.hot-update.js", + "/chunks/oasis/homepage.625a3e2ac6c182752753.hot-update.js": "/chunks/oasis/homepage.625a3e2ac6c182752753.hot-update.js", + "/chunks/oasis/homepage.998927871f6e7e6c6b75.hot-update.js": "/chunks/oasis/homepage.998927871f6e7e6c6b75.hot-update.js", + "/chunks/oasis/homepage.64af31825f898f310928.hot-update.js": "/chunks/oasis/homepage.64af31825f898f310928.hot-update.js", + "/chunks/oasis/homepage.be433d86046705862167.hot-update.js": "/chunks/oasis/homepage.be433d86046705862167.hot-update.js", + "/chunks/oasis/homepage.91ae060f3a5a8e4ee6fa.hot-update.js": "/chunks/oasis/homepage.91ae060f3a5a8e4ee6fa.hot-update.js", + "/chunks/oasis/homepage.1cd9c869190db25b52fb.hot-update.js": "/chunks/oasis/homepage.1cd9c869190db25b52fb.hot-update.js", + "/chunks/oasis/homepage.12f4ac23862df01f33f3.hot-update.js": "/chunks/oasis/homepage.12f4ac23862df01f33f3.hot-update.js", + "/chunks/oasis/homepage.6b5b7c459bc5bfc01409.hot-update.js": "/chunks/oasis/homepage.6b5b7c459bc5bfc01409.hot-update.js", + "/chunks/oasis/homepage.3365e383ae33915e3c06.hot-update.js": "/chunks/oasis/homepage.3365e383ae33915e3c06.hot-update.js", + "/chunks/oasis/homepage.624843c8f95e303560cb.hot-update.js": "/chunks/oasis/homepage.624843c8f95e303560cb.hot-update.js", + "/chunks/oasis/homepage.b54003306ca15544bf07.hot-update.js": "/chunks/oasis/homepage.b54003306ca15544bf07.hot-update.js", + "/chunks/oasis/homepage.2f872e6e779de8e871e2.hot-update.js": "/chunks/oasis/homepage.2f872e6e779de8e871e2.hot-update.js", + "/chunks/oasis/homepage.4f0cd8ae9159c0c8b8aa.hot-update.js": "/chunks/oasis/homepage.4f0cd8ae9159c0c8b8aa.hot-update.js", + "/chunks/oasis/homepage.dcc1c15826fdbc3af3e2.hot-update.js": "/chunks/oasis/homepage.dcc1c15826fdbc3af3e2.hot-update.js", + "/chunks/oasis/homepage.89455d5bf580cf310774.hot-update.js": "/chunks/oasis/homepage.89455d5bf580cf310774.hot-update.js", + "/chunks/oasis/homepage.c0f00119ba149681f225.hot-update.js": "/chunks/oasis/homepage.c0f00119ba149681f225.hot-update.js", + "/chunks/dynamic-page.c8b574721250c5117971.hot-update.js": "/chunks/dynamic-page.c8b574721250c5117971.hot-update.js", + "/chunks/dynamic-page~chunks/oasis/homepage.c8b574721250c5117971.hot-update.js": "/chunks/dynamic-page~chunks/oasis/homepage.c8b574721250c5117971.hot-update.js", + "/chunks/oasis/homepage.c8b574721250c5117971.hot-update.js": "/chunks/oasis/homepage.c8b574721250c5117971.hot-update.js", + "/chunks/oasis/homepage.6ca3a782d0f8561cce98.hot-update.js": "/chunks/oasis/homepage.6ca3a782d0f8561cce98.hot-update.js", + "/chunks/oasis/homepage.1f0e21f0cdecd4259a2f.hot-update.js": "/chunks/oasis/homepage.1f0e21f0cdecd4259a2f.hot-update.js", + "/chunks/oasis/homepage.b990468d7b9c0ee50686.hot-update.js": "/chunks/oasis/homepage.b990468d7b9c0ee50686.hot-update.js", + "/chunks/oasis/homepage.5af231af9142e0c9b14e.hot-update.js": "/chunks/oasis/homepage.5af231af9142e0c9b14e.hot-update.js", + "/chunks/oasis/homepage.cf937b60a6bdb9feb5bd.hot-update.js": "/chunks/oasis/homepage.cf937b60a6bdb9feb5bd.hot-update.js", + "/chunks/oasis/homepage.d97cdb67e62186be1eb5.hot-update.js": "/chunks/oasis/homepage.d97cdb67e62186be1eb5.hot-update.js", + "/chunks/oasis/homepage.09f614a4ab8fae6dcce7.hot-update.js": "/chunks/oasis/homepage.09f614a4ab8fae6dcce7.hot-update.js", + "/chunks/oasis/homepage.db7181386c05b0097a8d.hot-update.js": "/chunks/oasis/homepage.db7181386c05b0097a8d.hot-update.js", + "/chunks/oasis/homepage.2a018497b91a511bcfeb.hot-update.js": "/chunks/oasis/homepage.2a018497b91a511bcfeb.hot-update.js", + "/chunks/oasis/homepage.0e50998b6d530f0e9aff.hot-update.js": "/chunks/oasis/homepage.0e50998b6d530f0e9aff.hot-update.js", + "/chunks/oasis/homepage.6f57c85530149609e182.hot-update.js": "/chunks/oasis/homepage.6f57c85530149609e182.hot-update.js", + "/chunks/oasis/homepage.a5b4fdc497fd5e48a753.hot-update.js": "/chunks/oasis/homepage.a5b4fdc497fd5e48a753.hot-update.js", + "/chunks/oasis/homepage.806b1c0be9c09d26de90.hot-update.js": "/chunks/oasis/homepage.806b1c0be9c09d26de90.hot-update.js", + "/chunks/oasis/homepage.d1bbd379345c8e897b3d.hot-update.js": "/chunks/oasis/homepage.d1bbd379345c8e897b3d.hot-update.js", + "/chunks/oasis/homepage.9e5a34723145d759939a.hot-update.js": "/chunks/oasis/homepage.9e5a34723145d759939a.hot-update.js", + "/chunks/oasis/homepage.0df8a2f7e3d5446cbbe3.hot-update.js": "/chunks/oasis/homepage.0df8a2f7e3d5446cbbe3.hot-update.js", + "/chunks/oasis/homepage.6e8616009618c0a47d8f.hot-update.js": "/chunks/oasis/homepage.6e8616009618c0a47d8f.hot-update.js", + "/chunks/oasis/homepage.9ae54d2254c1d906f654.hot-update.js": "/chunks/oasis/homepage.9ae54d2254c1d906f654.hot-update.js", + "/chunks/oasis/homepage.867da984e24ffaaacf0a.hot-update.js": "/chunks/oasis/homepage.867da984e24ffaaacf0a.hot-update.js", + "/chunks/oasis/homepage.566f1a6622c573143234.hot-update.js": "/chunks/oasis/homepage.566f1a6622c573143234.hot-update.js", + "/chunks/oasis/homepage.a269bf3e5a5b272a6cbd.hot-update.js": "/chunks/oasis/homepage.a269bf3e5a5b272a6cbd.hot-update.js", + "/chunks/oasis/homepage.67a09b9efdabac16db00.hot-update.js": "/chunks/oasis/homepage.67a09b9efdabac16db00.hot-update.js", + "/chunks/oasis/homepage.3699e06c17be65f60c49.hot-update.js": "/chunks/oasis/homepage.3699e06c17be65f60c49.hot-update.js", + "/chunks/oasis/homepage.b28666c1709e6ecd94c0.hot-update.js": "/chunks/oasis/homepage.b28666c1709e6ecd94c0.hot-update.js", + "/chunks/oasis/homepage.dc32d1c4e2da964ed356.hot-update.js": "/chunks/oasis/homepage.dc32d1c4e2da964ed356.hot-update.js", + "/chunks/oasis/homepage.5fb09bf0bae7915ac139.hot-update.js": "/chunks/oasis/homepage.5fb09bf0bae7915ac139.hot-update.js", + "/chunks/oasis/homepage.4c34ad880542eec2c2ae.hot-update.js": "/chunks/oasis/homepage.4c34ad880542eec2c2ae.hot-update.js", + "/chunks/oasis/homepage.9ac7f3d1043119ec3f9d.hot-update.js": "/chunks/oasis/homepage.9ac7f3d1043119ec3f9d.hot-update.js", + "/chunks/oasis/homepage.b8301893c104b4588915.hot-update.js": "/chunks/oasis/homepage.b8301893c104b4588915.hot-update.js", + "/chunks/oasis/homepage.488ccd4d48728b9bc0e5.hot-update.js": "/chunks/oasis/homepage.488ccd4d48728b9bc0e5.hot-update.js", + "/chunks/oasis/homepage.e86acb71b47316e17015.hot-update.js": "/chunks/oasis/homepage.e86acb71b47316e17015.hot-update.js", + "/chunks/oasis/homepage.f3d2859c2e5d2c4e4c64.hot-update.js": "/chunks/oasis/homepage.f3d2859c2e5d2c4e4c64.hot-update.js", + "/chunks/oasis/homepage.22c7dfae577cfc998c36.hot-update.js": "/chunks/oasis/homepage.22c7dfae577cfc998c36.hot-update.js", + "/chunks/oasis/homepage.4715ca6b38b456889c73.hot-update.js": "/chunks/oasis/homepage.4715ca6b38b456889c73.hot-update.js", + "/chunks/oasis/homepage.9a105ab1611f6feedad5.hot-update.js": "/chunks/oasis/homepage.9a105ab1611f6feedad5.hot-update.js", + "/chunks/oasis/homepage.c732d762cb1713443b9c.hot-update.js": "/chunks/oasis/homepage.c732d762cb1713443b9c.hot-update.js" } diff --git a/resources/js/Oasis/Auth/SignUp.vue b/resources/js/Oasis/Auth/SignUp.vue index 15bbefda..06eaa281 100644 --- a/resources/js/Oasis/Auth/SignUp.vue +++ b/resources/js/Oasis/Auth/SignUp.vue @@ -112,10 +112,10 @@ return { isLoading: false, register: { - name: 'Peter', - email: 'john@doe.com', - password: 'vuefilemanager', - password_confirmation: 'vuefilemanager', + name: '', + email: '', + password: '', + password_confirmation: '', }, } }, diff --git a/resources/js/Oasis/Homepage/Components/OasisAboutUs.vue b/resources/js/Oasis/Homepage/Components/OasisAboutUs.vue index 1072684a..3fb270d1 100644 --- a/resources/js/Oasis/Homepage/Components/OasisAboutUs.vue +++ b/resources/js/Oasis/Homepage/Components/OasisAboutUs.vue @@ -231,6 +231,11 @@ } @media only screen and (max-width: 960px) { + + .oasis-about-us .content-wrapper { + margin-bottom: -220px; + } + .info-list { margin: 65px 0; @@ -240,7 +245,7 @@ margin-bottom: 40px; .description { - max-width: 700px; + max-width: 540px; @include font-size(19); color: $text-primary; font-weight: 800; @@ -249,4 +254,32 @@ } } } + + @media only screen and (max-width: 760px) { + .oasis-about-us { + padding-top: 30px; + + .content-wrapper { + margin-bottom: -70px; + } + } + + .info-list { + margin: 35px 0; + } + + .clouds .cloud { + + &:nth-child(3), + &:nth-child(4) { + display: none; + } + + &:nth-child(2) { + left: 3%; + top: 86%; + @include transform(scale(0.35)); + } + } + } diff --git a/resources/js/Oasis/Homepage/Components/OasisContact.vue b/resources/js/Oasis/Homepage/Components/OasisContact.vue index 68a41e61..44b4ba51 100644 --- a/resources/js/Oasis/Homepage/Components/OasisContact.vue +++ b/resources/js/Oasis/Homepage/Components/OasisContact.vue @@ -221,18 +221,6 @@ } @media only screen and (max-width: 960px) { - .oasis-contact { - - .info-container { - grid-template-columns: 1fr; - gap: 0; - } - - .info-grid { - gap: 0; - grid-template-columns: 1fr; - } - } .info-wrapper { @@ -245,9 +233,39 @@ .contact-form { padding-bottom: 40px; + .block-wrapper { + max-width: 100%; + } + button { width: 100%; } } } + + @media only screen and (max-width: 760px) { + + .oasis-contact { + padding-top: 60px; + padding-bottom: 10px; + + .info-container { + grid-template-columns: 1fr; + gap: 0; + } + + .info-grid { + gap: 0; + grid-template-columns: 1fr; + } + + .title-wrapper { + margin-bottom: 45px; + } + } + } + + .contact-form { + padding-top: 20px; + } diff --git a/resources/js/Oasis/Homepage/Components/OasisFeatures.vue b/resources/js/Oasis/Homepage/Components/OasisFeatures.vue index 6c608d28..6b8c3e10 100644 --- a/resources/js/Oasis/Homepage/Components/OasisFeatures.vue +++ b/resources/js/Oasis/Homepage/Components/OasisFeatures.vue @@ -263,6 +263,11 @@ } @media only screen and (max-width: 960px) { + + .oasis-features .main-title-sm { + max-width: 440px; + } + .features-box { .box { diff --git a/resources/js/Oasis/Homepage/Components/OasisHeader.vue b/resources/js/Oasis/Homepage/Components/OasisHeader.vue index f2b93a39..564c004c 100644 --- a/resources/js/Oasis/Homepage/Components/OasisHeader.vue +++ b/resources/js/Oasis/Homepage/Components/OasisHeader.vue @@ -210,4 +210,90 @@ margin-bottom: 60px; } } + + @media only screen and (max-width: 960px) { + .header { + margin-bottom: 100px; + } + + .oasis-header { + padding-top: 200px; + + .main-title { + max-width: 590px; + } + } + + .clouds .cloud { + + &:nth-child(1) { + top: 11%; + left: -1%; + @include transform(scale(-0.6, 0.6)); + } + + &:nth-child(2) { + @include transform(scale(-0.4, 0.4)); + top: 30%; + left: -24%; + } + + &:nth-child(3) { + @include transform(scale(0.6)); + top: 43%; + left: -5%; + } + + &:nth-child(4) { + right: -26%; + } + + &:nth-child(5) { + @include transform(scale(-0.7, 0.7)); + top: 38%; + } + } + } + + @media only screen and (max-width: 760px) { + + .clouds .cloud { + + &:nth-child(1) { + top: 12%; + left: -36%; + @include transform(scale(-0.4, 0.4)); + } + + &:nth-child(2) { + @include transform(scale(-0.4, 0.4)); + top: 65%; + left: -48%; + } + + &:nth-child(3) { + @include transform(scale(0.5)); + top: 48%; + left: -35%; + } + + &:nth-child(4) { + right: -35%; + top: 15%; + } + + &:nth-child(5) { + top: 44%; + right: -58%; + } + } + + .oasis-header .main-title { + max-width: 500px; + } + + .header { + margin-bottom: 120px; + } + } diff --git a/resources/js/Oasis/Homepage/Components/OasisPricing.vue b/resources/js/Oasis/Homepage/Components/OasisPricing.vue index b4107703..7eab440e 100644 --- a/resources/js/Oasis/Homepage/Components/OasisPricing.vue +++ b/resources/js/Oasis/Homepage/Components/OasisPricing.vue @@ -17,8 +17,10 @@ -
+
oasis-trees +
+
  • @@ -352,13 +354,43 @@ } } - @media only screen and (max-width: 960px) { + + .clouds .cloud { + + &:nth-child(1) { + left: 1%; + top: 4%; + @include transform(scale(0.6)) + } + + &:nth-child(2) { + left: 2%; + top: 25%; + } + + &:nth-child(3) { + right: -12%; + top: 2%; + @include transform(scale(-0.9, 0.9)) + } + + &:nth-child(4) { + right: -3%; + top: 26%; + @include transform(scale(0.5)) + } + } + .pricing-box { grid-template-columns: 1fr; gap: 25px; .box { + width: 100%; + max-width: 520px !important; + margin-left: auto !important; + margin-right: auto !important; &:nth-child(2) { padding: 38px 40px 35px; @@ -376,4 +408,56 @@ } } } + + @media only screen and (max-width: 760px) { + + .oasis-pricing { + + .title-wrapper { + margin-bottom: -70px; + } + } + + .trees { + margin-bottom: -130px; + margin-left: 0; + transform: scale(0.5) translatex(-110px); + } + + .pricing-box .box { + + .pricing-data { + @include font-size(36); + margin-bottom: 0; + } + + .pricing-description { + margin-bottom: 35px; + } + } + + .clouds .cloud { + + &:nth-child(1) { + left: -10%; + } + + &:nth-child(2) { + left: -18%; + top: 18%; + @include transform(scale(-0.5, 0.5)) + } + + &:nth-child(3) { + right: -22%; + top: 1%; + } + + &:nth-child(4) { + right: 1%; + top: 24%; + @include transform(scale(0.4)) + } + } + } diff --git a/resources/sass/oasis/_responsive.scss b/resources/sass/oasis/_responsive.scss index 3d35d350..eef4f0ae 100644 --- a/resources/sass/oasis/_responsive.scss +++ b/resources/sass/oasis/_responsive.scss @@ -33,43 +33,51 @@ @media only screen and (max-width: 960px) { .container { - padding-left: 20px; - padding-right: 20px; + padding-left: 50px !important; + padding-right: 50px !important; } - .main-title { - @include font-size(38); - line-height: 1.1; - margin-bottom: 20px; - } + @media only screen and (max-width: 760px) { - .main-title-sm { - @include font-size(32); - line-height: 1.1; - margin-bottom: 20px; - } + .container { + padding-left: 20px !important; + padding-right: 20px !important; + } - .sub-title { - @include font-size(20); - font-weight: 600; - } + .main-title { + @include font-size(38); + line-height: 1.1; + margin-bottom: 20px; + } - .sub-title-sm { - @include font-size(18); - font-weight: 600; - line-height: 1.6; - } + .main-title-sm { + @include font-size(32); + line-height: 1.1; + margin-bottom: 20px; + } - .theme-button { - @include font-size(19); - } + .sub-title { + @include font-size(20); + font-weight: 600; + } - .base-button { - @include font-size(15); - } + .sub-title-sm { + @include font-size(18); + font-weight: 600; + line-height: 1.6; + } - .info-title { - @include font-size(21); - margin-bottom: 12px; + .theme-button { + @include font-size(19); + } + + .base-button { + @include font-size(15); + } + + .info-title { + @include font-size(21); + margin-bottom: 12px; + } } } \ No newline at end of file