Merge pull request #663 from ethereum/compileRunTab6

Compile run tab - 6
pull/1/head
yann300 7 years ago committed by GitHub
commit 3b17684ed8
  1. 123
      assets/css/browser-solidity.css
  2. 114
      assets/css/universal-dapp.css

@ -42,27 +42,37 @@
display: inline-block; display: inline-block;
} }
#header { #righthand-panel {
top: 0;
right: 0;
bottom: 0;
box-sizing: border-box;
overflow: hidden;
}
#righthand-panel {
font-size: 13px; font-size: 13px;
height: 100%; display: flex;
flex-direction: column;
} }
#header #solIcon { #righthand-panel #solIcon {
float: right; float: right;
height: 90%; height: 90%;
background-color: white; background-color: white;
padding-right: 1%; padding-right: 1%;
} }
#header #menu { #righthand-panel #menu {
border-bottom: 3px solid #F4F6FF; border-bottom: 3px solid #F4F6FF;
height: 2em; height: 2em;
font-size: 1em; font-size: 1em;
padding-top: 0.5em; padding-top: 0.5em;
box-sizing: content-box; box-sizing: content-box;
display: flex;
} }
#header #options { #righthand-panel #options {
list-style: none; list-style: none;
margin: 0; margin: 0;
padding: 0; padding: 0;
@ -70,55 +80,58 @@
justify-content: space-between; justify-content: space-between;
} }
#header #options li.active { #righthand-panel #options li.active {
background-color: #F4F6FF; background-color: #F4F6FF;
} }
#header #options li a { #righthand-panel #options li a {
color: inherit; color: inherit;
} }
#header #optionViews { #righthand-panel #optionViews {
clear: both;
overflow: auto;
background-color: #F4F6FF; background-color: #F4F6FF;
overflow: scroll;
height: 100%; height: 100%;
} }
#header #optionViews > div { #righthand-panel #optionViews > div {
display: none; display: none;
} }
#header #optionViews.txView #txView { #righthand-panel #optionViews.txView #txView {
display: block;
}
#righthand-panel #optionViews.settingsView #settingsView {
display: block; display: block;
} }
#header #optionViews.settingsView #settingsView { #righthand-panel #optionViews.publishView #publishView {
display: block; display: block;
} }
#header #optionViews.publishView #publishView { #righthand-panel #optionViews.compileView #compileTabView {
display: block; display: block;
} }
#header #optionViews.envView #envView { #righthand-panel #optionViews.runView #runTabView {
display: block; display: block;
} }
#header #optionViews.debugView #debugView { #righthand-panel #optionViews.debugView #debugView {
display: block; display: block;
} }
#header #optionViews.verificationView #verificationView { #righthand-panel #optionViews.verificationView #verificationView {
display: block; display: block;
} }
#header #optionViews.staticanalysisView #staticanalysisView { #righthand-panel #optionViews.staticanalysisView #staticanalysisView {
display: block; display: block;
} }
#header #optionViews.txView input, #righthand-panel #optionViews.txView input,
#header #optionViews.txView select { #righthand-panel #optionViews.txView select {
max-width: 13em; max-width: 13em;
padding: 0.3em; padding: 0.3em;
box-sizing: border-box; box-sizing: border-box;
@ -126,7 +139,7 @@
border-radius: 3px; border-radius: 3px;
} }
#header #optionViews .pre { #righthand-panel #optionViews .pre {
word-wrap: break-word; word-wrap: break-word;
background-color: rgba(255, 255, 255, 0.5); background-color: rgba(255, 255, 255, 0.5);
font-family: monospace; font-family: monospace;
@ -135,11 +148,11 @@
padding: 0 0.6em; padding: 0 0.6em;
} }
#header #optionViews .hide { #righthand-panel #optionViews .hide {
display: none; display: none;
} }
#header .info { #righthand-panel .info {
font-family: monospace; font-family: monospace;
min-height: 6em; min-height: 6em;
padding: 0.25em 0; padding: 0.25em 0;
@ -158,31 +171,6 @@
cursor: pointer; cursor: pointer;
} }
#publishView button {
background-color: #C6CFF7;
font-size: 12px;
margin-bottom: .5em;
color: black;
border:0 none;
border-radius: 3px;
width: 8em;
height: 20px;
margin-right: 1em;
cursor: pointer;
}
#staticanalysisView button {
background-color: #C6CFF7;
font-size: 12px;
padding: 0.25em;
margin: 2em 1em .5em 0;
color: black;
border:0 none;
border-radius: 3px;
width: 8em;
cursor: pointer;
}
#debugView button { #debugView button {
background-color: #C6CFF7; background-color: #C6CFF7;
font-size: 12px; font-size: 12px;
@ -207,7 +195,7 @@
font-weight: bold; font-weight: bold;
} }
#header #versionSelector { #righthand-panel #versionSelector {
text-decoration: none; text-decoration: none;
background-color: #C6CFF7; background-color: #C6CFF7;
cursor: pointer; cursor: pointer;
@ -269,6 +257,7 @@
margin-bottom: 1em; margin-bottom: 1em;
} }
.sol.success,
.sol.error, .sol.error,
.sol.warning { .sol.warning {
word-wrap: break-word; word-wrap: break-word;
@ -280,6 +269,7 @@
padding: 8px 15px; padding: 8px 15px;
} }
.sol.success pre,
.sol.error pre, .sol.error pre,
.sol.warning pre { .sol.warning pre {
background-color: transparent; background-color: transparent;
@ -290,6 +280,7 @@
border-radius: 0; border-radius: 0;
} }
.sol.success .close,
.sol.error .close, .sol.error .close,
.sol.warning .close { .sol.warning .close {
font-weight: bold; font-weight: bold;
@ -310,6 +301,22 @@
border: .2em dotted #ffbd01; border: .2em dotted #ffbd01;
} }
.sol.success {
background-color: hsla(59, 56%, 78%, 0.5);
border: .2em dotted green;
}
#ghostbar {
width: 1px;
background-color: red;
opacity: 0.5;
position: absolute;
cursor: col-resize;
z-index: 9999;
top: 0;
bottom: 0;
}
input[readonly] { input[readonly] {
display: block; display: block;
width: 100%; width: 100%;
@ -355,8 +362,13 @@ input[type="file"] {
/* Modal Header */ /* Modal Header */
.modal-header { .modal-header {
padding: 2px 16px; padding: 2px 16px;
background-color: orange; background-color: hsla(59, 56%, 78%, 0.5);
border-top-right-radius: 3px;
border-top-left-radius: 3px;
color: white; color: white;
display: flex;
align-items: baseline;
justify-content: space-between;
} }
/* Modal Body */ /* Modal Body */
@ -365,8 +377,10 @@ input[type="file"] {
/* Modal Footer */ /* Modal Footer */
.modal-footer { .modal-footer {
padding: 2px 16px; padding: 2px 16px;
background-color: orange; background-color: hsla(59, 56%, 78%, 0.5);
color: white; color: black;
display: flex;
justify-content: flex-end;
} }
/* Modal Content */ /* Modal Content */
@ -375,13 +389,14 @@ input[type="file"] {
background-color: #fefefe; background-color: #fefefe;
margin: auto; margin: auto;
padding: 0; padding: 0;
border: 1px solid #888; border-top-right-radius: 3px;
border-top-left-radius: 3px;
width: 50%; width: 50%;
box-shadow: 0 4px 8px 0 rgba(0,0,0,0.2),0 6px 20px 0 rgba(0,0,0,0.19); box-shadow: 0 4px 8px 0 rgba(0,0,0,0.2),0 6px 20px 0 rgba(0,0,0,0.19);
-webkit-animation-name: animatetop; -webkit-animation-name: animatetop;
-webkit-animation-duration: 0.4s; -webkit-animation-duration: 0.4s;
animation-name: animatetop; animation-name: animatetop;
animation-duration: 0.4s animation-duration: 0.4s;
} }
#modal-footer-cancel { #modal-footer-cancel {

@ -93,19 +93,6 @@
display: none; display: none;
} }
.udapp-close:before {
position: absolute;
font-family: monospace;
top: .4em;
right: .4em;
width: 1.5em;
height: 1.5em;
text-align: center;
content: "x";
cursor: pointer;
z-index: 9999;
}
.udapp .instance { .udapp .instance {
padding: 0.4em; padding: 0.4em;
background-color: rgb(244, 246, 255); background-color: rgb(244, 246, 255);
@ -144,7 +131,7 @@
content: "\25B6"; content: "\25B6";
} }
.udapp .contractProperty { #runTabView .contractProperty {
overflow: auto; overflow: auto;
margin-bottom: 0.4em; margin-bottom: 0.4em;
} }
@ -187,69 +174,84 @@
.udapp .instance input, .udapp .instance input,
.udapp .instance button { .udapp .instance button {
width: 50%; width: 25%;
float: left; float: left;
box-sizing: border-box; box-sizing: border-box;
} }
.udapp .contractProperty.hasArgs input { #runTabView .contractProperty.hasArgs input {
width: 75%; width: 75%;
padding: .36em;
} }
.udapp .contractProperty button { #runTabView .contractProperty button {
border-radius : 3px;
border : .3px solid #dddddd;
cursor : pointer;
min-height : 25px;
max-height : 25px;
padding : 3px;
min-width : 100px;
width : 25%; width : 25%;
font-size : 10px;
} }
.udapp .contractProperty button.debug { #runTabView .contractProperty button.debug {
width: 12em; width: 12em;
} }
.udapp .contractProperty button:disabled { #runTabView .contractProperty button:disabled {
cursor: not-allowed; cursor: not-allowed;
background-color: white; background-color: white;
border-color: lightgray; border-color: lightgray;
} }
.udapp .contractProperty .call { #runTabView .contractProperty .call {
background-color: #FFB9B9; background-color: #FFB9B9;
border-color: #FFB9B9; border-color: #FFB9B9;
} }
.udapp .contractProperty .debug { #runTabView .contractProperty .debug {
background-color: #9DC1F5; background-color: #9DC1F5;
border-color: #9DC1F5; border-color: #9DC1F5;
} }
.udapp .contractProperty.constant .call { #runTabView .contractProperty.constant .call {
background-color: #9DC1F5; background-color: #9DC1F5;
border-color: #9DC1F5; border-color: #9DC1F5;
width: 25%; width: 25%;
font-style: italic;
outline: none;
} }
.udapp .contractProperty.payable .call { #runTabView .contractProperty.payable .call {
background-color: #FF8B8B; background-color: #FF8B8B;
border-color: #FF8B8B; border-color: #FF8B8B;
width: 25%; width: 25%;
} }
.udapp .contractProperty input { #runTabView .contractProperty input {
display: none; display: none;
} }
.udapp .contractProperty > .value { #runTabView .contractProperty > .value {
padding: 0 0.4em; padding: 0 0.4em;
box-sizing: border-box; box-sizing: border-box;
width: 75%; width: 25%;
float: left; float: left;
word-wrap: break-word; word-wrap: break-word;
} }
.udapp .contractProperty.hasArgs input { #runTabView .contractProperty.hasArgs input {
display: block; display: block;
border-top-left-radius: 0; border: 1px solid #dddddd;
border-bottom-left-radius: 0; padding: .36em;
border-left: none;
padding: 8px 8px 8px 10px;
font-size: 10px;
height: 25px;
} }
.udapp .contractProperty.hasArgs button { #runTabView .contractProperty.hasArgs button {
border-top-right-radius: 0; border-top-right-radius: 0;
border-bottom-right-radius: 0; border-bottom-right-radius: 0;
border-right: 0; border-right: 0;
@ -276,55 +278,3 @@
.udapp .events .event .name { .udapp .events .event .name {
margin-right: 0.5em; margin-right: 0.5em;
} }
.udapp .legend {
background-color: white;
line-height: 20px;
border: .2em dotted lightGrey;
padding: 8px 15px;
border-radius: 5px;
margin-bottom: 1em;
display: flex;
justify-content: initial;
flex-wrap: wrap;
}
.udapp .legend div {
display: inline-block;
margin-right: 0.5em;
display: flex;
align-items: center;
line-height: 0px;
padding: 5px;
}
.udapp .legend div:before {
content: ".";
color: transparent;
display: inline-block;
background-color: #ccc;
height: 1em;
margin-right: 0.5em;
width: 1em;
border-radius: 50%;
}
.udapp .legend .publish:before {
background-color: #EC96EC;
}
.udapp .legend .attach:before {
background-color: #B1EAC5;
}
.udapp .legend .transact:before {
background-color: #FFB9B9;
}
.udapp .legend .payable:before {
background-color: #FF8B8B;
}
.udapp .legend .call:before {
background-color: #9DC1F5;
}

Loading…
Cancel
Save