diff --git a/src/app.js b/src/app.js index b98e337623..c74aceaf2d 100644 --- a/src/app.js +++ b/src/app.js @@ -65,12 +65,8 @@ var css = csjs` html { box-sizing: border-box; } *, *:before, *:after { box-sizing: inherit; } body { - font: 14px/1.5 Lato, "Helvetica Neue", Helvetica, Arial, sans-serif; - margin : 0; - padding : 0; - font-size : 12px; - color : ${styles.leftPanel.text_Primary}; - font-weight : normal; + /* font: 14px/1.5 Lato, "Helvetica Neue", Helvetica, Arial, sans-serif; */ + font-size : .8rem; } pre { overflow-x: auto; diff --git a/src/app/tabs/settings-tab.js b/src/app/tabs/settings-tab.js index 619cf06452..3c1f656b48 100644 --- a/src/app/tabs/settings-tab.js +++ b/src/app/tabs/settings-tab.js @@ -6,7 +6,7 @@ var globalRegistry = require('../../global/registry') var tooltip = require('../ui/tooltip') var copyToClipboard = require('../ui/copy-to-clipboard') var styleGuide = require('../ui/styles-guide/theme-chooser') -var styles = styleGuide.chooser() +// var styles = styleGuide.chooser() var Storage = remixLib.Storage var EventManager = require('../../lib/events') @@ -52,79 +52,85 @@ module.exports = class SettingsTab { if (self._view.el) return self._view.el // Gist settings - var gistAccessToken = yo`` + var gistAccessToken = yo`` var token = self._deps.config.get('settings/gist-access-token') if (token) gistAccessToken.value = token - var gistAddToken = yo` { self._deps.config.set('settings/gist-access-token', gistAccessToken.value); tooltip('Access token saved') }} value="Save" type="button">` - var gistRemoveToken = yo` { gistAccessToken.value = ''; self._deps.config.set('settings/gist-access-token', ''); tooltip('Access token removed') }} value="Remove" type="button">` + var gistAddToken = yo` { self._deps.config.set('settings/gist-access-token', gistAccessToken.value); tooltip('Access token saved') }} value="Save" type="button">` + var gistRemoveToken = yo` { gistAccessToken.value = ''; self._deps.config.set('settings/gist-access-token', ''); tooltip('Access token removed') }} value="Remove" type="button">` self._view.gistToken = yo`
${gistAccessToken}${copyToClipboard(() => self._deps.config.get('settings/gist-access-token'))}${gistAddToken}${gistRemoveToken}
` // - self._view.optionVM = yo`` + self._view.optionVM = yo`` if (self._deps.config.get('settings/always-use-vm')) self._view.optionVM.setAttribute('checked', '') - self._view.personal = yo`` + self._view.personal = yo`` if (self._deps.config.get('settings/personal-mode')) self._view.personal.setAttribute('checked', '') var warnText = `Transaction sent over Web3 will use the web3.personal API - be sure the endpoint is opened before enabling it. This mode allows to provide the passphrase in the Remix interface without having to unlock the account. Although this is very convenient, you should completely trust the backend you are connected to (Geth, Parity, ...). It is not recommended (and also most likely not relevant) to use this mode with an injected provider (Mist, Metamask, ...) or with JavaScript VM. Remix never persist any passphrase.`.split('\n').map(s => s.trim()).join(' ') - self._view.warnPersonalMode = yo`` - self._view.generateContractMetadata = yo`` + self._view.warnPersonalMode = yo`` + self._view.generateContractMetadata = yo`` + if (self._deps.config.get('settings/generate-contract-metadata')) self._view.generateContractMetadata.setAttribute('checked', '') + self._view.pluginInput = yo`` - self._view.theme.light = yo`` - self._view.theme.dark = yo`` - self._view.theme.clean = yo`` + self._view.theme.light = yo`` + self._view.theme.dark = yo`` + self._view.theme.clean = yo`` self._view.theme[self.data.currentTheme].setAttribute('checked', 'checked') self._view.config.general = yo` -
-
General settings
-
+
+
+
General settings
+
${self._view.generateContractMetadata}
- Generate contract metadata. Generate a JSON file in the contract folder. Allows to specify library addresses the contract depends on. If nothing is specified, Remix deploys libraries automatically. +
-
+
${self._view.optionVM}
- Always use Ethereum VM at Load +
-
-
- Text Wrap +
+
+
-
+
${self._view.personal}>
- Enable Personal Mode ${self._view.warnPersonalMode}> +
+
` self._view.gistToken = yo` -
-
Gist Access Token
-
Manage the access token used to publish to Gist and retrieve Github contents.
-
Go to github token page (link below) to create a new token and save it in Remix. Make sure this token has only 'create gist' permission.
-
https://github.com/settings/tokens
-
${self._view.gistToken}
+
+
+
Gist Access Token
+

