You can test such css with Custom Css box in the settings of More theme (in administration menu). If you add there the css from that jsFiddle example
table.mceLayout, textarea.tinyMCE {
width: 100% !important;
}
.mceToolbar td {
display:table-row;
float: left;
}
.mceToolbar td:nth-of-type(11){
clear: left;
}
@media only screen and (min-width: 600px) {
table.mceLayout, textarea.richEditor {
width: 600px !important;
}
.mceToolbar td {
display:table-cell;
float: none;
}
mceToolbar td:nth-of-type(11){
clear: none;
}
}
toolbars get wrapped (responsive) according to screen width but it's not very ideal solution because you get easily a long row of buttons that fill small screen phones... You can see the effect better in previous versions of moodle like moodle 2.5 with for example Essential theme (and smaller buttons in tinymce toolbar/old o2k7 skin)
That css wraps toolbar rows if screen (window) width is less than 600px and keeps the toolbars at 600px if screen (window) width is more than 600px. I think core moodle developers did implement some wrapping already (wrap plugin?) to tinymce before they started to develop Atto (default editor of moodle 2.7) but nobody tried to create actual responsive skins or mobile themes for tinymce since core moodle developers decided to drop support for working with tinymce.