diff options
author | Alexander Tseung <alextsg@gmail.com> | 2018-08-03 11:20:15 +0800 |
---|---|---|
committer | Alexander Tseung <alextsg@gmail.com> | 2018-08-24 07:44:44 +0800 |
commit | 5ddd9b55be0d8bd778822b4b401cbd22a7b57c54 (patch) | |
tree | 607cb4747aba68d7f6127e5f1bfb6d732f735acf /ui/app/components/transaction-list-item/index.scss | |
parent | fa8313f9036882e1a558d871f4e520da71ffaa03 (diff) | |
download | tangerine-wallet-browser-5ddd9b55be0d8bd778822b4b401cbd22a7b57c54.tar tangerine-wallet-browser-5ddd9b55be0d8bd778822b4b401cbd22a7b57c54.tar.gz tangerine-wallet-browser-5ddd9b55be0d8bd778822b4b401cbd22a7b57c54.tar.bz2 tangerine-wallet-browser-5ddd9b55be0d8bd778822b4b401cbd22a7b57c54.tar.lz tangerine-wallet-browser-5ddd9b55be0d8bd778822b4b401cbd22a7b57c54.tar.xz tangerine-wallet-browser-5ddd9b55be0d8bd778822b4b401cbd22a7b57c54.tar.zst tangerine-wallet-browser-5ddd9b55be0d8bd778822b4b401cbd22a7b57c54.zip |
Add retry button to TransactionListItem
Diffstat (limited to 'ui/app/components/transaction-list-item/index.scss')
-rw-r--r-- | ui/app/components/transaction-list-item/index.scss | 45 |
1 files changed, 34 insertions, 11 deletions
diff --git a/ui/app/components/transaction-list-item/index.scss b/ui/app/components/transaction-list-item/index.scss index b93edebcc..9c53c8960 100644 --- a/ui/app/components/transaction-list-item/index.scss +++ b/ui/app/components/transaction-list-item/index.scss @@ -2,21 +2,36 @@ box-sizing: border-box; min-height: 74px; padding: 8px 20px; - display: grid; - grid-template-columns: 45px 1fr 1fr 1fr; - grid-template-areas: - "identicon action status primary-amount" - "identicon nonce status secondary-amount"; border-bottom: 1px solid $geyser; cursor: pointer; + display: flex; + justify-content: center; + align-items: center; + flex-direction: column; @media screen and (max-width: $break-small) { padding: 8px 20px 12px; - grid-template-columns: 45px 5fr 3fr; + } + + &:hover { + background: rgba($alto, .2); + } + + &__grid { + width: 100%; + display: grid; + grid-template-columns: 45px 1fr 1fr 1fr; grid-template-areas: - "nonce nonce nonce" - "identicon action primary-amount" - "identicon status secondary-amount"; + "identicon action status primary-amount" + "identicon nonce status secondary-amount"; + + @media screen and (max-width: $break-small) { + grid-template-columns: 45px 5fr 3fr; + grid-template-areas: + "nonce nonce nonce" + "identicon action primary-amount" + "identicon status secondary-amount"; + } } &__identicon { @@ -87,8 +102,16 @@ } } + &__retry { + background: #d1edff; + border-radius: 12px; + font-size: .75rem; + padding: 4px 12px; + cursor: pointer; + margin-top: 8px; - &:hover { - background: rgba($alto, .2); + @media screen and (max-width: $break-small) { + font-size: .5rem; + } } } |