diff --git a/deploy-web/package.json b/deploy-web/package.json
index 44453ad0d..001f21dad 100644
--- a/deploy-web/package.json
+++ b/deploy-web/package.json
@@ -1,6 +1,6 @@
 {
   "name": "akash-console",
-  "version": "2.0.6",
+  "version": "2.0.8",
   "description": "Web UI to deploy on the Akash Network and view statistic about network usage.",
   "author": "Akash Network",
   "private": true,
diff --git a/deploy-web/src/components/deployments/DeploymentDetail.tsx b/deploy-web/src/components/deployments/DeploymentDetail.tsx
index 3c93496c0..6e8f470b0 100644
--- a/deploy-web/src/components/deployments/DeploymentDetail.tsx
+++ b/deploy-web/src/components/deployments/DeploymentDetail.tsx
@@ -82,7 +82,7 @@ export function DeploymentDetail({ dseq }: React.PropsWithChildren<{ dseq: strin
       }
     }
   });
-  const isDeploymentNotFound = deploymentError && (deploymentError as any).response?.data?.message?.includes("Deployment not found");
+  const isDeploymentNotFound = (deploymentError && (deploymentError as any).response?.data?.message?.includes("Deployment not found")) || !address;
   const hasLeases = leases && leases.length > 0;
   const { isLocalCertMatching, localCert, isCreatingCert, createCertificate } = useCertificate();
   const { data: providers, isFetching: isLoadingProviders, refetch: getProviders } = useProviderList();
