diff --git a/extension/icons/taler-logo-24.png b/extension/icons/taler-logo-24.png deleted file mode 100644 index 00a908e79..000000000 Binary files a/extension/icons/taler-logo-24.png and /dev/null differ diff --git a/extension/manifest.json b/extension/manifest.json index 73952f683..86de58da5 100644 --- a/extension/manifest.json +++ b/extension/manifest.json @@ -16,7 +16,7 @@ ], "browser_action": { - "default_icon": "icons/taler-logo-24.png", + "default_icon": "img/taler-logo-24.png", "default_title": "Taler", "default_popup": "popup/balance-overview.html" }, diff --git a/extension/pages/confirm-contract.html b/extension/pages/confirm-contract.html index 9959bb489..6b09ffeb1 100644 --- a/extension/pages/confirm-contract.html +++ b/extension/pages/confirm-contract.html @@ -7,7 +7,8 @@ - + + - - + -

Confirm Payment

+
+ +

Payment Confirmation

+
-
+ - +
+ +
+
+ + +
+ +
+ +
-
- diff --git a/extension/pages/confirm-create-reserve.html b/extension/pages/confirm-create-reserve.html index d89fd0b13..f5dd725f7 100644 --- a/extension/pages/confirm-create-reserve.html +++ b/extension/pages/confirm-create-reserve.html @@ -5,19 +5,38 @@ Taler Wallet: Confirm Reserve Creation - + + -

Confirm Reserve Creation

- Hello, this is the wallet. A bank wants to create a reserve for (loading...). - Please specify the base URL of the mint you want to use. -

-

-
- - -
- -
+ +
+ +

Confirm Reserve Creation

+
+ + + +
+ +
+

+ A bank wants to create a reserve for (loading...). +

+

+ Please specify the base URL of the mint you want to use. +

+ +
+
+ + +
+ +
+
+ +
diff --git a/extension/pages/confirm-create-reserve.js b/extension/pages/confirm-create-reserve.js index 5c35121e3..98acfebfc 100644 --- a/extension/pages/confirm-create-reserve.js +++ b/extension/pages/confirm-create-reserve.js @@ -8,7 +8,7 @@ function updateAmount() { console.log("Query is " + JSON.stringify(query)); let s = query.amount_str; if (!s) { - document.body.innerHTML = "Oops, something went wrong."; + document.getElementById('main').innerHTML = "Oops, something went wrong."; return; } showAmount.textContent = s; @@ -29,7 +29,7 @@ document.addEventListener("DOMContentLoaded", (e) => { if (resp.success === true) { document.location.href = resp.backlink; } else { - document.body.innerHTML = + document.getElementById('main').innerHTML = `Oops, something went wrong. The bank responded with HTTP status code ${resp.status}. Here is some more info: @@ -39,5 +39,3 @@ document.addEventListener("DOMContentLoaded", (e) => { }); }); - - diff --git a/extension/pages/reserve-success.html b/extension/pages/reserve-success.html index 81de9cb41..05871ca1f 100644 --- a/extension/pages/reserve-success.html +++ b/extension/pages/reserve-success.html @@ -3,10 +3,28 @@ Taler Wallet: Reserve Created - + -

Success!

- The reserve was created successfully. + +
+ +

Reserve Creation

+
+ + + +
+ +
+

Success!

+ +

The reserve was created successfully.

+
+ +
+ + diff --git a/extension/style/wallet.css b/extension/style/wallet.css index 487cdd407..01b9cd96f 100644 --- a/extension/style/wallet.css +++ b/extension/style/wallet.css @@ -1,3 +1,72 @@ +body { + background-color: white; + margin: 0; + padding: 0; + font-family: Verdana, sans; +} + +header { + width: 100%; + height: 100px; + margin: 0; + padding: 0; + border-bottom: 1px solid black; +} + +header h1 { + font-size: 200%; + margin: 0; + padding: 0 0 0 120px; + position: relative; + top: 50%; + transform: translateY(-50%); +} + +header #logo { + float: left; + width: 100px; + height: 100px; + padding: 0; + margin: 0; + text-align: center; + border-right: 1px solid black; + background-image: url(../img/logo.png); + background-size: 100px; +} + +aside { + width: 100px; + float: left; +} + +section#main { + margin: 0 0 0 100px; + padding: 20px; + border-left: 1px solid black; + height: 100%; + max-width: 40em; +} + +section#main h1:first-child { + margin-top: 0; +} + +h1 { + font-size: 160%; +} + +h2 { + font-size: 140%; +} + +h3 { + font-size: 120%; +} + +h4, h5, h6 { + font-size: 100%; +} + .form-row { padding-top: 5px; padding-bottom: 5px; @@ -27,3 +96,8 @@ input.url { .json-string { color: olive; } + +button { + font-size: 120%; + padding: 0.5em; +}