From 3234e31e2dee2baa569086f767c5b91e48e01608 Mon Sep 17 00:00:00 2001 From: "tg(x)" <*@tg-x.net> Date: Fri, 18 Dec 2015 22:36:26 +0100 Subject: [PATCH] webext: styling --- extension/icons/taler-logo-24.png | Bin 1452 -> 0 bytes extension/manifest.json | 2 +- extension/pages/confirm-contract.html | 28 +++++--- extension/pages/confirm-create-reserve.html | 43 ++++++++---- extension/pages/confirm-create-reserve.js | 6 +- extension/pages/reserve-success.html | 24 ++++++- extension/style/wallet.css | 74 ++++++++++++++++++++ 7 files changed, 149 insertions(+), 28 deletions(-) delete mode 100644 extension/icons/taler-logo-24.png diff --git a/extension/icons/taler-logo-24.png b/extension/icons/taler-logo-24.png deleted file mode 100644 index 00a908e79ca86f2aefa9f167280ab19a2c2395c8..0000000000000000000000000000000000000000 GIT binary patch literal 0 HcmV?d00001 literal 1452 zcmZ`(c{J2}6#tH0)0$d)5ZdA685vW+$G*Pri?ckc2zcln%q&;8@l9qcW{4#^z?0Ek&x5*;Cwg-k|B z0P?O2nkWePdX zu;>AR;X?q9QSzEdIH(|S*~Wqh4t~kgmeO=6BTTV$xe9>DkzWP_IeE}6~oW!F<)}$c8NTr%Y8#I6jNmrZSc;H#1sB?=H-dmC_Y>B253$F6Naa(W#$A zKM{u#laua1rQ*+sWZA3cH=I8EdD6S2h0AVcXqXu zRn&eSA0JAyFU`T&iG;Gtmj%~Jp)&-*f>Z|87?Gd9)GbBtWcy*7+(;RDD%KTDmEih| z^8Fi+OyFG$8kuTdKdv)IuGFOn`UP~eA|@OH0yxJP!go3v8a6ZK<(C{$=~ERIEba|k z+YC#0_b2Y<8N2db`?VMAsbrTQC8fR!;@=h*(TbVWCI!BKIyd>-8xvmG{E+tUY8Hxo>i`p`YQT>K!*AZj%dZt|0p+nufT zr8$C=^^NnQ#rl2MNj{P^U2zK?&O3ZjCgPR7&ZC#rp&fPO7~6W+@<5)g&Y_`o89R~R zh2*$AtJ^qn1>DPL#l^Fg^#Py4Th=!JLOw`Jzg#0^t-7--i2v<&!EsrQqom67{iCCV z^Up8Q+uPe$dKi7P0h_0TGv}Z8q$dudV719o;jgfQRKHfEFOFs z5^g}jdoqG;iX8_kGNYIkYEpK>LVw3Fhp))!2QxfkV&DvINzc>`@Cfl z1Py;)dS)$(rYpwKM!%o)&6m7>N&fBf5rX7mviVmLmYcB$gH`(sYrWu5<4g;db@m&2 zV?ZPjF>(n=%}I1T!s9ZtGiVH^RAi}IhwBrZ-xF_(a0|b7jbweiHTnL1!(*DRGkI%f zAp=}vQ3;8T&T3&YwuqdCv!0$%v?WaLT&L3h)+R*lG zp`1@nq;taqGcz-Z>ifLC8&vrRmV6^G+)sAh-;bA3e{5o#&gX2`&* zccXC9lx!l91N?yhD_A+O*h}v>p=_z`EA3?!K_BcyxS4Y}*)!bR&@0Rv0-%G|*404& wQYUR~Lk!jsja5hM7^2bU^D_AV5Q0L;{ytIvPtb3Az6TM2m6<)U%G4wNU$$C>wg3PC 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; +}