Manage the access token used to publish to Gist and retrieve Github contents.

+

Go to github token page (link below) to create a new token and save it in Remix. Make sure this token has only 'create gist' permission.

+

https://github.com/settings/tokens

+
${self._view.gistToken}
+
` self._view.config.themes = yo` -
-
Themes
-
- - Selecting a theme will trigger a page reload -
-
- ${self._view.theme.light} - -
-
- ${self._view.theme.dark} - -
-
- ${self._view.theme.clean} - +
+
+
Themes
+
+
+ ${self._view.theme.light} + +
+
+ ${self._view.theme.dark} + +
+
+ ${self._view.theme.clean} + +
+
` self._view.el = yo` @@ -164,20 +170,26 @@ const css = csjs` padding: 2%; } .info { - ${styles.rightPanel.settingsTab.box_SolidityVersionInfo}; - margin-bottom: 1em; + margin-bottom: .6rem; word-break: break-word; + font-size: .8rem; + } + .info h7 { + margin-bottom: .5rem; } .title { - font-size: 1.1em; - font-weight: bold; - margin-bottom: 1em; + // font-size: 1.1em; + // font-weight: bold; + // margin-bottom: 1em; + } + .frow { + margin-bottom: .5rem; } .crow { - display: flex; - overflow: auto; - clear: both; - padding: .2em; + // display: flex; + // overflow: auto; + // clear: both; + // padding: .2em; } .checkboxText { font-weight: normal; @@ -212,27 +224,10 @@ const css = csjs` .pluginTextArea { font-family: unset; } - .pluginLoad { - vertical-align: top; - ${styles.rightPanel.settingsTab.button_LoadPlugin}; - width: inherit; - display: inline-block; - } - .initPlugin { - vertical-align: top; - ${styles.rightPanel.settingsTab.button_initPlugin}; - width: inherit; - display: block; - max-height: inherit; - padding:7px; - } .removePlugin { cursor: pointer; } - i.warnIt { - color: ${styles.appProperties.warningText_Color}; - } .icon { margin-right: .5em; } @@ -250,16 +245,13 @@ const css = csjs` white-space: nowrap; vertical-align: middle; } - .pluginLoad { - vertical-align: top; - max-height: inherit; - margin: 2px; - - } .removePlugin{ padding-left: 7px; padding-right: 7px; - border-left: 2px solid ${styles.appProperties.primary_BackgroundColor}; margin-left: 10px; } + .inline { + display: inline; + width: 50%; + } ` diff --git a/src/app/ui/styles-guide/theme-chooser.js b/src/app/ui/styles-guide/theme-chooser.js index 2dc60d3b74..59f06246fe 100644 --- a/src/app/ui/styles-guide/theme-chooser.js +++ b/src/app/ui/styles-guide/theme-chooser.js @@ -8,7 +8,7 @@ var Storage = require('remix-lib').Storage const themes = { dark: 'https://bootstrap.themes.guide/darkster/theme.min.css', light: 'https://bootstrap.themes.guide/herbie/theme.min.css', - clean: 'https://bootstrap.themes.guide/signal/theme.min.css' + clean: 'https://bootstrap.themes.guide/fresca/theme.min.css' } // Used for the scroll color const themeVariable = {