Minor changes

DuoNetwork · Jun 6, 2019 · bdc7eb8 · bdc7eb8
1 parent 24a0c56
commit bdc7eb8
Show file tree

Hide file tree

Showing 5 changed files with 64 additions and 24 deletions.
diff --git a/src/ts/common/stakingCST.ts b/src/ts/common/stakingCST.ts
@@ -11,6 +11,11 @@ export const STK_TITLE: ILocaleText = {
 	[LOCALE_EN]: 'DUO Staking Campaign'
 };
 
+export const STK_STATUS: ILocaleText = {
+	[LOCALE_CN]: '系统状态',
+	[LOCALE_EN]: 'Stake/Unstake'
+};
+
 export const STK_STAKE: ILocaleText = {
 	[LOCALE_CN]: '质押',
 	[LOCALE_EN]: 'Stake'

diff --git a/src/ts/components/Cards/StakingNodesCardM.tsx b/src/ts/components/Cards/StakingNodesCardM.tsx
@@ -16,7 +16,7 @@ import {
 	SCardTitle,
 	SStakingButtonF,
 	SStakingButtonM,
-	SStakingInput
+	SStakingInputM
 } from './_styled';
 
 interface IProps {
@@ -194,7 +194,7 @@ export default class StakingNodesCardM extends React.Component<IProps, IState> {
 								justifyContent: 'space-between'
 							}}
 						>
-							<SStakingInput
+							<SStakingInputM
 								placeholder={StakingCST.STK_PLACEHODLER[locale]}
 								value={inputText}
 								onChange={e => this.handleInputChange(e.target.value)}

diff --git a/src/ts/components/Cards/StakingPersonalCard.tsx b/src/ts/components/Cards/StakingPersonalCard.tsx
@@ -45,9 +45,7 @@ export default class StakingPersonalCard extends React.Component<IProps> {
 						{StakingCST.STK_TITLE[locale]}
 						<span style={{ fontSize: 14, marginLeft: 10 }}>
 							{'(' +
-								StakingCST.STK_STAKE[locale] +
-								'/' +
-								StakingCST.STK_UNSTAKE[locale] +
+								StakingCST.STK_STATUS[locale] +
 								' ' +
 								(enabled
 									? StakingCST.STK_ENABLED[locale]
@@ -60,12 +58,21 @@ export default class StakingPersonalCard extends React.Component<IProps> {
 				margin="0 0 20px 0"
 			>
 				<div style={{ marginTop: 15 }}>
-					<img
-						style={{ width: 16, height: 16, marginRight: 10, marginLeft: 5 }}
-						src={avt}
-					/>
-					{StakingCST.STK_ADDRESS[locale]}:{' '}
-					<span style={{ color: '#5CA4DE' }}>{address}</span>
+					<a
+						style={{ color: 'rgba(0,0,0,.6)' }}
+						target="_blank"
+						href={
+							'https://etherscan.io/token/0x56e0b2c7694e6e10391e870774daa45cf6583486?a=' +
+							address
+						}
+					>
+						<img
+							style={{ width: 16, height: 16, marginRight: 10, marginLeft: 5 }}
+							src={avt}
+						/>
+						{StakingCST.STK_ADDRESS[locale]}:{' '}
+						<span style={{ color: '#5CA4DE' }}>{address}</span>
+					</a>
 				</div>
 				<img
 					style={{
@@ -133,7 +140,9 @@ export default class StakingPersonalCard extends React.Component<IProps> {
 							paddingBottom: 10
 						}}
 					>
-						<SStakingButtonM onClick={this.handleApprove}>{StakingCST.STK_APPROVE[locale]}</SStakingButtonM>
+						<SStakingButtonM onClick={this.handleApprove}>
+							{StakingCST.STK_APPROVE[locale]}
+						</SStakingButtonM>
 						<SStakingButtonM
 							style={{ cursor: !enabled ? 'not-allowed' : 'default' }}
 							onClick={() =>

diff --git a/src/ts/components/Cards/StakingPersonalCardM.tsx b/src/ts/components/Cards/StakingPersonalCardM.tsx
@@ -45,9 +45,7 @@ export default class StakingPersonalCardM extends React.Component<IProps> {
 						{StakingCST.STK_TITLE[locale]}
 						<span style={{ fontSize: 14, marginLeft: 10 }}>
 							{'(' +
-								StakingCST.STK_STAKE[locale] +
-								'/' +
-								StakingCST.STK_UNSTAKE[locale] +
+								StakingCST.STK_STATUS[locale] +
 								' ' +
 								(enabled
 									? StakingCST.STK_ENABLED[locale]
@@ -60,12 +58,18 @@ export default class StakingPersonalCardM extends React.Component<IProps> {
 				margin="10px 0 20px 0"
 			>
 				<div style={{ marginTop: 15 }}>
-					<img
-						style={{ width: 16, height: 16, marginRight: 10 }}
-						src={avt}
-					/>
-					{StakingCST.STK_ADDRESS[locale]}:{' '}
-					<div style={{ color: '#5CA4DE', marginTop: 10 }}>{address}</div>
+					<a
+						style={{ color: 'rgba(0,0,0,.6)' }}
+						target="_blank"
+						href={
+							'https://etherscan.io/token/0x56e0b2c7694e6e10391e870774daa45cf6583486?a=' +
+							address
+						}
+					>
+						<img style={{ width: 16, height: 16, marginRight: 10 }} src={avt} />
+						{StakingCST.STK_ADDRESS[locale]}:{' '}
+						<div style={{ color: '#5CA4DE', marginTop: 10 }}>{address}</div>
+					</a>
 				</div>
 				<img
 					style={{
@@ -78,7 +82,9 @@ export default class StakingPersonalCardM extends React.Component<IProps> {
 					src={duo3d}
 				/>
 				<div>
-					<SCardTag2 style={{ pointerEvents: 'none', width: '100%', paddingTop: 0, height: 75 }}>
+					<SCardTag2
+						style={{ pointerEvents: 'none', width: '100%', paddingTop: 0, height: 75 }}
+					>
 						<div className="bg-logo">
 							<img src={duoIcon} />
 						</div>
@@ -102,7 +108,9 @@ export default class StakingPersonalCardM extends React.Component<IProps> {
 							</div>
 						</div>
 					</SCardTag2>
-					<SCardTag2 style={{ pointerEvents: 'none', width: '100%', paddingTop: 0, height: 75 }}>
+					<SCardTag2
+						style={{ pointerEvents: 'none', width: '100%', paddingTop: 0, height: 75 }}
+					>
 						<div className="bg-logo">
 							<img src={duoIcon} />
 						</div>
@@ -135,7 +143,9 @@ export default class StakingPersonalCardM extends React.Component<IProps> {
 							paddingBottom: 10
 						}}
 					>
-						<SStakingButtonM style={{width: '45%'}} onClick={this.handleApprove}>{StakingCST.STK_APPROVE[locale]}</SStakingButtonM>
+						<SStakingButtonM style={{ width: '45%' }} onClick={this.handleApprove}>
+							{StakingCST.STK_APPROVE[locale]}
+						</SStakingButtonM>
 						<SStakingButtonM
 							style={{ cursor: !enabled ? 'not-allowed' : 'default', width: '45%' }}
 							onClick={() =>

diff --git a/src/ts/components/Cards/_styled.tsx b/src/ts/components/Cards/_styled.tsx
@@ -680,6 +680,22 @@ export const SStakingInput = styled.input`
 	border: 1px solid rgba(180,180,180,1);
 	border-radius: 3px;
 `;
+export const SStakingInputM = styled.input`
+ 	&::placeholder {
+		font-size: 14px;
+		color: rgba(0,0,0,.3);
+	}
+	&:focus {
+		box-shadow: 0 0 0 2px rgba(125, 196, 252, .8)
+	}
+	font-size: 14px;
+	line-height:24px;
+	padding-left: 5px;
+	height: 24px;
+	outline: none;
+	border: 1px solid rgba(180,180,180,1);
+	border-radius: 3px;
+`;
 
 export interface ICardAssetTagProps {
 	mobile?: boolean;