update dropdowns to use the updated / styled components (#12758)

* update dropdowns to use the updated / styled components

* update colors / behavior for colors

* remove class binding

website/client/src/components/shops/quests/index.vue

@@ -122,19 +122,14 @@
       <div class="clearfix">
         <div class="float-right">
           <span class="dropdown-label">{{ $t('sortBy') }}</span>
-          <b-dropdown
-            :text="$t(selectedSortItemsBy)"
-            right="right"
-          >
-            <b-dropdown-item
-              v-for="sort in sortItemsBy"
-              :key="sort"
-              :active="selectedSortItemsBy === sort"
-              @click="selectedSortItemsBy = sort"
-            >
-              {{ $t(sort) }}
-            </b-dropdown-item>
-          </b-dropdown>
+          <select-translated-array
+              :right="true"
+              :value="selectedSortItemsBy"
+              :items="sortItemsBy"
+              :inline-dropdown="false"
+              class="inline"
+              @select="selectedSortItemsBy = $event"
+          />
         </div>
       </div>
       <!-- eslint-disable vue/no-use-v-if-with-v-for -->
@@ -474,10 +469,12 @@ import QuestInfo from './questInfo.vue';
 import shops from '@/../../common/script/libs/shops';
 
 import isPinned from '@/../../common/script/libs/isPinned';
+import SelectTranslatedArray from '@/components/tasks/modal-controls/selectTranslatedArray';
 
 
 export default {
   components: {
+    SelectTranslatedArray,
     ShopItem,
     Item,
     CountBadge,