Merge pull request #49 from LucasWerey/fix/21

fix(dslib): fix selectfield and offerCard
LucasWerey · Jan 25, 2024 · b2f002e · b2f002e
2 parents 2edd1c1 + 64046f4
commit b2f002e
Show file tree

Hide file tree

Showing 5 changed files with 31 additions and 6 deletions.
diff --git a/package.json b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@lucaswerey/dslib-pfe",
-  "version": "0.0.68",
+  "version": "0.0.69",
   "private": false,
   "main": "./lib/index.umd.js",
   "module": "./lib/index.mjs",

diff --git a/src/components/CTA/SelectField/SelectField.story.vue b/src/components/CTA/SelectField/SelectField.story.vue
@@ -36,6 +36,10 @@ const controls = reactive<Controls>({
     { value: 'Mois', label: 'Mois' },
     { value: 'Années', label: 'Années' },
     { value: 'Semaines', label: 'Semaines' },
+    { value: 'Jours', label: 'Jours' },
+    { value: 'Jours', label: 'Jours' },
+    { value: 'Jours', label: 'Jours' },
+    { value: 'Jours', label: 'Jours' },
     { value: 'Jours', label: 'Jours' }
   ],
   default: 'Mois',

diff --git a/src/components/CTA/SelectField/SelectField.vue b/src/components/CTA/SelectField/SelectField.vue
@@ -1,5 +1,5 @@
 <template>
-  <div class="flex h-[72px] w-[200px] flex-col gap-2">
+  <div class="flex h-[72px] w-[200px] flex-col gap-2" @focusout="open = false">
     <h1 class="font-eina1 text-2 font-bold uppercase text-basic-black">
       {{ title }}
     </h1>
@@ -18,7 +18,7 @@
           color="darkgrey"
         />
       </div>
-      <div class="items absolute z-10 w-full" v-show="open">
+      <div class="items scrollbar absolute z-10 max-h-[150px] w-full overflow-auto" v-show="open">
         <div
           v-for="(option, i) of options"
           :key="i"
@@ -75,3 +75,24 @@ const handleClick = (option: SelectFieldOption) => {
 
 const emit = defineEmits(['update:modelValue'])
 </script>
+
+<style scoped>
+.scrollbar::-webkit-scrollbar {
+  width: 4px;
+}
+
+.scrollbar::-webkit-scrollbar-track {
+  @apply bg-primary-lightmoonstone;
+  border-radius: 40px;
+}
+
+.scrollbar::-webkit-scrollbar-thumb {
+  @apply bg-primary-moonstone;
+  border-radius: 40px;
+}
+
+.scrollbar::-webkit-scrollbar-thumb:hover {
+  @apply bg-primary-moonstone;
+  border-radius: 40px;
+}
+</style>
diff --git a/src/components/Containment/OfferCard/OfferCard.story.vue b/src/components/Containment/OfferCard/OfferCard.story.vue
@@ -41,7 +41,7 @@
       </ControlDescription>
     </template>
 
-    <template #default>
+    <Variant title="playground" auto-props-disabled>
       <OfferCard
         :type="controls.type"
         :title="controls.title"
@@ -55,7 +55,7 @@
         @seeOffer="() => {}"
         @createOffer="() => {}"
       />
-    </template>
+    </Variant>
   </Story>
 </template>
 

diff --git a/src/components/Containment/OfferCard/OfferCard.vue b/src/components/Containment/OfferCard/OfferCard.vue
@@ -39,7 +39,7 @@
             />
           </div>
           <p class="font-eina1 text-3 font-semibold text-basic-black">
-            {{ nCandidates }} candidats
+            {{ nCandidates ?? 0 }} {{ (nCandidates ?? 0) > 1 ? 'candidats' : 'candidat' }}
           </p>
         </div>
         <Button
-Original file line number
+Diff line change
@@ Expand Up / @@ -39,7 +39,7 @@ @@
                 />
               </div>
               <p class="font-eina1 text-3 font-semibold text-basic-black">
-                {{ nCandidates }} candidats
+                {{ nCandidates ?? 0 }} {{ (nCandidates ?? 0) > 1 ? 'candidats' : 'candidat' }}
               </p>
             </div>
             <Button
@@ Expand Down @@