Initial responsive update.

about.json

@@ -4,6 +4,6 @@
   "license_url": null,
   "about_url": "https://www.mon-discourse.fr/themes/md-composer-extras/",
   "authors": "Steven",
-  "theme_version": "1.4",
+  "theme_version": "1.5",
   "learn_more": "https://meta.discourse.org/t/beginners-guide-to-using-discourse-themes/91966"
 }

common/common.scss

@@ -1,26 +0,0 @@
-[data-wrap="center"] {
-  text-align: center;
-}
-
-[data-wrap="right"] {
-  text-align: right;
-}
-
-[data-wrap="justify"] {
-  text-align: justify;
-}
-
-[data-wrap="columns"] {
-  width: 50%;
-  float: left;
-}
-
-[data-wrap="floatl"] {
-  float: left;
-  margin-right: 10px;
-}
-
-[data-wrap="floatr"] {
-  float: right;
-  margin-left: 10px;
-}

desktop/desktop.scss

@@ -0,0 +1,26 @@
+[data-wrap="center"] {
+  text-align: center;
+}
+
+[data-wrap="right"] {
+  text-align: right;
+}
+
+[data-wrap="justify"] {
+  text-align: justify;
+}
+
+[data-wrap="columns"] {
+  width: 50%;
+  float: left;
+}
+
+[data-wrap="floatl"] {
+  float: left;
+  margin-right: 10px;
+}
+
+[data-wrap="floatr"] {
+  float: right;
+  margin-left: 10px;
+}

desktop/head_tag.html

@@ -0,0 +1,134 @@
+<script type="text/discourse-plugin" version="0.8">
+const { iconNode } = require("discourse-common/lib/icon-library");
+// TOOLBAR
+api.onToolbarCreate(toolbar => {
+    toolbar.addButton({
+        id: "underline_button",
+        group: "fontStyles",
+        icon: "underline",
+        perform: e => e.applySurround('[u]', '[/u]', 'underline_text')
+    });
+});
+api.onToolbarCreate(toolbar => {
+    toolbar.addButton({
+        id: "strikethrough_button",
+        group: "fontStyles",
+        icon: "strikethrough",
+		perform: e => e.applySurround('<s>', '[/s]', 'strikethrough_text')
+    });
+});
+api.onToolbarCreate(toolbar => {
+    toolbar.addButton({
+        id: "superscript_button",
+        group: "fontStyles",
+        icon: "superscript",
+		perform: e => e.applySurround('<sup>', '</sup>', 'superscript_text')
+    });
+});
+api.onToolbarCreate(toolbar => {
+    toolbar.addButton({
+        id: "subscript_button",
+        group: "fontStyles",
+        icon: "subscript",
+		perform: e => e.applySurround('<sub>', '</sub>', 'subscript_text')
+    });
+});
+api.onToolbarCreate(toolbar => {
+    toolbar.addButton({
+        id: "align_center_button",
+        group: "extras",
+        icon: "align-center",
+        perform: e => e.applySurround('[wrap="center"]\n', '\n[/wrap]', 'align_center_text')
+    });
+});
+api.onToolbarCreate(toolbar => {
+    toolbar.addButton({
+        id: "align_right_button",
+        group: "extras",
+        icon: "align-right",
+        perform: e => e.applySurround('[wrap="right"]\n', '\n[/wrap]', 'align_right_text')
+    });
+});
+api.onToolbarCreate(toolbar => {
+    toolbar.addButton({
+        id: "align_justify_button",
+        group: "extras",
+        icon: "align-justify",
+        perform: e => e.applySurround('[wrap="justify"]\n', '\n[/wrap]', 'align_justify_text')
+    });
+});
+
+// EXTRAS
+api.addToolbarPopupMenuOptionsCallback(() => {
+  return {
+      action: "floatleft",
+      icon: "indent",
+      label: "float_left_button"
+  };
+});
+api.addToolbarPopupMenuOptionsCallback(() => {
+  return {
+      action: "columns",
+      icon: "columns",
+      label: "columns_button"
+  };
+});
+
+api.modifyClass("controller:composer", {
+  actions: {
+    strikethrough() {
+    floatleft() {
+      this.get("toolbarEvent").applySurround('[wrap="floatl"]\n', '\n[/wrap]', "float_left_text");
+    },
+	columns() {
+	  this.get("toolbarEvent").applySurround('[wrap="columns"]\n', '\n[/wrap]', "columns_text");
+	}
+  }
+});
+
+// TEXTS
+let translations = I18n.translations[I18n.currentLocale()].js;
+if (!translations) {
+  translations = {};
+}
+if (!translations.composer) {
+  translations.composer = {};
+}
+
+translations.composer.underline_button_title = settings.underline_button;
+translations.composer.underline_text =
+  settings.underline_text;
+
+translations.composer.align_center_button_title = settings.align_center_button;
+translations.composer.align_center_text =
+  settings.align_center_text;
+
+translations.composer.align_right_button_title = settings.align_right_button;
+translations.composer.align_right_text =
+  settings.align_right_text;
+
+translations.composer.align_justify_button_title = settings.align_justify_button;
+translations.composer.align_justify_text =
+  settings.align_justify_text;
+
+translations.composer.strikethrough_button = settings.strikethrough_button;
+translations.composer.strikethrough_text =
+  settings.strikethrough_text;
+
+translations.composer.superscript_button = settings.superscript_button;
+translations.composer.superscript_text =
+  settings.superscript_text;
+
+translations.composer.subscript_button = settings.subscript_button;
+translations.composer.subscript_text =
+  settings.subscript_text;
+
+translations.columns_button = settings.columns_button;
+translations.composer.columns_text =
+  settings.columns_text;
+
+translations.float_left_button = settings.float_left_button;
+translations.composer.float_left_text =
+  settings.float_left_text;
+ 
+</script>

mobile/head_tag.html

@@ -9,30 +9,6 @@ api.onToolbarCreate(toolbar => {
         perform: e => e.applySurround('[u]', '[/u]', 'underline_text')
     });
 });
