1
0
Fork 0
mirror of https://github.com/codex-team/codex.docs.git synced 2025-07-25 16:19:44 +02:00

Integrate CodeXEditor: dynamic import added (#5)

* Main elements created

* Add Editor to the writing page
This commit is contained in:
Peter Savchenko 2018-09-19 01:47:32 +03:00 committed by GitHub
parent 4326cb22ab
commit e7e64cea3e
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
21 changed files with 15676 additions and 820 deletions

View file

@ -2,11 +2,42 @@
// eslint-disable-next-line no-unused-vars
import css from '../styles/main.pcss';
module.exports = class Docs {
/**
* Module Dispatcher
* @see {@link https://github.com/codex-team/moduleDispatcher}
* @author CodeX
*/
import ModuleDispatcher from 'module-dispatcher';
/**
* Import modules
*/
import Writing from './modules/writing';
/**
* Main app class
*/
class Docs {
/**
* @constructor
*/
constructor() {
console.log('CodeX Docs initialized');
this.writing = new Writing();
document.addEventListener('DOMContentLoaded', (event) => {
this.docReady();
});
}
};
/**
* Document is ready
*/
docReady() {
this.moduleDispatcher = new ModuleDispatcher({
Library: window.Docs
});
}
}
module.exports = new Docs();

View file

@ -0,0 +1,28 @@
/**
* Module for pages create/edit
*/
module.exports = class Writing {
constructor(){
}
/**
* Called by ModuleDispatcher to initialize module from DOM
*/
init(config, moduleEl) {
this.editorWrapper = document.createElement('div');
this.editorWrapper.id = 'codex-editor';
moduleEl.appendChild(this.editorWrapper);
this.loadEditor().then(() => {
console.log('Editor loaded');
})
};
loadEditor(){
return import(/* webpackChunkName: "codex-editor" */ 'codex.editor').then(({ default: CodexEditor }) => {
console.log('codex-editor', new CodexEditor());
}).catch(error => 'An error occurred while loading CodeX Editor');
}
};

View file

@ -7,16 +7,12 @@
a {
text-decoration: none;
color: inherit;
display: inline-block;
&:hover {
color: var(--color-link-active);
}
}
&__logo {
font-weight: bold;
color: inherit;
}
&__menu {
@ -27,5 +23,18 @@
list-style: none;
margin-left: 20px;
}
a:not(.docs-header__button) {
color: inherit;
&:hover {
color: var(--color-link-active);
}
}
}
&__button {
@apply --button;
margin: auto 30px auto auto;
}
}

View file

@ -8,6 +8,7 @@
&__content {
flex-grow: 2;
word-wrap: break-word;
&-inner {
max-width: var(--layout-width-main-col);

View file

@ -10,3 +10,7 @@ body {
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}
svg {
fill: currentColor;
}

View file

@ -10,4 +10,22 @@
--layout-padding-horisontal: 40px;
--layout-width-aside: 250px;
--layout-width-main-col: 650px;
--button {
display: inline-block;
background: var(--color-link-active);
color: #fff;
border-radius: 3px;
padding: 9px 15px;
font-size: 14px;
line-height: 1em;
svg {
margin: 0 0.3em 0 -0.05em;
}
&:hover {
background: color-mod(var(--color-link-active) blackness(+10%));
}
}
}

View file

@ -0,0 +1,3 @@
<svg width="11" height="11" viewBox="0 0 11 11" xmlns="http://www.w3.org/2000/svg">
<path d="M6.44 4.64h3.7a.9.9 0 1 1 0 1.8h-3.7v3.7a.9.9 0 1 1-1.8 0v-3.7H.9a.9.9 0 0 1 0-1.8h3.74V.9a.9.9 0 0 1 1.8 0v3.74z"/>
</svg>

After

Width:  |  Height:  |  Size: 219 B