set init settings for languages + fixes
This commit is contained in:
+1
-39
@@ -1,4 +1,5 @@
|
|||||||
@import url('../shared/theme.less');
|
@import url('../shared/theme.less');
|
||||||
|
@import url('../shared/flex.less');
|
||||||
|
|
||||||
html, body {
|
html, body {
|
||||||
margin: 0;
|
margin: 0;
|
||||||
@@ -9,18 +10,6 @@ html, body {
|
|||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
.flex-horiz {
|
|
||||||
display: flex;
|
|
||||||
flex-direction: row;
|
|
||||||
height: 100%;
|
|
||||||
overflow: hidden;
|
|
||||||
}
|
|
||||||
|
|
||||||
.flex-vert {
|
|
||||||
display: flex;
|
|
||||||
flex-direction: column;
|
|
||||||
height: 100%;
|
|
||||||
}
|
|
||||||
|
|
||||||
.flex-horiz > * {
|
.flex-horiz > * {
|
||||||
min-height: auto !important;
|
min-height: auto !important;
|
||||||
@@ -33,37 +22,10 @@ html, body {
|
|||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
.flex-horiz > *, .flex-vert > * {
|
|
||||||
flex-grow: 1;
|
|
||||||
flex-shrink: 1;
|
|
||||||
flex-basis: 1px;
|
|
||||||
position: relative;
|
|
||||||
}
|
|
||||||
|
|
||||||
.animate .flex-horiz > *, .animate .flex-vert > * {
|
.animate .flex-horiz > *, .animate .flex-vert > * {
|
||||||
transition: all 280ms ease-in-out;
|
transition: all 280ms ease-in-out;
|
||||||
}
|
}
|
||||||
|
|
||||||
.flex-horiz .flex-shrink, .flex-vert .flex-shrink {
|
|
||||||
flex-grow: 0;
|
|
||||||
flex-shrink: 1;
|
|
||||||
}
|
|
||||||
|
|
||||||
.flex-horiz .flex-grow, .flex-vert .flex-grow {
|
|
||||||
flex-grow: 1;
|
|
||||||
flex-shrink: 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
.flex-reset {
|
|
||||||
position: absolute;
|
|
||||||
top: 0;
|
|
||||||
bottom: 0;
|
|
||||||
left: 0;
|
|
||||||
right: 0;
|
|
||||||
width: 100%;
|
|
||||||
height: 100%;
|
|
||||||
}
|
|
||||||
|
|
||||||
body {
|
body {
|
||||||
font-family: @primary-font-family;
|
font-family: @primary-font-family;
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -14,8 +14,7 @@ export class CodeEditor extends BaseElement {
|
|||||||
this.initWorkers();
|
this.initWorkers();
|
||||||
this.input = this.setInitInput();
|
this.input = this.setInitInput();
|
||||||
this.language = this.tagName.substring(0, this.tagName.indexOf("-")).toLocaleLowerCase();
|
this.language = this.tagName.substring(0, this.tagName.indexOf("-")).toLocaleLowerCase();
|
||||||
|
this.setInitSettings();
|
||||||
console.log(this.language);
|
|
||||||
|
|
||||||
const prefersDarkScheme = window.matchMedia("(prefers-color-scheme: dark)");
|
const prefersDarkScheme = window.matchMedia("(prefers-color-scheme: dark)");
|
||||||
|
|
||||||
|
|||||||
@@ -1,7 +1,8 @@
|
|||||||
import { CodeEditor } from "./code-editor";
|
import { CodeEditor } from "./code-editor";
|
||||||
import * as monaco from 'monaco-editor';
|
import * as monaco from 'monaco-editor';
|
||||||
import initCss from '!!raw-loader!./injects/editor-init.css';
|
import initCss from '!!raw-loader!./injects/editor-init.css';
|
||||||
import { createScript } from "../../../shared/create-script";
|
|
||||||
|
import flexCss from '!!raw-loader!../../../shared/flex.less';
|
||||||
|
|
||||||
export class CssCodeEditor extends CodeEditor {
|
export class CssCodeEditor extends CodeEditor {
|
||||||
setInitInput(): string {
|
setInitInput(): string {
|
||||||
@@ -16,7 +17,7 @@ export class CssCodeEditor extends CodeEditor {
|
|||||||
{
|
{
|
||||||
label: 'insert-flex',
|
label: 'insert-flex',
|
||||||
kind: monaco.languages.CompletionItemKind.Snippet,
|
kind: monaco.languages.CompletionItemKind.Snippet,
|
||||||
insertText: createScript('https://cdnjs.cloudflare.com/ajax/libs/jquery/3.6.0/jquery.min.js', false).toString(),
|
insertText: flexCss,
|
||||||
range: <any>null,
|
range: <any>null,
|
||||||
insertTextRules: monaco.languages.CompletionItemInsertTextRule.InsertAsSnippet
|
insertTextRules: monaco.languages.CompletionItemInsertTextRule.InsertAsSnippet
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -1,7 +1,6 @@
|
|||||||
import { CodeEditor } from "./code-editor";
|
import { CodeEditor } from "./code-editor";
|
||||||
import * as monaco from 'monaco-editor';
|
import * as monaco from 'monaco-editor';
|
||||||
import initHtml from '!!raw-loader!./injects/editor-init.html';
|
import initHtml from '!!raw-loader!./injects/editor-init.html';
|
||||||
import { createScript } from "../../../shared/create-script";
|
|
||||||
|
|
||||||
export class HtmlCodeEditor extends CodeEditor {
|
export class HtmlCodeEditor extends CodeEditor {
|
||||||
setInitInput(): string {
|
setInitInput(): string {
|
||||||
@@ -16,7 +15,7 @@ export class HtmlCodeEditor extends CodeEditor {
|
|||||||
{
|
{
|
||||||
label: 'jqueryCDN',
|
label: 'jqueryCDN',
|
||||||
kind: monaco.languages.CompletionItemKind.Snippet,
|
kind: monaco.languages.CompletionItemKind.Snippet,
|
||||||
insertText: createScript('https://cdnjs.cloudflare.com/ajax/libs/jquery/3.6.0/jquery.min.js', false).toString(),
|
insertText: "<script src='https://cdnjs.cloudflare.com/ajax/libs/jquery/3.6.0/jquery.min.js'></script>",
|
||||||
range: <any>null,
|
range: <any>null,
|
||||||
insertTextRules: monaco.languages.CompletionItemInsertTextRule.InsertAsSnippet
|
insertTextRules: monaco.languages.CompletionItemInsertTextRule.InsertAsSnippet
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -31,8 +31,8 @@ export class JavascriptCodeEditor extends CodeEditor {
|
|||||||
insertTextRules: monaco.languages.CompletionItemInsertTextRule.InsertAsSnippet
|
insertTextRules: monaco.languages.CompletionItemInsertTextRule.InsertAsSnippet
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
label: 'spiralBoxesSolutionSnippet',
|
label: 'spiralSolutionSnippet',
|
||||||
detail: "inserts solution of spiral boxes",
|
detail: "",
|
||||||
kind: monaco.languages.CompletionItemKind.Snippet,
|
kind: monaco.languages.CompletionItemKind.Snippet,
|
||||||
insertText: spiralBoxesSolutionScript,
|
insertText: spiralBoxesSolutionScript,
|
||||||
range: <any>null,
|
range: <any>null,
|
||||||
|
|||||||
@@ -0,0 +1,29 @@
|
|||||||
|
.flex-horiz {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: row;
|
||||||
|
height: 100%;
|
||||||
|
overflow: hidden;
|
||||||
|
}
|
||||||
|
|
||||||
|
.flex-vert {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
height: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.flex-horiz > *, .flex-vert > * {
|
||||||
|
flex-grow: 1;
|
||||||
|
flex-shrink: 1;
|
||||||
|
flex-basis: 1px;
|
||||||
|
position: relative;
|
||||||
|
}
|
||||||
|
|
||||||
|
.flex-horiz .flex-shrink, .flex-vert .flex-shrink {
|
||||||
|
flex-grow: 0;
|
||||||
|
flex-shrink: 1;
|
||||||
|
}
|
||||||
|
|
||||||
|
.flex-horiz .flex-grow, .flex-vert .flex-grow {
|
||||||
|
flex-grow: 1;
|
||||||
|
flex-shrink: 0;
|
||||||
|
}
|
||||||
Reference in New Issue
Block a user