Skip to content
Projects
Groups
Snippets
Help
This project
Loading...
Sign in / Register
Toggle navigation
B
baas-ide
Project
Project
Details
Activity
Cycle Analytics
Repository
Repository
Files
Commits
Branches
Tags
Contributors
Graph
Compare
Charts
Issues
0
Issues
0
List
Board
Labels
Milestones
JIRA
JIRA
Merge Requests
1
Merge Requests
1
CI / CD
CI / CD
Pipelines
Jobs
Schedules
Charts
Registry
Registry
Wiki
Wiki
Snippets
Snippets
Members
Members
Collapse sidebar
Close sidebar
Activity
Graph
Charts
Create a new issue
Jobs
Commits
Issue Boards
Open sidebar
guxukai
baas-ide
Commits
18d2183f
Commit
18d2183f
authored
Feb 25, 2019
by
yann300
Browse files
Options
Browse Files
Download
Email Patches
Plain Diff
remove most of the old style guide reference and replace by bootstrap
parent
fd2fbce7
Show whitespace changes
Inline
Side-by-side
Showing
22 changed files
with
30 additions
and
113 deletions
+30
-113
swap-panel-component.js
src/app/components/swap-panel-component.js
+0
-4
editor.js
src/app/editor/editor.js
+2
-2
sourceHighlighter.js
src/app/editor/sourceHighlighter.js
+2
-4
contextView-styles.js
src/app/editor/styles/contextView-styles.js
+1
-5
confirmDialog.js
src/app/execution/confirmDialog.js
+0
-3
txLogger.js
src/app/execution/txLogger.js
+10
-14
file-panel.js
src/app/panels/file-panel.js
+0
-4
settings-tab.js
src/app/tabs/settings-tab.js
+0
-1
compile-tab-styles.js
src/app/tabs/styles/compile-tab-styles.js
+0
-2
settings-tab-styles.js
src/app/tabs/styles/settings-tab-styles.js
+1
-5
support-tab-styles.js
src/app/tabs/styles/support-tab-styles.js
+0
-4
tabbed-menu-styles.js
src/app/tabs/styles/tabbed-menu-styles.js
+0
-6
contextMenu.js
src/app/ui/contextMenu.js
+3
-6
copy-to-clipboard.js
src/app/ui/copy-to-clipboard.js
+0
-5
draggableContent.js
src/app/ui/draggableContent.js
+0
-9
modaldialog.js
src/app/ui/modaldialog.js
+1
-1
auto-complete-popup-styles.js
src/app/ui/styles/auto-complete-popup-styles.js
+0
-4
dropdown-styles.js
src/app/ui/styles/dropdown-styles.js
+1
-5
modaldialog-styles.js
src/app/ui/styles/modaldialog-styles.js
+5
-20
tooltip-styles.js
src/app/ui/styles/tooltip-styles.js
+1
-4
tooltip.js
src/app/ui/tooltip.js
+1
-1
panels-resize.js
src/lib/panels-resize.js
+2
-4
No files found.
src/app/components/swap-panel-component.js
View file @
18d2183f
var
yo
=
require
(
'yo-yo'
)
var
yo
=
require
(
'yo-yo'
)
var
csjs
=
require
(
'csjs-inject'
)
var
csjs
=
require
(
'csjs-inject'
)
// const remixLib = require('remix-lib')
// const styleguide = require('../ui/styles-guide/theme-chooser')
// const styles = styleguide.chooser()
class
SwapPanelComponent
{
class
SwapPanelComponent
{
constructor
(
name
,
appStore
,
appManager
,
opt
)
{
constructor
(
name
,
appStore
,
appManager
,
opt
)
{
...
...
src/app/editor/editor.js
View file @
18d2183f
...
@@ -38,14 +38,14 @@ document.head.appendChild(yo`
...
@@ -38,14 +38,14 @@ document.head.appendChild(yo`
position:absolute;
position:absolute;
z-index:20;
z-index:20;
background-color: var(--secondary);
background-color: var(--secondary);
opacity: 0.
7
opacity: 0.
6
}
}
.highlightreferenceline {
.highlightreferenceline {
position:absolute;
position:absolute;
z-index:20;
z-index:20;
background-color: var(--secondary);
background-color: var(--secondary);
opacity: 0.
7
opacity: 0.
6
}
}
.highlightcode {
.highlightcode {
...
...
src/app/editor/sourceHighlighter.js
View file @
18d2183f
'use strict'
'use strict'
const
csjs
=
require
(
'csjs-inject'
)
const
csjs
=
require
(
'csjs-inject'
)
const
globlalRegistry
=
require
(
'../../global/registry'
)
const
globlalRegistry
=
require
(
'../../global/registry'
)
const
styleGuide
=
require
(
'../ui/styles-guide/theme-chooser'
)
const
styles
=
styleGuide
.
chooser
()
class
SourceHighlighter
{
class
SourceHighlighter
{
constructor
(
localRegistry
)
{
constructor
(
localRegistry
)
{
...
@@ -48,12 +46,12 @@ class SourceHighlighter {
...
@@ -48,12 +46,12 @@ class SourceHighlighter {
.highlightcode {
.highlightcode {
position:absolute;
position:absolute;
z-index:20;
z-index:20;
background-color:
${
style
||
styles
.
editor
.
backgroundColor_DebuggerMode
}
;
background-color:
${
style
||
'var(--text-info)'
}
;
}
}
.highlightcode_fullLine {
.highlightcode_fullLine {
position:absolute;
position:absolute;
z-index:20;
z-index:20;
background-color:
${
style
||
styles
.
editor
.
backgroundColor_DebuggerMode
}
;
background-color:
${
style
||
'var(--text-info)'
}
;
opacity: 0.5;
opacity: 0.5;
}
}
`
`
...
...
src/app/editor/styles/contextView-styles.js
View file @
18d2183f
var
csjs
=
require
(
'csjs-inject'
)
var
csjs
=
require
(
'csjs-inject'
)
var
styleGuide
=
require
(
'../../ui/styles-guide/theme-chooser'
)
var
styles
=
styleGuide
.
chooser
()
var
css
=
csjs
`
var
css
=
csjs
`
.contextview {
.contextview {
...
@@ -16,7 +14,6 @@ var css = csjs`
...
@@ -16,7 +14,6 @@ var css = csjs`
text-overflow : ellipsis;
text-overflow : ellipsis;
overflow : hidden;
overflow : hidden;
white-space : nowrap;
white-space : nowrap;
color :
${
styles
.
editor
.
text_Primary
}
;
font-size : 11px;
font-size : 11px;
}
}
.type {
.type {
...
@@ -29,10 +26,9 @@ var css = csjs`
...
@@ -29,10 +26,9 @@ var css = csjs`
.jump {
.jump {
cursor : pointer;
cursor : pointer;
margin : 0 5px;
margin : 0 5px;
color :
${
styles
.
editor
.
icon_Color_Editor
}
;
}
}
.jump:hover {
.jump:hover {
color :
${
styles
.
editor
.
icon_HoverColor_Editor
}
;
color :
var(--secondary)
;
}
}
.referencesnb {
.referencesnb {
float : right;
float : right;
...
...
src/app/execution/confirmDialog.js
View file @
18d2183f
var
yo
=
require
(
'yo-yo'
)
var
yo
=
require
(
'yo-yo'
)
var
csjs
=
require
(
'csjs-inject'
)
var
csjs
=
require
(
'csjs-inject'
)
var
styleGuide
=
require
(
'../ui/styles-guide/theme-chooser'
)
var
styles
=
styleGuide
.
chooser
()
var
css
=
csjs
`
var
css
=
csjs
`
.txInfoBox {
.txInfoBox {
${
styles
.
rightPanel
.
compileTab
.
box_CompileContainer
}
; // add askToConfirmTXContainer to Remix and then replace this styling
}
}
.wrapword {
.wrapword {
white-space: pre-wrap; /* Since CSS 2.1 */
white-space: pre-wrap; /* Since CSS 2.1 */
...
...
src/app/execution/txLogger.js
View file @
18d2183f
...
@@ -5,8 +5,6 @@ var copyToClipboard = require('../ui/copy-to-clipboard')
...
@@ -5,8 +5,6 @@ var copyToClipboard = require('../ui/copy-to-clipboard')
// -------------- styling ----------------------
// -------------- styling ----------------------
var
csjs
=
require
(
'csjs-inject'
)
var
csjs
=
require
(
'csjs-inject'
)
var
remixLib
=
require
(
'remix-lib'
)
var
remixLib
=
require
(
'remix-lib'
)
var
styleGuide
=
require
(
'../ui/styles-guide/theme-chooser'
)
var
styles
=
styleGuide
.
chooser
()
var
EventManager
=
require
(
'../../lib/events'
)
var
EventManager
=
require
(
'../../lib/events'
)
var
helper
=
require
(
'../../lib/helper'
)
var
helper
=
require
(
'../../lib/helper'
)
...
@@ -26,14 +24,14 @@ var css = csjs`
...
@@ -26,14 +24,14 @@ var css = csjs`
opacity: 0.8;
opacity: 0.8;
}
}
.arrow {
.arrow {
color:
${
styles
.
terminal
.
icon_Color_Menu
}
;
color:
var(--primary)
;
font-size: 20px;
font-size: 20px;
cursor: pointer;
cursor: pointer;
display: flex;
display: flex;
margin-left: 10px;
margin-left: 10px;
}
}
.arrow:hover {
.arrow:hover {
color:
${
styles
.
terminal
.
icon_HoverColor_Menu
}
;
color:
var(--secondary)
;
}
}
.txLog {
.txLog {
}
}
...
@@ -44,28 +42,27 @@ var css = csjs`
...
@@ -44,28 +42,27 @@ var css = csjs`
float: left;
float: left;
}
}
.succeeded {
.succeeded {
color:
${
styles
.
terminal
.
icon_Color_Log_Succeed
}
;
color:
var(--success)
;
}
}
.failed {
.failed {
color:
${
styles
.
terminal
.
icon_Color_Log_Failed
}
;
color:
var(--danger)
;
}
}
.notavailable {
.notavailable {
}
}
.call {
.call {
font-size: 7px;
font-size: 7px;
background-color:
${
styles
.
terminal
.
icon_BackgroundColor_Log_Call
}
;
border-radius: 50%;
border-radius: 50%;
min-width: 20px;
min-width: 20px;
min-height: 20px;
min-height: 20px;
display: flex;
display: flex;
justify-content: center;
justify-content: center;
align-items: center;
align-items: center;
color:
${
styles
.
terminal
.
icon_Color_Log_Call
}
;
color:
var(--primary)
;
text-transform: uppercase;
text-transform: uppercase;
font-weight: bold;
font-weight: bold;
}
}
.txItem {
.txItem {
color:
${
styles
.
terminal
.
text_Primary
}
;
color:
var(--primary)
;
margin-right: 5px;
margin-right: 5px;
float: left;
float: left;
}
}
...
@@ -73,7 +70,7 @@ var css = csjs`
...
@@ -73,7 +70,7 @@ var css = csjs`
font-weight: bold;
font-weight: bold;
}
}
.tx {
.tx {
color:
${
styles
.
terminal
.
text_Title_TransactionLog
}
;
color:
var(--primary)
;
font-weight: bold;
font-weight: bold;
float: left;
float: left;
margin-right: 10px;
margin-right: 10px;
...
@@ -83,8 +80,8 @@ var css = csjs`
...
@@ -83,8 +80,8 @@ var css = csjs`
.td {
.td {
border-collapse: collapse;
border-collapse: collapse;
font-size: 10px;
font-size: 10px;
color:
${
styles
.
terminal
.
text_Primary
}
;
color:
var(--primary)
;
border: 1px solid
${
styles
.
terminal
.
text_Secondary
}
;
border: 1px solid
var(--secondary)
;
}
}
#txTable {
#txTable {
margin-top: 1%;
margin-top: 1%;
...
@@ -110,7 +107,6 @@ var css = csjs`
...
@@ -110,7 +107,6 @@ var css = csjs`
margin-left: auto;
margin-left: auto;
}
}
.debug {
.debug {
${
styles
.
terminal
.
button_Log_Debug
}
width: 55px;
width: 55px;
min-width: 55px;
min-width: 55px;
min-height: 20px;
min-height: 20px;
...
@@ -240,7 +236,7 @@ function renderKnownTransaction (self, data) {
...
@@ -240,7 +236,7 @@ function renderKnownTransaction (self, data) {
${
checkTxStatus
(
data
.
receipt
,
txType
)}
${
checkTxStatus
(
data
.
receipt
,
txType
)}
${
context
(
self
,
{
from
,
to
,
data
})}
${
context
(
self
,
{
from
,
to
,
data
})}
<div class=
${
css
.
buttons
}
>
<div class=
${
css
.
buttons
}
>
<
div class=
${
css
.
debug
}
onclick=
${(
e
)
=>
debug
(
e
,
data
,
self
)}
>Debug</div>
<
button class="
${
css
.
debug
}
btn"
onclick=
${(
e
)
=>
debug
(
e
,
data
,
self
)}
>Debug</div>
</div>
</div>
<i class="
${
css
.
arrow
}
fa fa-angle-down"></i>
<i class="
${
css
.
arrow
}
fa fa-angle-down"></i>
</div>
</div>
...
...
src/app/panels/file-panel.js
View file @
18d2183f
...
@@ -115,21 +115,17 @@ function filepanel (localRegistry) {
...
@@ -115,21 +115,17 @@ function filepanel (localRegistry) {
fileExplorer
.
ensureRoot
()
fileExplorer
.
ensureRoot
()
configExplorer
.
ensureRoot
()
configExplorer
.
ensureRoot
()
self
.
_deps
.
fileProviders
[
'localhost'
].
event
.
register
(
'connecting'
,
(
event
)
=>
{
self
.
_deps
.
fileProviders
[
'localhost'
].
event
.
register
(
'connecting'
,
(
event
)
=>
{
tooltip
(
'Connecting to localhost. '
+
JSON
.
stringify
(
event
))
})
})
self
.
_deps
.
fileProviders
[
'localhost'
].
event
.
register
(
'connected'
,
(
event
)
=>
{
self
.
_deps
.
fileProviders
[
'localhost'
].
event
.
register
(
'connected'
,
(
event
)
=>
{
tooltip
(
'Connected to localhost. '
+
JSON
.
stringify
(
event
))
fileSystemExplorer
.
show
()
fileSystemExplorer
.
show
()
})
})
self
.
_deps
.
fileProviders
[
'localhost'
].
event
.
register
(
'errored'
,
(
event
)
=>
{
self
.
_deps
.
fileProviders
[
'localhost'
].
event
.
register
(
'errored'
,
(
event
)
=>
{
tooltip
(
'localhost connection errored. '
+
JSON
.
stringify
(
event
))
fileSystemExplorer
.
hide
()
fileSystemExplorer
.
hide
()
})
})
self
.
_deps
.
fileProviders
[
'localhost'
].
event
.
register
(
'closed'
,
(
event
)
=>
{
self
.
_deps
.
fileProviders
[
'localhost'
].
event
.
register
(
'closed'
,
(
event
)
=>
{
tooltip
(
'localhost connection closed. '
+
JSON
.
stringify
(
event
))
fileSystemExplorer
.
hide
()
fileSystemExplorer
.
hide
()
})
})
...
...
src/app/tabs/settings-tab.js
View file @
18d2183f
...
@@ -6,7 +6,6 @@ var globalRegistry = require('../../global/registry')
...
@@ -6,7 +6,6 @@ var globalRegistry = require('../../global/registry')
var
tooltip
=
require
(
'../ui/tooltip'
)
var
tooltip
=
require
(
'../ui/tooltip'
)
var
copyToClipboard
=
require
(
'../ui/copy-to-clipboard'
)
var
copyToClipboard
=
require
(
'../ui/copy-to-clipboard'
)
var
styleGuide
=
require
(
'../ui/styles-guide/theme-chooser'
)
var
styleGuide
=
require
(
'../ui/styles-guide/theme-chooser'
)
// var styles = styleGuide.chooser()
var
Storage
=
remixLib
.
Storage
var
Storage
=
remixLib
.
Storage
var
EventManager
=
require
(
'../../lib/events'
)
var
EventManager
=
require
(
'../../lib/events'
)
...
...
src/app/tabs/styles/compile-tab-styles.js
View file @
18d2183f
const
csjs
=
require
(
'csjs-inject'
)
const
csjs
=
require
(
'csjs-inject'
)
// const styleGuide = require('../../ui/styles-guide/theme-chooser')
// const styles = styleGuide.chooser()
const
css
=
csjs
`
const
css
=
csjs
`
.compilerArticle {
.compilerArticle {
...
...
src/app/tabs/styles/settings-tab-styles.js
View file @
18d2183f
var
csjs
=
require
(
'csjs-inject'
)
var
csjs
=
require
(
'csjs-inject'
)
var
styleGuide
=
require
(
'../../ui/styles-guide/theme-chooser'
)
var
styles
=
styleGuide
.
chooser
()
var
css
=
csjs
`
var
css
=
csjs
`
.settingsTabView {
.settingsTabView {
...
@@ -8,7 +6,6 @@ var css = csjs`
...
@@ -8,7 +6,6 @@ var css = csjs`
display: flex;
display: flex;
}
}
.info {
.info {
${
styles
.
rightPanel
.
settingsTab
.
box_SolidityVersionInfo
}
margin-bottom: 1em;
margin-bottom: 1em;
word-break: break-word;
word-break: break-word;
}
}
...
@@ -41,7 +38,6 @@ var css = csjs`
...
@@ -41,7 +38,6 @@ var css = csjs`
.select {
.select {
font-weight: bold;
font-weight: bold;
margin-top: 1em;
margin-top: 1em;
${
styles
.
rightPanel
.
settingsTab
.
dropdown_SelectCompiler
}
}
}
.heading {
.heading {
margin-bottom: 0;
margin-bottom: 0;
...
@@ -64,7 +60,7 @@ var css = csjs`
...
@@ -64,7 +60,7 @@ var css = csjs`
vertical-align: top;
vertical-align: top;
}
}
i.warnIt {
i.warnIt {
color:
${
styles
.
appProperties
.
warningText_Color
}
;
color:
var(--warning)
;
}
}
.icon {
.icon {
margin-right: .5em;
margin-right: .5em;
...
...
src/app/tabs/styles/support-tab-styles.js
View file @
18d2183f
const
csjs
=
require
(
'csjs-inject'
)
const
csjs
=
require
(
'csjs-inject'
)
const
styles
=
require
(
'../../ui/styles-guide/theme-chooser'
).
chooser
()
const
css
=
csjs
`
const
css
=
csjs
`
.supportTabView {
.supportTabView {
...
@@ -12,7 +11,6 @@ const css = csjs`
...
@@ -12,7 +11,6 @@ const css = csjs`
overflow-y: auto;
overflow-y: auto;
}
}
.chat {
.chat {
${
styles
.
rightPanel
.
supportTab
.
box_IframeContainer
}
display: flex;
display: flex;
flex-direction: column;
flex-direction: column;
align-items: center;
align-items: center;
...
@@ -49,7 +47,6 @@ const css = csjs`
...
@@ -49,7 +47,6 @@ const css = csjs`
border: none;
border: none;
}
}
.infoBox {
.infoBox {
${
styles
.
rightPanel
.
supportTab
.
box_SupportInfo
}
}
}
.remixdinstallation {
.remixdinstallation {
padding: 3px;
padding: 3px;
...
@@ -57,7 +54,6 @@ const css = csjs`
...
@@ -57,7 +54,6 @@ const css = csjs`
margin-left: 5px;
margin-left: 5px;
}
}
.info {
.info {
${
styles
.
rightPanel
.
settingsTab
.
box_SolidityVersionInfo
}
;
margin-top: 1em;
margin-top: 1em;
word-break: break-word;
word-break: break-word;
}
}
...
...
src/app/tabs/styles/tabbed-menu-styles.js
View file @
18d2183f
const
csjs
=
require
(
'csjs-inject'
)
const
csjs
=
require
(
'csjs-inject'
)
const
styles
=
require
(
'../../ui/styles-guide/theme-chooser'
).
chooser
()
const
css
=
csjs
`
const
css
=
csjs
`
.menu {
.menu {
display: flex;
display: flex;
background-color:
${
styles
.
rightPanel
.
BackgroundColor_Pre
}
;
list-style: none;
list-style: none;
margin: 0;
margin: 0;
padding: 0;
padding: 0;
}
}
.active {
.active {
background-color:
${
styles
.
rightPanel
.
backgroundColor_Tab
}
;
color:
${
styles
.
appProperties
.
mainText_Color
}
}
}
.options {
.options {
float: left;
float: left;
...
@@ -23,7 +19,6 @@ const css = csjs`
...
@@ -23,7 +19,6 @@ const css = csjs`
text-align: center;
text-align: center;
}
}
.optionViews {
.optionViews {
background-color:
${
styles
.
rightPanel
.
backgroundColor_Tab
}
;
overflow: scroll;
overflow: scroll;
height: 100%;
height: 100%;
}
}
...
@@ -32,7 +27,6 @@ const css = csjs`
...
@@ -32,7 +27,6 @@ const css = csjs`
}
}
.optionViews .pre {
.optionViews .pre {
word-wrap: break-word;
word-wrap: break-word;
background-color:
${
styles
.
rightPanel
.
BackgroundColor_Pre
}
;
border-radius: 3px;
border-radius: 3px;
display: inline-block;
display: inline-block;
padding: 0 0.6em;
padding: 0 0.6em;
...
...
src/app/ui/contextMenu.js
View file @
18d2183f
var
yo
=
require
(
'yo-yo'
)
var
yo
=
require
(
'yo-yo'
)
// -------------- copyToClipboard ----------------------
// -------------- copyToClipboard ----------------------
var
csjs
=
require
(
'csjs-inject'
)
var
csjs
=
require
(
'csjs-inject'
)
var
styleGuide
=
require
(
'./styles-guide/theme-chooser'
)
var
styles
=
styleGuide
.
chooser
()
var
css
=
csjs
`
var
css
=
csjs
`
.container
.container
{
{
display: none;
display: none;
position: fixed;
position: fixed;
border: 1px solid
${
styles
.
appProperties
.
solidBorderBox_BorderColor
}
;
border: 1px solid
var(--primary)
;
width:150px;
width:150px;
background:
${
styles
.
appProperties
.
solidBorderBox_BackgroundColor
}
;
border-radius: 2px;
border-radius: 2px;
z-index: 1000;
z-index: 1000;
}
}
...
@@ -31,12 +28,12 @@ var css = csjs`
...
@@ -31,12 +28,12 @@ var css = csjs`
padding-left: 5px;
padding-left: 5px;
padding-right: 5px;
padding-right: 5px;
padding-bottom: 3px;
padding-bottom: 3px;
color:
${
styles
.
appProperties
.
solidBorderBox_TextColor
}
;
color:
var(--primary)
;
}
}
#menuitems :hover
#menuitems :hover
{
{
background:
$
{
styles
.
appProperties
.
highlight_BackgroundColor
}
;
background: $
var(--seconday)
;
border-radius: 2px;
border-radius: 2px;
}
}
`
`
...
...
src/app/ui/copy-to-clipboard.js
View file @
18d2183f
...
@@ -4,8 +4,6 @@ const copy = require('clipboard-copy')
...
@@ -4,8 +4,6 @@ const copy = require('clipboard-copy')
var
addTooltip
=
require
(
'./tooltip'
)
var
addTooltip
=
require
(
'./tooltip'
)
// -------------- styling ----------------------
// -------------- styling ----------------------
var
csjs
=
require
(
'csjs-inject'
)
var
csjs
=
require
(
'csjs-inject'
)
var
styleGuide
=
require
(
'./styles-guide/theme-chooser'
)
var
styles
=
styleGuide
.
chooser
()
var
css
=
csjs
`
var
css
=
csjs
`
.copyIcon {
.copyIcon {
...
@@ -16,9 +14,6 @@ var css = csjs`
...
@@ -16,9 +14,6 @@ var css = csjs`
module
.
exports
=
function
copyToClipboard
(
getContent
,
tip
=
'Copy value to clipboard'
,
icon
=
'fa-clipboard'
)
{
module
.
exports
=
function
copyToClipboard
(
getContent
,
tip
=
'Copy value to clipboard'
,
icon
=
'fa-clipboard'
)
{
var
copyIcon
=
yo
`<i title="
${
tip
}
" class="
${
css
.
copyIcon
}
fa
${
icon
}
" aria-hidden="true"></i>`
var
copyIcon
=
yo
`<i title="
${
tip
}
" class="
${
css
.
copyIcon
}
fa
${
icon
}
" aria-hidden="true"></i>`
copyIcon
.
style
.
color
=
styles
.
remix
.
icon_Color_CopyToClipboard
copyIcon
.
onmouseenter
=
function
(
event
)
{
copyIcon
.
style
.
color
=
styles
.
remix
.
icon_HoverColor_CopyToClipboard
}
copyIcon
.
onmouseleave
=
function
(
event
)
{
copyIcon
.
style
.
color
=
styles
.
remix
.
icon_Color_CopyToClipboard
}
copyIcon
.
onclick
=
(
event
)
=>
{
copyIcon
.
onclick
=
(
event
)
=>
{
event
.
stopPropagation
()
event
.
stopPropagation
()
var
copiableContent
var
copiableContent
...
...
src/app/ui/draggableContent.js
View file @
18d2183f
'use strict'
'use strict'
var
yo
=
require
(
'yo-yo'
)
var
yo
=
require
(
'yo-yo'
)
var
csjs
=
require
(
'csjs-inject'
)
var
csjs
=
require
(
'csjs-inject'
)
var
styleGuide
=
require
(
'./styles-guide/theme-chooser'
)
var
styles
=
styleGuide
.
chooser
()
var
css
=
csjs
`
var
css
=
csjs
`
.containerDraggableModal {
.containerDraggableModal {
position: absolute;
position: absolute;
z-index: 1000;
z-index: 1000;
background-color:
${
styles
.
appProperties
.
light_BackgroundColor
}
;
text-align: center;
text-align: center;
width: 500px;
width: 500px;
height: 500px;
height: 500px;
border: 1px solid
${
styles
.
appProperties
.
solidBorderBox_BorderColor
}
;
overflow-y: hidden;
overflow-y: hidden;
}
}
.headerDraggableModal {
.headerDraggableModal {
cursor: move;
cursor: move;
z-index: 10;
z-index: 10;
color:
${
styles
.
appProperties
.
mainText_Color
}
;
background-color:
${
styles
.
appProperties
.
primary_BackgroundColor
}
;
border-bottom: 1px solid
${
styles
.
appProperties
.
solidBorderBox_BorderColor
}
;
text-overflow: ellipsis;
text-overflow: ellipsis;
overflow-x: hidden;
overflow-x: hidden;
}
}
.modalActions {
.modalActions {
float: right;
float: right;
color:
${
styles
.
appProperties
.
solidBorderBox_BorderColor
}
;
}
}
.modalAction {
.modalAction {
padding-right: 1px;
padding-right: 1px;
padding-left: 1px;
padding-left: 1px;
cursor: pointer;
cursor: pointer;
color:
${
styles
.
appProperties
.
solidBorderBox_BorderColor
}
;
}
}
`
`
...
...
src/app/ui/modaldialog.js
View file @
18d2183f
...
@@ -82,7 +82,7 @@ module.exports = (title, content, ok, cancel, focusSelector) => {
...
@@ -82,7 +82,7 @@ module.exports = (title, content, ok, cancel, focusSelector) => {
function
html
()
{
function
html
()
{
return
yo
`<div id="modal-dialog" class="
${
css
.
modal
}
">
return
yo
`<div id="modal-dialog" class="
${
css
.
modal
}
">
<div id="modal-background" class="
${
css
[
'modalBackground'
]}
"> </div>
<div id="modal-background" class="
${
css
[
'modalBackground'
]}
"> </div>
<div class="
${
css
[
'modalContent'
]}
">
<div class="
${
css
[
'modalContent'
]}
bg-warning text-info
">
<div class="
${
css
[
'modalHeader'
]}
">
<div class="
${
css
[
'modalHeader'
]}
">
<h2></h2>
<h2></h2>
<i id="modal-close" title="Close" class="fa fa-times
${
css
[
'modalClose'
]}
" aria-hidden="true"></i>
<i id="modal-close" title="Close" class="fa fa-times
${
css
[
'modalClose'
]}
" aria-hidden="true"></i>
...
...
src/app/ui/styles/auto-complete-popup-styles.js
View file @
18d2183f
var
csjs
=
require
(
'csjs-inject'
)
var
csjs
=
require
(
'csjs-inject'
)
var
styleGuide
=
require
(
'../styles-guide/theme-chooser'
)
var
styles
=
styleGuide
.
chooser
()
var
css
=
csjs
`
var
css
=
csjs
`
.popup {
.popup {
...
@@ -40,11 +38,9 @@ var css = csjs`
...
@@ -40,11 +38,9 @@ var css = csjs`
margin-left : 20%;
margin-left : 20%;
margin-bottom : 32px;
margin-bottom : 32px;
bottom : 0px;
bottom : 0px;
background-color :
${
styles
.
colors
.
black
}
;
padding : 0;
padding : 0;
line-height : 18px;
line-height : 18px;
font-size : 12px;
font-size : 12px;
border : 1px solid
${
styles
.
colors
.
grey
}
;
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: animatebottom;
-webkit-animation-name: animatebottom;
...
...
src/app/ui/styles/dropdown-styles.js
View file @
18d2183f
var
csjs
=
require
(
'csjs-inject'
)
var
csjs
=
require
(
'csjs-inject'
)
var
styleGuide
=
require
(
'../styles-guide/theme-chooser'
)
var
styles
=
styleGuide
.
chooser
()
var
css
=
csjs
`
var
css
=
csjs
`
.dropdown {
.dropdown {
${
styles
.
terminal
.
dropdown_Filter_MenuBar
}
overflow : visible;
overflow : visible;
position : relative;
position : relative;
display : flex;
display : flex;
...
@@ -38,8 +35,7 @@ var css = csjs`
...
@@ -38,8 +35,7 @@ var css = csjs`
top : 24px;
top : 24px;
left : 0;
left : 0;
width : 250px;
width : 250px;
background-color :
${
styles
.
appProperties
.
dropdown_BackgroundColor
}
;
border : 1px solid var(--primary);
border : 1px solid
${
styles
.
appProperties
.
dropdown_BorderColor
}
;
border-radius : 3px;
border-radius : 3px;
border-top : 0;
border-top : 0;
}
}
...
...
src/app/ui/styles/modaldialog-styles.js
View file @
18d2183f
var
csjs
=
require
(
'csjs-inject'
)
var
csjs
=
require
(
'csjs-inject'
)
var
styleGuide
=
require
(
'../styles-guide/theme-chooser'
)
var
styles
=
styleGuide
.
chooser
()
var
css
=
csjs
`
var
css
=
csjs
`
.modal {
.modal {
...
@@ -12,47 +10,37 @@ var css = csjs`
...
@@ -12,47 +10,37 @@ var css = csjs`
width: 100%; /* Full width */
width: 100%; /* Full width */
height: 100%; /* Full height */
height: 100%; /* Full height */
overflow: auto; /* Enable scroll if needed */
overflow: auto; /* Enable scroll if needed */
background-color:
${
styles
.
colors
.
black
}
; /* Fallback color */
background-color:
${
styles
.
colors
.
opacityBlack
}
; /* Black w/ opacity */
word-wrap: break-word;
word-wrap: break-word;
}
}
.modalHeader {
.modalHeader {
padding: 2px 16px;
padding: 2px 16px;
background-color:
${
styles
.
remix
.
modalDialog_Header_Footer_BackgroundColor
}
;
color:
${
styles
.
remix
.
modalDialog_Header_Footer_Color
}
;
display: flex;
display: flex;
justify-content: space-between;
justify-content: space-between;
}
}
.modalBody {
.modalBody {
background-color:
${
styles
.
remix
.
modalDialog_BackgroundColor_Primary
}
;
color:
${
styles
.
remix
.
modalDialog_text_Primary
}
;
padding: 1.5em;
padding: 1.5em;
line-height: 1.5em;
line-height: 1.5em;
}
}
.modalBody em{
.modalBody em
{
color:
${
styles
.
remix
.
modalDialog_text_Em
}
;
color:
var(--text-info)
}
}
.modalBody a{
.modalBody a
{
color:
${
styles
.
remix
.
modalDialog_text_Link
}
;
color:
color: var(--text-info)
}
}
.modalFooter {
.modalFooter {
display: flex;
display: flex;
justify-content: flex-end;
justify-content: flex-end;
padding: 10px 30px;
padding: 10px 30px;
background-color:
${
styles
.
remix
.
modalDialog_Header_Footer_BackgroundColor
}
;
color:
${
styles
.
remix
.
modalDialog_Header_Footer_Color
}
;
text-align: right;
text-align: right;
font-weight: 700;
font-weight: 700;
cursor: pointer;
cursor: pointer;
}
}
.modalContent {
.modalContent {
position: relative;
position: relative;
background-color:
${
styles
.
colors
.
black
}
;
margin: auto;
margin: auto;
padding: 0;
padding: 0;
line-height: 18px;
line-height: 18px;
font-size: 12px;
font-size: 14px;
border: 1px solid
${
styles
.
colors
.
grey
}
;
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;
...
@@ -62,16 +50,13 @@ var css = csjs`
...
@@ -62,16 +50,13 @@ var css = csjs`
}
}
.modalFooterOk {
.modalFooterOk {
cursor: pointer;
cursor: pointer;
color:
${
styles
.
remix
.
modalDialog_Header_Footer_Color
}
;
}
}
.modalFooterCancel {
.modalFooterCancel {
margin-left: 1em;
margin-left: 1em;
cursor: pointer;
cursor: pointer;
color:
${
styles
.
remix
.
modalDialog_Header_Footer_Color
}
;
}
}
.modalClose {
.modalClose {
margin: auto 0;
margin: auto 0;
color:
${
styles
.
remix
.
modalDialog_Header_Footer_Color
}
;
cursor: pointer;
cursor: pointer;
}
}
.modalBackground {
.modalBackground {
...
...
src/app/ui/styles/tooltip-styles.js
View file @
18d2183f
var
csjs
=
require
(
'csjs-inject'
)
var
csjs
=
require
(
'csjs-inject'
)
var
styleGuide
=
require
(
'../styles-guide/theme-chooser'
)
var
styles
=
styleGuide
.
chooser
()
var
css
=
csjs
`
var
css
=
csjs
`
.tooltip {
.tooltip {
z-index: 1001;
z-index: 1001;
display: inline-block;
display: inline-block;
position: fixed;
position: fixed;
background-color:
${
styles
.
remix
.
tooltip_CopyToClipboard_BackgroundColor
}
;
color: var(--primary)
color:
${
styles
.
remix
.
tooltip_CopyToClipboard_Color
}
;
min-height: 50px;
min-height: 50px;
min-width: 290px;
min-width: 290px;
padding: 16px 24px 12px;
padding: 16px 24px 12px;
...
...
src/app/ui/tooltip.js
View file @
18d2183f
...
@@ -2,7 +2,7 @@ var yo = require('yo-yo')
...
@@ -2,7 +2,7 @@ var yo = require('yo-yo')
var
css
=
require
(
'./styles/tooltip-styles'
)
var
css
=
require
(
'./styles/tooltip-styles'
)
module
.
exports
=
function
addTooltip
(
tooltipText
)
{
module
.
exports
=
function
addTooltip
(
tooltipText
)
{
var
tooltip
=
yo
`<div class=
${
css
.
tooltip
}
>
${
tooltipText
}
</div>`
var
tooltip
=
yo
`<div class=
"
${
css
.
tooltip
}
bg-primary"
>
${
tooltipText
}
</div>`
document
.
body
.
appendChild
(
tooltip
)
document
.
body
.
appendChild
(
tooltip
)
setTimeout
(
function
()
{
setTimeout
(
function
()
{
document
.
body
.
removeChild
(
tooltip
)
document
.
body
.
removeChild
(
tooltip
)
...
...
src/lib/panels-resize.js
View file @
18d2183f
const
yo
=
require
(
'yo-yo'
)
const
yo
=
require
(
'yo-yo'
)
const
csjs
=
require
(
'csjs-inject'
)
const
csjs
=
require
(
'csjs-inject'
)
const
styleGuide
=
require
(
'../app/ui/styles-guide/theme-chooser'
)
const
styles
=
styleGuide
.
chooser
()
const
css
=
csjs
`
const
css
=
csjs
`
.dragbar {
.dragbar {
...
@@ -12,11 +10,11 @@ const css = csjs`
...
@@ -12,11 +10,11 @@ const css = csjs`
bottom : 0;
bottom : 0;
cursor : col-resize;
cursor : col-resize;
z-index : 999;
z-index : 999;
border-right :
${
styles
.
leftPanel
.
dragbarBorderRight
}
;
border-right :
var(--primary)
;
}
}
.ghostbar {
.ghostbar {
width : 3px;
width : 3px;
background-color :
${
styles
.
colors
.
lightBlue
}
;
background-color :
var(--primary)
;
opacity : 0.5;
opacity : 0.5;
position : absolute;
position : absolute;
cursor : col-resize;
cursor : col-resize;
...
...
Write
Preview
Markdown
is supported
0%
Try again
or
attach a new file
Attach a file
Cancel
You are about to add
0
people
to the discussion. Proceed with caution.
Finish editing this message first!
Cancel
Please
register
or
sign in
to comment