Introduced base css files for plugins
Change-Id: Ia8f1bb671c6e770c19ce196f5161e48cf88b2b2a
diff --git a/Changes b/Changes
index fad80b6..6bfcd63 100755
--- a/Changes
+++ b/Changes
@@ -1,9 +1,10 @@
-0.39 2020-07-02
+0.39 2020-08-24
- Add information on secret file to Readme.
- Change default API endpoint to korap.ids-mannheim.de.
- Fix label for toggle plugins.
- Activate plugin registry.
- Forward 'pipe' parameter to backend.
+ - Introduce base css file for plugins.
WARNING: If you relied on the former default API endpoint
being http://localhost:9999/, this will break your
diff --git a/Gruntfile.js b/Gruntfile.js
index 3a042b0..114014a 100644
--- a/Gruntfile.js
+++ b/Gruntfile.js
@@ -79,8 +79,10 @@
},
files: {
'public/css/kalamar-<%= pkg.version %>.css' : 'dev/scss/kalamar.scss',
+ 'public/css/kalamar-plugin-<%= pkg.pluginVersion %>.css' : 'dev/scss/base.scss',
'dev/css/kalamar.css' : 'dev/scss/kalamar.scss',
'dev/css/kwic.css' : 'dev/scss/main/kwic.scss',
+ 'dev/css/kalamar-plugin.css' : 'dev/scss/base.scss'
}
}
},
diff --git a/dev/demo/plugin-client.html b/dev/demo/plugin-client.html
index 3cce6de..44333f8 100644
--- a/dev/demo/plugin-client.html
+++ b/dev/demo/plugin-client.html
@@ -3,7 +3,7 @@
<head>
<title>Plugin demo</title>
- <link type="text/css" rel="stylesheet" href="/css/kalamar.css" />
+ <link type="text/css" rel="stylesheet" href="/css/kalamar-plugin.css" />
<!-- load client javascript library -->
<script src="/js/src/plugin/client.js" data-server="http://localhost:3003/"></script>
@@ -21,7 +21,7 @@
}
</style>
</head>
- <body style="background-color: yellow">
+ <body class="result-view">
<h2>Example Widget!</h2>
<script>
function flood () {
diff --git a/dev/js/src/panel.js b/dev/js/src/panel.js
index 4ebef1e..eee7a00 100644
--- a/dev/js/src/panel.js
+++ b/dev/js/src/panel.js
@@ -83,15 +83,15 @@
this.views.push(view);
// Append or prepend element to panel element
- if(this.prepend){
+ if (this.prepend){
this._viewElement().prepend(
- view.element()
- );
- }
+ view.element()
+ );
+ }
else{
- this._viewElement().appendChild(
- view.element()
- );
+ this._viewElement().appendChild(
+ view.element()
+ );
}
if (view.afterEmbed)
diff --git a/dev/scss/base.scss b/dev/scss/base.scss
index 2d71b4d..fe16021 100644
--- a/dev/scss/base.scss
+++ b/dev/scss/base.scss
@@ -1,9 +1,11 @@
@charset "utf-8";
@import "util";
+@import "base/fonts";
@import "base/flextable";
@import "base/fragment";
@import "base/load";
@import "base/form";
+@import "base/view";
/**
* Basic global CSS rules for Kalamar
@@ -22,17 +24,6 @@
@include box-sizing-box;
}
-/*
-html {
-// @include box-sizing-box;
- box-sizing: border-box;
-}
-
-*, *:before, *:after {
- box-sizing: inherit;
-}
-*/
-
g > text {
fill: $dark-grey;
}
diff --git a/dev/scss/fonts.scss b/dev/scss/base/fonts.scss
similarity index 96%
rename from dev/scss/fonts.scss
rename to dev/scss/base/fonts.scss
index d0349a4..81726ad 100644
--- a/dev/scss/fonts.scss
+++ b/dev/scss/base/fonts.scss
@@ -1,5 +1,5 @@
@charset "utf-8";
-@import "util";
+@import "../util";
/**
* Load web fonts for Kalamar
diff --git a/dev/scss/base/view.scss b/dev/scss/base/view.scss
new file mode 100644
index 0000000..96162cf
--- /dev/null
+++ b/dev/scss/base/view.scss
@@ -0,0 +1,5 @@
+@import "../util.scss";
+
+.result-view {
+ background-color: $nearly-white;
+}
\ No newline at end of file
diff --git a/dev/scss/kalamar.scss b/dev/scss/kalamar.scss
index 4c4407f..084b443 100644
--- a/dev/scss/kalamar.scss
+++ b/dev/scss/kalamar.scss
@@ -5,11 +5,10 @@
*/
// Global variables and mixins
-@import "fonts"; // Font families
@import "base"; // Base styles
@import "main/main"; // Main frame styles
@import "header/header"; // Top frame styles
@import "footer/footer"; // Bottom frame styles
@import "sidebar/sidebar"; // Left frame styles
@import "no-js"; // Script disabled
-@import "media"; // Media queries
+@import "media"; // Media queries
\ No newline at end of file
diff --git a/dev/scss/main/koralquery.scss b/dev/scss/main/koralquery.scss
index 402f477..d6d4818 100644
--- a/dev/scss/main/koralquery.scss
+++ b/dev/scss/main/koralquery.scss
@@ -6,9 +6,11 @@
#koralquery {
white-space: pre;
> div {
+ // TODO:
+ // Mark this with result-view
+ background-color: $nearly-white;
overflow-x: auto;
font-size: 85%;
- background-color: $nearly-white;
margin: {
top: 2pt;
right: $right-view-distance; // 3em;