From 9efeb287e75768ee4838445745bb20de28e93db5 Mon Sep 17 00:00:00 2001
From: Rithvik-padma <rithvik.padma@gmail.com>
Date: Fri, 8 Sep 2023 02:11:43 +0530
Subject: [PATCH 1/2] fix: shift-confirm-cancel-buttons-to-bottom

---
 src/app/screens/LNURLPay/index.tsx | 11 +++++++----
 1 file changed, 7 insertions(+), 4 deletions(-)

diff --git a/src/app/screens/LNURLPay/index.tsx b/src/app/screens/LNURLPay/index.tsx
index 35d26a0326..8512ad88cf 100644
--- a/src/app/screens/LNURLPay/index.tsx
+++ b/src/app/screens/LNURLPay/index.tsx
@@ -406,14 +406,17 @@ function LNURLPay() {
         {!successAction ? (
           <>
             <div className="grow overflow-y-auto no-scrollbar">
-              <Container maxWidth="sm">
+              <Container justifyBetween maxWidth="sm">
                 <PublisherCard
                   title={navState.origin?.name}
                   description={getRecipient()}
                   image={navState.origin?.icon || getImage()}
                 />
-                <form onSubmit={handleSubmit}>
-                  <fieldset disabled={loadingConfirm}>
+                <form onSubmit={handleSubmit} className="h-full">
+                  <fieldset
+                    disabled={loadingConfirm}
+                    className="h-full relative"
+                  >
                     <dl className="mt-4 overflow-hidden">
                       <>
                         {formattedMetadata(details.metadata).map(
@@ -517,7 +520,7 @@ function LNURLPay() {
                         )}
                       </div>
                     )}
-                    <div className="mt-2 dark:border-white/10">
+                    <div className="absolute bottom-0 w-full dark:border-white/10">
                       <ConfirmOrCancel
                         isFocused={false}
                         label={tCommon("actions.confirm")}

From 4c0fa74c57f6c3e28b439a7f04840d2d7b07a660 Mon Sep 17 00:00:00 2001
From: Rithvik-padma <rithvik.padma@gmail.com>
Date: Fri, 8 Sep 2023 16:44:03 +0530
Subject: [PATCH 2/2] fix: modify-without-absolute-positioning

---
 src/app/screens/LNURLPay/index.tsx | 203 +++++++++++++++--------------
 1 file changed, 103 insertions(+), 100 deletions(-)

diff --git a/src/app/screens/LNURLPay/index.tsx b/src/app/screens/LNURLPay/index.tsx
index 8512ad88cf..bc68de8724 100644
--- a/src/app/screens/LNURLPay/index.tsx
+++ b/src/app/screens/LNURLPay/index.tsx
@@ -415,112 +415,115 @@ function LNURLPay() {
                 <form onSubmit={handleSubmit} className="h-full">
                   <fieldset
                     disabled={loadingConfirm}
-                    className="h-full relative"
+                    className="h-full flex flex-col justify-between"
                   >
-                    <dl className="mt-4 overflow-hidden">
-                      <>
-                        {formattedMetadata(details.metadata).map(
-                          ([dt, dd], i) => (
-                            <Fragment key={`element-${i}`}>
-                              <Dt>{dt}</Dt>
-                              <Dd>{dd}</Dd>
-                            </Fragment>
-                          )
-                        )}
-                        {details.minSendable === details.maxSendable && (
-                          <>
-                            <Dt>{t("amount.label")}</Dt>
-                            <Dd>
-                              {getFormattedSats(
-                                Math.floor(+details.minSendable / 1000)
-                              )}
-                            </Dd>
-                          </>
-                        )}
-                      </>
-                    </dl>
-                    {details && details.minSendable !== details.maxSendable && (
-                      <div>
-                        <DualCurrencyField
-                          autoFocus
-                          id="amount"
-                          label={t("amount.label")}
-                          min={amountMin}
-                          max={amountMax}
-                          rangeExceeded={rangeExceeded}
-                          value={valueSat}
-                          onChange={(e) => setValueSat(e.target.value)}
-                          fiatValue={fiatValue}
-                          hint={`${tCommon("balance")}: ${auth
-                            ?.balancesDecorated?.accountBalance}`}
-                          amountExceeded={amountExceeded}
-                        />
-                        <SatButtons
-                          min={amountMin}
-                          max={amountMax}
-                          onClick={setValueSat}
-                          disabled={loadingConfirm}
-                        />
-                      </div>
-                    )}
-
-                    {showCommentField() && (
-                      <div className="mt-4">
-                        <TextField
-                          id="comment"
-                          label={t("comment.label")}
-                          placeholder={tCommon("optional")}
-                          onChange={(e) => {
-                            setComment(e.target.value);
-                          }}
-                        />
-                      </div>
-                    )}
-
-                    {(showNameField() || showEmailField()) && (
-                      <div className="flex justify-center mt-4">
-                        <Hyperlink onClick={toggleShowMoreFields}>
-                          {tCommon("actions.more")}{" "}
-                          {showMoreFields ? (
-                            <CaretUpIcon className="h-4 w-4 inline-flex" />
-                          ) : (
-                            <CaretDownIcon className="h-4 w-4 inline-flex" />
+                    <div>
+                      <dl className="mt-4 overflow-hidden">
+                        <>
+                          {formattedMetadata(details.metadata).map(
+                            ([dt, dd], i) => (
+                              <Fragment key={`element-${i}`}>
+                                <Dt>{dt}</Dt>
+                                <Dd>{dd}</Dd>
+                              </Fragment>
+                            )
+                          )}
+                          {details.minSendable === details.maxSendable && (
+                            <>
+                              <Dt>{t("amount.label")}</Dt>
+                              <Dd>
+                                {getFormattedSats(
+                                  Math.floor(+details.minSendable / 1000)
+                                )}
+                              </Dd>
+                            </>
                           )}
-                        </Hyperlink>
-                      </div>
-                    )}
-
-                    {showMoreFields && (
-                      <div className="mb-4">
-                        {showNameField() && (
-                          <div className="mt-4">
-                            <TextField
-                              id="name"
-                              label={t("name.label")}
-                              placeholder={tCommon("optional")}
-                              value={userName}
-                              onChange={(e) => {
-                                setUserName(e.target.value);
-                              }}
+                        </>
+                      </dl>
+                      {details &&
+                        details.minSendable !== details.maxSendable && (
+                          <div>
+                            <DualCurrencyField
+                              autoFocus
+                              id="amount"
+                              label={t("amount.label")}
+                              min={amountMin}
+                              max={amountMax}
+                              rangeExceeded={rangeExceeded}
+                              value={valueSat}
+                              onChange={(e) => setValueSat(e.target.value)}
+                              fiatValue={fiatValue}
+                              hint={`${tCommon("balance")}: ${auth
+                                ?.balancesDecorated?.accountBalance}`}
+                              amountExceeded={amountExceeded}
                             />
-                          </div>
-                        )}
-                        {showEmailField() && (
-                          <div className="mt-4">
-                            <TextField
-                              id="email"
-                              label={t("email.label")}
-                              placeholder={tCommon("optional")}
-                              value={userEmail}
-                              onChange={(e) => {
-                                setUserEmail(e.target.value);
-                              }}
+                            <SatButtons
+                              min={amountMin}
+                              max={amountMax}
+                              onClick={setValueSat}
+                              disabled={loadingConfirm}
                             />
                           </div>
                         )}
-                      </div>
-                    )}
-                    <div className="absolute bottom-0 w-full dark:border-white/10">
+
+                      {showCommentField() && (
+                        <div className="mt-4">
+                          <TextField
+                            id="comment"
+                            label={t("comment.label")}
+                            placeholder={tCommon("optional")}
+                            onChange={(e) => {
+                              setComment(e.target.value);
+                            }}
+                          />
+                        </div>
+                      )}
+
+                      {(showNameField() || showEmailField()) && (
+                        <div className="flex justify-center mt-4">
+                          <Hyperlink onClick={toggleShowMoreFields}>
+                            {tCommon("actions.more")}{" "}
+                            {showMoreFields ? (
+                              <CaretUpIcon className="h-4 w-4 inline-flex" />
+                            ) : (
+                              <CaretDownIcon className="h-4 w-4 inline-flex" />
+                            )}
+                          </Hyperlink>
+                        </div>
+                      )}
+
+                      {showMoreFields && (
+                        <div className="mb-4">
+                          {showNameField() && (
+                            <div className="mt-4">
+                              <TextField
+                                id="name"
+                                label={t("name.label")}
+                                placeholder={tCommon("optional")}
+                                value={userName}
+                                onChange={(e) => {
+                                  setUserName(e.target.value);
+                                }}
+                              />
+                            </div>
+                          )}
+                          {showEmailField() && (
+                            <div className="mt-4">
+                              <TextField
+                                id="email"
+                                label={t("email.label")}
+                                placeholder={tCommon("optional")}
+                                value={userEmail}
+                                onChange={(e) => {
+                                  setUserEmail(e.target.value);
+                                }}
+                              />
+                            </div>
+                          )}
+                        </div>
+                      )}
+                    </div>
+                    <div className="mt-2 dark:border-white/10">
                       <ConfirmOrCancel
                         isFocused={false}
                         label={tCommon("actions.confirm")}