remove unused section scss (#9146)
Brad Decker
4 years ago
committed by
GitHub
parent
85e658993b
commit
f3ba18d79f
@ -1,63 +0,0 @@ |
||||
import PropTypes from 'prop-types' |
||||
import React, { Component } from 'react' |
||||
import Identicon from '../ui/identicon' |
||||
import { addressSummary, formatBalance } from '../../helpers/utils/util' |
||||
|
||||
export default class AccountPanel extends Component { |
||||
static propTypes = { |
||||
identity: PropTypes.object, |
||||
account: PropTypes.object, |
||||
isFauceting: PropTypes.bool, |
||||
} |
||||
|
||||
static defaultProps = { |
||||
identity: {}, |
||||
account: {}, |
||||
isFauceting: false, |
||||
} |
||||
|
||||
render () { |
||||
const { identity, account, isFauceting } = this.props |
||||
|
||||
const panelState = { |
||||
key: `accountPanel${identity.address}`, |
||||
identiconKey: identity.address, |
||||
identiconLabel: identity.name || '', |
||||
attributes: [ |
||||
{ |
||||
key: 'ADDRESS', |
||||
value: addressSummary(identity.address), |
||||
}, |
||||
balanceOrFaucetingIndication(account, isFauceting), |
||||
], |
||||
} |
||||
|
||||
return ( |
||||
<div |
||||
className="identity-panel flex-row flex-space-between" |
||||
style={{ flex: '1 0 auto', cursor: panelState.onClick ? 'pointer' : undefined }} |
||||
onClick={panelState.onClick} |
||||
> |
||||
<div className="identicon-wrapper flex-column select-none"> |
||||
<Identicon address={panelState.identiconKey} /> |
||||
<span className="font-small">{panelState.identiconLabel.substring(0, 7) + '...'}</span> |
||||
</div> |
||||
<div className="identity-data flex-column flex-justify-center flex-grow select-none"> |
||||
{panelState.attributes.map((attr, index) => ( |
||||
<div className="flex-row flex-space-between" key={index}> |
||||
<label className="font-small no-select">{attr.key}</label> |
||||
<span className="font-small">{attr.value}</span> |
||||
</div> |
||||
))} |
||||
</div> |
||||
</div> |
||||
) |
||||
} |
||||
} |
||||
|
||||
function balanceOrFaucetingIndication (account) { |
||||
return { |
||||
key: 'BALANCE', |
||||
value: formatBalance(account.balance), |
||||
} |
||||
} |
||||
@ -0,0 +1 @@ |
||||
export { default } from './qr-code' |
||||
@ -0,0 +1,25 @@ |
||||
.qr-code { |
||||
display: flex; |
||||
flex-direction: column; |
||||
justify-content: center; |
||||
align-items: center; |
||||
|
||||
&__message-container > div:first-child { |
||||
margin-top: 18px; |
||||
font-size: 15px; |
||||
color: #4d4d4d; |
||||
} |
||||
|
||||
&__message { |
||||
font-size: 12px; |
||||
color: #f7861c; |
||||
} |
||||
|
||||
&__error { |
||||
display: flex; |
||||
justify-content: center; |
||||
align-items: center; |
||||
color: #f7861c; |
||||
margin-bottom: 9px; |
||||
} |
||||
} |
||||
@ -0,0 +1 @@ |
||||
export { default } from './readonly-input' |
||||
@ -0,0 +1,8 @@ |
||||
.readonly-input { |
||||
&__input { |
||||
direction: ltr; |
||||
overflow: hidden; |
||||
text-overflow: ellipsis; |
||||
width: 100%; |
||||
} |
||||
} |
||||
@ -1,426 +0,0 @@ |
||||
// Old scss, do not lint - clean up later |
||||
/* stylelint-disable */ |
||||
|
||||
|
||||
/* |
||||
App Sections |
||||
TODO: Move into separate files. |
||||
*/ |
||||
|
||||
/* initialize */ |
||||
textarea.twelve-word-phrase { |
||||
padding: 12px; |
||||
width: 300px; |
||||
height: 140px; |
||||
font-size: 16px; |
||||
background: $white; |
||||
resize: none; |
||||
} |
||||
|
||||
.initialize-screen { |
||||
width: 100%; |
||||
z-index: $main-container-z-index; |
||||
background: #f7f7f7; |
||||
} |
||||
|
||||
.initialize-screen hr { |
||||
width: 60px; |
||||
margin: 12px; |
||||
border-color: #f7861c; |
||||
border-style: solid; |
||||
} |
||||
|
||||
.initialize-screen label { |
||||
margin-top: 20px; |
||||
} |
||||
|
||||
.initialize-screen button.create-vault { |
||||
margin-top: 40px; |
||||
} |
||||
|
||||
.initialize-screen .warning { |
||||
font-size: 14px; |
||||
margin: 0 16px; |
||||
} |
||||
|
||||
/* unlock */ |
||||
.error { |
||||
color: #f7861c; |
||||
margin-bottom: 9px; |
||||
} |
||||
|
||||
.warning { |
||||
color: #ffae00; |
||||
} |
||||
|
||||
.lock { |
||||
width: 50px; |
||||
height: 50px; |
||||
} |
||||
|
||||
.lock.locked { |
||||
transform: scale(1.5); |
||||
opacity: 0; |
||||
transition: opacity 400ms ease-in, transform 400ms ease-in; |
||||
} |
||||
|
||||
.lock.unlocked { |
||||
transform: scale(1); |
||||
opacity: 1; |
||||
transition: opacity 500ms ease-out, transform 500ms ease-out, background 200ms ease-in; |
||||
} |
||||
|
||||
.lock.locked .lock-top { |
||||
transform: scaleX(1) translateX(0); |
||||
transition: transform 250ms ease-in; |
||||
} |
||||
|
||||
.lock.unlocked .lock-top { |
||||
transform: scaleX(-1) translateX(-12px); |
||||
transition: transform 250ms ease-in; |
||||
} |
||||
|
||||
.lock.unlocked:hover { |
||||
border-radius: 4px; |
||||
background: #e5e5e5; |
||||
border: 1px solid #b1b1b1; |
||||
} |
||||
|
||||
.lock.unlocked:active { |
||||
background: #c3c3c3; |
||||
} |
||||
|
||||
.section-title .fa-arrow-left { |
||||
margin: -2px 8px 0 -8px; |
||||
} |
||||
|
||||
.sizing-input { |
||||
font-size: 14px; |
||||
height: 30px; |
||||
padding-left: 5px; |
||||
} |
||||
|
||||
/* accounts */ |
||||
|
||||
.accounts-section { |
||||
margin: 0 0; |
||||
} |
||||
|
||||
.accounts-section .horizontal-line { |
||||
margin: 0 18px; |
||||
} |
||||
|
||||
.accounts-list-option { |
||||
height: 120px; |
||||
} |
||||
|
||||
.accounts-list-option .identicon-wrapper { |
||||
width: 100px; |
||||
} |
||||
|
||||
.unconftx-link { |
||||
margin-top: 24px; |
||||
cursor: pointer; |
||||
} |
||||
|
||||
.unconftx-link .fa-arrow-right { |
||||
margin: 0 -8px 0 8px; |
||||
} |
||||
|
||||
/* identity panel */ |
||||
|
||||
.identity-panel { |
||||
font-weight: 500; |
||||
} |
||||
|
||||
.identity-panel .identicon-wrapper { |
||||
margin: 4px; |
||||
margin-top: 8px; |
||||
display: flex; |
||||
align-items: center; |
||||
} |
||||
|
||||
.identity-panel .identicon-wrapper span { |
||||
margin: 0 auto; |
||||
} |
||||
|
||||
.identity-panel .identity-data { |
||||
margin: 8px 8px 8px 18px; |
||||
} |
||||
|
||||
.identity-panel i { |
||||
margin-top: 32px; |
||||
margin-right: 6px; |
||||
color: #b9b9b9; |
||||
} |
||||
|
||||
.identity-panel .arrow-right { |
||||
padding-left: 18px; |
||||
width: 42px; |
||||
min-width: 18px; |
||||
height: 100%; |
||||
} |
||||
|
||||
.identity-copy.flex-column { |
||||
flex: 0.25 0 auto; |
||||
justify-content: center; |
||||
} |
||||
|
||||
/* accounts screen */ |
||||
|
||||
.identity-section { |
||||
} |
||||
|
||||
.identity-section .identity-panel { |
||||
background: #e9e9e9; |
||||
border-bottom: 1px solid #b1b1b1; |
||||
cursor: pointer; |
||||
} |
||||
|
||||
.identity-section .identity-panel.selected { |
||||
background: $white; |
||||
color: #f3c83e; |
||||
} |
||||
|
||||
.identity-section .identity-panel.selected .identicon { |
||||
border-color: $orange; |
||||
} |
||||
|
||||
.identity-section .accounts-list-option:hover, |
||||
.identity-section .accounts-list-option.selected { |
||||
background: $white; |
||||
} |
||||
|
||||
/* account detail screen */ |
||||
|
||||
.account-detail-section { |
||||
display: flex; |
||||
flex-wrap: wrap; |
||||
overflow-y: auto; |
||||
flex-direction: inherit; |
||||
} |
||||
|
||||
.grow-tenx { |
||||
flex-grow: 10; |
||||
} |
||||
|
||||
.name-label { |
||||
} |
||||
|
||||
.unapproved-tx-icon { |
||||
height: 16px; |
||||
width: 16px; |
||||
background: rgb(47, 174, 244); |
||||
border-color: $silver-chalice; |
||||
border-radius: 13px; |
||||
} |
||||
|
||||
.edit-text { |
||||
height: 100%; |
||||
visibility: hidden; |
||||
} |
||||
|
||||
.editing-label { |
||||
display: flex; |
||||
justify-content: flex-start; |
||||
margin-left: 50px; |
||||
margin-bottom: 2px; |
||||
font-size: 11px; |
||||
text-rendering: geometricPrecision; |
||||
color: #f7861c; |
||||
} |
||||
|
||||
.name-label:hover .edit-text { |
||||
visibility: visible; |
||||
} |
||||
|
||||
/* tx confirm */ |
||||
|
||||
.unconftx-section input[type=password] { |
||||
height: 22px; |
||||
padding: 2px; |
||||
margin: 12px; |
||||
margin-bottom: 24px; |
||||
border-radius: 4px; |
||||
border: 2px solid #f3c83e; |
||||
background: #faf6f0; |
||||
} |
||||
|
||||
/* Info screen */ |
||||
.info-gray { |
||||
text-transform: uppercase; |
||||
color: $silver-chalice; |
||||
} |
||||
|
||||
.icon-size { |
||||
width: 20px; |
||||
} |
||||
|
||||
.info { |
||||
padding-bottom: 10px; |
||||
display: inline-block; |
||||
padding-left: 5px; |
||||
} |
||||
|
||||
/* buy eth warning screen */ |
||||
.custom-radios { |
||||
justify-content: space-around; |
||||
align-items: center; |
||||
} |
||||
|
||||
.custom-radio-selected { |
||||
width: 17px; |
||||
height: 17px; |
||||
border: solid; |
||||
border-style: double; |
||||
border-radius: 15px; |
||||
border-width: 5px; |
||||
background: rgba(247, 134, 28, 1); |
||||
border-color: #f7f7f7; |
||||
} |
||||
|
||||
.custom-radio-inactive { |
||||
width: 14px; |
||||
height: 14px; |
||||
border: solid; |
||||
border-width: 1px; |
||||
border-radius: 24px; |
||||
border-color: $silver-chalice; |
||||
} |
||||
|
||||
.radio-titles { |
||||
color: rgba(247, 134, 28, 1); |
||||
} |
||||
|
||||
.eth-warning { |
||||
transition: opacity 400ms ease-in, transform 400ms ease-in; |
||||
} |
||||
|
||||
.buy-subview { |
||||
transition: opacity 400ms ease-in, transform 400ms ease-in; |
||||
} |
||||
|
||||
.input-container:hover .edit-text { |
||||
visibility: visible; |
||||
} |
||||
|
||||
.buy-inputs { |
||||
font-size: 13px; |
||||
height: 20px; |
||||
background: transparent; |
||||
box-sizing: border-box; |
||||
border: solid; |
||||
border-color: transparent; |
||||
border-width: 0.5px; |
||||
border-radius: 2px; |
||||
} |
||||
|
||||
.input-container:hover .buy-inputs { |
||||
box-sizing: inherit; |
||||
border: solid; |
||||
border-color: #f7861c; |
||||
border-width: 0.5px; |
||||
border-radius: 2px; |
||||
} |
||||
|
||||
.buy-inputs:focus { |
||||
border: solid; |
||||
border-color: #f7861c; |
||||
border-width: 0.5px; |
||||
border-radius: 2px; |
||||
} |
||||
|
||||
.activeForm { |
||||
background: #f7f7f7; |
||||
border: none; |
||||
border-radius: 8px 8px 0 0; |
||||
width: 50%; |
||||
text-align: center; |
||||
padding-bottom: 4px; |
||||
} |
||||
|
||||
.inactiveForm { |
||||
border: none; |
||||
border-radius: 8px 8px 0 0; |
||||
width: 50%; |
||||
text-align: center; |
||||
padding-bottom: 4px; |
||||
} |
||||
|
||||
.ex-coins { |
||||
text-transform: uppercase; |
||||
text-align: center; |
||||
font-size: 33px; |
||||
width: 118px; |
||||
height: 42px; |
||||
padding: 1px; |
||||
color: #4d4d4d; |
||||
} |
||||
|
||||
.marketinfo { |
||||
color: $silver-chalice; |
||||
font-size: 15px; |
||||
line-height: 17px; |
||||
} |
||||
|
||||
#fromCoin::-webkit-calendar-picker-indicator { |
||||
display: none; |
||||
} |
||||
|
||||
#coinList { |
||||
width: 400px; |
||||
height: 500px; |
||||
overflow: scroll; |
||||
} |
||||
|
||||
.icon-control .fa-sync { |
||||
visibility: hidden; |
||||
} |
||||
|
||||
.icon-control:hover .fa-sync { |
||||
visibility: visible; |
||||
} |
||||
|
||||
.icon-control:hover .fa-chevron-right { |
||||
visibility: hidden; |
||||
} |
||||
|
||||
.inactive { |
||||
color: $silver-chalice; |
||||
} |
||||
|
||||
.inactive button { |
||||
background: $silver-chalice; |
||||
color: $white; |
||||
} |
||||
|
||||
.qr-ellip-address, |
||||
.ellip-address { |
||||
/*rtl:ignore*/ |
||||
direction: ltr; |
||||
overflow: hidden; |
||||
text-overflow: ellipsis; |
||||
width: 100%; |
||||
} |
||||
|
||||
.qr-header { |
||||
font-size: 25px; |
||||
margin-top: 40px; |
||||
} |
||||
|
||||
.qr-message { |
||||
font-size: 12px; |
||||
color: #f7861c; |
||||
} |
||||
|
||||
div.message-container > div:first-child { |
||||
margin-top: 18px; |
||||
font-size: 15px; |
||||
color: #4d4d4d; |
||||
} |
||||
|
||||
.pop-hover:hover { |
||||
transform: scale(1.1); |
||||
} |
||||
|
||||
/* stylelint-enable */ |
||||
Loading…
Reference in new issue