@useblu/ocean-core 1.26.0 → 1.27.2

package/CHANGELOG.md

@@ -3,6 +3,28 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [1.27.2](https://github.com/ocean-ds/ocean-web/compare/v1.27.1...v1.27.2) (2022-02-11)
+
+### Bug Fixes
+
+- **carosel:** add shadown to block ([#910](https://github.com/ocean-ds/ocean-web/issues/910)) ([1835bc6](https://github.com/ocean-ds/ocean-web/commit/1835bc6ec497edcc3d05f7a875c903741d7d729e))
+
+## [1.27.1](https://github.com/ocean-ds/ocean-web/compare/v1.27.0...v1.27.1) (2022-02-11)
+
+### Bug Fixes
+
+- **carosel:** layout adjustments ([#906](https://github.com/ocean-ds/ocean-web/issues/906)) ([c6f258b](https://github.com/ocean-ds/ocean-web/commit/c6f258b74589c4eb448473fcf414111ed265ec28))
+
+## [1.26.2](https://github.com/ocean-ds/ocean-web/compare/v1.26.1...v1.26.2) (2022-01-24)
+
+### Bug Fixes
+
+- scroll modal mobile ([#889](https://github.com/ocean-ds/ocean-web/issues/889)) ([4bb34f7](https://github.com/ocean-ds/ocean-web/commit/4bb34f7e3b72892f5d4b84c64b94d39a113189f5))
+
+## [1.26.1](https://github.com/ocean-ds/ocean-web/compare/v1.26.0...v1.26.1) (2022-01-18)
+
+**Note:** Version bump only for package @useblu/ocean-core
+
 # [1.26.0](https://github.com/ocean-ds/ocean-web/compare/v1.25.2...v1.26.0) (2021-12-17)
 
 ### Features

package/ocean.css

@@ -1639,6 +1639,10 @@
   line-height: 1.5;
 }
 
+.ods-carousel.columns-5 .slick-track, .ods-carousel.columns-4 .slick-track, .ods-carousel.columns-3 .slick-track, .ods-carousel.columns-2 .slick-track {
+  gap: 8px;
+}
+
 .slick-slider {
   box-sizing: border-box;
   display: block;
@@ -1651,10 +1655,19 @@
       -ms-user-select: none;
           user-select: none;
 }
+.slick-slider .slick-arrow {
+  display: none !important;
+}
+.slick-slider:hover .slick-arrow {
+  display: block !important;
+}
 
 .slick-list {
+  border-radius: 8px;
+  box-shadow: 0 4px 8px rgba(12, 13, 20, 0.08);
   display: block;
   margin: 0;
+  margin-bottom: 15px;
   overflow: hidden;
   padding: 0;
   position: relative;
@@ -1668,27 +1681,12 @@
 .slick-track {
   display: flex;
   left: 0;
-  margin-bottom: 15px;
   margin-left: auto;
   margin-right: auto;
   position: relative;
   top: 0;
 }
 
-.slick-track > div:not(:first-child) {
-  margin-left: 8px;
-  margin-right: 8px;
-}
-
-.slick-track > div:first-child {
-  margin-left: 4px;
-  margin-right: 8px;
-}
-
-.slick-track > div:last-child {
-  margin-right: 8px;
-}
-
 .slick-slide {
   display: block;
   float: left;
@@ -1696,6 +1694,9 @@
   min-height: 1px;
 }
 
+.slick-arrow {
+  box-shadow: 0 4px 8px rgba(12, 13, 20, 0.08);
+}
 @media (max-width: 767.98px) {
   .slick-arrow {
     display: none !important;
@@ -1714,7 +1715,7 @@
   outline: none;
   padding: 0;
   position: absolute;
-  right: -10px;
+  right: 8px;
   top: 45%;
   transform: translate(0, -50%);
   width: 30px;
@@ -1727,7 +1728,7 @@
   color: #0025e0;
   font-size: 0;
   height: 30px;
-  left: -10px;
+  left: 8px;
   line-height: 0;
   margin-top: -10px;
   outline: none;
@@ -1813,7 +1814,7 @@
   line-height: 0;
   outline: none;
   padding: 5px;
-  width: 20px;
+  width: 8px;
 }
 
 .ods-carousel-dots li button::before {
@@ -2317,6 +2318,7 @@
 @media (max-width: 767.98px) {
   .ods-modal__content--after-open {
     max-height: 80%;
+    overflow: auto;
     top: auto;
   }
 }
@@ -2533,12 +2535,17 @@
 
 .ods-topbar {
   align-items: center;
-  display: flex;
+  display: grid;
   flex-wrap: wrap;
   font-family: "Avenir";
   font-size: 20px;
+  grid-template-columns: 3rem auto 3rem;
+  padding: 10px 5px;
   width: 100%;
 }
+.ods-topbar-scroll-bar {
+  box-shadow: 0 4px 8px rgba(12, 13, 20, 0.08);
+}
 .ods-topbar-light {
   color: #fff;
 }
@@ -2548,18 +2555,21 @@
 .ods-topbar-default {
   color: #0025e0;
 }
+.ods-topbar-default .ods-topbar-title {
+  padding-top: 0;
+}
 .ods-topbar-default .ods-topbar-title span {
   color: #67697a;
 }
 .ods-topbar-extend {
-  display: grid;
-  grid-template-columns: 2rem auto 2rem;
+  display: flex;
+  grid-template-columns: 50% 50% auto;
 }
 .ods-topbar-extend .ods-topbar-title {
-  padding-top: 0;
+  padding-top: 4rem;
 }
 .ods-topbar-extend .ods-topbar-search {
-  width: auto;
+  width: 50%;
 }
 .ods-topbar-prev {
   line-height: 0;
@@ -2571,7 +2581,6 @@
 .ods-topbar-title {
   font-weight: 800;
   line-height: 1.1;
-  padding-top: 5rem;
   width: 100%;
 }
 .ods-topbar-title span {
@@ -2583,7 +2592,6 @@
 .ods-topbar-search {
   line-height: 0;
   text-align: right;
-  width: 50%;
 }
 .ods-topbar-search svg {
   cursor: pointer;