Style select

cartridge-gg · Dec 18, 2024 · 666c86b · 666c86b
1 parent 63ba1b5
commit 666c86b
Show file tree

Hide file tree

Showing 4 changed files with 17 additions and 17 deletions.
diff --git a/packages/keychain/src/components/connect/CreateSession.tsx b/packages/keychain/src/components/connect/CreateSession.tsx
@@ -56,9 +56,11 @@ export function CreateSession({
     if (violatingPolicy) {
       setError({
         code: ErrorCode.PolicyChainIdMismatch,
-        message: `Policy for ${(violatingPolicy as TypedDataPolicy).domain.name
-          }.${(violatingPolicy as TypedDataPolicy).primaryType
-          } has mismatched chain ID.`,
+        message: `Policy for ${
+          (violatingPolicy as TypedDataPolicy).domain.name
+        }.${
+          (violatingPolicy as TypedDataPolicy).primaryType
+        } has mismatched chain ID.`,
       });
       setIsDisabled(true);
     } else {
@@ -136,6 +138,7 @@ export function CreateSession({
             </Text>
           </HStack>
         )}
+
         {error && isControllerError(error) && (
           <ControllerErrorAlert error={error} />
         )}
@@ -158,13 +161,11 @@ export function CreateSession({
 
         {!error && (
           <div className="flex flex-col">
-            <div className="flex items-center text-sm text-muted-foreground">
-              <div>Expires in </div>
+            <div className="flex items-center text-sm text-muted-foreground py-4 gap-2">
+              <div className="font-medium">Expires in </div>
               <Select
                 value={duration.toString()}
-                onValueChange={(val) => {
-                  setDuration(BigInt(val));
-                }}
+                onValueChange={(val) => setDuration(BigInt(val))}
               >
                 <SelectTrigger className="w-28">
                   <SelectValue
@@ -181,7 +182,6 @@ export function CreateSession({
                   <SelectItem value={(60 * 60 * 24 * 7).toString()}>
                     1 WEEK
                   </SelectItem>
-                  <SelectItem value={"never"}>NEVER</SelectItem>
                 </SelectContent>
               </Select>
             </div>

diff --git a/packages/ui-next/src/components/primitives/select.tsx b/packages/ui-next/src/components/primitives/select.tsx
@@ -2,7 +2,7 @@
 
 import * as React from "react";
 import {
-  CheckIcon,
+  CheckCircledIcon,
   ChevronDownIcon,
   ChevronUpIcon,
 } from "@radix-ui/react-icons";
@@ -24,7 +24,7 @@ const SelectTrigger = React.forwardRef<
   <SelectPrimitive.Trigger
     ref={ref}
     className={cn(
-      "flex h-9 w-full items-center justify-between whitespace-nowrap rounded-md border border-input bg-transparent px-3 py-2 text-xs shadow-sm placeholder:text-muted-foreground focus:outline-none disabled:cursor-not-allowed disabled:opacity-50 [&>span]:line-clamp-1",
+      "flex h-9 w-full items-center justify-between whitespace-nowrap rounded-md bg-secondary px-3 py-2 text-xs font-bold placeholder:text-muted-foreground focus:outline-none disabled:cursor-not-allowed disabled:opacity-50 [&>span]:line-clamp-1",
       className,
     )}
     {...props}
@@ -80,7 +80,7 @@ const SelectContent = React.forwardRef<
     <SelectPrimitive.Content
       ref={ref}
       className={cn(
-        "relative z-50 max-h-96 min-w-[8rem] overflow-hidden rounded-md border bg-popover text-popover-foreground shadow-md data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2",
+        "relative z-50 max-h-96 min-w-[8rem] overflow-hidden rounded-md bg-popover text-popover-foreground font-bold data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2",
         position === "popper" &&
           "data-[side=bottom]:translate-y-1 data-[side=left]:-translate-x-1 data-[side=right]:translate-x-1 data-[side=top]:-translate-y-1",
         className,
@@ -130,7 +130,7 @@ const SelectItem = React.forwardRef<
   >
     <span className="absolute right-2 flex h-3.5 w-3.5 items-center justify-center">
       <SelectPrimitive.ItemIndicator>
-        <CheckIcon className="h-4 w-4" />
+        <CheckCircledIcon />
       </SelectPrimitive.ItemIndicator>
     </span>
     <SelectPrimitive.ItemText>{children}</SelectPrimitive.ItemText>

diff --git a/packages/ui-next/src/themes/dark.css b/packages/ui-next/src/themes/dark.css
@@ -3,13 +3,13 @@
     --background: 135 8% 9%; /* bg.background */
     --foreground: 0 0% 100%; /* text.primary */
 
-    --popover: 135 8% 9%; /* bg.background */
+    --popover: 135 6% 13%; /* bg.primary */
     --popover-foreground: 0 0% 100%; /* text.primary */
 
     --primary: 44 96% 61%; /* brand.primary */
     --primary-foreground: 135 15% 10%; /* bg.primary */
 
-    --secondary: 135 12% 13%; /* bg.primary */
+    --secondary: 135 6% 13%; /* bg.primary */
     --secondary-foreground: 0 0% 100%; /* text.primary */
 
     --tertiary: 120 57% 78%;
@@ -30,7 +30,7 @@
     --destructive: 7 72% 65%; /* text.error */
     --destructive-foreground: 7 72% 65%; /* text.error */
 
-    --border: 0 0% 50%;
+    --border: 135 8% 9%; /* bg.background */
     --input: 120 7.5% 15.69%; /* bg.secondary */
     --ring: 0 0% 100%; /* text.primary */
 

diff --git a/packages/ui-next/src/themes/default.css b/packages/ui-next/src/themes/default.css
@@ -30,7 +30,7 @@
     --destructive: 7 72% 65%;
     --destructive-foreground: 7 72% 65%;
 
-    --border: 0 0% 50%;
+    --border: 220 60% 99%;
     --input: 210 2.48% 94.9%; /* bg.secondary */
     --ring: 0 0% 0%;