Merge "Bug 1605110: Raw theme table border style overrides user settings"

htdocs/js/tinymce/README.Mahara

@@ -15,3 +15,4 @@ Changes:
  * Added code to spellchecker/spellchecker.rpc to use $CFG->spellcheckerengine
  * Adjusted the charmap plugin to contain Māori macrons
  * Adding the 'aria-hidden="true"' to presentation icons
+ * Bug 1605110: Modified the "table" plugin to style the table through CSS instead of HTML attributes
\ No newline at end of file

htdocs/js/tinymce/plugins/table/classes/Dialogs.js

@@ -221,7 +221,7 @@ define("tinymce/tableplugin/Dialogs", [
 
 					if (editor.settings.table_style_by_css) {
 						stylesToMerge = [];
-						stylesToMerge.push({name: 'border', value: data.border});
+						stylesToMerge.push({name: 'border-width', value: addSizeSuffix(data.border)});
 						stylesToMerge.push({name: 'border-spacing', value: addSizeSuffix(data.cellspacing)});
 						mergeStyles(dom, tableElm, stylesToMerge);
 						dom.setAttribs(tableElm, {
@@ -231,7 +231,8 @@ define("tinymce/tableplugin/Dialogs", [
 						});
 						if (tableElm.children) {
 							for (var i = 0; i < tableElm.children.length; i++) {
-								styleTDTH(tableElm.children[i], 'border', data.border);
+								styleTDTH(tableElm.children[i], 'border-width', addSizeSuffix(data.border));
+                                                                styleTDTH(tableElm.children[i], 'border-color', data.borderColor);
 								styleTDTH(tableElm.children[i], 'padding', addSizeSuffix(data.cellpadding));
 							}
 						}
@@ -302,14 +303,15 @@ define("tinymce/tableplugin/Dialogs", [
 
 				if (tableElm) {
 					data = {
-						width: removePxSuffix(dom.getStyle(tableElm, 'width') || dom.getAttrib(tableElm, 'width')),
-						height: removePxSuffix(dom.getStyle(tableElm, 'height') || dom.getAttrib(tableElm, 'height')),
-						cellspacing: removePxSuffix(dom.getStyle(tableElm, 'border-spacing') ||
-							dom.getAttrib(tableElm, 'cellspacing')),
+						width: dom.getStyle(tableElm, 'width') || dom.getAttrib(tableElm, 'width'),
+						height: dom.getStyle(tableElm, 'height') || dom.getAttrib(tableElm, 'height'),
+						cellspacing: dom.getStyle(tableElm, 'border-spacing') ||
+							dom.getAttrib(tableElm, 'cellspacing'),
 						cellpadding: dom.getAttrib(tableElm, 'data-mce-cell-padding') || dom.getAttrib(tableElm, 'cellpadding') ||
 							getTDTHOverallStyle(tableElm, 'padding'),
-						border: dom.getAttrib(tableElm, 'data-mce-border') || dom.getAttrib(tableElm, 'border') ||
-							getTDTHOverallStyle(tableElm, 'border'),
+						border: dom.getStyle(tableElm, 'border-width') ||
+						        dom.getAttrib(tableElm, 'data-mce-border') || dom.getAttrib(tableElm, 'border') ||
+						        getTDTHOverallStyle(tableElm, 'border'),
 						borderColor: dom.getAttrib(tableElm, 'data-mce-border-color'),
 						caption: !!dom.select('caption', tableElm)[0],
 						'class': dom.getAttrib(tableElm, 'class')

htdocs/js/tinymce/plugins/table/plugin.js

@@ -80,7 +80,7 @@
 
 			target[fragments[fragments.length - 1]] = modules[id];
 		}
-		
+
 		// Expose private modules for unit tests
 		if (exports.AMDLC_TESTS) {
 			privateModules = exports.privateModules || {};
@@ -1846,7 +1846,7 @@ define("tinymce/tableplugin/Dialogs", [
 
 					if (editor.settings.table_style_by_css) {
 						stylesToMerge = [];
-						stylesToMerge.push({name: 'border', value: data.border});
+						stylesToMerge.push({name: 'border-width', value: addSizeSuffix(data.border)});
 						stylesToMerge.push({name: 'border-spacing', value: addSizeSuffix(data.cellspacing)});
 						mergeStyles(dom, tableElm, stylesToMerge);
 						dom.setAttribs(tableElm, {
@@ -1856,7 +1856,8 @@ define("tinymce/tableplugin/Dialogs", [
 						});
 						if (tableElm.children) {
 							for (var i = 0; i < tableElm.children.length; i++) {
-								styleTDTH(tableElm.children[i], 'border', data.border);
+								styleTDTH(tableElm.children[i], 'border-width', addSizeSuffix(data.border));
+                                                                styleTDTH(tableElm.children[i], 'border-color', data.borderColor);
 								styleTDTH(tableElm.children[i], 'padding', addSizeSuffix(data.cellpadding));
 							}
 						}
@@ -1927,13 +1928,14 @@ define("tinymce/tableplugin/Dialogs", [
 
 				if (tableElm) {
 					data = {
-						width: removePxSuffix(dom.getStyle(tableElm, 'width') || dom.getAttrib(tableElm, 'width')),
-						height: removePxSuffix(dom.getStyle(tableElm, 'height') || dom.getAttrib(tableElm, 'height')),
-						cellspacing: removePxSuffix(dom.getStyle(tableElm, 'border-spacing') ||
-							dom.getAttrib(tableElm, 'cellspacing')),
+						width: dom.getStyle(tableElm, 'width') || dom.getAttrib(tableElm, 'width'),
+						height: dom.getStyle(tableElm, 'height') || dom.getAttrib(tableElm, 'height'),
+						cellspacing: dom.getStyle(tableElm, 'border-spacing') ||
+							dom.getAttrib(tableElm, 'cellspacing'),
 						cellpadding: dom.getAttrib(tableElm, 'data-mce-cell-padding') || dom.getAttrib(tableElm, 'cellpadding') ||
 							getTDTHOverallStyle(tableElm, 'padding'),
-						border: dom.getAttrib(tableElm, 'data-mce-border') || dom.getAttrib(tableElm, 'border') ||
+						border: dom.getStyle(tableElm, 'border-width') ||
+							dom.getAttrib(tableElm, 'data-mce-border') || dom.getAttrib(tableElm, 'border') ||
 							getTDTHOverallStyle(tableElm, 'border'),
 						borderColor: dom.getAttrib(tableElm, 'data-mce-border-color'),
 						caption: !!dom.select('caption', tableElm)[0],

htdocs/lib/web.php

@@ -277,6 +277,7 @@ function smarty($javascript = array(), $headers = array(), $pagestrings = array(
     menubar: false,
     fix_list_elements: true,
     image_advtab: true,
+    table_style_by_css: true,
     {$spellchecker_config}
 EOF;
                     }

htdocs/theme/raw/sass/features/_user-pages.scss

@@ -61,11 +61,13 @@
 
     table {
         border-spacing: 0;
+        border-color: $gray-light;
+        border-width: 1px;
     }
 
     table,
     table td {
-        border: 1px solid $gray-light;
+        border-style: solid;
     }
 
     table td {