wallet transaction detail view

2 files changed, 31 insertions, 2 deletions

diff --git a/packages/taler-wallet-webextension/static/img/empty.png b/packages/taler-wallet-webextension/static/img/empty.png
new file mode 100644
index 000000000..5120d3138
--- /dev/null
+++ b/packages/taler-wallet-webextension/static/img/empty.png
diff --git a/packages/taler-wallet-webextension/static/style/popup.css b/packages/taler-wallet-webextension/static/style/popup.css
index a234f2a2c..504400471 100644
--- a/packages/taler-wallet-webextension/static/style/popup.css
+++ b/packages/taler-wallet-webextension/static/style/popup.css
@@ -5,11 +5,11 @@
  */
 
 body {
-  min-height: 20em;
+  /* min-height: 20em; */
   /* width: 30em; */
   margin: 0;
   padding: 0;
-  max-height: 800px;
+  /* max-height: 800px; */
   overflow: hidden;
   background-color: #f8faf7;
   font-family: Arial, Helvetica, sans-serif;
@@ -259,4 +259,33 @@ table.detailsTable {
 
 table.detailsTable.pending {
   color: gray;
+}
+
+.overflow {
+  text-align: justify;
+  position: relative;
+  max-height: calc(1.2em * 2);
+  overflow: hidden;
+  padding-right: 1rem; /* space for ellipsis */
+}
+.overflow::before {
+  position: absolute;
+  content: "...";
+/*   inset-block-end: 0;
+  inset-inline-end: 0; */
+  bottom: 0;
+  right: 0;
+}
+.overflow::after {
+  content: "";
+  position: absolute;
+/*   inset-inline-end: 0; */
+  right: 0;
+  width: 1rem;
+  height: 1rem;
+  background: white;
+}
+
+button.danger {
+  background-color: 'red';
 }
\ No newline at end of file