diff --git a/client/package.json b/client/package.json index b82146e..443ea07 100644 --- a/client/package.json +++ b/client/package.json @@ -1,6 +1,6 @@ { "name": "bitfeed-client", - "version": "2.1.5", + "version": "2.2.0", "scripts": { "build": "rollup -c", "dev": "rollup -c -w", diff --git a/client/src/components/BlockInfo.svelte b/client/src/components/BlockInfo.svelte index c9ad972..d03b462 100644 --- a/client/src/components/BlockInfo.svelte +++ b/client/src/components/BlockInfo.svelte @@ -5,7 +5,7 @@ import { createEventDispatcher } from 'svelte' import Icon from '../components/Icon.svelte' import closeIcon from '../assets/icon/cil-x-circle.svg' - import { shortBtcFormat, longBtcFormat, timeFormat, integerFormat } from '../utils/format.js' + import { shortBtcFormat, longBtcFormat, timeFormat, numberFormat } from '../utils/format.js' import { exchangeRates, settings } from '../stores.js' import { formatCurrency } from '../utils/fx.js' @@ -57,16 +57,22 @@ function formatBytes (bytes) { if (bytes) { - return `${integerFormat.format(bytes)} bytes` + return `${numberFormat.format(bytes)} bytes` } else return `unknown size` } function formatCount (n) { if (n) { - return integerFormat.format(n) + return numberFormat.format(n) } else return '0' } + function formatFee (n) { + if (n) { + return numberFormat.format(n.toFixed(2)) + } else return '0' + } + function hideBlock () { analytics.trackEvent('viz', 'block', 'hide') dispatch('hideBlock') @@ -108,11 +114,36 @@ font-size: 4.4vw; } + .compact { + display: none; + } + + @media (max-aspect-ratio: 1/1) and (max-height: 760px) { + .compact { + display: block; + } + .full-size { + display: none; + } + } + @media (aspect-ratio: 1/1) and (max-height: 760px) { + .compact { + display: none; + } + .full-size { + display: block; + } + } + .data-row { display: flex; flex-direction: row; flex-wrap: nowrap; justify-content: space-between; + + &.spacer { + display: none; + } } .data-field { @@ -157,6 +188,10 @@ flex-direction: column; justify-content: flex-start; align-items: flex-end; + + &.spacer { + display: flex; + } } .data-field { @@ -196,17 +231,46 @@ {#if block != null && visible }