grassrootseconomics/openethereum
5
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

Adjust tx overlay colours (#5353)

Browse Source 
* Adjust tx overlay colours

* Adjust sizes to be consistent

* Formatting
This commit is contained in:
Jaco Greeff 2017-03-31 23:32:03 +02:00 committed by Gav Wood
parent 8b0f9759ec
commit 73dc52980e
2 changed files with 28 additions and 19 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

15
js/src/views/Application/Requests/requests.css
View File

@ -15,8 +15,9 @@
/* along with Parity. If not, see <http://www.gnu.org/licenses/>. /* along with Parity. If not, see <http://www.gnu.org/licenses/>.
*/ */
$baseColor: 255; $baseColor: 18;
$baseOpacity: 0.95; $baseOpacity: 0.95;
$borderColor: rgba($baseColor, $baseColor, $baseColor, 0.25);
.requests { .requests {
align-items: flex-end; align-items: flex-end;
@ -25,6 +26,7 @@ $baseOpacity: 0.95;
flex-direction: column; flex-direction: column;
position: fixed; position: fixed;
right: 0.175em; right: 0.175em;
width: 24em;
z-index: 750; z-index: 750;
* { * {
@ -36,10 +38,11 @@ $baseOpacity: 0.95;
animation-fill-mode: forwards; animation-fill-mode: forwards;
animation-timing-function: cubic-bezier(0.7, 0, 0.3, 1); animation-timing-function: cubic-bezier(0.7, 0, 0.3, 1);
background-color: rgba($baseColor, $baseColor, $baseColor, $baseOpacity); background-color: rgba($baseColor, $baseColor, $baseColor, $baseOpacity);
color: black; border: 4px solid $borderColor;
cursor: pointer; cursor: pointer;
margin-top: 0.5em; margin-top: 0.25em;
opacity: 1; opacity: 1;
width: 100%;
&.hide { &.hide {
animation-duration: 0.5s; animation-duration: 0.5s;
@ -58,11 +61,7 @@ $baseOpacity: 0.95;
.container { .container {
display: flex; display: flex;
flex-direction: row; flex-direction: row;
padding: 1em; padding: 1em 1em 0.5em 1em;
* {
color: black !important;
}
} }
&:hover .container { &:hover .container {

32
js/src/views/Application/Requests/requests.js
View File

@ -46,7 +46,11 @@ class Requests extends Component {
return ( return (
<div className={ styles.requests }> <div className={ styles.requests }>
{ Object.values(requests).map((request) => this.renderRequest(request, extras[request.requestId])) } {
Object
.values(requests)
.map((request) => this.renderRequest(request, extras[request.requestId]))
}
</div> </div>
); );
} }
@ -94,17 +98,20 @@ class Requests extends Component {
</div> </div>
{ {
state.type === ERROR_STATE state.type === ERROR_STATE
? null ? null
: ( : (
<LinearProgress <LinearProgress
max={ 6 } max={ 6 }
mode={ state.type === WAITING_STATE ? 'indeterminate' : 'determinate' } mode={ state.type === WAITING_STATE ? 'indeterminate' : 'determinate' }
value={ state.type === DONE_STATE ? request.blockHeight.toNumber() : 6 } value={ state.type === DONE_STATE ? request.blockHeight.toNumber() : 6 }
/> />
) )
} }
<div className={ styles.container }> <div className={ styles.container }>
<div className={ styles.identity } title={ transaction.from }> <div
className={ styles.identity }
title={ transaction.from }
>
<IdentityIcon <IdentityIcon
address={ transaction.from } address={ transaction.from }
inline inline
@ -230,4 +237,7 @@ function mapDispatchToProps (dispatch) {
}, dispatch); }, dispatch);
} }
export default connect(mapStateToProps, mapDispatchToProps)(Requests); export default connect(
mapStateToProps,
mapDispatchToProps
)(Requests);