fix: margins on homescreen + basic styles of disabled website

Author: reneaaron

src/app/screens/Home/DefaultView/index.tsx

@@ -1,5 +1,4 @@
 import { ArrowRightIcon } from "@bitcoin-design/bitcoin-icons-react/filled";
-import Button from "@components/Button";
 import Loading from "@components/Loading";
 import TransactionsTable from "@components/TransactionsTable";
 import {
@@ -12,7 +11,9 @@ import relativeTime from "dayjs/plugin/relativeTime";
 import { FC, useEffect, useState } from "react";
 import { useTranslation } from "react-i18next";
 import { useNavigate } from "react-router-dom";
+import Alert from "~/app/components/Alert";
 import BalanceBox from "~/app/components/BalanceBox";
+import Button from "~/app/components/Button";
 import Hyperlink from "~/app/components/Hyperlink";
 import { IconLinkCard } from "~/app/components/IconLinkCard/IconLinkCard";
 import SkeletonLoader from "~/app/components/SkeletonLoader";
@@ -116,7 +117,26 @@ const DefaultView: FC<Props> = (props) => {
       {props.renderPublisherWidget && !!props.lnDataFromCurrentTab?.length && (
         <PublisherLnData lnData={props.lnDataFromCurrentTab[0]} />
       )}
+
       <div className="p-4">
+        {isBlockedUrl && (
+          <div className="items-center dark:text-white text-sm mb-4">
+            <Alert type="info">
+              <p className="pb-2">
+                {t("default_view.is_blocked_hint", {
+                  host: props.currentUrl?.host,
+                })}
+              </p>
+              <Button
+                fullWidth
+                label={t("actions.enable_now")}
+                direction="column"
+                onClick={() => unblock()}
+              />
+            </Alert>
+          </div>
+        )}
+
         <BalanceBox />
         {(accountLoading || lightningAddress) && (
           <div className="flex justify-center">
@@ -163,22 +183,6 @@ const DefaultView: FC<Props> = (props) => {
           </HomeButton>
         </div>
 
-        {isBlockedUrl && (
-          <div className="mb-2 items-center py-3 dark:text-white">
-            <p className="py-1">
-              {t("default_view.is_blocked_hint", {
-                host: props.currentUrl?.host,
-              })}
-            </p>
-            <Button
-              fullWidth
-              label={t("actions.enable_now")}
-              direction="column"
-              onClick={() => unblock()}
-            />
-          </div>
-        )}
-
         {isLoading && (
           <div className="flex justify-center mt-4">
             <Loading />
@@ -187,7 +191,7 @@ const DefaultView: FC<Props> = (props) => {
 
         {!isLoading && (
           <div>
-            <div className="flex flex-col gap-2 md:gap-3">
+            <div className="flex flex-col mt-4 gap-2 md:gap-3">
               {transactions.length == 0 && (
                 <IconLinkCard
                   title={t("default_view.actions.get_started.title")}