diff --git a/src/assets/styles/analyticalView.scss b/src/assets/styles/analyticalView.scss index b8438c1..8b3ab30 100644 --- a/src/assets/styles/analyticalView.scss +++ b/src/assets/styles/analyticalView.scss @@ -55,67 +55,77 @@ } } - .recommendation-details{ - height: calc(100vh - $case-top); - background-color: $k-white; - padding: 15px; - border-radius: 10px; - display: flex; - flex-direction: column; - flex-grow: 1; - overflow: hidden; - - .tabs-component{ - position: relative; - overflow: inherit; - - .legend { - display:flex; - flex-direction: column; - padding: 5px 10px 5px 5px; - position:absolute; - top: 5px; - right: 0px; - // bottom: 30px; - z-index: 1; - background-color: rgba($color: #ffffff, $alpha: 0.9); - - .row{ - margin: 0px 5px; - } - - .past-activity, .current-activity, .next-activity, .intervention { - height: 10px; - width: 20px; - margin: 5px; - border-radius: 5px; - } - - .past-activity { - background-color: $k-gray2; - } - .current-activity { - background-color: $k-blue; - } - .next-activity { - background-color: $k-orange; - } - .intervention { - background-color: $k-purple; - } - + .selected { + background-color: $k-blue4; + } + } + + .recommendation-details { + height: calc(100vh - $case-top); + background-color: $k-white; + padding: 15px; + border-radius: 10px; + display: flex; + flex-direction: column; + flex-grow: 1; + overflow: hidden; + + .tabs-component { + position: relative; + overflow: inherit; + + .legend { + display: flex; + flex-direction: column; + padding: 5px 10px 5px 5px; + position: absolute; + top: 5px; + right: 0px; + // bottom: 30px; + z-index: 1; + background-color: rgba($color: #ffffff, $alpha: 0.9); + + .row { + margin: 0px 5px; + } + + .past-activity, + .current-activity, + .next-activity, + .intervention { + height: 10px; + width: 20px; + margin: 5px; + border-radius: 5px; + } + + .past-activity { + background-color: $k-gray2; + } + + .current-activity { + background-color: $k-blue; } - } - .tab-details{ - height: calc(100vh - 100px - $case-top); - overflow-y: auto; + .next-activity { + background-color: $k-orange; + } - ion-icon{ - height:25px; - width:25px; - padding: 10px; + .intervention { + background-color: $k-purple; } + + } + } + + .tab-details{ + height: calc(100vh - 100px - $case-top); + overflow-y: auto; + + ion-icon{ + height:25px; + width:25px; + padding: 10px; } } }