1 files changed, 10 insertions, 10 deletions

diff --git a/addons/web_editor/static/lib/summernote/src/js/Renderer.js b/addons/web_editor/static/lib/summernote/src/js/Renderer.js
index 7fa1afe3adc..2c856d4b152 100644
--- a/addons/web_editor/static/lib/summernote/src/js/Renderer.js
+++ b/addons/web_editor/static/lib/summernote/src/js/Renderer.js
@@ -36,7 +36,7 @@ define([
       return (dropdown ? '<div class="btn-group' +
                (className ? ' ' + className : '') + '">' : '') +
                '<button type="button"' +
-                 ' class="btn btn-default btn-sm' +
+                 ' class="btn btn-secondary btn-sm' +
                    ((!dropdown && className) ? ' ' + className : '') +
                    (dropdown ? ' dropdown-toggle' : '') +
                  '"' +
@@ -162,7 +162,7 @@ define([
       style: function (lang, options) {
         var items = options.styleTags.reduce(function (memo, v) {
           var label = lang.style[v === 'p' ? 'normal' : v];
-          return memo + '<li><a data-event="formatBlock" href="#" data-value="' + v + '">' +
+          return memo + '<li><a class="dropdown-item" data-event="formatBlock" href="#" data-value="' + v + '">' +
                    (
                      (v === 'p' || v === 'pre') ? label :
                      '<' + v + '>' + label + '</' + v + '>'
@@ -225,12 +225,12 @@ define([
         });
 
         var items = [
-          '<li><div class="btn-group">',
+          '<li class="flex"><div class="btn-group flex-column">',
           '<div class="note-palette-title">' + lang.color.background + '</div>',
           '<div class="note-color-reset" data-event="backColor"',
           ' data-value="inherit" title="' + lang.color.transparent + '">' + lang.color.setTransparent + '</div>',
           '<div class="note-color-palette" data-target-event="backColor"></div>',
-          '</div><div class="btn-group">',
+          '</div><div class="btn-group flex-column">',
           '<div class="note-palette-title">' + lang.color.foreground + '</div>',
           '<div class="note-color-reset" data-event="foreColor" data-value="inherit" title="' + lang.color.reset + '">',
           lang.color.resetToDefault,
@@ -450,12 +450,12 @@ define([
         var roundedButton = tplIconButton(options.iconPrefix + options.icons.image.shapeRounded, {
           title: lang.image.shapeRounded,
           event: 'imageShape',
-          value: 'img-rounded'
+          value: 'rounded'
         });
         var circleButton = tplIconButton(options.iconPrefix + options.icons.image.shapeCircle, {
           title: lang.image.shapeCircle,
           event: 'imageShape',
-          value: 'img-circle'
+          value: 'rounded-circle'
         });
         var thumbnailButton = tplIconButton(options.iconPrefix + options.icons.image.shapeThumbnail, {
           title: lang.image.shapeThumbnail,
@@ -536,7 +536,7 @@ define([
      * @param {String} body
      */
     var tplShortcut = function (title, keys) {
-      var keyClass = 'note-shortcut-col col-xs-6 note-shortcut-';
+      var keyClass = 'note-shortcut-col col-6 note-shortcut-';
       var body = [];
 
       for (var i in keys) {
@@ -548,7 +548,7 @@ define([
         }
       }
 
-      return '<div class="note-shortcut-row row"><div class="' + keyClass + 'title col-xs-offset-6">' + title + '</div></div>' +
+      return '<div class="note-shortcut-row row"><div class="' + keyClass + 'title offset-6">' + title + '</div></div>' +
              '<div class="note-shortcut-row row">' + body.join('</div><div class="note-shortcut-row row">') + '</div>';
     };
 
@@ -616,7 +616,7 @@ define([
     };
 
     var tplShortcutTable = function (lang, options) {
-      var colClass = 'class="note-shortcut note-shortcut-col col-sm-6 col-xs-12"';
+      var colClass = 'class="note-shortcut note-shortcut-col col-md-6 col-12"';
       var template = [
         '<div ' + colClass + '>' + tplShortcutAction(lang, options) + '</div>' +
         '<div ' + colClass + '>' + tplShortcutText(lang, options) + '</div>',
@@ -681,7 +681,7 @@ define([
       },
 
       help: function (lang, options) {
-        var body = '<a class="modal-close pull-right" aria-hidden="true" tabindex="-1">' + lang.shortcut.close + '</a>' +
+        var body = '<a class="modal-close float-right" aria-hidden="true" tabindex="-1">' + lang.shortcut.close + '</a>' +
                    '<div class="title">' + lang.shortcut.shortcuts + '</div>' +
                    (agent.isMac ? tplShortcutTable(lang, options) : replaceMacKeys(tplShortcutTable(lang, options))) +
                    '<p class="text-center">' +