diff --git a/front/docs/CSS.md b/front/docs/CSS.md
index cd26f25..5241610 100644
--- a/front/docs/CSS.md
+++ b/front/docs/CSS.md
@@ -1,7 +1,7 @@
# CSS
In this document we take a look at what CSS is and how it can be applied to a publication in ChattyPub.
-The slides based on this document can be found here.
+## The slides based on this document can be found here.
- [What is CSS](#what-is-css)
- [Rules](#rules)
diff --git a/front/docs/Workshop.md b/front/docs/Workshop.md
index 3ffc90e..f057f95 100644
--- a/front/docs/Workshop.md
+++ b/front/docs/Workshop.md
@@ -42,9 +42,9 @@ The workshop is split over two sessions (over two days) of 4 hours each.
_Opening Session: Introductions & first encounters with ChattyPub_
- Introductory presentation ( 1hr ) -- will be livestreamed in the morning / recorded and shared afterwards.
- - Context and background on H&D's publishing activities (Anja & Juliette)
+ - Context and background on H&D's publishing activities (Anja & Juliette) [slides](https://hackersanddesigners.github.io/chatty-pub-css-slides/assets/hdsa-chattypub-intro.pdf)
- Introduction to ChattyPub (Karl).
- - Introduction to CSS (Heerko).
+ - Introduction to CSS (Heerko). [slides](https://hackersanddesigners.github.io/chatty-pub-css-slides/)
- How it all comes together (emojis ;])(Karl)
- Experimenting with ChattyPub! ( 2 hrs )
- participants with different levels of experience of CSS are grouped together
diff --git a/front/src/components/Content/Message.vue b/front/src/components/Content/Message.vue
index 167f3b8..376b7b2 100644
--- a/front/src/components/Content/Message.vue
+++ b/front/src/components/Content/Message.vue
@@ -39,6 +39,7 @@ export default {
return "```json\n" + JSON.stringify(this.message, null, 2) + "\n```";
},
content() {
+ if(!this.message.content) return "";
let c = this.message.content.replace("\n", "
");
// create absolute url on images and relative links
let url = process.env.VUE_APP_ZULIP_site;
@@ -52,6 +53,8 @@ export default {
"https://chatty-pub-files.hackersanddesigners.nl/files/"
);
+ c = this.replaceAllEmojiCodes(c);
+
const referrers = this.$store.state.topics
.find((t) => t.title == this.message.subject)
.messages.filter(
diff --git a/front/src/mixins/emoji.js b/front/src/mixins/emoji.js
index 2a6f487..aecb747 100644
--- a/front/src/mixins/emoji.js
+++ b/front/src/mixins/emoji.js
@@ -49,5 +49,14 @@ export default {
const regexExp = /(\u00a9|\u00ae|[\u2000-\u3300]|\ud83c[\ud000-\udfff]|\ud83d[\ud000-\udfff]|\ud83e[\ud000-\udfff])/gi;
return regexExp.test(str); // true
},
+
+
+ replaceAllEmojiCodes(content) {
+ let regex = /:([^\s]+):/gm;
+ content = content.replaceAll(regex, (match) => {
+ return this.shortcodeToEmoji(match);
+ })
+ return content;
+ }
}
}
\ No newline at end of file