diff --git a/.changelog/1915.bugfix.md b/.changelog/1915.bugfix.md
new file mode 100644
index 0000000000..a4a18eb65f
--- /dev/null
+++ b/.changelog/1915.bugfix.md
@@ -0,0 +1 @@
+Show debondable amount next to debonding input
diff --git a/src/app/components/ReclaimEscrowForm/__tests__/__snapshots__/index.test.tsx.snap b/src/app/components/ReclaimEscrowForm/__tests__/__snapshots__/index.test.tsx.snap
index 0133361382..24e939c10a 100644
--- a/src/app/components/ReclaimEscrowForm/__tests__/__snapshots__/index.test.tsx.snap
+++ b/src/app/components/ReclaimEscrowForm/__tests__/__snapshots__/index.test.tsx.snap
@@ -15,7 +15,26 @@ exports[` should match snapshot 1`] = `
flex-direction: column;
}
-.c8 {
+.c7 {
+ display: -webkit-box;
+ display: -webkit-flex;
+ display: -ms-flexbox;
+ display: flex;
+ box-sizing: border-box;
+ max-width: 100%;
+ margin-top: 6px;
+ -webkit-align-items: flex-end;
+ -webkit-box-align: flex-end;
+ -ms-flex-align: flex-end;
+ align-items: flex-end;
+ min-width: 0;
+ min-height: 0;
+ -webkit-flex-direction: column;
+ -ms-flex-direction: column;
+ flex-direction: column;
+}
+
+.c10 {
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
@@ -27,6 +46,7 @@ exports[` should match snapshot 1`] = `
-webkit-flex-direction: row;
-ms-flex-direction: row;
flex-direction: row;
+ height: 50px;
}
.c1 {
@@ -44,7 +64,7 @@ exports[` should match snapshot 1`] = `
padding-top: 12px;
}
-.c9 {
+.c11 {
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
@@ -60,7 +80,7 @@ exports[` should match snapshot 1`] = `
height: 100%;
}
-.c11 {
+.c13 {
-webkit-flex: 0 0 auto;
-ms-flex: 0 0 auto;
flex: 0 0 auto;
@@ -70,7 +90,7 @@ exports[` should match snapshot 1`] = `
width: 24px;
}
-.c7 {
+.c9 {
-webkit-flex: 0 0 auto;
-ms-flex: 0 0 auto;
flex: 0 0 auto;
@@ -87,7 +107,13 @@ exports[` should match snapshot 1`] = `
font-weight: 600;
}
-.c10 {
+.c8 {
+ font-size: 14px;
+ line-height: 20px;
+ font-weight: bolder;
+}
+
+.c12 {
display: inline-block;
box-sizing: border-box;
cursor: pointer;
@@ -122,51 +148,51 @@ exports[` should match snapshot 1`] = `
font-weight: bold;
}
-.c10:hover {
+.c12:hover {
box-shadow: 0px 0px 0px 2px #0500e2;
}
-.c10:focus {
+.c12:focus {
outline: none;
box-shadow: 0 0 2px 2px #00A9FF;
}
-.c10:focus > circle,
-.c10:focus > ellipse,
-.c10:focus > line,
-.c10:focus > path,
-.c10:focus > polygon,
-.c10:focus > polyline,
-.c10:focus > rect {
+.c12:focus > circle,
+.c12:focus > ellipse,
+.c12:focus > line,
+.c12:focus > path,
+.c12:focus > polygon,
+.c12:focus > polyline,
+.c12:focus > rect {
outline: none;
box-shadow: 0 0 2px 2px #00A9FF;
}
-.c10:focus::-moz-focus-inner {
+.c12:focus::-moz-focus-inner {
border: 0;
}
-.c10:focus:not(:focus-visible) {
+.c12:focus:not(:focus-visible) {
outline: none;
box-shadow: none;
}
-.c10:focus:not(:focus-visible) > circle,
-.c10:focus:not(:focus-visible) > ellipse,
-.c10:focus:not(:focus-visible) > line,
-.c10:focus:not(:focus-visible) > path,
-.c10:focus:not(:focus-visible) > polygon,
-.c10:focus:not(:focus-visible) > polyline,
-.c10:focus:not(:focus-visible) > rect {
+.c12:focus:not(:focus-visible) > circle,
+.c12:focus:not(:focus-visible) > ellipse,
+.c12:focus:not(:focus-visible) > line,
+.c12:focus:not(:focus-visible) > path,
+.c12:focus:not(:focus-visible) > polygon,
+.c12:focus:not(:focus-visible) > polyline,
+.c12:focus:not(:focus-visible) > rect {
outline: none;
box-shadow: none;
}
-.c10:focus:not(:focus-visible)::-moz-focus-inner {
+.c12:focus:not(:focus-visible)::-moz-focus-inner {
border: 0;
}
-.c12 {
+.c14 {
display: inline-block;
box-sizing: border-box;
cursor: pointer;
@@ -198,47 +224,47 @@ exports[` should match snapshot 1`] = `
font-weight: bold;
}
-.c12:hover {
+.c14:hover {
box-shadow: 0px 0px 0px 2px #0500e2;
}
-.c12:focus {
+.c14:focus {
outline: none;
box-shadow: 0 0 2px 2px #00A9FF;
}
-.c12:focus > circle,
-.c12:focus > ellipse,
-.c12:focus > line,
-.c12:focus > path,
-.c12:focus > polygon,
-.c12:focus > polyline,
-.c12:focus > rect {
+.c14:focus > circle,
+.c14:focus > ellipse,
+.c14:focus > line,
+.c14:focus > path,
+.c14:focus > polygon,
+.c14:focus > polyline,
+.c14:focus > rect {
outline: none;
box-shadow: 0 0 2px 2px #00A9FF;
}
-.c12:focus::-moz-focus-inner {
+.c14:focus::-moz-focus-inner {
border: 0;
}
-.c12:focus:not(:focus-visible) {
+.c14:focus:not(:focus-visible) {
outline: none;
box-shadow: none;
}
-.c12:focus:not(:focus-visible) > circle,
-.c12:focus:not(:focus-visible) > ellipse,
-.c12:focus:not(:focus-visible) > line,
-.c12:focus:not(:focus-visible) > path,
-.c12:focus:not(:focus-visible) > polygon,
-.c12:focus:not(:focus-visible) > polyline,
-.c12:focus:not(:focus-visible) > rect {
+.c14:focus:not(:focus-visible) > circle,
+.c14:focus:not(:focus-visible) > ellipse,
+.c14:focus:not(:focus-visible) > line,
+.c14:focus:not(:focus-visible) > path,
+.c14:focus:not(:focus-visible) > polygon,
+.c14:focus:not(:focus-visible) > polyline,
+.c14:focus:not(:focus-visible) > rect {
outline: none;
box-shadow: none;
}
-.c12:focus:not(:focus-visible)::-moz-focus-inner {
+.c14:focus:not(:focus-visible)::-moz-focus-inner {
border: 0;
}
@@ -366,6 +392,12 @@ exports[` should match snapshot 1`] = `
}
+@media only screen and (max-width:768px) {
+ .c7 {
+ margin-top: 3px;
+ }
+}
+
@media only screen and (max-width:768px) {
.c1 {
padding-top: 6px;
@@ -373,13 +405,13 @@ exports[` should match snapshot 1`] = `
}
@media only screen and (max-width:768px) {
- .c11 {
+ .c13 {
width: 12px;
}
}
@media only screen and (max-width:768px) {
- .c7 {
+ .c9 {
height: 12px;
}
}
@@ -420,31 +452,61 @@ exports[` should match snapshot 1`] = `
value=""
/>
+
+
+
+ account.reclaimEscrow.reclaimableAmount
+
+
+
+
+ 0.000001
+
+
+
+
+
+
+
+
+