mirror
/
remix-project
mirror of https://github.com/ethereum/remix-project.git
2
0
Fork 0
Code Issues Releases Wiki Activity

Add solidity compiler styles

Browse Source
pull/1/head
alexcherman 5 years ago committed by LianaHus
parent e8104d93ea
commit b0b674c210
4 changed files with 57 additions and 70 deletions
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Show Stats Download Patch File Download Diff File
  1. 1
      src/app/components/side-panel.js
  2. 18
      src/app/tabs/compile-tab.js
  3. 77
      src/app/tabs/compileTab/compilerContainer.js
  4. 19
      src/app/tabs/styles/compile-tab-styles.js

1
src/app/components/side-panel.js
Unescape View File

@ -34,6 +34,7 @@ const css = csjs`
.pluginsContainer { .pluginsContainer {
height: 100%; height: 100%;
overflow-y: auto; overflow-y: auto;
padding-top: 24px;
} }
.titleInfo { .titleInfo {
padding-left: 10px; padding-left: 10px;

18
src/app/tabs/compile-tab.js
View File

File diff suppressed because one or more lines are too long

77
src/app/tabs/compileTab/compilerContainer.js
Unescape View File

@ -121,16 +121,11 @@ class CompilerContainer {
compilationButton (name = '') { compilationButton (name = '') {
const displayed = name || '<no file selected>' const displayed = name || '<no file selected>'
const disabled = name && this.isSolFileSelected() ? '' : 'disabled' const disabled = name && this.isSolFileSelected() ? '' : 'disabled'
const compileBtn = yo` return yo`
<button id="compileBtn" data-id="compilerContainerCompileBtn" class="btn btn-primary btn-block ${disabled}" title="Compile" onclick="${this.compile.bind(this)}"> <button id="compileBtn" data-id="compilerContainerCompileBtn" class="btn btn-primary btn-block ${disabled} mt-3" title="Compile" onclick="${this.compile.bind(this)}">
<span>${this._view.compileIcon} Compile ${displayed}</span> <span>${this._view.compileIcon} Compile ${displayed}</span>
</button> </button>
` `
return yo`
<div class="px-2 mt-2 pb-0 d-flex">
${compileBtn}
</div>
`
} }
_disableCompileBtn (shouldDisable) { _disableCompileBtn (shouldDisable) {
@ -238,67 +233,51 @@ class CompilerContainer {
this._view.compilationButton = this.compilationButton() this._view.compilationButton = this.compilationButton()
this._view.includeNightlies = yo` this._view.includeNightlies = yo`
<input class="mr-0 ml-1" id="nightlies" type="checkbox" onchange=${() => this._updateVersionSelector()}> <input class="mr-2" id="nightlies" type="checkbox" onchange=${() => this._updateVersionSelector()}>
` `
this._view.compileContainer = yo` this._view.compileContainer = yo`
<section> <section>
<!-- Select Compiler Version --> <!-- Select Compiler Version -->
<article> <article>
<header class="navbar navbar-light p-2 bg-light"> <header class="${css.compilerSection} border-bottom">
<div class="row w-100 no-gutters mb-2"> <div class="mb-2">
<div class="col-sm-4"> <label class="${css.compilerLabel} form-check-label" for="versionSelector">
<div class="d-flex flex-row justify-content-end">
<label class="${css.compilerLabel} form-check-label input-group-text pr-0 border-0 w-100" for="versionSelector">
<button class="far fa-plus-square border-0 p-0 mx-2 btn-sm" onclick="${(e) => this.promtCompiler(e)}" title="Add a custom compiler with URL"></button>
Compiler Compiler
<button class="far fa-plus-square border-0 p-0 mx-2 btn-sm" onclick="${(e) => this.promtCompiler(e)}" title="Add a custom compiler with URL"></button>
</label> </label>
</div>
</div>
<div class="col-sm-8">
${this._view.versionSelector} ${this._view.versionSelector}
<div class="pt-0 ${css.nightlyBuilds}">
<label for="nightlies" class="text-dark p-0 m-0 form-check-label">Include nightly builds</label>
${this._view.includeNightlies}
</div> </div>
<div class="mb-2 ${css.nightlyBuilds}">
${this._view.includeNightlies}
<label for="nightlies" class="form-check-label">Include nightly builds</label>
</div> </div>
</div> <div class="mb-2">
<div class="row w-100 no-gutters mb-2"> <label class="${css.compilerLabel} form-check-label" for="compilierLanguageSelector">Language</label>
<div class="col-sm-4">
<label class="${css.compilerLabel} form-check-label input-group-text pl-0 border-0" for="compilierLanguageSelector">Language</label>
</div>
<div class="col-sm-8">
${this._view.languageSelector} ${this._view.languageSelector}
</div> </div>
<div class="mb-2">
<label class="${css.compilerLabel} form-check-label" for="evmVersionSelector">EVM Version</label>
${this._view.evmVersionSelector}
</div> </div>
<div class="row w-100 no-gutters"> <div class="mt-3">
<div class="col-sm-4"> <p class="mt-2 ${css.compilerLabel}">Compiler Configuration</p>
<label class="${css.compilerLabel} form-check-label input-group-text pl-0 border-0" for="evmVersionSelector">EVM Version</label> <div class="mt-2 ${css.compilerConfig}">
${this._view.autoCompile}
<label class="ml-2 form-check-label" for="autoCompile">Auto compile</label>
</div> </div>
<div class="col-sm-8"> <div class="mt-2 ${css.compilerConfig}">
${this._view.evmVersionSelector} ${this._view.optimize}
<label class="ml-2 form-check-label" for="optimize">Enable optimization</label>
</div>
<div class="mt-2 ${css.compilerConfig}">
${this._view.hideWarningsBox}
<label class="ml-2 form-check-label" for="hideWarningsBox">Hide warnings</label>
</div> </div>
</div> </div>
</header>
${this._view.compilationButton} ${this._view.compilationButton}
</header>
</article> </article>
<!-- Config --> <!-- Config -->
<article class="p-2">
<small class="${css.compilerSm}">Compiler Configuration</small>
<ul class="list-group list-group-flush">
<li class="list-group-item form-group ${css.compilerConfig}">
${this._view.autoCompile}
<label class="form-check-label" for="autoCompile">Auto compile</label>
</li>
<li class="list-group-item form-group ${css.compilerConfig}">
${this._view.optimize}
<label class="form-check-label" for="optimize">Enable optimization</label>
</li>
<li class="list-group-item form-group ${css.compilerConfig}">
${this._view.hideWarningsBox}
<label class="form-check-label" for="hideWarningsBox">Hide warnings</label>
</li>
</ul>
</article>
</section>` </section>`
return this._view.compileContainer return this._view.compileContainer

19
src/app/tabs/styles/compile-tab-styles.js
Unescape View File

@ -37,8 +37,6 @@ const css = csjs`
.nightlyBuilds { .nightlyBuilds {
display: flex; display: flex;
flex-direction: row; flex-direction: row;
justify-content: flex-end;
align-content: center;
align-items: center; align-items: center;
} }
.autocompileContainer { .autocompileContainer {
@ -71,11 +69,20 @@ const css = csjs`
.compilerConfig label { .compilerConfig label {
margin: 0; margin: 0;
} }
.compilerSm { .compilerSection {
padding-left: 1.25rem; padding: 0 24px 16px;
} }
.compilerLabel { .compilerLabel {
direction: rtl; margin-bottom: 2px;
font-size: 11px;
line-height: 12px;
text-transform: uppercase;
}
.copyButton {
padding: 6px;
font-weight: bold;
font-size: 11px;
line-height: 15px;
} }
.name { .name {
display: flex; display: flex;
@ -107,7 +114,7 @@ const css = csjs`
align-items: center; align-items: center;
} }
.contractHelperButtons { .contractHelperButtons {
margin-top: 10px; margin-top: 6px;
display: flex; display: flex;
align-items: center; align-items: center;
justify-content: space-between; justify-content: space-between;

Write Preview
Loading…
Cancel
Save