Webpack build for frontend

2 files changed, 163 insertions, 0 deletions

diff --git a/language-web/src/main/css/index.scss b/language-web/src/main/css/index.scss
new file mode 100644
index 00000000..e788bbd1
--- /dev/null
+++ b/language-web/src/main/css/index.scss
@@ -0,0 +1,105 @@
+@import 'codemirror/lib/codemirror';
+@import 'codemirror/addon/hint/show-hint';
+
+@import 'xtext/xtext-codemirror';
+
+body {
+        width: 100%;
+        height: 100%;
+        overflow: hidden;
+        font: 16px Helvetica,sans-serif;
+}
+
+a {
+        color: #22a;
+        text-decoration: none;
+}
+
+a:hover {
+        text-decoration: underline;
+}
+
+.container {
+        display: block;
+        position: absolute;
+        top: 0;
+        bottom: 0;
+        left: 0;
+        right: 0;
+        margin: 24px 24px 36px 24px;
+}
+
+.header {
+        display: block;
+        position: absolute;
+        top: 0;
+        left: 0;
+        right: 0;
+        padding: 16px;
+        background: #dbdbdb;
+        border-radius: 16px;
+        color: #383838;
+}
+
+.header h1 {
+  font-size: 36px;
+  margin: 0;
+}
+
+.content {
+        display: block;
+        position: absolute;
+        top: 108px;
+        bottom: 0;
+        left: 0;
+        width: 100%;
+        box-shadow: 0 0 8px rgba(80, 10, 98, .25), 0 10px 24px rgba(80, 10, 98, .35);
+        border-radius: 16px;
+}
+
+.xtext-editor {
+        display: block;
+        position: absolute;
+        top: 16px;
+        bottom: 16px;
+        left: 16px;
+        right: 16px;
+        border: 1px solid #999;
+}
+
+.problem-class {
+        color: #005032;
+}
+
+.problem-abstract {
+        color: #8b8816;
+}
+
+.problem-enum {
+        color: #644632;
+}
+
+.problem-reference {
+        color: #0000c0;
+}
+
+.problem-containment {
+        font-weight: bold;
+}
+
+.CodeMirror .cm-quoted-name, .problem-enum-node {
+        color: #1a1a1a !important;
+        font-weight: bold;
+}
+
+.problem-new-node {
+        font-style: italic;
+}
+
+.problem-variable {
+        color: #6a3e3e;
+}
+
+.problem-singleton-variable {
+        color: #a1706f;
+}
diff --git a/language-web/src/main/css/xtext/xtext-codemirror.css b/language-web/src/main/css/xtext/xtext-codemirror.css
new file mode 100644
index 00000000..831b6daf
--- /dev/null
+++ b/language-web/src/main/css/xtext/xtext-codemirror.css
@@ -0,0 +1,58 @@
+.CodeMirror {
+        height: 100%;
+}
+
+.annotations-gutter {
+        width: 12px;
+        background: #f0f0f0;
+}
+
+.xtext-annotation_error {
+        width: 12px;
+        height: 12px;
+        background-image: url('images/error_an.gif');
+        background-repeat: no-repeat;
+}
+
+.xtext-annotation_warning {
+        width: 12px;
+        height: 12px;
+        background-image: url('images/warning_an.gif');
+        background-repeat: no-repeat;
+}
+
+.xtext-annotation_info {
+        width: 12px;
+        height: 12px;
+        background-image: url('images/info_an.gif');
+        background-repeat: no-repeat;
+}
+
+.xtext-marker_error {
+        z-index: 30;
+        background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAQAAAADCAYAAAC09K7GAAAABmJLR0QA/wD/AP+gvaeTAAAAHElEQVQI12NggIL/DAz/GdA5/xkY/qPKMDAwAADLZwf5rvm+LQAAAABJRU5ErkJggg==");
+        background-repeat: repeat-x;
+        background-position: left bottom;
+}
+
+.xtext-marker_warning {
+        z-index: 20;
+        background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAQAAAADCAYAAAC09K7GAAAABmJLR0QA/wD/AP+gvaeTAAAAMklEQVQI12NkgIIvJ3QXMjAwdDN+OaEbysDA4MPAwNDNwMCwiOHLCd1zX07o6kBVGQEAKBANtobskNMAAAAASUVORK5CYII=");
+        background-repeat: repeat-x;
+        background-position: left bottom;
+}
+
+.xtext-marker_info {
+        z-index: 10;
+        background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAQAAAADCAYAAAC09K7GAAAABmJLR0QA/wD/AP+gvaeTAAAANklEQVQI12NkgIIVRx8tZGBg6GZccfRRKAMDgw8DA0M3AwPDIiYGBoZKBgaG7ghruSsMDAwpABH5CoqwzCoTAAAAAElFTkSuQmCC");
+        background-repeat: repeat-x;
+        background-position: left bottom;
+}
+
+.xtext-marker_read {
+        background-color: #ddd;
+}
+
+.xtext-marker_write {
+        background-color: yellow;
+}