@useblu/ocean-core 1.61.0 → 1.62.2

package/CHANGELOG.md

@@ -3,6 +3,16 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [1.62.2](https://github.com/ocean-ds/ocean-web/compare/v1.62.1...v1.62.2) (2024-06-18)
+
+**Note:** Version bump only for package @useblu/ocean-core
+
+# [1.62.0](https://github.com/ocean-ds/ocean-web/compare/v1.61.0...v1.62.0) (2024-06-14)
+
+### Features
+
+- create accordion component ([#1106](https://github.com/ocean-ds/ocean-web/issues/1106)) ([f685167](https://github.com/ocean-ds/ocean-web/commit/f685167ca6e7293670b751bc583e7f5aacc8c01a))
+
 # [1.61.0](https://github.com/ocean-ds/ocean-web/compare/v1.60.0...v1.61.0) (2024-06-14)
 
 ### Features

package/ocean.css

@@ -4627,6 +4627,7 @@
   display: flex;
   gap: 8px;
   list-style-type: none;
+  padding: 4px 0;
 }
 .ods-unordered-list-item__icon {
   height: 24px;
@@ -4667,4 +4668,74 @@
   display: flex;
   min-height: 24px;
 }
+
+.ods-accordion {
+  border-bottom: 1px solid #e0e2ee;
+  padding: 16px 0;
+  width: 100%;
+}
+.ods-accordion__header {
+  align-items: center;
+  background-color: transparent;
+  border: hidden;
+  cursor: pointer;
+  display: flex;
+  font-family: "Nunito Sans";
+  font-size: 14px;
+  font-weight: 600;
+  justify-content: space-between;
+  margin: 0;
+  padding: 0;
+  text-align: start;
+  width: 100%;
+}
+.ods-accordion__header:hover {
+  color: #5872f5;
+}
+.ods-accordion__header:focus {
+  outline: none;
+}
+.ods-accordion__header--collapsed {
+  color: #67697a;
+}
+.ods-accordion__header:not(.ods-accordion__header--collapsed) {
+  color: #5872f5;
+}
+.ods-accordion__icon {
+  height: 16px;
+  transition: transform 0.3s ease, fill 0.3s ease;
+  width: 16px;
+}
+.ods-accordion__icon--rotated {
+  color: #67697a;
+}
+.ods-accordion__icon:not(.ods-accordion__icon--rotated) {
+  color: #5872f5;
+  transform: rotate(180deg);
+}
+.ods-accordion__header:hover .ods-accordion__icon {
+  fill: #5872f5;
+}
+.ods-accordion__content {
+  max-height: 0;
+  overflow: hidden;
+  transition: max-height 0.3s ease;
+  will-change: max-height;
+}
+.ods-accordion__content--collapsed {
+  max-height: 0;
+}
+.ods-accordion__content:not(.ods-accordion__content--collapsed) {
+  max-height: 800px;
+  transition: max-height 0.4s ease;
+}
+.ods-accordion__description {
+  color: #67697a;
+  font-family: "Nunito Sans";
+  font-size: 12px;
+  font-weight: 400;
+  line-height: 21px;
+  margin: 0;
+  padding-top: 8px;
+}
 /*# sourceMappingURL=ocean.css.map */