MDL-57114 filemanager: apply btn-sm class to buttons
authorSimey Lameze <simey@moodle.com>
Thu, 8 Dec 2016 07:41:04 +0000 (15:41 +0800)
committerDan Poltawski <dan@moodle.com>
Tue, 20 Dec 2016 10:34:29 +0000 (10:34 +0000)
This commit also creates a new css rule to fix the file picker icons misalignment.

theme/boost/scss/moodle/icons.scss
theme/boost/templates/core/filemanager_modal_generallayout.mustache
theme/boost/templates/core/filemanager_page_generallayout.mustache

index 65b0c5c..0e040c2 100644 (file)
@@ -61,3 +61,8 @@ span:first-of-type > .icon {
 [data-action=toggle-drawer] .icon {
     margin: 0;
 }
 [data-action=toggle-drawer] .icon {
     margin: 0;
 }
+
+// Apply in special cases where the default icons styles does not work properly. Eg file picker buttons.
+.icon-no-spacing a > .icon {
+    margin: 0;
+}
index e7f40ba..e3b41e2 100644 (file)
@@ -7,45 +7,45 @@
     </div>
     <div class="col-md-9">
         <div class="fp-repo-items" tabindex="0">
     </div>
     <div class="col-md-9">
         <div class="fp-repo-items" tabindex="0">
-            <div class="fp-navbar bg-faded card m-b-0 clearfix">
+            <div class="fp-navbar bg-faded card m-b-0 clearfix icon-no-spacing">
                 <div>
                     <div class="fp-toolbar">
                         <div class="fp-tb-back">
                 <div>
                     <div class="fp-toolbar">
                         <div class="fp-tb-back">
-                            <a href="#" class="btn btn-secondary">{{#str}}back, repository{{/str}}</a>
+                            <a href="#" class="btn btn-secondary btn-sm">{{#str}}back, repository{{/str}}</a>
                         </div>
                         <div class="fp-tb-search">
                             <form></form>
                         </div>
                         <div class="fp-tb-refresh">
                         </div>
                         <div class="fp-tb-search">
                             <form></form>
                         </div>
                         <div class="fp-tb-refresh">
-                            <a title="{{#str}}refresh, repository{{/str}}" class="btn btn-secondary" href="#">
+                            <a title="{{#str}}refresh, repository{{/str}}" class="btn btn-secondary btn-sm" href="#">
                                 {{#pix}}a/refresh{{/pix}}
                             </a>
                         </div>
                         <div class="fp-tb-logout">
                                 {{#pix}}a/refresh{{/pix}}
                             </a>
                         </div>
                         <div class="fp-tb-logout">
-                            <a title="{{#str}}logout, repository{{/str}}" class="btn btn-secondary" href="#">
+                            <a title="{{#str}}logout, repository{{/str}}" class="btn btn-secondary btn-sm" href="#">
                                 {{#pix}}a/logout{{/pix}}
                             </a>
                         </div>
                         <div class="fp-tb-manage">
                                 {{#pix}}a/logout{{/pix}}
                             </a>
                         </div>
                         <div class="fp-tb-manage">
-                            <a title="{{#str}}settings, repository{{/str}}" class="btn btn-secondary" href="#">
+                            <a title="{{#str}}settings, repository{{/str}}" class="btn btn-secondary btn-sm" href="#">
                                 {{#pix}}a/setting{{/pix}}
                             </a>
                         </div>
                         <div class="fp-tb-help">
                                 {{#pix}}a/setting{{/pix}}
                             </a>
                         </div>
                         <div class="fp-tb-help">
-                            <a title="{{#str}}help, repository{{/str}}" class="btn btn-secondary" href="#">
+                            <a title="{{#str}}help, repository{{/str}}" class="btn btn-secondary btn-sm" href="#">
                                 {{#pix}}a/help{{/pix}}
                             </a>
                         </div>
                         <div class="fp-tb-message"></div>
                     </div>
                     <div class="fp-viewbar btn-group pull-xs-right">
                                 {{#pix}}a/help{{/pix}}
                             </a>
                         </div>
                         <div class="fp-tb-message"></div>
                     </div>
                     <div class="fp-viewbar btn-group pull-xs-right">
-                        <a role="button" title="{{#str}}displayicons, repository{{/str}}" class="fp-vb-icons btn btn-secondary" href="#">
+                        <a role="button" title="{{#str}}displayicons, repository{{/str}}" class="fp-vb-icons btn btn-secondary btn-sm" href="#">
                             {{#pix}}fp/view_icon_active, theme{{/pix}}
                         </a>
                             {{#pix}}fp/view_icon_active, theme{{/pix}}
                         </a>
-                        <a role="button" title="{{#str}}displaydetails, repository{{/str}}" class="fp-vb-details btn btn-secondary" href="#">
+                        <a role="button" title="{{#str}}displaydetails, repository{{/str}}" class="fp-vb-details btn btn-secondary btn-sm" href="#">
                             {{#pix}}fp/view_list_active, theme{{/pix}}
                         </a>
                             {{#pix}}fp/view_list_active, theme{{/pix}}
                         </a>
-                        <a role="button" title="{{#str}}displaytree, repository{{/str}}" class="fp-vb-tree btn btn-secondary" href="#">
+                        <a role="button" title="{{#str}}displaytree, repository{{/str}}" class="fp-vb-tree btn btn-secondary btn-sm" href="#">
                             {{#pix}}fp/view_tree_active, theme{{/pix}}
                         </a>
                     </div>
                             {{#pix}}fp/view_tree_active, theme{{/pix}}
                         </a>
                     </div>
index a24fba5..15c2223 100644 (file)
@@ -4,20 +4,20 @@
         <span class="dnduploadnotsupported-message"> - {{#str}}dndnotsupported_insentence{{/str}}{{{helpicon}}}</span>
     </div>
     <div class="fp-navbar bg-faded card m-b-0">
         <span class="dnduploadnotsupported-message"> - {{#str}}dndnotsupported_insentence{{/str}}{{{helpicon}}}</span>
     </div>
     <div class="fp-navbar bg-faded card m-b-0">
-        <div class="filemanager-toolbar">
+        <div class="filemanager-toolbar icon-no-spacing">
             <div class="fp-toolbar">
                 <div class="fp-btn-add">
             <div class="fp-toolbar">
                 <div class="fp-btn-add">
-                    <a role="button" title="{{#str}}addfile, repository{{/str}}" class="btn btn-secondary" href="#">
+                    <a role="button" title="{{#str}}addfile, repository{{/str}}" class="btn btn-secondary btn-sm" href="#">
                         {{#pix}}a/add_file{{/pix}}
                     </a>
                 </div>
                 <div class="fp-btn-mkdir">
                         {{#pix}}a/add_file{{/pix}}
                     </a>
                 </div>
                 <div class="fp-btn-mkdir">
-                    <a role="button" title="{{#str}}makeafolder{{/str}}" class="btn btn-secondary" href="#">
+                    <a role="button" title="{{#str}}makeafolder{{/str}}" class="btn btn-secondary btn-sm" href="#">
                         {{#pix}}a/create_folder{{/pix}}
                     </a>
                 </div>
                 <div class="fp-btn-download">
                         {{#pix}}a/create_folder{{/pix}}
                     </a>
                 </div>
                 <div class="fp-btn-download">
-                    <a role="button" title="{{#str}}downloadfolder, repository{{/str}}" class="btn btn-secondary" href="#">
+                    <a role="button" title="{{#str}}downloadfolder, repository{{/str}}" class="btn btn-secondary btn-sm" href="#">
                         {{#pix}}a/download_all{{/pix}}
                     </a>
                 </div>
                         {{#pix}}a/download_all{{/pix}}
                     </a>
                 </div>
                 </span>
             </div>
             <div class="fp-viewbar btn-group pull-xs-right">
                 </span>
             </div>
             <div class="fp-viewbar btn-group pull-xs-right">
-                <a title="{{#str}}displayicons, repository{{/str}}" class="fp-vb-icons btn btn-secondary" href="#">
+                <a title="{{#str}}displayicons, repository{{/str}}" class="fp-vb-icons btn btn-secondary btn-sm" href="#">
                     {{#pix}}fp/view_icon_active, theme{{/pix}}
                 </a>
                     {{#pix}}fp/view_icon_active, theme{{/pix}}
                 </a>
-                <a title="{{#str}}displaydetails, repository{{/str}}" class="fp-vb-details btn btn-secondary" href="#">
+                <a title="{{#str}}displaydetails, repository{{/str}}" class="fp-vb-details btn btn-secondary btn-sm" href="#">
                     {{#pix}}fp/view_list_active, theme{{/pix}}
                 </a>
                     {{#pix}}fp/view_list_active, theme{{/pix}}
                 </a>
-                <a title="{{#str}}displaytree, repository{{/str}}" class="fp-vb-tree btn btn-secondary" href="#">
+                <a title="{{#str}}displaytree, repository{{/str}}" class="fp-vb-tree btn btn-secondary btn-sm" href="#">
                     {{#pix}}fp/view_tree_active, theme{{/pix}}
                 </a>
             </div>
                     {{#pix}}fp/view_tree_active, theme{{/pix}}
                 </a>
             </div>