From 9fa10f7892846443a3e9a846acd7336126468060 Mon Sep 17 00:00:00 2001 From: lianahus Date: Tue, 22 Jun 2021 09:29:54 +0200 Subject: [PATCH] example added some steps fixed the margines new class for tour --- apps/remix-ide/src/app.js | 31 ++++++++++--------- .../src/app/components/vertical-icons.js | 16 +++++----- apps/remix-ide/src/index.html | 3 +- .../workspace/src/lib/remix-ui-workspace.css | 1 + package-lock.json | 6 ++-- package.json | 2 +- 6 files changed, 32 insertions(+), 27 deletions(-) diff --git a/apps/remix-ide/src/app.js b/apps/remix-ide/src/app.js index f965ee3071..04a52ff91a 100644 --- a/apps/remix-ide/src/app.js +++ b/apps/remix-ide/src/app.js @@ -7,6 +7,7 @@ import PanelsResize from './lib/panels-resize' import { RemixEngine } from './remixEngine' import { RemixAppManager } from './remixAppManager' import { FramingService } from './framingService' +import { WalkthroughService } from './walkthroughService' import { MainView } from './app/panels/main-view' import { ThemeModule } from './app/tabs/theme-module' import { NetworkModule } from './app/tabs/network-module' @@ -20,7 +21,6 @@ import { MainPanel } from './app/components/main-panel' import { OffsetToLineColumnConverter, CompilerMetadata, CompilerArtefacts, FetchAndCompile, CompilerImports } from '@remix-project/core-plugin' import migrateFileSystem from './migrateFileSystem' -const introJs = require('intro.js') const isElectron = require('is-electron') const csjs = require('csjs-inject') @@ -113,7 +113,11 @@ const css = csjs` fill: var(--secondary); } .centered svg polygon { - fill: var(--secondary); + fill : var(--secondary); + } + .onboarding { + color : var(--text-info); + background-color : var(--info) } .matomoBtn { width : 100px; @@ -127,11 +131,11 @@ class App { self._components = {} self._view = {} self._view.splashScreen = yo` -
- ${basicLogo()} -
- REMIX IDE -
+
+ ${basicLogo()} +
+ REMIX IDE +
` document.body.appendChild(self._view.splashScreen) @@ -497,13 +501,12 @@ Please make a backup of your contracts and start using http://remix.ethereum.org // Load and start the service who manager layout and frame const framingService = new FramingService(sidePanel, menuicons, mainview, this._components.resizeFeature) - framingService.start(params) if (params.embed) framingService.embed() - //if (!params) { - if (!localStorage.getItem('hadTour_initial')) { - introJs().start() - localStorage.setItem('hadTour_initial', true) - } - //} + framingService.start(params) + + const walkthroughService = new WalkthroughService(localStorage) + if (!params.code) { + walkthroughService.start() + } } diff --git a/apps/remix-ide/src/app/components/vertical-icons.js b/apps/remix-ide/src/app/components/vertical-icons.js index 04ea78e5f6..54b77f9720 100644 --- a/apps/remix-ide/src/app/components/vertical-icons.js +++ b/apps/remix-ide/src/app/components/vertical-icons.js @@ -69,12 +69,14 @@ export class VerticalIcons extends Plugin { title = title.replace(/^\w/, c => c.toUpperCase()) this.icons[name] = yo`
+ data-id="verticalIconsKind${name}" + id="verticalIconsKind${name}" + > ${name}
` this.iconKind[kind || 'none'].appendChild(this.icons[name]) @@ -249,13 +251,14 @@ export class VerticalIcons extends Plugin { render () { const home = yo`
${basicLogo()}
@@ -270,8 +273,8 @@ export class VerticalIcons extends Plugin { this.iconKind.settings = yo`
` this.view = yo` -
-
+
+
${home} ${this.iconKind.fileexplorer} ${this.iconKind.compiler} @@ -294,7 +297,6 @@ const css = csjs` width: 42px; height: 42px; margin-bottom: 20px; - margin-left: -5px; cursor: pointer; } .homeIcon svg path { @@ -304,8 +306,6 @@ const css = csjs` fill: var(--primary); } .icons { - margin-left: 10px; - margin-top: 15px; } .icon { cursor: pointer; diff --git a/apps/remix-ide/src/index.html b/apps/remix-ide/src/index.html index dd238f72b8..7322cb46a5 100644 --- a/apps/remix-ide/src/index.html +++ b/apps/remix-ide/src/index.html @@ -30,6 +30,7 @@ Remix - Ethereum IDE + @@ -117,6 +118,6 @@ - + diff --git a/libs/remix-ui/workspace/src/lib/remix-ui-workspace.css b/libs/remix-ui/workspace/src/lib/remix-ui-workspace.css index f190b84fac..534da8bca6 100644 --- a/libs/remix-ui/workspace/src/lib/remix-ui-workspace.css +++ b/libs/remix-ui/workspace/src/lib/remix-ui-workspace.css @@ -11,6 +11,7 @@ position : relative; width : 100%; padding-left : 6px; + padding-right : 6px; padding-top : 6px; } .remixui_fileExplorerTree { diff --git a/package-lock.json b/package-lock.json index 49a7464213..8fae619e36 100644 --- a/package-lock.json +++ b/package-lock.json @@ -20125,9 +20125,9 @@ "integrity": "sha512-agE4QfB2Lkp9uICn7BAqoscw4SZP9kTE2hxiFI3jBPmXJfdqiahTbUuKGsMoN2GtqL9AxhYioAcVvgsb1HvRbA==" }, "intro.js": { - "version": "4.0.0", - "resolved": "https://registry.npmjs.org/intro.js/-/intro.js-4.0.0.tgz", - "integrity": "sha512-IS8+p4rpnWUq2Vd8YRgjR8w9lbyLvT0ptscBqA4iudO68oven39CvxHfxopfwlNUGgmgcyX17DOETof+D90AXA==" + "version": "4.1.0", + "resolved": "https://registry.npmjs.org/intro.js/-/intro.js-4.1.0.tgz", + "integrity": "sha512-+Y+UsP+yvqqlEOjFExMBXKopn3nzwc91PaUl0SrvqiVs6ztko1DzfkoXR2AnfirZVZZhr5Aej6wlXRlvIkuMcA==" }, "invariant": { "version": "2.2.4", diff --git a/package.json b/package.json index 196e3e23d5..be9183fd1a 100644 --- a/package.json +++ b/package.json @@ -158,7 +158,7 @@ "form-data": "^4.0.0", "fs-extra": "^3.0.1", "http-server": "^0.11.1", - "intro.js": "^4.0.0", + "intro.js": "^4.1.0", "isbinaryfile": "^3.0.2", "isomorphic-git": "^1.8.2", "jquery": "^3.3.1",