disable select on stake page ui components

fluidity-money · Dec 24, 2024 · 44b417e · 44b417e
1 parent ab94563
commit 44b417e
Show file tree

Hide file tree

Showing 4 changed files with 12 additions and 12 deletions.
diff --git a/web/src/app/stake/MyPositions.tsx b/web/src/app/stake/MyPositions.tsx
@@ -499,7 +499,7 @@ export const MyPositions = () => {
         {pools && showClaimAllYield && pools.length > 0 && (
           <div className="flex flex-1 flex-col items-center">
             <Button
-              className="w-full text-3xs text-black md:text-xs"
+              className="w-full select-none text-3xs text-black md:text-xs"
               variant={collectError ? "destructive" : "iridescent"}
               disabled={collectAllYieldButtonDisabled}
               size="sm"
@@ -531,7 +531,7 @@ export const MyPositions = () => {
         )}
         <Link href={"/stake/pool/create"} className="flex-1">
           <Button
-            className="w-full text-3xs md:text-xs"
+            className="w-full select-none text-3xs md:text-xs"
             variant="secondary"
             size="sm"
           >

diff --git a/web/src/app/stake/_AllPoolsTable/columns.tsx b/web/src/app/stake/_AllPoolsTable/columns.tsx
@@ -26,11 +26,11 @@ export type Pool = {
 export const columns: ColumnDef<Pool>[] = [
   {
     accessorKey: "tokens",
-    header: "Pair",
+    header: () => <div className="select-none">Pair</div>,
     cell: ({ row }) => {
       return (
         <Link href={`/stake/pool?id=${row.original.id}`}>
-          <Badge className="h-[35.61px] cursor-pointer gap-1 pl-1 text-2xs md:text-xs">
+          <Badge className="h-[35.61px] cursor-pointer select-none gap-1 pl-1 text-2xs md:text-xs">
             <div className={"flex flex-row items-center"}>
               <TokenIcon
                 src={row.original.tokens[0].icon}
@@ -52,7 +52,7 @@ export const columns: ColumnDef<Pool>[] = [
     header: ({ column }) => {
       return (
         <div
-          className="flex cursor-pointer flex-row items-center"
+          className="flex cursor-pointer select-none flex-row items-center"
           onClick={() => column.toggleSorting(column.getIsSorted() === "asc")}
         >
           TVL
@@ -69,7 +69,7 @@ export const columns: ColumnDef<Pool>[] = [
     header: ({ column }) => {
       return (
         <div
-          className="flex cursor-pointer flex-row items-center"
+          className="flex cursor-pointer select-none flex-row items-center"
           onClick={() => column.toggleSorting(column.getIsSorted() === "asc")}
         >
           Fees
@@ -86,7 +86,7 @@ export const columns: ColumnDef<Pool>[] = [
     header: ({ column }) => {
       return (
         <div
-          className="flex cursor-pointer flex-row items-center"
+          className="flex cursor-pointer select-none flex-row items-center"
           onClick={() => column.toggleSorting(column.getIsSorted() === "asc")}
         >
           Volume
@@ -103,7 +103,7 @@ export const columns: ColumnDef<Pool>[] = [
     header: ({ column }) => {
       return (
         <div
-          className="flex cursor-pointer flex-row items-center"
+          className="flex cursor-pointer select-none flex-row items-center"
           onClick={() => column.toggleSorting(column.getIsSorted() === "asc")}
         >
           Rewards
@@ -128,7 +128,7 @@ export const columns: ColumnDef<Pool>[] = [
     header: ({ column }) => {
       return (
         <div
-          className="flex cursor-pointer flex-row items-center"
+          className="flex cursor-pointer select-none flex-row items-center"
           onClick={() => column.toggleSorting(column.getIsSorted() === "asc")}
         >
           APR
@@ -142,7 +142,7 @@ export const columns: ColumnDef<Pool>[] = [
   },
   {
     id: "action",
-    header: "Action",
+    header: () => <div className="select-none">Action</div>,
     cell: ({ row }) => {
       return (
         <div className="flex flex-row gap-2 group-hover:invert">

diff --git a/web/src/components/Menu/index.tsx b/web/src/components/Menu/index.tsx
@@ -148,7 +148,7 @@ const Menu: React.FC<MenuProps> = ({
       : "light";
 
   return (
-    <div className={cn("flex flex-row gap-3 rounded", className)}>
+    <div className={cn("flex select-none flex-row gap-3 rounded", className)}>
       <LayoutGroup id={id}>
         {children.map((item, i) => {
           return (

diff --git a/web/src/components/ui/segmented-control.tsx b/web/src/components/ui/segmented-control.tsx
@@ -73,7 +73,7 @@ const SegmentedControl = <T extends string>({
         {segments?.map((item: Segment<T>, i: number) => (
           <div
             key={item.value}
-            className={"relative z-10 w-full text-center"}
+            className={"relative z-10 w-full select-none text-center"}
             ref={item.ref}
           >
             <input