fixing some styles with dynamic select and dropdown

Shelf-nu · Nov 26, 2024 · 2c45a13 · 2c45a13
1 parent 0a91914
commit 2c45a13
Show file tree

Hide file tree

Showing 3 changed files with 31 additions and 6 deletions.
diff --git a/app/components/assets/assets-index/advanced-filters/value-field.tsx b/app/components/assets/assets-index/advanced-filters/value-field.tsx
@@ -563,7 +563,12 @@ function CustodyEnumField({
             className="w-full justify-start  font-normal [&_span]:w-full [&_span]:max-w-full [&_span]:truncate"
           >
             <div className="flex items-center justify-between">
-              <span className=" text-left">
+              <span
+                className={tw(
+                  "text-left",
+                  selectedIds.length <= 0 && "text-gray-500"
+                )}
+              >
                 {value === "without-custody"
                   ? "Without custody"
                   : selectedIds.length > 0
@@ -675,7 +680,12 @@ function CategoryEnumField({
             className="w-full justify-start font-normal [&_span]:w-full [&_span]:max-w-full [&_span]:truncate"
           >
             <div className="flex items-center justify-between">
-              <span className="text-left">
+              <span
+                className={tw(
+                  "text-left",
+                  selectedIds.length <= 0 && "text-gray-500"
+                )}
+              >
                 {selectedIds.length > 0
                   ? selectedIds
                       .map((id) => {
@@ -778,7 +788,12 @@ function LocationEnumField({
             className="w-full justify-start font-normal [&_span]:w-full [&_span]:max-w-full [&_span]:truncate"
           >
             <div className="flex items-center justify-between">
-              <span className="text-left">
+              <span
+                className={tw(
+                  "text-left",
+                  selectedIds.length <= 0 && "text-gray-500"
+                )}
+              >
                 {selectedIds.length > 0
                   ? selectedIds
                       .map((id) => {
@@ -881,7 +896,12 @@ function KitEnumField({
             className="w-full justify-start font-normal [&_span]:w-full [&_span]:max-w-full [&_span]:truncate"
           >
             <div className="flex items-center justify-between">
-              <span className="text-left">
+              <span
+                className={tw(
+                  "text-left",
+                  selectedIds.length <= 0 && "text-gray-500"
+                )}
+              >
                 {selectedIds.length > 0 && data.kits && data.kits.length > 0
                   ? selectedIds
                       .map((id) => {

diff --git a/app/components/assets/custom-fields-inputs.tsx b/app/components/assets/custom-fields-inputs.tsx
@@ -84,7 +84,7 @@ export default function AssetCustomFields({
     DATE: (field) => (
       <div className="flex w-full items-end">
         <Input
-          className="w-full"
+          className="w-full placeholder:text-gray-500"
           label={field.name}
           hideLabel
           type="date"

diff --git a/app/components/dynamic-select/dynamic-select.tsx b/app/components/dynamic-select/dynamic-select.tsx
@@ -188,7 +188,12 @@ export default function DynamicSelect({
                 ref={triggerRef}
                 className="flex w-full items-center justify-between whitespace-nowrap rounded border border-gray-300 px-[14px] py-2 text-[14px]  hover:cursor-pointer disabled:opacity-50"
               >
-                <span className="truncate whitespace-nowrap pr-2">
+                <span
+                  className={tw(
+                    "truncate whitespace-nowrap pr-2",
+                    selectedValue === undefined && "text-gray-500"
+                  )}
+                >
                   {triggerValue}
                 </span>
                 <ChevronDownIcon />