-api.onToolbarCreate(toolbar => {
-    toolbar.addButton({
-        id: "align_center_button",
-        group: "extras",
-        icon: "align-center",
-        perform: e => e.applySurround('[wrap="center"]\n', '\n[/wrap]', 'align_center_text')
-    });
-});
-api.onToolbarCreate(toolbar => {
-    toolbar.addButton({
-        id: "align_right_button",
-        group: "extras",
-        icon: "align-right",
-        perform: e => e.applySurround('[wrap="right"]\n', '\n[/wrap]', 'align_right_text')
-    });
-});
-api.onToolbarCreate(toolbar => {
-    toolbar.addButton({
-        id: "align_justify_button",
-        group: "extras",
-        icon: "align-justify",
-        perform: e => e.applySurround('[wrap="justify"]\n', '\n[/wrap]', 'align_justify_text')
-    });
-});
 
 // EXTRAS
 api.addToolbarPopupMenuOptionsCallback(() => {
@@ -56,6 +32,27 @@ api.addToolbarPopupMenuOptionsCallback(() => {
       label: "subscript_button"
   };
 });
+api.addToolbarPopupMenuOptionsCallback(() => {
+  return {
+      action: "aligncenter",
+      icon: "align-center",
+      label: "align_center_button"
+  };
+});
+api.addToolbarPopupMenuOptionsCallback(() => {
+  return {
+      action: "alignright",
+      icon: "align-right",
+      label: "align_right_button"
+  };
+});
+api.addToolbarPopupMenuOptionsCallback(() => {
+  return {
+      action: "alignjustify",
+      icon: "align-justify",
+      label: "align_justify_button"
+  };
+});
 api.addToolbarPopupMenuOptionsCallback(() => {
   return {
       action: "floatleft",
@@ -81,6 +78,15 @@ api.modifyClass("controller:composer", {
     },
     subscript() {
       this.get("toolbarEvent").applySurround("<sub>", "</sub>", "subscript_text");
+    },
+	aligncenter() {
+      this.get("toolbarEvent").applySurround('[wrap="center"]\n', '\n[/wrap]', "align_center_text");
+    },
+    alignright() {
+      this.get("toolbarEvent").applySurround('[wrap="right"]\n', '\n[/wrap]', "align_right_text");
+    },
+    alignjustify() {
+      this.get("toolbarEvent").applySurround('[wrap="justify"]\n', '\n[/wrap]', "align_justify_text");
     },
     floatleft() {
       this.get("toolbarEvent").applySurround('[wrap="floatl"]\n', '\n[/wrap]', "float_left_text");

mobile/mobile.scss

@@ -5,3 +5,7 @@
 .d-editor-spacer {
     margin: 0 2px;
 }
+
+[data-wrap="columns"] {
+}
+