@@ -155,9 +155,9 @@ export function DeploymentDetail({ dseq }: React.PropsWithChildren<{ dseq: strin
       {isDeploymentNotFound && (
         <div className="mt-8 text-center">
           <Title className="mb-2">404</Title>
-          <Title subTitle className="text-xl !font-normal">
+          <p>
             This deployment does not exist or it was created using another wallet.
-          </Title>
+          </p>
           <div className="pt-4">
             <Link href={UrlService.home()} className={cn(buttonVariants({ variant: "default" }), "inline-flex items-center space-x-2")}>
               <ArrowLeft className="text-sm" />
diff --git a/deploy-web/src/components/deployments/GranteeDepositMenuItem.tsx b/deploy-web/src/components/deployments/GranteeDepositMenuItem.tsx
index b3866ff98..04c87903b 100644
--- a/deploy-web/src/components/deployments/GranteeDepositMenuItem.tsx
+++ b/deploy-web/src/components/deployments/GranteeDepositMenuItem.tsx
@@ -16,18 +16,17 @@ export const GranteeDepositMenuItem: React.FunctionComponent<Props> = ({ grant }
   const denomData = useDenomData(grant.authorization.spend_limit.denom);
 
   return (
-    <div className="text-sm">
-      <Address address={grant.granter} />
-      &nbsp;|&nbsp;
+    <div className="text-xs">
+      <Address address={grant.granter} disableTooltip />
+      &nbsp;<small className="text-muted-foreground">|</small>&nbsp;
       <AKTAmount uakt={coinToUDenom(grant.authorization.spend_limit)} />
       &nbsp;
       {denomData?.label}
       &nbsp;
-      <small>
+      <small className="text-muted-foreground">
         (Exp:&nbsp;
-        <FormattedDate value={new Date(grant.expiration)} />
+        <FormattedDate value={new Date(grant.expiration)} />)
       </small>
-      )
     </div>
   );
 };
diff --git a/deploy-web/src/components/get-started/GetStartedStepper.tsx b/deploy-web/src/components/get-started/GetStartedStepper.tsx
index dceb4fff6..c8e3b0417 100644
--- a/deploy-web/src/components/get-started/GetStartedStepper.tsx
+++ b/deploy-web/src/components/get-started/GetStartedStepper.tsx
@@ -162,7 +162,7 @@ export const GetStartedStepper: React.FunctionComponent<Props> = () => {
           </p>
 
           <p className="text-muted-foreground">For the sake of getting started, we will deploy a simple Next.js app that you can find in the deploy page.</p>
-          <div className="my-4 flex flex-wrap items-center space-x-4">
+          <div className="my-4 flex flex-col flex-wrap items-start space-y-4 sm:flex-row sm:items-center sm:space-x-4 sm:space-y-0">
             <Button variant="default" onClick={handleNext}>
               Next
             </Button>
@@ -171,7 +171,7 @@ export const GetStartedStepper: React.FunctionComponent<Props> = () => {
               <ExternalLink href="https://docs.docker.com/get-started/" text="Learn how" />
             </div>
 
-            <Link href={UrlService.templates()} className={cn("py-4", buttonVariants({ variant: "text" }))}>
+            <Link href={UrlService.templates()} className={cn("py-4", buttonVariants({ variant: "secondary" }))}>
               Explore Marketplace
             </Link>
           </div>
diff --git a/deploy-web/src/components/layout/Layout.tsx b/deploy-web/src/components/layout/Layout.tsx
index 63f675a3b..e65537c9b 100644
--- a/deploy-web/src/components/layout/Layout.tsx
+++ b/deploy-web/src/components/layout/Layout.tsx
@@ -115,8 +115,8 @@ const LayoutApp: React.FunctionComponent<Props> = ({ children, isLoading, isUsin
 
               <div
                 className={cn("ease ml-0 h-full flex-grow transition-[margin-left] duration-300", {
-                  ["sm:ml-[240px]"]: isNavOpen,
-                  ["sm:ml-[57px]"]: !isNavOpen
+                  ["md:ml-[240px]"]: isNavOpen,
+                  ["md:ml-[57px]"]: !isNavOpen
                 })}
               >
                 {isLoading !== undefined && <LinearLoadingSkeleton isLoading={isLoading} />}
diff --git a/deploy-web/src/components/new-deployment/BidRow.tsx b/deploy-web/src/components/new-deployment/BidRow.tsx
index 09e74986e..e532ffbe5 100644
--- a/deploy-web/src/components/new-deployment/BidRow.tsx
+++ b/deploy-web/src/components/new-deployment/BidRow.tsx
@@ -133,7 +133,7 @@ export const BidRow: React.FunctionComponent<Props> = ({ bid, selectedBid, handl
       {gpuModels.length > 0 && (
         <TableCell align="center">
           <div className="space-x">
-            {gpuModels.map((gpu) => (
+            {gpuModels.map(gpu => (
               <Badge key={`${gpu.vendor}-${gpu.model}`} className={cn("px-1 py-0 text-xs")} variant="default">
                 {gpu.vendor}-{gpu.model}
               </Badge>
@@ -198,7 +198,7 @@ export const BidRow: React.FunctionComponent<Props> = ({ bid, selectedBid, handl
           )}
 
           {isSendingManifest && isCurrentBid && (
-            <div className="flex items-center justify-center">
+            <div className="flex items-center justify-center whitespace-nowrap">
               <Badge variant="success">Deploying! 🚀</Badge>
             </div>
           )}
diff --git a/deploy-web/src/components/new-deployment/CreateLease.tsx b/deploy-web/src/components/new-deployment/CreateLease.tsx
index 632923e9c..8d01e86b1 100644
--- a/deploy-web/src/components/new-deployment/CreateLease.tsx
+++ b/deploy-web/src/components/new-deployment/CreateLease.tsx
@@ -89,53 +89,31 @@ export const CreateLease: React.FunctionComponent<Props> = ({ dseq }) => {
     // eslint-disable-next-line react-hooks/exhaustive-deps
   }, []);
 
-  // Filter bids by search
+  // Filter bids
   useEffect(() => {
-    let fBids: string[] = [];
     if ((search || isFilteringFavorites || isFilteringAudited) && providers) {
-      bids?.forEach(bid => {
-        let isAdded = false;
-
-        // Filter for search
-        if (search) {
-          const provider = providers.find(p => p.owner === bid.provider);
-          // Filter by attribute value
-          provider?.attributes.forEach(att => {
-            if (att.value?.toLowerCase().includes(search.toLowerCase())) {
-              fBids.push(bid.id);
-              isAdded = true;
-            }
-          });
-
-          if (!isAdded && provider?.hostUri.includes(search)) {
-            fBids.push(bid.id);
-          }
-        }
+      let filteredBids = [...(bids || [])];
 
-        // Filter for favorites
-        if (!isAdded && !search && isFilteringFavorites) {
-          const provider = favoriteProviders.find(p => p === bid.provider);
+      if (search) {
+        filteredBids = filteredBids.filter(bid => {
+          const provider = providers?.find(p => p.owner === bid.provider);
+          return provider?.attributes.some(att => att.value?.toLowerCase().includes(search.toLowerCase())) || provider?.hostUri.includes(search);
+        });
+      }
 
-          if (provider) {
-            fBids.push(bid.id);
-            isAdded = true;
-          }
-        }
+      if (isFilteringFavorites) {
+        filteredBids = filteredBids.filter(bid => favoriteProviders.some(y => y === bid.provider));
+      }
 
-        // Filter for audited
-        if (!isAdded && !search && isFilteringAudited) {
-          const provider = providers.filter(x => x.isAudited).find(p => p.owner === bid.provider);
+      if (isFilteringAudited) {
+        filteredBids = filteredBids.filter(bid => !!providers.filter(x => x.isAudited).find(p => p.owner === bid.provider));
+      }
 
-          if (provider) {
-            fBids.push(bid.id);
-          }
-        }
-      });
+      setFilteredBids(filteredBids.map(bid => bid.id));
     } else {
-      fBids = bids?.map(b => b.id) || [];
+      setFilteredBids(bids?.map(bid => bid.id) || []);
     }
 
-    setFilteredBids(fBids);
     // eslint-disable-next-line react-hooks/exhaustive-deps
   }, [search, bids, providers, isFilteringFavorites, isFilteringAudited, favoriteProviders]);
 
diff --git a/deploy-web/src/components/new-deployment/ManifestEdit.tsx b/deploy-web/src/components/new-deployment/ManifestEdit.tsx
index 1486fe7ab..2aa48f707 100644
--- a/deploy-web/src/components/new-deployment/ManifestEdit.tsx
+++ b/deploy-web/src/components/new-deployment/ManifestEdit.tsx
@@ -214,14 +214,11 @@ export const ManifestEdit: React.FunctionComponent<Props> = ({ editedManifest, s
 
   return (
     <>
-      <CustomNextSeo
-        title="Create Deployment - Manifest Edit"
-        url={`${domainName}${UrlService.newDeployment({ step: RouteStepKeys.editDeployment })}`}
-      />
+      <CustomNextSeo title="Create Deployment - Manifest Edit" url={`${domainName}${UrlService.newDeployment({ step: RouteStepKeys.editDeployment })}`} />
 
       <div className="mb-2 pt-4">
         <div className="mb-2 flex flex-col items-end justify-between md:flex-row">
-          <div className="flex-grow">
+          <div className="w-full flex-grow">
             <InputWithIcon value={deploymentName} onChange={ev => setDeploymentName(ev.target.value)} label="Name your deployment (optional)" />
           </div>
 
@@ -237,10 +234,10 @@ export const ManifestEdit: React.FunctionComponent<Props> = ({ editedManifest, s
                 </p>
               }
             >
-              <InfoCircle className="mx-4 text-sm text-muted-foreground" />
+              <InfoCircle className="mr-4 text-sm text-muted-foreground md:ml-4" />
             </CustomTooltip>
 
-            <div>
+            <div className="flex-grow">
               <Button
                 variant="default"
                 disabled={isCreatingDeployment || !!parsingError || !editedManifest}
@@ -261,8 +258,15 @@ export const ManifestEdit: React.FunctionComponent<Props> = ({ editedManifest, s
             </div>
           </div>
         </div>
+      </div>
 
-        <Button variant={selectedSdlEditMode === "builder" ? "default" : "outline"} onClick={() => onModeChange("builder")} size="sm" className="rounded-e-none">
+      <div className="mb-2 flex items-center">
+        <Button
+          variant={selectedSdlEditMode === "builder" ? "default" : "outline"}
+          onClick={() => onModeChange("builder")}
+          size="sm"
+          className="flex-grow rounded-e-none sm:flex-grow-0"
+        >
           Builder
         </Button>
         <Button
@@ -270,7 +274,7 @@ export const ManifestEdit: React.FunctionComponent<Props> = ({ editedManifest, s
           color={selectedSdlEditMode === "yaml" ? "secondary" : "primary"}
           onClick={() => onModeChange("yaml")}
           size="sm"
-          className="rounded-s-none"
+          className="flex-grow rounded-s-none sm:flex-grow-0"
         >
           YAML
         </Button>
diff --git a/deploy-web/src/components/providers/ProviderDetail.tsx b/deploy-web/src/components/providers/ProviderDetail.tsx
index 0eab0e4b2..0e425b0c1 100644
--- a/deploy-web/src/components/providers/ProviderDetail.tsx
+++ b/deploy-web/src/components/providers/ProviderDetail.tsx
@@ -166,8 +166,8 @@ export const ProviderDetail: React.FunctionComponent<Props> = ({ owner, _provide
             <div className="mt-4">
               <p className="mb-4">General Info</p>
 
-              <Card className="mb-4 grid grid-cols-1 gap-4 p-4 sm:grid-cols-2">
-                <CardContent>
+              <Card className="mb-4">
+                <CardContent className="mb-4 grid grid-cols-1 gap-4 p-4 sm:grid-cols-2">
                   <div>
                     <LabelValue label="Host" value={provider.host} />
                     <LabelValue label="Website" value={provider.website} />
@@ -191,16 +191,16 @@ export const ProviderDetail: React.FunctionComponent<Props> = ({ owner, _provide
               <ProviderSpecs provider={provider} />
 
               <p className="mb-4 mt-4">Features</p>
-              <Card className="mb-4 grid grid-cols-1 gap-4 p-4 sm:grid-cols-2">
-                <CardContent>
+              <Card className="mb-4">
+                <CardContent className="grid grid-cols-1 gap-4 p-4 sm:grid-cols-2">
                   <div>
                     <LabelValue label="Akash version" value={provider.akashVersion || "Unknown"} />
-                    <LabelValue label="IP Leases" value={provider.featEndpointIp && <Check className="ml-2 text-primary" />} />
-                    <LabelValue label="Chia" value={provider.workloadSupportChia && <Check className="ml-2 text-primary" />} />
+                    <LabelValue label="IP Leases" value={provider.featEndpointIp && <Check className="ml-0 text-primary sm:ml-2" />} />
+                    <LabelValue label="Chia" value={provider.workloadSupportChia && <Check className="ml-0 text-primary sm:ml-2" />} />
                   </div>
                   <div>
                     <LabelValue label="Kube version" value={provider.kube ? `${provider.kube?.major}.${provider.kube?.minor}` : "Unkown"} />
-                    <LabelValue label="Custom domain" value={provider.featEndpointCustomDomain && <Check className="ml-2 text-primary" />} />
+                    <LabelValue label="Custom domain" value={provider.featEndpointCustomDomain && <Check className="ml-0 text-primary sm:ml-2" />} />
                     <LabelValue label="Chia capabilities" value={provider.workloadSupportChiaCapabilities} />
                   </div>
                 </CardContent>
@@ -208,8 +208,8 @@ export const ProviderDetail: React.FunctionComponent<Props> = ({ owner, _provide
 
               <p className="mb-4">Stats</p>
 
-              <Card className="mb-4 p-4">
-                <CardContent>
+              <Card className="mb-4">
+                <CardContent className="p-4">
                   <LabelValue label="Deployments" value={provider.deploymentCount} />
                   <LabelValue label="Leases" value={provider.leaseCount} />
                   <LabelValue label="Orders" value={provider.orderCount || "0"} />
@@ -219,8 +219,8 @@ export const ProviderDetail: React.FunctionComponent<Props> = ({ owner, _provide
             </div>
 
             <p className="mb-4">Raw attributes</p>
-            <Card className="p-4">
-              <CardContent>
+            <Card>
+              <CardContent className="p-4">
                 {provider.attributes.map(x => (
                   <LabelValue key={x.key} label={x.key} value={x.value} />
                 ))}
diff --git a/deploy-web/src/components/providers/ProviderList.tsx b/deploy-web/src/components/providers/ProviderList.tsx
index d48b5452d..23ad85e03 100644
--- a/deploy-web/src/components/providers/ProviderList.tsx
+++ b/deploy-web/src/components/providers/ProviderList.tsx
@@ -232,7 +232,7 @@ export const ProviderList: React.FunctionComponent<Props> = ({}) => {
                 </div>
               </div>
 
-              <div className="flex items-center md:ml-8">
+              <div className="my-2 flex items-center md:ml-8 md:my-0">
                 <div>
                   <CheckboxWithLabel checked={isFilteringActive} onCheckedChange={onIsFilteringActiveClick} label="Active" />
                 </div>
@@ -245,7 +245,7 @@ export const ProviderList: React.FunctionComponent<Props> = ({}) => {
               </div>
             </div>
 
-            <div className="my-2 flex flex-col items-center md:flex-row md:space-x-2">
+            <div className="my-2 flex flex-col items-center space-y-2 md:flex-row md:space-x-2 md:space-y-0">
               <InputWithIcon
                 label="Search Providers"
                 value={search}
@@ -261,7 +261,7 @@ export const ProviderList: React.FunctionComponent<Props> = ({}) => {
                 }
               />
 
-              <div className="min-w-[200px]">
+              <div className="w-full min-w-[200px] md:w-auto">
                 <Label>Sort by</Label>
                 <Select value={sort} onValueChange={handleSortChange}>
                   <SelectTrigger>
@@ -282,8 +282,8 @@ export const ProviderList: React.FunctionComponent<Props> = ({}) => {
 
             <ProviderTable providers={currentPageProviders} sortOption={sort} />
 
-            {search && currentPageProviders.length === 0 && (
-              <div className="p-4">
+            {currentPageProviders.length === 0 && (
+              <div className="p-4 text-center">
                 <p>No provider found.</p>
               </div>
             )}
diff --git a/deploy-web/src/components/sdl/EnvFormModal.tsx b/deploy-web/src/components/sdl/EnvFormModal.tsx
index bcaefce04..9a83e84ac 100644
--- a/deploy-web/src/components/sdl/EnvFormModal.tsx
+++ b/deploy-web/src/components/sdl/EnvFormModal.tsx
@@ -9,7 +9,7 @@ import { FormInput } from "../ui/input";
 import { Bin } from "iconoir-react";
 import { Button } from "../ui/button";
 import { Switch } from "../ui/switch";
-import { CustomTooltip } from "../shared/CustomTooltip";
+import { CustomNoDivTooltip, CustomTooltip } from "../shared/CustomTooltip";
 import { FormPaper } from "./FormPaper";
 
 type Props = {
@@ -139,7 +139,7 @@ export const EnvFormModal: React.FunctionComponent<Props> = ({ control, serviceI
                     control={control}
                     name={`services.${serviceIndex}.env.${envIndex}.isSecret`}
                     render={({ field }) => (
-                      <CustomTooltip
+                      <CustomNoDivTooltip
                         title={
                           <>
                             <p>
@@ -151,8 +151,8 @@ export const EnvFormModal: React.FunctionComponent<Props> = ({ control, serviceI
                           </>
                         }
                       >
-                        <Switch checked={field.value || false} onCheckedChange={field.onChange} />
-                      </CustomTooltip>
+                        <Switch checked={!!field.value} onCheckedChange={field.onChange} />
+                      </CustomNoDivTooltip>
                     )}
                   />
                 )}
diff --git a/deploy-web/src/components/settings/CertificateDisplay.tsx b/deploy-web/src/components/settings/CertificateDisplay.tsx
index 7151db11d..f99180556 100644
--- a/deploy-web/src/components/settings/CertificateDisplay.tsx
+++ b/deploy-web/src/components/settings/CertificateDisplay.tsx
@@ -44,9 +44,9 @@ export function CertificateDisplay() {
               {selectedCertificate ? (
                 <span>
                   Current certificate:{" "}
-                  <div className="inline-flex items-center text-xs font-bold text-primary">
+                  <span className="inline-flex items-center text-xs font-bold text-primary">
                     {selectedCertificate.serial} <Check color="secondary" className="ml-2" />
-                  </div>
+                  </span>
                 </span>
               ) : (
                 "No local certificate."
diff --git a/deploy-web/src/components/shared/CustomPagination.tsx b/deploy-web/src/components/shared/CustomPagination.tsx
index 256a88844..3482e7105 100644
--- a/deploy-web/src/components/shared/CustomPagination.tsx
+++ b/deploy-web/src/components/shared/CustomPagination.tsx
@@ -12,35 +12,32 @@ interface Props {
 
 export function CustomPagination({ pageIndex, totalPageCount, pageSize, setPageSize, setPageIndex }: React.PropsWithChildren<Props>) {
   return (
-    <div className="flex flex-col items-center justify-between px-2 sm:flex-row">
-      <div className="flex items-center space-x-6 lg:space-x-8">
-        <div className="flex items-center space-x-2">
-          <p className="text-xs">Rows per page</p>
-          <Select
-            value={`${pageSize}`}
-            onValueChange={value => {
-              setPageSize(Number(value));
-            }}
-          >
-            <SelectTrigger className="h-8 w-[70px]">
-              <SelectValue placeholder={pageSize} />
-            </SelectTrigger>
-            <SelectContent side="top">
-              {[10, 20, 30, 40, 50].map((val, i) => (
-                <SelectItem key={i} value={`${val}`}>
-                  {val}
-                </SelectItem>
-              ))}
-            </SelectContent>
-          </Select>
-        </div>
-        <div className="flex flex-col sm:flex-row sm:space-x-2">
-          <div className="mb-2 flex items-center justify-center whitespace-nowrap text-xs sm:mb-0">
-            Page {pageIndex + 1} of {totalPageCount}
-          </div>
-
-          <Paginator currentPage={pageIndex + 1} totalPages={totalPageCount} onPageChange={pageNumber => setPageIndex(pageNumber - 1)} showPreviousNext />
-        </div>
+    <div className="flex flex-col items-center justify-between px-2 md:flex-row md:space-x-4">
+      <div className="flex items-center space-x-2">
+        <p className="text-xs">Rows per page</p>
+        <Select
+          value={`${pageSize}`}
+          onValueChange={value => {
+            setPageSize(Number(value));
+          }}
+        >
+          <SelectTrigger className="h-8 w-[70px]">
+            <SelectValue placeholder={pageSize} />
+          </SelectTrigger>
+          <SelectContent side="top">
+            {[10, 20, 30, 40, 50].map((val, i) => (
+              <SelectItem key={i} value={`${val}`}>
+                {val}
+              </SelectItem>
+            ))}
+          </SelectContent>
+        </Select>
+      </div>
+      <div className="my-4 flex items-center justify-center whitespace-nowrap text-xs md:my-0">
+        Page {pageIndex + 1} of {totalPageCount}
+      </div>
+      <div>
+        <Paginator currentPage={pageIndex + 1} totalPages={totalPageCount} onPageChange={pageNumber => setPageIndex(pageNumber - 1)} showPreviousNext />
       </div>
     </div>
   );
diff --git a/deploy-web/src/components/shared/Pagninator.tsx b/deploy-web/src/components/shared/Pagninator.tsx
index f273e6343..0e576e332 100644
--- a/deploy-web/src/components/shared/Pagninator.tsx
+++ b/deploy-web/src/components/shared/Pagninator.tsx
@@ -13,13 +13,13 @@ export default function Paginator({ currentPage, totalPages, onPageChange, showP
     <Pagination>
       <PaginationContent>
         {showPreviousNext && totalPages ? (
-          <PaginationItem>
+          <PaginationItem className="hidden sm:list-item">
             <PaginationPrevious onClick={() => onPageChange(currentPage - 1)} disabled={currentPage - 1 < 1} />
           </PaginationItem>
         ) : null}
         {generatePaginationLinks(currentPage, totalPages, onPageChange)}
         {showPreviousNext && totalPages ? (
-          <PaginationItem>
+          <PaginationItem className="hidden sm:list-item">
             <PaginationNext onClick={() => onPageChange(currentPage + 1)} disabled={currentPage > totalPages - 1} />
           </PaginationItem>
         ) : null}
diff --git a/deploy-web/src/components/shared/Popup.tsx b/deploy-web/src/components/shared/Popup.tsx
index 376ca43f5..1c24fb0ba 100644
--- a/deploy-web/src/components/shared/Popup.tsx
+++ b/deploy-web/src/components/shared/Popup.tsx
@@ -7,7 +7,7 @@ import { DialogProps } from "@radix-ui/react-dialog";
 import Spinner from "./Spinner";
 import { InputWithIcon } from "../ui/input";
 import { cn } from "@src/utils/styleUtils";
-import { ScrollArea } from "../ui/scroll-area";
+import { ScrollArea, ScrollBar } from "../ui/scroll-area";
 
 type MessageProps = {
   variant: "message";
@@ -45,7 +45,6 @@ type CommonProps = {
   maxWidth?: false | "xs" | "sm" | "md" | "lg" | "xl";
   dialogProps?: Partial<DialogProps>;
   fixedTopPosition?: boolean;
-  fixedTopPositionHeight?: "10%" | "15%" | "20%" | "25%";
   enableCloseOnBackdropClick?: boolean;
   hideCloseButton?: boolean;
 };
@@ -56,7 +55,6 @@ export type ActionButton = ButtonProps & {
   label: string | React.ReactNode;
   side: ActionButtonSide;
   isLoading?: boolean;
-  isLoadingColor?: "inherit" | "primary" | "secondary" | "success" | "error" | "info" | "warning";
 };
 
 export type PopupProps = (MessageProps | ConfirmProps | PromptProps | CustomPrompt) & CommonProps;
@@ -102,6 +100,7 @@ export function Popup(props: React.PropsWithChildren<PopupProps>) {
     component.push(
       <ScrollArea className="max-h-[75vh]" key="dialog-content">
         {props.message}
+        <ScrollBar orientation="horizontal" />
       </ScrollArea>
     );
   } else {
@@ -120,6 +119,7 @@ export function Popup(props: React.PropsWithChildren<PopupProps>) {
             props.children
           )}
         </div>
+        <ScrollBar orientation="horizontal" />
       </ScrollArea>
     );
   }
@@ -194,38 +194,20 @@ export function Popup(props: React.PropsWithChildren<PopupProps>) {
     case "custom": {
       const leftButtons = props.actions
         ?.filter(x => x.side === "left")
-        .map(({ isLoading, isLoadingColor, side, label, ...rest }, idx) => (
+        .map(({ isLoading, side, label, ...rest }, idx) => (
           <Button key={`dialog-action-button-${idx}`} {...rest}>
-            {isLoading ? (
-              <Spinner
-                size="small"
-                // TODO
-                // color={isLoadingColor ? isLoadingColor : "secondary"}
-                // sx={{ color: !isLoadingColor && rest.color === "secondary" ? theme.palette.secondary.contrastText : "" }}
-              />
-            ) : (
-              label
-            )}
+            {isLoading ? <Spinner size="small" /> : label}
           </Button>
         ));
       const rightButtons = props.actions
         ?.filter(x => x.side === "right")
-        .map(({ isLoading, isLoadingColor, side, label, ...rest }, idx) => (
+        .map(({ isLoading, side, label, ...rest }, idx) => (
           <Button key={`dialog-action-button-${idx}`} {...rest}>
-            {isLoading ? (
-              <Spinner
-                size="small"
-                // TODO
-                // color={isLoadingColor ? isLoadingColor : "secondary"}
-                // sx={{ color: !isLoadingColor && rest.color === "secondary" ? theme.palette.secondary.contrastText : "" }}
-              />
-            ) : (
-              label
-            )}
+            {isLoading ? <Spinner size="small" /> : label}
           </Button>
         ));
       component.push(
-        <DialogFooter className="flex justify-between space-x-2 sm:justify-between" key="DialogCustomActions">
+        <DialogFooter className="flex justify-between space-x-2 sm:justify-between flex-row" key="DialogCustomActions">
           <div className="space-x-2">{leftButtons}</div>
           <div className="space-x-2">{rightButtons}</div>
         </DialogFooter>
@@ -234,31 +216,11 @@ export function Popup(props: React.PropsWithChildren<PopupProps>) {
     }
   }
 
-  // const getFixedPositionHeightClass = () => {
-  //   switch (props.fixedTopPositionHeight) {
-  //     case "10%":
-  //       return classes.fixedTopPosition10;
-  //     case "15%":
-  //       return classes.fixedTopPosition15;
-  //     case "20%":
-  //       return classes.fixedTopPosition20;
-  //     case "25%":
-  //       return classes.fixedTopPosition25;
-
-  //     default:
-  //       break;
-  //   }
-  // };
-
   /**
    * Prevent close because of click on backdrop unless enabled through the setting 'enableCloseOnBackdropClick'.
    */
   const handleOnClose = (open: boolean) => {
-    // if ((props.enableCloseOnBackdropClick || reason !== "backdropClick") && props.onClose) {
-    //   props.onClose();
-    // }
     if (!open && props.onClose) {
-      // TODO
       props.onClose(null, "action");
     }
   };
@@ -267,8 +229,6 @@ export function Popup(props: React.PropsWithChildren<PopupProps>) {
     <Dialog key="Dialog" {...dialogProps} onOpenChange={handleOnClose}>
       <ErrorBoundary FallbackComponent={ErrorFallback}>
         <DialogContent
-          // TODO sizes
-          // dividers={props.dividers}
           className={cn("m-0 p-4", {
             ["sm:max-w-[400px]"]: props.maxWidth === "xs",
             ["sm:max-w-[600px]"]: props.maxWidth === "sm",
diff --git a/deploy-web/src/components/shared/SpecDetail.tsx b/deploy-web/src/components/shared/SpecDetail.tsx
index 58fb59c95..3eaf4c22d 100644
--- a/deploy-web/src/components/shared/SpecDetail.tsx
+++ b/deploy-web/src/components/shared/SpecDetail.tsx
@@ -35,10 +35,10 @@ export function SpecDetail({
 
   return (
     <div
-      className={cn("flex items-center", {
-        ["space-x-1"]: gutterSize === "small",
-        ["space-x-2"]: gutterSize === "medium",
-        ["space-x-3"]: gutterSize === "large"
+      className={cn("flex flex-col items-start space-y-1 sm:flex-row sm:items-center sm:space-y-0", {
+        ["sm:space-x-1"]: gutterSize === "small",
+        ["sm:space-x-2"]: gutterSize === "medium",
+        ["sm:space-x-3"]: gutterSize === "large"
       })}
     >
       <Badge className={badgeClasses} variant="outline">
diff --git a/deploy-web/src/components/ui/switch.tsx b/deploy-web/src/components/ui/switch.tsx
index e40f36c17..d20a318fe 100644
--- a/deploy-web/src/components/ui/switch.tsx
+++ b/deploy-web/src/components/ui/switch.tsx
@@ -9,7 +9,7 @@ const Switch = React.forwardRef<React.ElementRef<typeof SwitchPrimitives.Root>,
   ({ className, ...props }, ref) => (
     <SwitchPrimitives.Root
       className={cn(
-        "peer inline-flex h-6 w-11 shrink-0 cursor-pointer items-center rounded-full border-2 border-transparent transition-colors data-[state=checked]:bg-primary data-[state=unchecked]:bg-input focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 focus-visible:ring-offset-background disabled:cursor-not-allowed disabled:opacity-50",
+        "peer inline-flex h-6 w-11 shrink-0 cursor-pointer items-center rounded-full border-2 border-transparent transition-colors aria-[checked=true]:bg-primary aria-[checked=false]:bg-input focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 focus-visible:ring-offset-background disabled:cursor-not-allowed disabled:opacity-50",
         className
       )}
       {...props}
diff --git a/deploy-web/src/context/WalletProvider/WalletProvider.tsx b/deploy-web/src/context/WalletProvider/WalletProvider.tsx
index 99a90a6de..202d07fd6 100644
--- a/deploy-web/src/context/WalletProvider/WalletProvider.tsx
+++ b/deploy-web/src/context/WalletProvider/WalletProvider.tsx
@@ -12,7 +12,7 @@ import { UrlService } from "@src/utils/urlUtils";
 import { useSettings } from "../SettingsProvider";
 import axios from "axios";
 import { useUsdcDenom } from "@src/hooks/useDenom";
-import { getSelectedNetwork } from "@src/hooks/useSelectedNetwork";
+import { getSelectedNetwork, useSelectedNetwork } from "@src/hooks/useSelectedNetwork";
 import { LocalWalletDataType } from "@src/utils/walletUtils";
 import { useSelectedChain } from "../CustomChainProvider";
 import { customRegistry } from "@src/utils/customRegistry";
@@ -132,10 +132,6 @@ export const WalletProvider = ({ children }) => {
   // Update balances on wallet address change
   useEffect(() => {
     if (walletAddress) {
-      // Redirect to deployment list if on deployment detail page
-      if (pathname?.startsWith("/deployments/")) {
-        router.push(UrlService.deploymentList());
-      }
       loadWallet();
     }
   }, [walletAddress]);
@@ -328,7 +324,8 @@ export function useWallet() {
 }
 
 const TransactionSnackbarContent = ({ snackMessage, transactionHash }) => {
-  const txUrl = transactionHash && `https://stats.akash.network/transactions/${transactionHash}`;
+  const selectedNetwork = useSelectedNetwork();
+  const txUrl = transactionHash && `https://stats.akash.network/transactions/${transactionHash}?network=${selectedNetwork.id}`;
 
   return (
     <>