diff --git a/src/components/base/BaseSelect.vue b/src/components/base/BaseSelect.vue
index abd7492..b498f6a 100644
--- a/src/components/base/BaseSelect.vue
+++ b/src/components/base/BaseSelect.vue
@@ -1,6 +1,6 @@
.flex.flex-col.gap-y-2
- base-input-container(:label="label")
+ base-input-container(:label="label", :style="{width: width}")
q-select(
v-model="value",
:options="items",
@@ -74,6 +74,7 @@ export default {
disable: Boolean,
label: String,
readonly: Boolean,
+ width: String,
},
emits: ["update:modelValue"],
data() {
diff --git a/src/pages/newMedicalCard/components/MedicalProtocolsList.vue b/src/pages/newMedicalCard/components/MedicalProtocolsList.vue
index 004b2cf..5c07cc4 100644
--- a/src/pages/newMedicalCard/components/MedicalProtocolsList.vue
+++ b/src/pages/newMedicalCard/components/MedicalProtocolsList.vue
@@ -9,8 +9,16 @@
icon="add",
:style="{width: '100%'}"
)
- .p-4.rounded.background.h-full
- base-select
+ .p-4.rounded.background.h-full.w-full
+ .flex.w-full
+ base-select(:style="{flex: 1}")
+ q-btn.ml-2(
+ icon="sort"
+ :style="{width: '40px', height: '40px'}",
+ padding="0"
+ :class="sortingClass"
+ @click="invertSorting"
+ )
@@ -26,4 +55,10 @@ export default {
width: 19.6%
.background
background-color: var(--default-white)
+.sort-icon-default
+ background-color: var(--bg-light-grey)
+ color: var(--font-grey-color)
+.sort-icon-active
+ background-color: var(--btn-blue-color)
+ color: var(--default-white)