diff --git a/Server/MarkdownPreviewer/static/style.css b/data/css/style.css
similarity index 93%
rename from Server/MarkdownPreviewer/static/style.css
rename to data/css/style.css
index 0b09631..975754f 100644
--- a/Server/MarkdownPreviewer/static/style.css
+++ b/data/css/style.css
@@ -17,6 +17,7 @@
--secondary-color: #34A853;
--accent-color: #EA4335;
--background-color: white;
+ --quote-bg-color: #F5F5F5;
--text-color: #222222;
--light-gray: #ECF0F1;
--dark-gray: #303333;
@@ -40,9 +41,13 @@
--spacing-medium: 1rem;
--spacing-large: 2rem;
+ --quote-blue: #0726b0;
+
--border-radius: 4px;
--border-width: 2px;
+ --blockquote-width: 8px;
+
--shadow-small: 0 1px 3px rgba(0, 0, 0, 0.12);
--shadow-medium: 0 2px 6px rgba(0,0,0,0.12);
@@ -62,6 +67,17 @@ body {
padding: 0;
}
+blockquote {
+ border-left: var(--blockquote-width) solid var(--quote-blue);
+ border-radius: var(--border-radius);
+ margin-left: 0px;
+ padding-left: 20px;
+ padding-top: 5px;
+ padding-bottom: 5px;
+ padding-right: 20px;
+ background-color: var(--quote-bg-color);
+}
+
.page-header {
margin-bottom: var(--spacing-large);
text-align: center;
diff --git a/Server/template/index.html b/template/index.html
similarity index 52%
rename from Server/template/index.html
rename to template/index.html
index 0436c87..30de370 100644
--- a/Server/template/index.html
+++ b/template/index.html
@@ -1,21 +1,21 @@
-
-
-
-
-
-
+
+
+
+
+
+
@@ -42,11 +42,10 @@
socket.send("ping");
});
- socket.addEventListener("message", (event) => {
- var data = JSON.parse(event.data);
- var node = document.getElementById("page-content");
- var wrapper = document.createElement('div');
- wrapper.innerHTML = data['show'];
+ function change_body(v) {
+ const node = document.getElementById("page-content");
+ const wrapper = document.createElement("div");
+ wrapper.innerHTML = v;
node.replaceChildren(wrapper);
hljs.highlightAll();
@@ -60,6 +59,34 @@
{left: "\\(", right: "\\)", display: false}
]
});
+ }
+
+ function change_header(k,v) {
+ const dict = {
+ 'title' : 'page-title',
+ 'date' : 'date',
+ 'course' : 'page-author'
+ }
+
+ const node = document.getElementById(dict[k])
+ node.replaceChildren(v);
+ }
+
+ socket.addEventListener("message", (event) => {
+ var data = JSON.parse(event.data);
+ Object.entries(data).forEach(([k,v]) => {
+ console.log(k,v);
+ switch (k) {
+ case "show":
+ change_body(v)
+ break;
+ case "title":
+ case "date":
+ case "course":
+ change_header(k,v);
+ break;
+ }
+ })
});