mirror of
https://github.com/bitburner-official/bitburner-src.git
synced 2026-04-19 15:54:09 +02:00
Implemented new Editor Option: CodeMirror. (Vim mode not 100% done yet)
This commit is contained in:
danielyxie
@@ -0,0 +1,40 @@
|
||||
@import "theme";
|
||||
|
||||
/**
|
||||
* Customized styling for the Code Mirror editor
|
||||
*/
|
||||
|
||||
#codemirror-form-wrapper {
|
||||
height: 80%;
|
||||
margin: 10px 0px 10px 6px;
|
||||
}
|
||||
|
||||
.CodeMirror {
|
||||
height: 100%;
|
||||
width: 100%;
|
||||
border: 2px solid var(--my-highlight-color);
|
||||
z-index: 1;
|
||||
font-family: $fontFamily;
|
||||
font-size: $defaultFontSize;
|
||||
}
|
||||
|
||||
/**
|
||||
* Highlight matches
|
||||
*/
|
||||
.cm-matchhighlight {
|
||||
background-color: #8F908A;
|
||||
}
|
||||
|
||||
.CodeMirror-selection-highlight-scrollbar {
|
||||
background-color: #8F908A;
|
||||
}
|
||||
|
||||
|
||||
/**
|
||||
* Show Invisibles
|
||||
*/
|
||||
.cm-whitespace::before {
|
||||
position: absolute;
|
||||
pointer-events: none;
|
||||
color: #404F7D;
|
||||
}
|
||||
@@ -18,116 +18,6 @@
|
||||
position: fixed;
|
||||
}
|
||||
|
||||
/* Script Editor */
|
||||
#script-editor-container {
|
||||
background-color: transparent;
|
||||
}
|
||||
|
||||
#javascript-editor {
|
||||
margin: 10px;
|
||||
height: 80%;
|
||||
width: 100%;
|
||||
margin-left: 6px;
|
||||
padding-left: 6px;
|
||||
padding-top: 6px;
|
||||
padding-bottom: 6px;
|
||||
border: 2px solid var(--my-highlight-color);
|
||||
z-index: 1;
|
||||
font-family: $fontFamily;
|
||||
}
|
||||
|
||||
.ace_line,
|
||||
.ace_line * {
|
||||
background-color: transparent;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.ace_text-input {
|
||||
font-size: $defaultFontSize;
|
||||
background-color: transparent;
|
||||
}
|
||||
|
||||
/* This temp element is used for auto adjusting filename field */
|
||||
.tmp-element {
|
||||
visibility: hidden;
|
||||
white-space: pre;
|
||||
}
|
||||
|
||||
#script-editor-container {
|
||||
position: fixed;
|
||||
padding-top: 10px;
|
||||
}
|
||||
|
||||
#script-editor-buttons-wrapper {
|
||||
width: 100%;
|
||||
padding-right: 0;
|
||||
margin-right: 0;
|
||||
}
|
||||
|
||||
#script-editor-wrapper {
|
||||
height: 100%;
|
||||
width: 70%;
|
||||
background: transparent;
|
||||
}
|
||||
|
||||
#script-editor-filename-wrapper {
|
||||
background-color: #555;
|
||||
margin-left: 6px;
|
||||
margin-right: 0;
|
||||
padding-left: 6px;
|
||||
width: 100%;
|
||||
border: 2px solid var(--my-highlight-color);
|
||||
}
|
||||
|
||||
#script-editor-filename-tag {
|
||||
display: inline-block;
|
||||
padding-top: 10px;
|
||||
padding-bottom: 0;
|
||||
float: center;
|
||||
background-color: #555;
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
#script-editor-filename {
|
||||
$boxShadowArgs: inset 0 0 8px rgba(0, 0, 0, 0.1), 0 0 16px rgba(0, 0, 0, 0.1);
|
||||
@include boxShadow($boxShadowArgs);
|
||||
|
||||
background-color: #555;
|
||||
display: inline-block;
|
||||
float: center;
|
||||
resize: none;
|
||||
color: #fff;
|
||||
margin: 4px;
|
||||
padding: 2px;
|
||||
border: 2px solid var(--my-highlight-color);
|
||||
}
|
||||
|
||||
#script-editor-status {
|
||||
float: left;
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
#script-editor-options-panel {
|
||||
position: absolute;
|
||||
right: 9%;
|
||||
bottom: 15%;
|
||||
border: 2px solid #fff;
|
||||
width: 19%;
|
||||
background-color: #444;
|
||||
padding: 2px;
|
||||
overflow: auto;
|
||||
z-index: 1;
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
#script-editor-options-panel fieldset {
|
||||
margin-top: 8px;
|
||||
margin-bottom: 8px;
|
||||
padding: 2px;
|
||||
font-size: $defaultFontSize * 0.75;
|
||||
}
|
||||
|
||||
/* Active scripts */
|
||||
.active-scripts-list {
|
||||
list-style-type: none;
|
||||
|
||||
@@ -0,0 +1,122 @@
|
||||
@import "mixins";
|
||||
@import "theme";
|
||||
|
||||
/**
|
||||
* Styling for Script Editor (both Ace and CodeMirror)
|
||||
*/
|
||||
|
||||
#script-editor-container {
|
||||
background-color: transparent;
|
||||
}
|
||||
|
||||
#ace-editor {
|
||||
margin: 10px;
|
||||
height: 80%;
|
||||
width: 100%;
|
||||
margin-left: 6px;
|
||||
padding-left: 6px;
|
||||
padding-top: 6px;
|
||||
padding-bottom: 6px;
|
||||
border: 2px solid var(--my-highlight-color);
|
||||
z-index: 1;
|
||||
font-family: $fontFamily;
|
||||
}
|
||||
|
||||
/* This temp element is used for auto adjusting filename field */
|
||||
.tmp-element {
|
||||
visibility: hidden;
|
||||
white-space: pre;
|
||||
}
|
||||
|
||||
#script-editor-container {
|
||||
position: fixed;
|
||||
padding-top: 10px;
|
||||
}
|
||||
|
||||
#script-editor-buttons-wrapper {
|
||||
width: 100%;
|
||||
padding-right: 0;
|
||||
margin-right: 0;
|
||||
}
|
||||
|
||||
#script-editor-wrapper {
|
||||
height: 100%;
|
||||
width: 70%;
|
||||
background: transparent;
|
||||
}
|
||||
|
||||
#script-editor-filename-wrapper {
|
||||
background-color: #555;
|
||||
margin-left: 6px;
|
||||
margin-right: 0;
|
||||
padding-left: 6px;
|
||||
width: 100%;
|
||||
border: 2px solid var(--my-highlight-color);
|
||||
}
|
||||
|
||||
#script-editor-filename-tag {
|
||||
display: inline-block;
|
||||
padding-top: 10px;
|
||||
padding-bottom: 0;
|
||||
float: center;
|
||||
background-color: #555;
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
#script-editor-filename {
|
||||
$boxShadowArgs: inset 0 0 8px rgba(0, 0, 0, 0.1), 0 0 16px rgba(0, 0, 0, 0.1);
|
||||
@include boxShadow($boxShadowArgs);
|
||||
|
||||
background-color: #555;
|
||||
display: inline-block;
|
||||
float: center;
|
||||
resize: none;
|
||||
color: #fff;
|
||||
margin: 4px;
|
||||
padding: 2px;
|
||||
border: 2px solid var(--my-highlight-color);
|
||||
}
|
||||
|
||||
#script-editor-status {
|
||||
float: left;
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
#script-editor-options-panel {
|
||||
position: absolute;
|
||||
right: 9%;
|
||||
bottom: 15%;
|
||||
border: 2px solid #fff;
|
||||
width: 19%;
|
||||
background-color: #444;
|
||||
padding: 2px;
|
||||
overflow: auto;
|
||||
z-index: 1;
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
#script-editor-options-panel fieldset {
|
||||
margin-top: 8px;
|
||||
margin-bottom: 8px;
|
||||
padding: 2px;
|
||||
font-size: $defaultFontSize * 0.75;
|
||||
|
||||
input {
|
||||
margin: 2px;
|
||||
}
|
||||
}
|
||||
|
||||
/* Specific overrides for Ace Editor */
|
||||
.ace_line,
|
||||
.ace_line * {
|
||||
background-color: transparent;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.ace_text-input {
|
||||
font-size: $defaultFontSize;
|
||||
background-color: transparent;
|
||||
}
|
||||
|
||||
/* Specified overrides for Code mirror Editor are defined in codemirror-override.scss */
|
||||
@@ -35,11 +35,6 @@ li {
|
||||
list-style-type: none;
|
||||
}
|
||||
|
||||
span {
|
||||
margin: 4px;
|
||||
padding: 4px;
|
||||
}
|
||||
|
||||
#entire-game-container {
|
||||
background-color: transparent;
|
||||
}
|
||||
|
||||
@@ -67,5 +67,6 @@
|
||||
}
|
||||
|
||||
#terminal-input-text-box {
|
||||
margin-left: 2px;
|
||||
flex: 1 1 auto;
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user