diff options
Diffstat (limited to 'packages/taler-wallet-webextension')
19 files changed, 116 insertions, 102 deletions
diff --git a/packages/taler-wallet-webextension/.storybook/preview.js b/packages/taler-wallet-webextension/.storybook/preview.js index 6a7c8e867..1c07ba402 100644 --- a/packages/taler-wallet-webextension/.storybook/preview.js +++ b/packages/taler-wallet-webextension/.storybook/preview.js @@ -16,9 +16,6 @@ import { setupI18n } from "@gnu-taler/taler-util" import { strings } from '../src/i18n/strings.ts' -import '../static/style/pure.css' -import '../static/style/popup.css' -import '../static/style/wallet.css' const mockConfig = { backendURL: 'http://demo.taler.net', @@ -52,5 +49,27 @@ export const decorators = [ setupI18n(globals.locale, strings); return <Story /> }, + (Story, { kind }) => { + if (kind.startsWith('popup')) { + return <div class="popup-container"> + <link key="1" rel="stylesheet" type="text/css" href="/style/pure.css" /> + <link key="2" rel="stylesheet" type="text/css" href="/style/popup.css" /> + <div style={{ padding: 8, width: 'calc(400px - 16px - 2px)', height: 'calc(320px - 34px - 16px - 2px)', border: 'black solid 1px' }}> + <Story /> + </div> + </div> + } + if (kind.startsWith('wallet')) { + return <div class="wallet-container"> + <link key="1" rel="stylesheet" type="text/css" href="/style/pure.css" /> + <link key="2" rel="stylesheet" type="text/css" href="/style/wallet.css" /> + <Story /> + </div> + } + return <div> + <h1>this story is not under wallet or popup, check title property</h1> + <Story /> + </div> + } // (Story) => <ConfigContextProvider value={mockConfig}> <Story /> </ConfigContextProvider> ]; diff --git a/packages/taler-wallet-webextension/src/i18n/index.ts b/packages/taler-wallet-webextension/src/i18n/index.ts deleted file mode 100644 index 8db366a35..000000000 --- a/packages/taler-wallet-webextension/src/i18n/index.ts +++ /dev/null @@ -1,24 +0,0 @@ -/* - This file is part of TALER - (C) 2016 GNUnet e.V. - - TALER is free software; you can redistribute it and/or modify it under the - terms of the GNU General Public License as published by the Free Software - Foundation; either version 3, or (at your option) any later version. - - TALER is distributed in the hope that it will be useful, but WITHOUT ANY - WARRANTY; without even the implied warranty of MERCHANTABILITY or FITNESS FOR - A PARTICULAR PURPOSE. See the GNU General Public License for more details. - - You should have received a copy of the GNU General Public License along with - TALER; see the file COPYING. If not, see <http://www.gnu.org/licenses/> - */ - -/** - * Translation helpers for React components and template literals. - */ - -/** - * Imports. - */ -export { strings } from "./strings.js"; diff --git a/packages/taler-wallet-webextension/src/popup/Balance.tsx b/packages/taler-wallet-webextension/src/popup/Balance.tsx index 77d2c4201..ae0eb07ff 100644 --- a/packages/taler-wallet-webextension/src/popup/Balance.tsx +++ b/packages/taler-wallet-webextension/src/popup/Balance.tsx @@ -143,7 +143,7 @@ export class BalancePage extends Component<any, any> { const wallet = this.balance; if (this.gotError) { return ( - <div className="balance"> + <div class="balance"> <p>{i18n.str`Error: could not retrieve balance information.`}</p> <p> Click <PageLink pageName="welcome.html">here</PageLink> for help and @@ -165,7 +165,7 @@ export class BalancePage extends Component<any, any> { ); }); return listing.length > 0 ? ( - <div className="balance">{listing}</div> + <div class="balance">{listing}</div> ) : ( <EmptyBalanceView /> ); diff --git a/packages/taler-wallet-webextension/src/popup/History.stories.tsx b/packages/taler-wallet-webextension/src/popup/History.stories.tsx index a82863b43..8eef7dc31 100644 --- a/packages/taler-wallet-webextension/src/popup/History.stories.tsx +++ b/packages/taler-wallet-webextension/src/popup/History.stories.tsx @@ -32,16 +32,6 @@ import { HistoryView as TestedComponent } from './History'; export default { title: 'popup/transaction/list', component: TestedComponent, - decorators: [ - (Story: any) => <div> - <link key="1" rel="stylesheet" type="text/css" href="/style/pure.css" /> - <link key="2" rel="stylesheet" type="text/css" href="/style/popup.css" /> - <link key="3" rel="stylesheet" type="text/css" href="/style/wallet.css" /> - <div style={{ margin: "1em", width: 400, display: 'flex', padding: '0.5em', height: 'calc(320px - 34px)', border: 'black solid 1px' }}> - <Story /> - </div> - </div> - ], }; const commonTransaction = { diff --git a/packages/taler-wallet-webextension/src/popup/History.tsx b/packages/taler-wallet-webextension/src/popup/History.tsx index f055f6cb0..e76e656c1 100644 --- a/packages/taler-wallet-webextension/src/popup/History.tsx +++ b/packages/taler-wallet-webextension/src/popup/History.tsx @@ -42,7 +42,7 @@ export function HistoryPage(props: any): JSX.Element { } export function HistoryView({ list }: { list: Transaction[] }) { - return <div style={{ height: 'calc(320px - 34px - 2em)', overflow: 'auto', width: '100%' }}> + return <div style={{ height: 'calc(320px - 34px - 16px)', overflow: 'auto' }}> {list.map((tx, i) => ( <TransactionItem key={i} tx={tx} /> ))} diff --git a/packages/taler-wallet-webextension/src/popup/Transaction.stories.tsx b/packages/taler-wallet-webextension/src/popup/Transaction.stories.tsx index 38a348387..48f945783 100644 --- a/packages/taler-wallet-webextension/src/popup/Transaction.stories.tsx +++ b/packages/taler-wallet-webextension/src/popup/Transaction.stories.tsx @@ -32,16 +32,6 @@ import { TransactionView as TestedComponent } from './Transaction'; export default { title: 'popup/transaction/details', component: TestedComponent, - decorators: [ - (Story: any) => <div> - <link key="1" rel="stylesheet" type="text/css" href="/style/pure.css" /> - <link key="2" rel="stylesheet" type="text/css" href="/style/popup.css" /> - <link key="3" rel="stylesheet" type="text/css" href="/style/wallet.css" /> - <div style={{ margin: "1em", width: 400, display: 'flex', padding: '0.5em', height: 'calc(320px - 34px)', border: 'black solid 1px' }}> - <Story /> - </div> - </div> - ], }; const commonTransaction = { @@ -76,7 +66,7 @@ const exampleData = { }, orderId: '2021.167-03NPY6MCYMVGT', products: [], - summary: 'the summary', + summary: "Essay: Why the Devil's Advocate Doesn't Help Reach the Truth", fulfillmentMessage: '', }, proposalId: '1EMJJH8EP1NX3XF7733NCYS2DBEJW4Q2KA5KEB37MCQJQ8Q5HMC0', diff --git a/packages/taler-wallet-webextension/src/popup/Transaction.tsx b/packages/taler-wallet-webextension/src/popup/Transaction.tsx index 2db4cc1af..6a6876c02 100644 --- a/packages/taler-wallet-webextension/src/popup/Transaction.tsx +++ b/packages/taler-wallet-webextension/src/popup/Transaction.tsx @@ -82,8 +82,8 @@ export function TransactionView({ transaction, onDelete, onBack }: WalletTransac Amounts.parseOrThrow(transaction.amountEffective), ).amount return ( - <div style={{ display: 'flex', flexDirection: 'column', width: '100%' }} > - <section style={{ color: transaction.pending ? 'gray' : '', flex: '1 0 auto', height: 'calc(320px - 34px - 45px - 2em)', overflow: 'auto' }}> + <div style={{ display: 'flex', flexDirection: 'column' }} > + <section style={{ color: transaction.pending ? 'gray' : '', flex: '1 0 auto', height: 'calc(320px - 34px - 45px - 16px)', overflow: 'auto' }}> <span style="flat: left; font-size:small; color:gray">{transaction.timestamp.t_ms === "never" ? "never" : format(transaction.timestamp.t_ms, 'dd/MM/yyyy HH:mm:ss')}</span> <span style="float: right; font-size:small; color:gray"> From <b>{transaction.exchangeBaseUrl}</b> @@ -107,8 +107,8 @@ export function TransactionView({ transaction, onDelete, onBack }: WalletTransac ).amount return ( - <div style={{ display: 'flex', flexDirection: 'column', width: '100%' }} > - <section style={{ color: transaction.pending ? 'gray' : '', flex: '1 0 auto', height: 'calc(320px - 34px - 45px - 2em)', overflow: 'auto' }}> + <div style={{ display: 'flex', flexDirection: 'column' }} > + <section style={{ color: transaction.pending ? 'gray' : '', flex: '1 0 auto', height: 'calc(320px - 34px - 45px - 16px)', overflow: 'auto' }}> <span style="flat: left; font-size:small; color:gray">{transaction.timestamp.t_ms === "never" ? "never" : format(transaction.timestamp.t_ms, 'dd/MM/yyyy HH:mm:ss')}</span> <span style="float: right; font-size:small; color:gray"> To <b>{transaction.info.merchant.name}</b> @@ -145,8 +145,8 @@ export function TransactionView({ transaction, onDelete, onBack }: WalletTransac Amounts.parseOrThrow(transaction.amountEffective), ).amount return ( - <div style={{ display: 'flex', flexDirection: 'column', width: '100%' }} > - <section style={{ color: transaction.pending ? 'gray' : '', flex: '1 0 auto', height: 'calc(320px - 34px - 45px - 2em)', overflow: 'auto' }}> + <div style={{ display: 'flex', flexDirection: 'column' }} > + <section style={{ color: transaction.pending ? 'gray' : '', flex: '1 0 auto', height: 'calc(320px - 34px - 45px - 16px)', overflow: 'auto' }}> <span style="flat: left; font-size:small; color:gray">{transaction.timestamp.t_ms === "never" ? "never" : format(transaction.timestamp.t_ms, 'dd/MM/yyyy HH:mm:ss')}</span> <span style="float: right; font-size:small; color:gray"> To <b>{transaction.targetPaytoUri}</b> @@ -165,8 +165,8 @@ export function TransactionView({ transaction, onDelete, onBack }: WalletTransac Amounts.parseOrThrow(transaction.amountEffective), ).amount return ( - <div style={{ display: 'flex', flexDirection: 'column', width: '100%' }} > - <section style={{ color: transaction.pending ? 'gray' : '', flex: '1 0 auto', height: 'calc(320px - 34px - 45px - 2em)', overflow: 'auto' }}> + <div style={{ display: 'flex', flexDirection: 'column' }} > + <section style={{ color: transaction.pending ? 'gray' : '', flex: '1 0 auto', height: 'calc(320px - 34px - 45px - 16px)', overflow: 'auto' }}> <span style="flat: left; font-size:small; color:gray">{transaction.timestamp.t_ms === "never" ? "never" : format(transaction.timestamp.t_ms, 'dd/MM/yyyy HH:mm:ss')}</span> <span style="float: right; font-size:small; color:gray"> From <b>{transaction.exchangeBaseUrl}</b> @@ -185,8 +185,8 @@ export function TransactionView({ transaction, onDelete, onBack }: WalletTransac Amounts.parseOrThrow(transaction.amountEffective), ).amount return ( - <div style={{ display: 'flex', flexDirection: 'column', width: '100%' }} > - <section style={{ color: transaction.pending ? 'gray' : '', flex: '1 0 auto', height: 'calc(320px - 34px - 45px - 2em)', overflow: 'auto' }}> + <div style={{ display: 'flex', flexDirection: 'column' }} > + <section style={{ color: transaction.pending ? 'gray' : '', flex: '1 0 auto', height: 'calc(320px - 34px - 45px - 16px)', overflow: 'auto' }}> <span style="flat: left; font-size:small; color:gray">{transaction.timestamp.t_ms === "never" ? "never" : format(transaction.timestamp.t_ms, 'dd/MM/yyyy HH:mm:ss')}</span> <span style="float: right; font-size:small; color:gray"> From <b>{transaction.merchantBaseUrl}</b> @@ -205,8 +205,8 @@ export function TransactionView({ transaction, onDelete, onBack }: WalletTransac Amounts.parseOrThrow(transaction.amountEffective), ).amount return ( - <div style={{ display: 'flex', flexDirection: 'column', width: '100%' }} > - <section style={{ color: transaction.pending ? 'gray' : '', flex: '1 0 auto', height: 'calc(320px - 34px - 45px - 2em)', overflow: 'auto' }}> + <div style={{ display: 'flex', flexDirection: 'column' }} > + <section style={{ color: transaction.pending ? 'gray' : '', flex: '1 0 auto', height: 'calc(320px - 34px - 45px - 16px)', overflow: 'auto' }}> <span style="flat: left; font-size:small; color:gray">{transaction.timestamp.t_ms === "never" ? "never" : format(transaction.timestamp.t_ms, 'dd/MM/yyyy HH:mm:ss')}</span> <span style="float: right; font-size:small; color:gray"> From <b>{transaction.info.merchant.name}</b> diff --git a/packages/taler-wallet-webextension/src/popup/popup.tsx b/packages/taler-wallet-webextension/src/popup/popup.tsx index 95b87fad0..3692a0537 100644 --- a/packages/taler-wallet-webextension/src/popup/popup.tsx +++ b/packages/taler-wallet-webextension/src/popup/popup.tsx @@ -49,7 +49,7 @@ function Tab(props: TabProps): JSX.Element { cssClass = "active"; } return ( - <a href={props.target} className={cssClass}> + <a href={props.target} class={cssClass}> {props.children} </a> ); @@ -57,7 +57,7 @@ function Tab(props: TabProps): JSX.Element { export function WalletNavBar({ current }: { current?: string }) { return ( - <div className="nav" id="header"> + <div class="nav" id="header"> <Tab target="/balance" current={current}>{i18n.str`Balance`}</Tab> <Tab target="/history" current={current}>{i18n.str`History`}</Tab> <Tab target="/settings" current={current}>{i18n.str`Settings`}</Tab> diff --git a/packages/taler-wallet-webextension/src/popupEntryPoint.tsx b/packages/taler-wallet-webextension/src/popupEntryPoint.tsx index 05c5cca9c..1c569519c 100644 --- a/packages/taler-wallet-webextension/src/popupEntryPoint.tsx +++ b/packages/taler-wallet-webextension/src/popupEntryPoint.tsx @@ -34,7 +34,7 @@ import { BalancePage } from "./popup/Balance"; import Match from "preact-router/match"; import Router, { route, Route } from "preact-router"; import { useTalerActionURL } from "./hooks/useTalerActionURL"; -// import { Application } from "./Application"; +import { createHashHistory } from "history"; function main(): void { try { @@ -88,8 +88,8 @@ function Application() { return ( <div> <Match>{({ path }: any) => <WalletNavBar current={path} />}</Match > - <div style={{ padding: "1em", width: 'calc(400px - 2em)', height: 'calc(320px - 34px - 2em)' }}> - <Router> + <div style={{ padding: 8, width: 'calc(400px - 16px)', height: 'calc(320px - 34px - 16px)' }}> + <Router history={createHashHistory()}> <Route path={Pages.balance} component={BalancePage} /> <Route path={Pages.settings} component={SettingsPage} /> <Route path={Pages.debug} component={DebugPage} /> diff --git a/packages/taler-wallet-webextension/src/renderHtml.tsx b/packages/taler-wallet-webextension/src/renderHtml.tsx index 353a4eb85..1101b80d6 100644 --- a/packages/taler-wallet-webextension/src/renderHtml.tsx +++ b/packages/taler-wallet-webextension/src/renderHtml.tsx @@ -69,7 +69,7 @@ export function abbrev(s: string, n = 5): JSX.Element { sAbbrev = s.slice(0, n) + ".."; } return ( - <span className="abbrev" title={s}> + <span class="abbrev" title={s}> {sAbbrev} </span> ); @@ -108,7 +108,7 @@ export class Collapsible extends Component< if (this.state.collapsed) { return ( <h2> - <a className="opener opener-collapsed" href="#" onClick={doOpen}> + <a class="opener opener-collapsed" href="#" onClick={doOpen}> {" "} {this.props.title} </a> @@ -118,7 +118,7 @@ export class Collapsible extends Component< return ( <div> <h2> - <a className="opener opener-open" href="#" onClick={doClose}> + <a class="opener opener-open" href="#" onClick={doClose}> {" "} {this.props.title} </a> @@ -147,14 +147,14 @@ export interface LoadingButtonProps extends JSX.HTMLAttributes<HTMLButtonElement export function ProgressButton({isLoading, ...rest}: LoadingButtonProps): JSX.Element { return ( <button - className="pure-button pure-button-primary" + class="pure-button pure-button-primary" type="button" {...rest} > {isLoading ? ( <span> <object - className="svg-icon svg-baseline" + class="svg-icon svg-baseline" data="/img/spinner-bars.svg" /> </span> @@ -170,7 +170,7 @@ export function PageLink( const url = chrome.extension.getURL(`/static/wallet.html#/${props.pageName}`); return ( <a - className="actionLink" + class="actionLink" href={url} target="_blank" rel="noopener noreferrer" diff --git a/packages/taler-wallet-webextension/src/wallet/Pay.tsx b/packages/taler-wallet-webextension/src/wallet/Pay.tsx index 23b4e6c1a..bd06656c7 100644 --- a/packages/taler-wallet-webextension/src/wallet/Pay.tsx +++ b/packages/taler-wallet-webextension/src/wallet/Pay.tsx @@ -201,7 +201,7 @@ export function PayPage({ talerPayUri }: Props): JSX.Element { <div> <p>Payment failed: {payErrMsg}</p> <button - className="pure-button button-success" + class="pure-button button-success" onClick={() => doPayment()} > {i18n.str`Retry`} diff --git a/packages/taler-wallet-webextension/src/wallet/Withdraw.tsx b/packages/taler-wallet-webextension/src/wallet/Withdraw.tsx index 5dc12407b..4cb8ebfa1 100644 --- a/packages/taler-wallet-webextension/src/wallet/Withdraw.tsx +++ b/packages/taler-wallet-webextension/src/wallet/Withdraw.tsx @@ -81,7 +81,7 @@ export function View({ talerWithdrawUri, details, cancelled, selectedExchange, a <div> <button - className="pure-button button-success" + class="pure-button button-success" disabled={!selectedExchange} onClick={() => accept()} > diff --git a/packages/taler-wallet-webextension/src/wallet/reset-required.tsx b/packages/taler-wallet-webextension/src/wallet/reset-required.tsx index 0be7c09c5..87751561c 100644 --- a/packages/taler-wallet-webextension/src/wallet/reset-required.tsx +++ b/packages/taler-wallet-webextension/src/wallet/reset-required.tsx @@ -71,7 +71,7 @@ class ResetNotification extends Component<any, State> { </label> <br /> <button - className="pure-button" + class="pure-button" disabled={!this.state.checked} onClick={() => wxApi.resetDb()} > diff --git a/packages/taler-wallet-webextension/src/walletEntryPoint.tsx b/packages/taler-wallet-webextension/src/walletEntryPoint.tsx index cb97ffbeb..004fcc717 100644 --- a/packages/taler-wallet-webextension/src/walletEntryPoint.tsx +++ b/packages/taler-wallet-webextension/src/walletEntryPoint.tsx @@ -74,7 +74,7 @@ function Application() { return <Router history={createHashHistory()} > <Route path={Pages.welcome} component={() => { - return <section id="main"> + return <section class="main"> <div style="border-bottom: 3px dashed #aa3939; margin-bottom: 2em;"> <h1 style="font-family: monospace; font-size: 250%;"> <span style="color: #aa3939;">❰</span>Taler Wallet<span style="color: #aa3939;">❱</span> @@ -88,7 +88,7 @@ function Application() { }} /> <Route path={Pages.pay} component={() => { - return <section id="main"> + return <section class="main"> <h1>GNU Taler Wallet</h1> <article class="fade"> <PayPage talerPayUri={queryParams.talerPayUri} /> @@ -97,7 +97,7 @@ function Application() { }} /> <Route path={Pages.refund} component={() => { - return <section id="main"> + return <section class="main"> <h1>GNU Taler Wallet</h1> <article class="fade"> <RefundPage talerRefundUri={queryParams.talerRefundUri} /> @@ -106,7 +106,7 @@ function Application() { }} /> <Route path={Pages.tips} component={() => { - return <section id="main"> + return <section class="main"> <h1>GNU Taler Wallet</h1> <div> <TipPage talerTipUri={queryParams.talerTipUri} /> @@ -114,7 +114,7 @@ function Application() { </section> }} /> <Route path={Pages.withdraw} component={() => { - return <section id="main"> + return <section class="main"> <div style="border-bottom: 3px dashed #aa3939; margin-bottom: 2em;"> <h1 style="font-family: monospace; font-size: 250%;"> <span style="color: #aa3939;">❰</span>Taler Wallet<span style="color: #aa3939;">❱</span> diff --git a/packages/taler-wallet-webextension/static/popup.html b/packages/taler-wallet-webextension/static/popup.html index b670faacb..9f6520a16 100644 --- a/packages/taler-wallet-webextension/static/popup.html +++ b/packages/taler-wallet-webextension/static/popup.html @@ -3,13 +3,12 @@ <head> <meta charset="utf-8" /> <link rel="stylesheet" type="text/css" href="/static/style/pure.css" /> - <link rel="stylesheet" type="text/css" href="/static/style/wallet.css" /> <link rel="stylesheet" type="text/css" href="/static/style/popup.css" /> <link rel="icon" href="/static/img/icon.png" /> <script src="/dist/popupEntryPoint.js"></script> </head> <body> - <div id="container" style="margin: 0; padding: 0;"></div> + <taler-popup id="container" class="popup-container"></taler-popup> </body> </html> diff --git a/packages/taler-wallet-webextension/static/style/popup.css b/packages/taler-wallet-webextension/static/style/popup.css index 504400471..d0fd5d281 100644 --- a/packages/taler-wallet-webextension/static/style/popup.css +++ b/packages/taler-wallet-webextension/static/style/popup.css @@ -7,13 +7,25 @@ body { /* min-height: 20em; */ /* width: 30em; */ + /* max-height: 800px; */ margin: 0; + font-size: 100%; padding: 0; - /* max-height: 800px; */ overflow: hidden; background-color: #f8faf7; font-family: Arial, Helvetica, sans-serif; } +/* taler-popup { + min-height: 20em; + width: 30em; + height: 20rem; + margin: 0; + font-size: 100%; + padding: 0; + overflow: hidden; + background-color: #f8faf7; + font-family: Arial, Helvetica, sans-serif; +} */ .nav { background-color: #033; @@ -286,6 +298,32 @@ table.detailsTable.pending { background: white; } -button.danger { - background-color: 'red'; -}
\ No newline at end of file +.button-success, +.button-destructive, +.button-warning, +.button-secondary { + color: white; + border-radius: 4px; + text-shadow: 0 1px 1px rgba(0, 0, 0, 0.2); +} + +.button-success { + background: rgb(28, 184, 65); +} + +.button-destructive { + background: rgb(202, 60, 60); +} + +.button-warning { + background: rgb(223, 117, 20); +} + +.button-secondary { + background: rgb(66, 184, 221); +} + +button { + font-size: 120%; + padding: 0.5em; +} diff --git a/packages/taler-wallet-webextension/static/style/pure.css b/packages/taler-wallet-webextension/static/style/pure.css index 88a4bb7d7..c82fbaeee 100644 --- a/packages/taler-wallet-webextension/static/style/pure.css +++ b/packages/taler-wallet-webextension/static/style/pure.css @@ -830,7 +830,7 @@ this the same font stack that Normalize.css sets for the `body`. .pure-button:active { box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.15) inset, 0 0 6px rgba(0, 0, 0, 0.2) inset; - border-color: #000\9; + border-color: #000; } .pure-button[disabled], diff --git a/packages/taler-wallet-webextension/static/style/wallet.css b/packages/taler-wallet-webextension/static/style/wallet.css index 7c06f2386..32a96dbc4 100644 --- a/packages/taler-wallet-webextension/static/style/wallet.css +++ b/packages/taler-wallet-webextension/static/style/wallet.css @@ -4,7 +4,12 @@ body { margin-top: 2em; } -#main { +.wallet-container { + margin: 0px; + padding: 0px; +} + +section.main { border: solid 5px black; border-radius: 10px; margin-left: auto; @@ -37,14 +42,14 @@ aside { float: left; } -section#main { +section.main { margin: auto; padding: 20px; height: 100%; max-width: 50%; } -section#main h1:first-child { +section.main h1:first-child { margin-top: 0; } @@ -83,9 +88,6 @@ input.url { width: 25em; } -.formish { -} - .json-key { color: brown; } @@ -96,10 +98,6 @@ input.url { color: olive; } -button { - font-size: 120%; - padding: 0.5em; -} button.confirm-pay { float: right; @@ -287,4 +285,9 @@ object.svg-icon.svg-baseline { opacity: 0; width: 0; height: 0; -}
\ No newline at end of file +} + +button.pure-button { + font-size: 120%; + padding: 0.5em; +} diff --git a/packages/taler-wallet-webextension/static/wallet.html b/packages/taler-wallet-webextension/static/wallet.html index c66913c42..2b500b56f 100644 --- a/packages/taler-wallet-webextension/static/wallet.html +++ b/packages/taler-wallet-webextension/static/wallet.html @@ -4,12 +4,11 @@ <meta charset="utf-8" /> <link rel="stylesheet" type="text/css" href="/static/style/pure.css" /> <link rel="stylesheet" type="text/css" href="/static/style/wallet.css" /> - <link rel="stylesheet" type="text/css" href="/static/style/popup.css" /> <link rel="icon" href="/static/img/icon.png" /> <script src="/dist/walletEntryPoint.js"></script> </head> <body> - <div id="container" style="margin: 0; padding: 0;"></div> + <div id="container" class="wallet-container"></div> </body> </html> |