@useblu/ocean-core 1.37.1 → 1.38.0

package/CHANGELOG.md

@@ -3,6 +3,18 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+# [1.38.0](https://github.com/ocean-ds/ocean-web/compare/v1.37.2...v1.38.0) (2022-11-10)
+
+### Features
+
+- add doughnut chart component ([#1037](https://github.com/ocean-ds/ocean-web/issues/1037)) ([df268fb](https://github.com/ocean-ds/ocean-web/commit/df268fb9fdb7cbcb5b297d87e64cd42c6c260ad0))
+
+## [1.37.2](https://github.com/ocean-ds/ocean-web/compare/v1.37.1...v1.37.2) (2022-11-09)
+
+### Bug Fixes
+
+- components bugs ([#1034](https://github.com/ocean-ds/ocean-web/issues/1034)) ([d3e4397](https://github.com/ocean-ds/ocean-web/commit/d3e4397f301f631643c7b46023b8c80d93055ab9)), closes [#1023](https://github.com/ocean-ds/ocean-web/issues/1023) [#1018](https://github.com/ocean-ds/ocean-web/issues/1018)
+
 ## [1.37.1](https://github.com/ocean-ds/ocean-web/compare/v1.37.0...v1.37.1) (2022-10-24)
 
 ### Bug Fixes

package/ocean.css

@@ -1057,18 +1057,21 @@
 .ods-form-control__label {
   margin-right: 4px;
 }
+.ods-form-control__element {
+  max-height: 69.19px;
+}
 .ods-form-control__icon {
   align-items: start;
   display: flex;
   flex-direction: column;
   justify-content: center;
 }
-.ods-form-control.ods-tooltip[data-tooltip-pos*=-left]::after {
-  left: -5px;
-}
-.ods-form-control.ods-tooltip[data-tooltip-pos*=-left]::before {
+.ods-form-control__icon.ods-tooltip[data-tooltip-pos*=-left]::before {
   left: 3px;
 }
+.ods-form-control__icon.ods-tooltip[data-tooltip-pos*=-left]::after {
+  left: -5px;
+}
 .ods-form-control__helper-text {
   color: #b6b9cc;
   font-size: 12px;
@@ -1323,7 +1326,6 @@
   border-radius: 4px;
   display: flex;
   height: 46px;
-  margin: 1px;
 }
 .ods-input input {
   border: 0;
@@ -1354,23 +1356,16 @@
 .ods-input__number-controls {
   cursor: pointer;
 }
-.ods-input:hover, .ods-input:focus, .ods-input:active {
+.ods-input:hover, .ods-input:focus, .ods-input:active, .ods-input:focus-within {
   border-color: #5872f5;
   border-width: 2px;
-  margin: 0;
+  margin: -1px;
 }
-.ods-input--left {
-  flex-direction: row-reverse;
-}
-.ods-input--left input {
-  padding: 0 16px;
-}
-.ods-input--left .ods-input__adornment {
-  margin-right: -12px;
-  padding: 0 0 0 16px;
+.ods-input--filled {
+  border: 1px solid #b8c3ff;
 }
-.ods-input--right .ods-input__adornment {
-  margin-left: -12px;
+.ods-input--error {
+  border-color: #f5456e;
 }
 .ods-input--disabled {
   background-color: #ebecf5;
@@ -1382,13 +1377,7 @@
   cursor: not-allowed;
 }
 .ods-input--disabled:hover, .ods-input--disabled:focus, .ods-input--disabled:active {
-  border-color: #ebecf5;
-}
-.ods-input--filled {
-  border-color: #b8c3ff;
-}
-.ods-input--error {
-  border-color: #f5456e;
+  border-color: #5872f5;
 }
 .ods-input__adornment {
   align-items: center;
@@ -1403,6 +1392,19 @@
 .ods-input__adornment input {
   padding: 0 4px;
 }
+.ods-input--left {
+  flex-direction: row-reverse;
+}
+.ods-input--left input {
+  padding: 0 16px;
+}
+.ods-input--left .ods-input__adornment {
+  margin-right: -12px;
+  padding: 0 0 0 16px;
+}
+.ods-input--right .ods-input__adornment {
+  margin-left: -12px;
+}
 
 .ods-input--amount .ods-input--root {
   align-items: center;
@@ -1454,10 +1456,9 @@
 .ods-textarea::placeholder {
   color: #d8dae8;
 }
-.ods-textarea:hover, .ods-textarea:focus, .ods-textarea:active {
-  border-color: #5872f5;
-  border-width: 2px;
-  padding: 15px;
+.ods-textarea:hover, .ods-textarea:focus, .ods-textarea:active, .ods-textarea:focus-within {
+  border: 2px solid #5872f5;
+  margin: -1px;
 }
 .ods-textarea:disabled {
   background-color: #ebecf5;
@@ -1469,7 +1470,7 @@
   border-color: #ebecf5;
 }
 .ods-textarea--filled {
-  border-color: #b8c3ff;
+  border: 1px solid #b8c3ff;
 }
 .ods-textarea--error {
   border-color: #f5456e;
@@ -2690,7 +2691,6 @@
   border-radius: 4px;
   display: flex;
   height: 46px;
-  margin: 1px;
   width: 100%;
 }
 .ods-search input {
@@ -2718,13 +2718,12 @@
   color: #d8dae8;
   font-weight: 400;
 }
-.ods-search:hover, .ods-search:focus, .ods-search:active {
-  border-color: #5872f5;
-  border-width: 2px;
-  margin: 0;
+.ods-search:hover, .ods-search:focus, .ods-search:active, .ods-search:focus-within {
+  border: 2px solid #5872f5;
+  margin: -1px;
 }
 .ods-search--filled {
-  border-color: #b8c3ff;
+  border: 1px solid #b8c3ff;
 }
 .ods-search--disabled {
   background-color: #ebecf5;
@@ -2736,7 +2735,7 @@
   cursor: not-allowed;
 }
 .ods-search--disabled:hover, .ods-search--disabled:focus, .ods-search--disabled:active {
-  border-color: #ebecf5;
+  border: #ebecf5;
 }
 .ods-search__adornment {
   line-height: 0;
@@ -2745,9 +2744,6 @@
 .ods-search__adornment svg {
   color: #d8dae8;
 }
-.ods-search--filled .ods-search__adornment svg {
-  color: #0025e0;
-}
 .ods-search__clean {
   color: #b6b9cc;
   margin-right: 4px;
@@ -3602,4 +3598,100 @@
 .ods-date__selectedMiddle {
   background-color: rgba(176, 245, 245, 0.24);
 }
+
+.ods-chart {
+  padding-bottom: 16px;
+  width: 100%;
+}
+.ods-chart__title-and-subtitle {
+  margin-bottom: 24px;
+  width: 100%;
+}
+.ods-chart__title-and-subtitle .ods-typography__heading4 {
+  color: #393b47;
+  margin-bottom: 4px;
+}
+.ods-chart__canvas {
+  align-items: center;
+  display: flex;
+  justify-content: center;
+  margin-bottom: 24px;
+  position: relative;
+  width: 100%;
+}
+.ods-chart__canvas canvas {
+  margin: 0 auto;
+}
+.ods-chart__canvas__center-legend {
+  align-items: center;
+  display: flex;
+  flex-direction: column;
+  height: 40px;
+  justify-content: center;
+  position: absolute;
+  width: 96px;
+}
+.ods-chart__canvas__center-legend .ods-typography__heading2 {
+  align-items: center;
+  color: #393b47;
+  display: flex;
+  font-family: "Nunito Sans";
+  font-size: 20px;
+  font-weight: 600;
+  line-height: 1.1;
+  text-align: center;
+}
+.ods-chart__canvas__center-legend .ods-typography__description {
+  align-items: center;
+  color: #67697a;
+  display: flex;
+  font-family: "Nunito Sans";
+  font-size: 12px;
+  font-weight: 600;
+  line-height: 1.5;
+  text-align: center;
+}
+.ods-chart__legend {
+  align-items: flex-start;
+  display: flex;
+  flex-direction: column;
+  justify-content: center;
+  width: 100%;
+}
+.ods-chart__legend__row {
+  align-items: center;
+  display: flex;
+  height: 38px;
+  justify-content: space-between;
+  padding: 8px 0;
+  width: 100%;
+}
+.ods-chart__legend__row:not(:last-child) {
+  border-bottom: 1px solid #ebecf5;
+}
+.ods-chart__legend__row__description {
+  align-items: center;
+  display: flex;
+  justify-content: center;
+}
+.ods-chart__legend__row__description-circle {
+  border-radius: 8px;
+  height: 8px;
+  margin-right: 8px;
+  width: 8px;
+}
+.ods-chart__legend__row__percent {
+  align-items: center;
+  color: #393b47;
+  display: flex;
+  font-family: "Nunito Sans";
+  font-size: 14px;
+  font-weight: 600;
+  height: 21px;
+  line-height: 1.5;
+}
+.ods-chart__legend__row__description-level-2 {
+  color: #b6b9cc;
+  margin-left: 16px;
+}
 /*# sourceMappingURL=ocean.css.map */