-
+
+ - Kto Jsme? -
-- Jsme česká společnost, která pro fyzické a právnické osoby (živnostníky a firmy) poskytuje cloudové uložiště dle evropské směrnice (GDPR) a následného zákona o zpracování osobních údajů (zákon 110/2019 sb.). -
+
+
- Vyzkouset OasisDrive
-
+
+ 
@@ -46,6 +52,55 @@
@import '@assets/oasis/_homepage';
@import '@assets/oasis/_responsive';
+ .content-wrapper {
+ margin-bottom: -860px;
+ padding-left: 22%;
+ }
+
+ .hero {
+ width: 100%;
+ margin-bottom: -10px;
+ }
+
+ .oasis-about-us {
+ padding-top: 150px;
+
+ .sub-title-sm {
+ max-width: 890px;
+ }
+ }
+
+ .info-list {
+ margin: 65px 0;
+
+ .info-list-item {
+ display: flex;
+ align-items: start;
+ margin-bottom: 40px;
+
+ &:last-child {
+ margin-bottom: 0;
+ }
+
+ .icon {
+ margin-top: 5px;
+ margin-right: 15px;
+
+ polyline {
+ color: $pink;
+ }
+ }
+
+ .description {
+ max-width: 700px;
+ @include font-size(24);
+ color: $text-primary;
+ font-weight: 800;
+ line-height: 1.5;
+ }
+ }
+ }
+
@media only screen and (max-width: 960px) {
.info-list {
margin: 65px 0;
diff --git a/resources/js/Oasis/Homepage/Components/OasisContact.vue b/resources/js/Oasis/Homepage/Components/OasisContact.vue
index 3b227f78..cefb5007 100644
--- a/resources/js/Oasis/Homepage/Components/OasisContact.vue
+++ b/resources/js/Oasis/Homepage/Components/OasisContact.vue
@@ -1,6 +1,6 @@
+
-
+
+ Vyzkouset OasisDrive
+
+
+
+ + Kto Jsme? +
++ Jsme česká společnost, která pro fyzické a právnické osoby (živnostníky a firmy) poskytuje cloudové uložiště dle evropské směrnice (GDPR) a následného zákona o zpracování osobních údajů (zákon 110/2019 sb.). +
+-
+
-
+
+ {{ item }}
+
+
-
-
-
-
- {{ item }}
-
-
-
Vyzkouset OasisDrive
+
+ 
@@ -96,6 +98,133 @@
@import '@assets/oasis/_homepage';
@import '@assets/oasis/_responsive';
+ .oasis-features {
+ background: $theme-bg-dark;
+ padding-top: 85px;
+ position: relative;
+
+ .title-wrapper {
+ margin-bottom: 90px;
+ }
+
+ .main-title-sm {
+ color: white;
+ max-width: 690px;
+ margin: 0 auto;
+ }
+
+ .sub-title-sm {
+ margin: 0 auto;
+ color: $text-dark-subtitle;
+ }
+
+ .features-box {
+ margin-bottom: -230px;
+ }
+
+ .cta {
+ top: 300px;
+ position: relative;
+ }
+
+ .wave-background {
+ transform: translateY(100%);
+ position: absolute;
+ width: 100%;
+ z-index: 0;
+ bottom: 3px;
+ left: 0;
+ right: 0;
+ }
+ }
+
+ .features-box {
+ grid-template-columns: 1fr 1fr 1fr;
+ position: relative;
+ display: grid;
+ z-index: 1;
+ gap: 60px;
+
+ .box {
+ background: $theme-bg-light;
+ box-shadow: 0 22px 34px -20px #232142;
+ border-radius: 12px;
+ text-align: center;
+ padding: 40px 25px 45px;
+ display: block;
+
+ .box-title {
+ color: white;
+ margin-top: 22px;
+ margin-bottom: 25px;
+ @include font-size(32);
+ }
+
+ .box-description {
+ color: $text-dark-secondary;
+ @include font-size(19);
+ line-height: 1.55;
+ margin-bottom: 25px;
+ }
+
+ .box-more-info {
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ cursor: pointer;
+
+ .icon {
+ margin-left: 5px;
+
+ polyline {
+ color: $theme;
+ @include transition(150ms);
+ }
+ }
+
+ span {
+ @include font-size(17);
+ color: $theme;
+ font-weight: 700;
+ @include transition(150ms);
+ }
+
+ &:hover {
+ span, polyline {
+ color: lighten($theme, 10%);
+ }
+ }
+ }
+
+ &:nth-child(1) {
+
+ .box-icon {
+ rect, path {
+ color: $theme;
+ }
+ }
+ }
+
+ &:nth-child(2) {
+
+ .box-icon {
+ line, polyline, path {
+ color: $cyan;
+ }
+ }
+ }
+
+ &:nth-child(3) {
+
+ .box-icon {
+ path {
+ color: $pink;
+ }
+ }
+ }
+ }
+ }
+
@media only screen and (max-width: 960px) {
.features-box {
grid-template-columns: 1fr;
diff --git a/resources/js/Oasis/Homepage/Components/OasisHeader.vue b/resources/js/Oasis/Homepage/Components/OasisHeader.vue
index 58cd847c..b42eaf56 100644
--- a/resources/js/Oasis/Homepage/Components/OasisHeader.vue
+++ b/resources/js/Oasis/Homepage/Components/OasisHeader.vue
@@ -22,6 +22,8 @@
+
-
@@ -134,6 +133,74 @@
@import '@assets/oasis/_homepage';
@import '@assets/oasis/_responsive';
+ .oasis-contact {
+ background: $theme-bg-dark;
+ padding-top: 90px;
+ padding-bottom: 90px;
+
+ .title-wrapper {
+ margin-bottom: 65px;
+ }
+
+ .main-title-sm {
+ color: white;
+ }
+
+ .sub-title-sm {
+ color: $text-dark-subtitle;
+ max-width: 750px;
+ }
+
+ .info-container {
+ display: grid;
+ grid-template-columns: 1fr 1fr;
+ gap: 20px;
+ }
+
+ .info-grid {
+ gap: 20px;
+ display: grid;
+ grid-template-columns: 1fr 1fr;
+ }
+ }
+
+ .contact-form {
+ width: 100%;
+
+ .block-wrapper {
+ margin-bottom: 30px;
+ }
+
+ .error-message {
+ color: $pink;
+ margin-top: 5px;
+ display: block;
+ }
+
+ input, textarea {
+ background: $theme-bg-light;
+ border: 1px solid transparent;
+ border-radius: 8px;
+ padding: 13px 20px;
+ appearance: none;
+ outline: 0;
+ color: $text-dark-secondary;
+ @include font-size(16);
+ font-weight: 600;
+ width: 100%;
+
+ &.is-error {
+ border-color: $pink;
+ }
+
+ &::placeholder {
+ color: $text-dark-subtitle;
+ @include font-size(16);
+ font-weight: 600;
+ }
+ }
+ }
+
@media only screen and (max-width: 960px) {
.oasis-contact {
diff --git a/resources/js/Oasis/Homepage/Components/OasisFeatures.vue b/resources/js/Oasis/Homepage/Components/OasisFeatures.vue
index 9985cba4..cb8673e7 100644
--- a/resources/js/Oasis/Homepage/Components/OasisFeatures.vue
+++ b/resources/js/Oasis/Homepage/Components/OasisFeatures.vue
@@ -32,6 +32,8 @@
Kontakt a Podpora @@ -69,7 +69,6 @@
-