From 88af02083939b3b5a2d3cfe353c8fc892f3ef992 Mon Sep 17 00:00:00 2001
From: Damyon Wiese <damyon@moodle.com>
Date: Tue, 26 Jul 2016 17:10:08 +0800
Subject: [PATCH] MDL-55411 theme_noname: Style the filepicker for bootstrap 4

Uses templates.

Part of MDL-55071
---
 files/renderer.php                            |  40 +-
 lib/form/dndupload.js                         |  23 +-
 lib/form/filemanager.js                       |   8 +-
 repository/filepicker.js                      |  19 +-
 .../classes/output/core/files_renderer.php    | 139 ++++++
 theme/noname/scss/moodle/core.scss            |   2 +-
 theme/noname/scss/moodle/filemanager.scss     | 305 +-------------
 theme/noname/scss/moodle/forms.scss           |   7 -
 theme/noname/style/build.css                  | 398 +-----------------
 .../core/filemanager_confirmdialog.mustache   |   5 +
 .../filemanager_default_searchform.mustache   |   4 +
 .../core/filemanager_fileselect.mustache      |  65 +++
 .../core/filemanager_loginform.mustache       |  30 ++
 .../filemanager_modal_generallayout.mustache  |  61 +++
 .../filemanager_page_generallayout.mustache   |  58 +++
 .../filemanager_processexistingfile.mustache  |   8 +
 ...nager_processexistingfilemultiple.mustache |   9 +
 .../core/filemanager_selectlayout.mustache    |  50 +++
 .../core/filemanager_uploadform.mustache      |  29 ++
 19 files changed, 534 insertions(+), 726 deletions(-)
 create mode 100644 theme/noname/classes/output/core/files_renderer.php
 create mode 100644 theme/noname/templates/core/filemanager_confirmdialog.mustache
 create mode 100644 theme/noname/templates/core/filemanager_default_searchform.mustache
 create mode 100644 theme/noname/templates/core/filemanager_fileselect.mustache
 create mode 100644 theme/noname/templates/core/filemanager_loginform.mustache
 create mode 100644 theme/noname/templates/core/filemanager_modal_generallayout.mustache
 create mode 100644 theme/noname/templates/core/filemanager_page_generallayout.mustache
 create mode 100644 theme/noname/templates/core/filemanager_processexistingfile.mustache
 create mode 100644 theme/noname/templates/core/filemanager_processexistingfilemultiple.mustache
 create mode 100644 theme/noname/templates/core/filemanager_selectlayout.mustache
 create mode 100644 theme/noname/templates/core/filemanager_uploadform.mustache

diff --git a/files/renderer.php b/files/renderer.php
index 7060a677607..7fce28428ea 100644
--- a/files/renderer.php
+++ b/files/renderer.php
@@ -175,7 +175,7 @@ class core_files_renderer extends plugin_renderer_base {
      * @param form_filemanager $fm
      * @return string
      */
-    private function fm_print_generallayout($fm) {
+    protected function fm_print_generallayout($fm) {
         global $OUTPUT;
         $options = $fm->options;
         $client_id = $options->client_id;
@@ -264,7 +264,7 @@ class core_files_renderer extends plugin_renderer_base {
      * @see fp_js_template_iconfilename()
      * @return string
      */
-    private function fm_js_template_iconfilename() {
+    protected function fm_js_template_iconfilename() {
         $rv = '
 <div class="fp-file">
     <a href="#">
@@ -295,7 +295,7 @@ class core_files_renderer extends plugin_renderer_base {
      * @see fp_js_template_listfilename()
      * @return string
      */
-    private function fm_js_template_listfilename() {
+    protected function fm_js_template_listfilename() {
         $rv = '
 <span class="fp-filename-icon">
     <a href="#">
@@ -322,7 +322,7 @@ class core_files_renderer extends plugin_renderer_base {
      *
      * @return string
      */
-    private function fm_js_template_mkdir() {
+    protected function fm_js_template_mkdir() {
         $rv = '
 <div class="filemanager fp-mkdir-dlg" role="dialog" aria-live="assertive" aria-labelledby="fp-mkdir-dlg-title">
     <div class="fp-mkdir-dlg-text">
@@ -341,7 +341,7 @@ class core_files_renderer extends plugin_renderer_base {
      * @see fp_js_template_message()
      * @return string
      */
-    private function fm_js_template_message() {
+    protected function fm_js_template_message() {
         return $this->fp_js_template_message();
     }
 
@@ -386,7 +386,7 @@ class core_files_renderer extends plugin_renderer_base {
      *
      * @return string
      */
-    private function fm_js_template_fileselectlayout() {
+    protected function fm_js_template_fileselectlayout() {
         global $OUTPUT;
         $strloading  = get_string('loading', 'repository');
         $iconprogress = $this->pix_icon('i/loading_small', $strloading).'';
@@ -474,7 +474,7 @@ class core_files_renderer extends plugin_renderer_base {
      *
      * @return string
      */
-    private function fm_js_template_confirmdialog() {
+    protected function fm_js_template_confirmdialog() {
         $rv = '
 <div class="filemanager fp-dlg">
     <div class="fp-dlg-text"></div>
@@ -505,7 +505,7 @@ class core_files_renderer extends plugin_renderer_base {
      * @param form_filemanager $fm
      * @return string
      */
-    private function fm_print_restrictions($fm) {
+    protected function fm_print_restrictions($fm) {
         $maxbytes = display_size($fm->options->maxbytes);
         $strparam = (object) array('size' => $maxbytes, 'attachments' => $fm->options->maxfiles,
             'areasize' => display_size($fm->options->areamaxbytes));
@@ -568,7 +568,7 @@ class core_files_renderer extends plugin_renderer_base {
      *
      * @return string
      */
-    private function fp_js_template_generallayout() {
+    protected function fp_js_template_generallayout() {
         $rv = '
 <div tabindex="0" class="file-picker fp-generallayout" role="dialog" aria-live="assertive">
     <div class="fp-repo-area">
@@ -650,7 +650,7 @@ class core_files_renderer extends plugin_renderer_base {
      *
      * @return string
      */
-    private function fp_js_template_iconfilename() {
+    protected function fp_js_template_iconfilename() {
         $rv = '
 <a class="fp-file" href="#" >
     <div style="position:relative;">
@@ -681,7 +681,7 @@ class core_files_renderer extends plugin_renderer_base {
      *
      * @return string
      */
-    private function fp_js_template_listfilename() {
+    protected function fp_js_template_listfilename() {
         $rv = '
 <span class="fp-filename-icon">
     <a href="#">
@@ -705,7 +705,7 @@ class core_files_renderer extends plugin_renderer_base {
      *
      * @return string
      */
-    private function fp_js_template_nextpage() {
+    protected function fp_js_template_nextpage() {
         $rv = '
 <div class="fp-nextpage">
     <div class="fp-nextpage-link"><a href="#">'.get_string('more').'</a></div>
@@ -744,7 +744,7 @@ class core_files_renderer extends plugin_renderer_base {
      *
      * @return string
      */
-    private function fp_js_template_selectlayout() {
+    protected function fp_js_template_selectlayout() {
         $rv = '
 <div class="file-picker fp-select">
     <div class="fp-select-loading">
@@ -828,7 +828,7 @@ class core_files_renderer extends plugin_renderer_base {
      *
      * @return string
      */
-    private function fp_js_template_uploadform() {
+    protected function fp_js_template_uploadform() {
         $rv = '
 <div class="fp-upload-form">
     <div class="fp-content-center">
@@ -873,7 +873,7 @@ class core_files_renderer extends plugin_renderer_base {
      *
      * @return string
      */
-    private function fp_js_template_loading() {
+    protected function fp_js_template_loading() {
         return '
 <div class="fp-content-loading">
     <div class="fp-content-center">
@@ -891,7 +891,7 @@ class core_files_renderer extends plugin_renderer_base {
      *
      * @return string
      */
-    private function fp_js_template_error() {
+    protected function fp_js_template_error() {
         $rv = '
 <div class="fp-content-error" ><div class="fp-error"></div></div>';
         return $rv;
@@ -910,7 +910,7 @@ class core_files_renderer extends plugin_renderer_base {
      *
      * @return string
      */
-    private function fp_js_template_message() {
+    protected function fp_js_template_message() {
         $rv = '
 <div class="file-picker fp-msg" role="alertdialog" aria-live="assertive" aria-labelledby="fp-msg-labelledby">
     <p class="fp-msg-text" id="fp-msg-labelledby"></p>
@@ -934,7 +934,7 @@ class core_files_renderer extends plugin_renderer_base {
      *
      * @return string
      */
-    private function fp_js_template_processexistingfile() {
+    protected function fp_js_template_processexistingfile() {
         $rv = '
 <div class="file-picker fp-dlg">
     <p class="fp-dlg-text"></p>
@@ -961,7 +961,7 @@ class core_files_renderer extends plugin_renderer_base {
      *
      * @return string
      */
-    private function fp_js_template_processexistingfilemultiple() {
+    protected function fp_js_template_processexistingfilemultiple() {
         $rv = '
 <div class="file-picker fp-dlg">
     <p class="fp-dlg-text"></p>
@@ -997,7 +997,7 @@ class core_files_renderer extends plugin_renderer_base {
      *
      * @return string
      */
-    private function fp_js_template_loginform() {
+    protected function fp_js_template_loginform() {
         $rv = '
 <div class="fp-login-form">
     <div class="fp-content-center">
diff --git a/lib/form/dndupload.js b/lib/form/dndupload.js
index 9921d40f7ff..82f1bed2f9f 100644
--- a/lib/form/dndupload.js
+++ b/lib/form/dndupload.js
@@ -549,16 +549,14 @@ M.form_dndupload.init = function(Y, options) {
                 header = M.util.get_string('info', 'moodle');
             }
             if (!this.msg_dlg) {
-                this.msg_dlg_node = Y.Node.createWithFilesSkin(M.core_filepicker.templates.message);
+                this.msg_dlg_node = Y.Node.create(M.core_filepicker.templates.message);
                 this.msg_dlg_node.generateID();
 
-                this.msg_dlg = new Y.Panel({
-                    srcNode      : this.msg_dlg_node,
-                    zIndex       : 8000,
+                this.msg_dlg = new M.core.dialogue({
+                    bodyContent  : this.msg_dlg_node,
                     centered     : true,
                     modal        : true,
-                    visible      : false,
-                    render       : true
+                    visible      : false
                 });
                 this.msg_dlg.plug(Y.Plugin.Drag,{handles:['#'+this.msg_dlg_node.get('id')+' .yui3-widget-hd']});
                 this.msg_dlg_node.one('.fp-msg-butok').on('click', function(e) {
@@ -705,21 +703,18 @@ M.form_dndupload.init = function(Y, options) {
 
             var process_dlg_node;
             if (multiplefiles) {
-                process_dlg_node = Y.Node.createWithFilesSkin(M.core_filepicker.templates.processexistingfilemultiple);
+                process_dlg_node = Y.Node.create(M.core_filepicker.templates.processexistingfilemultiple);
             } else {
-                process_dlg_node = Y.Node.createWithFilesSkin(M.core_filepicker.templates.processexistingfile);
+                process_dlg_node = Y.Node.create(M.core_filepicker.templates.processexistingfile);
             }
             var node = process_dlg_node;
             node.generateID();
-            var process_dlg = new Y.Panel({
-                srcNode      : node,
+            var process_dlg = new M.core.dialogue({
+                bodyContent  : node,
                 headerContent: M.util.get_string('fileexistsdialogheader', 'repository'),
-                zIndex       : 8000,
                 centered     : true,
                 modal        : true,
-                visible      : false,
-                render       : true,
-                buttons      : {}
+                visible      : false
             });
             process_dlg.plug(Y.Plugin.Drag,{handles:['#'+node.get('id')+' .yui3-widget-hd']});
 
diff --git a/lib/form/filemanager.js b/lib/form/filemanager.js
index bd6a6323289..5d37e48c052 100644
--- a/lib/form/filemanager.js
+++ b/lib/form/filemanager.js
@@ -103,7 +103,7 @@ M.form_filemanager.init = function(Y, options) {
                 this.pathbar.removeChild(this.pathnode);
             }
             // initialize 'select file' panel
-            this.selectnode = Y.Node.createWithFilesSkin(M.form_filemanager.templates.fileselectlayout);
+            this.selectnode = Y.Node.create(M.form_filemanager.templates.fileselectlayout);
             this.selectnode.setAttribute('aria-live', 'assertive');
             this.selectnode.setAttribute('role', 'dialog');
             this.selectnode.generateID();
@@ -239,7 +239,7 @@ M.form_filemanager.init = function(Y, options) {
                 header = M.util.get_string('info', 'moodle');
             }
             if (!this.msg_dlg) {
-                this.msg_dlg_node = Y.Node.createWithFilesSkin(M.form_filemanager.templates.message);
+                this.msg_dlg_node = Y.Node.create(M.form_filemanager.templates.message);
                 var nodeid = this.msg_dlg_node.generateID();
 
                 this.msg_dlg = new M.core.dialogue({
@@ -319,7 +319,7 @@ M.form_filemanager.init = function(Y, options) {
                         return valid;
                     };
                     if (!this.mkdir_dialog) {
-                        var node = Y.Node.createWithFilesSkin(M.form_filemanager.templates.mkdir);
+                        var node = Y.Node.create(M.form_filemanager.templates.mkdir);
                         this.mkdir_dialog = new M.core.dialogue({
                             draggable    : true,
                             bodyContent  : node,
@@ -745,7 +745,7 @@ M.form_filemanager.init = function(Y, options) {
         show_confirm_dialog: function(dialog_options) {
             // instead of M.util.show_confirm_dialog(e, dialog_options);
             if (!this.confirm_dlg) {
-                this.confirm_dlg_node = Y.Node.createWithFilesSkin(M.form_filemanager.templates.confirmdialog);
+                this.confirm_dlg_node = Y.Node.create(M.form_filemanager.templates.confirmdialog);
                 var node = this.confirm_dlg_node;
                 node.generateID();
                 this.confirm_dlg = new M.core.dialogue({
diff --git a/repository/filepicker.js b/repository/filepicker.js
index 238bef2321b..43d1a22e412 100644
--- a/repository/filepicker.js
+++ b/repository/filepicker.js
@@ -460,17 +460,6 @@ YUI.add('moodle-core_filepicker', function(Y) {
         }
 
     }
-
-    /**
-     * creates a node and adds it to the div with id #filesskin. This is needed for CSS to be able
-     * to overwrite YUI skin styles (instead of using !important that does not work in IE)
-     */
-    Y.Node.createWithFilesSkin = function(node) {
-        if (!Y.one('#filesskin')) {
-            Y.one(document.body).appendChild(Y.Node.create('<div/>').set('id', 'filesskin'));
-        }
-        return Y.one('#filesskin').appendChild(Y.Node.create(node));
-    }
 }, '@VERSION@', {
     requires:['base', 'node', 'yui2-treeview', 'panel', 'cookie', 'datatable', 'datatable-sort']
 });
@@ -716,7 +705,7 @@ M.core_filepicker.init = function(Y, options) {
                 this.selectui.hide();
             }
             if (!this.process_dlg) {
-                this.process_dlg_node = Y.Node.createWithFilesSkin(M.core_filepicker.templates.processexistingfile);
+                this.process_dlg_node = Y.Node.create(M.core_filepicker.templates.processexistingfile);
                 var node = this.process_dlg_node;
                 node.generateID();
                 this.process_dlg = new M.core.dialogue({
@@ -757,7 +746,7 @@ M.core_filepicker.init = function(Y, options) {
                 header = M.util.get_string('info', 'moodle');
             }
             if (!this.msg_dlg) {
-                this.msg_dlg_node = Y.Node.createWithFilesSkin(M.core_filepicker.templates.message);
+                this.msg_dlg_node = Y.Node.create(M.core_filepicker.templates.message);
                 this.msg_dlg_node.generateID();
 
                 this.msg_dlg = new M.core.dialogue({
@@ -1301,7 +1290,7 @@ M.core_filepicker.init = function(Y, options) {
             var labelid = 'fp-dialog-label_'+ client_id;
             var width = 873;
             var draggable = true;
-            this.fpnode = Y.Node.createWithFilesSkin(M.core_filepicker.templates.generallayout).
+            this.fpnode = Y.Node.create(M.core_filepicker.templates.generallayout).
                 set('id', 'filepicker-'+client_id).set('aria-labelledby', labelid);
 
             if (this.in_iframe()) {
@@ -1324,7 +1313,7 @@ M.core_filepicker.init = function(Y, options) {
             });
 
             // create panel for selecting a file (initially hidden)
-            this.selectnode = Y.Node.createWithFilesSkin(M.core_filepicker.templates.selectlayout).
+            this.selectnode = Y.Node.create(M.core_filepicker.templates.selectlayout).
                 set('id', 'filepicker-select-'+client_id).
                 set('aria-live', 'assertive').
                 set('role', 'dialog');
diff --git a/theme/noname/classes/output/core/files_renderer.php b/theme/noname/classes/output/core/files_renderer.php
new file mode 100644
index 00000000000..eceb334ebcc
--- /dev/null
+++ b/theme/noname/classes/output/core/files_renderer.php
@@ -0,0 +1,139 @@
+<?php
+// This file is part of Moodle - http://moodle.org/
+//
+// Moodle is free software: you can redistribute it and/or modify
+// it under the terms of the GNU General Public License as published by
+// the Free Software Foundation, either version 3 of the License, or
+// (at your option) any later version.
+//
+// Moodle is distributed in the hope that it will be useful,
+// but WITHOUT ANY WARRANTY; without even the implied warranty of
+// MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+// GNU General Public License for more details.
+//
+// You should have received a copy of the GNU General Public License
+// along with Moodle.  If not, see <http://www.gnu.org/licenses/>.
+
+namespace theme_noname\output\core;
+
+use plugin_renderer_base;
+
+require_once($CFG->dirroot . '/files/renderer.php');
+
+defined('MOODLE_INTERNAL') || die();
+
+/**
+ * Rendering of files viewer related widgets.
+ * @package   theme_noname
+ * @copyright 2016 Damyon Wiese
+ * @license   http://www.gnu.org/copyleft/gpl.html GNU GPL v3 or later
+ */
+
+/**
+ * Rendering of files viewer related widgets.
+ * @package   theme_noname
+ * @copyright 2016 Damyon Wiese
+ * @license   http://www.gnu.org/copyleft/gpl.html GNU GPL v3 or later
+ */
+class files_renderer extends \core_files_renderer {
+    /**
+     * FileManager JS template for window with file information/actions.
+     *
+     */
+    protected function fm_js_template_fileselectlayout() {
+        $context = [
+            'helpicon' => $this->help_icon('setmainfile', 'repository')
+        ];
+        return $this->render_from_template('core/filemanager_fileselect', $context);
+    }
+
+    /**
+     * FileManager JS template for popup confirm dialogue window.
+     *
+     * @return string
+     */
+    protected function fm_js_template_confirmdialog() {
+        return $this->render_from_template('core/filemanager_confirmdialog', []);
+    }
+
+    /**
+     * Template for FilePicker with general layout (not QuickUpload).
+     *
+     *
+     * @return string
+     */
+    protected function fp_js_template_generallayout() {
+        return $this->render_from_template('core/filemanager_modal_generallayout', []);
+    }
+
+    /**
+     * Returns html for displaying one file manager
+     *
+     * @param form_filemanager $fm
+     * @return string
+     */
+    protected function fm_print_generallayout($fm) {
+        $context = [
+            'client_id' => $fm->options->client_id,
+            'helpicon' => $this->help_icon('setmainfile', 'repository'),
+            'restrictions' => $this->fm_print_restrictions($fm)
+        ];
+        return $this->render_from_template('core/filemanager_page_generallayout', $context);
+    }
+
+    /**
+     * Returns HTML for default repository searchform to be passed to Filepicker
+     *
+     * This will be used as contents for search form defined in generallayout template
+     * (form with id {TOOLSEARCHID}).
+     * Default contents is one text input field with name="s"
+     */
+    public function repository_default_searchform() {
+        return $this->render_from_template('core/filemanager_default_searchform', []);
+    }
+
+    /**
+     * FilePicker JS template for 'Upload file' repository
+     *
+     * @return string
+     */
+    protected function fp_js_template_uploadform() {
+        return $this->render_from_template('core/filemanager_uploadform', []);
+    }
+
+    /**
+     * FilePicker JS template for repository login form including templates for each element type
+     *
+     * @return string
+     */
+    protected function fp_js_template_loginform() {
+        return $this->render_from_template('core/filemanager_loginform', ['autofillhack' => prevent_form_autofill_password()]);
+    }
+
+    /**
+     * FilePicker JS template for window appearing to select a file.
+     *
+     * @return string
+     */
+    protected function fp_js_template_selectlayout() {
+        return $this->render_from_template('core/filemanager_selectlayout', []);
+    }
+
+    /**
+     * FilePicker JS template for popup dialogue window asking for action when file with the same name already exists (multiple-file version).
+     *
+     * @return string
+     */
+    protected function fp_js_template_processexistingfilemultiple() {
+        return $this->render_from_template('core/filemanager_processexistingfilemultiple', []);
+    }
+
+    /**
+     * FilePicker JS template for popup dialogue window asking for action when file with the same name already exists.
+     *
+     * @return string
+     */
+    protected function fp_js_template_processexistingfile() {
+        return $this->render_from_template('core/filemanager_processexistingfile', []);
+    }
+}
\ No newline at end of file
diff --git a/theme/noname/scss/moodle/core.scss b/theme/noname/scss/moodle/core.scss
index 2d51bc92f99..de446906cc4 100644
--- a/theme/noname/scss/moodle/core.scss
+++ b/theme/noname/scss/moodle/core.scss
@@ -1189,7 +1189,7 @@ body#page-lib-editor-tinymce-plugins-moodlemedia-preview {
 }
 .moodle-dialogue-base .moodle-dialogue-wrap .moodle-dialogue-hd.yui3-widget-hd {
     // Undo some YUI damage.
-    min-height: initial;
+    min-height: 3rem;
     color: initial;
     background-color: initial;
     background: initial;
diff --git a/theme/noname/scss/moodle/filemanager.scss b/theme/noname/scss/moodle/filemanager.scss
index b5d65501312..d7d0dc6c266 100644
--- a/theme/noname/scss/moodle/filemanager.scss
+++ b/theme/noname/scss/moodle/filemanager.scss
@@ -1,29 +1,4 @@
  // File Picker and File Manager
-.filemanager,
-.filepicker,
-.file-picker {
-    font-size: 11px;
-}
-.filemanager a,
-.file-picker a,
-.filemanager a:hover,
-.file-picker a:hover {
-    color: #555555;
-    text-decoration: none;
-}
-.filemanager input[type="text"],
-.file-picker input[type="text"] {
-    width: 265px;
-}
-.filemanager .fp-license,
-.file-picker .fp-setlicense {
-    td {
-        max-width: 265px;
-    }
-    select {
-        max-width: 100%;
-    }
-}
 .fp-content-center {
     height: 100%;
     width: 100%;
@@ -37,26 +12,6 @@
 .yui3-panel-focused {
     outline: none;
 }
-#filesskin .yui3-panel-content {
-    padding-bottom: 20px;
-    background: #F2F2F2;
-    @include border-radius(8px);
-    border: 1px solid #fff;
-    display: inline-block;
-    @include box-shadow(5px 5px 20px 0 #666);
-}
-#filesskin .yui3-widget-hd {
-    @include border-radius(10px 10px 0 0);
-    border-bottom: 1px solid #BBBBBB;
-    padding: 5px;
-    text-align: center;
-    font-size: 12px;
-    color: #333;
-    letter-spacing: 1px;
-    text-shadow: 1px 1px 1px #fff;
-    filter: dropshadow(color=#FFFFFF, offx=1, offy=1);
-    @include gradient-vertical (#fff, #ccc);
-}
 .fp-panel-button {
     background: #fff;
     padding: 3px 20px 2px 20px;
@@ -67,49 +22,13 @@
     @include box-shadow(2px 2px 3px .1px #999);
 }
 
-.moodle-dialogue h3 {
-    font-size: 14px;
-    margin: 0;
-    line-height: 20px;
-}
-
- .moodle-dialogue-base .filepicker .moodle-dialogue-wrap .moodle-dialogue-bd {
-    padding: 0px;
-}
-
 // File Picker layout
-#filesskin .file-picker.fp-generallayout {
-    width: 859px;
-    background: #FFFFFF;
-    @include border-radius(10px);
-    border: 1px solid #CCCCCC;
-    position: relative;
-}
-.file-picker .fp-repo-area {
-    width: 180px;
-    overflow: auto;
-    display: inline-block;
-    height: 525px;
-    border-right: 1px solid #BBBBBB;
-}
-.file-picker .fp-repo-items {
-    float: none;
-    width: auto;
-    margin-left:181px;
-}
-.moodle-dialogue-fullscreen .file-picker .fp-repo-items {
-    margin-left: 0px;
-    margin-right:0px;
-    float: left;
+.filepicker .yui3-widget-content-expanded {
+    height: auto;
 }
 .file-picker .fp-navbar {
-    background: #F2F2F2;
-    border-bottom: 1px solid #BBBBBB;
+    border-bottom: 1px solid #e5e5e5;
     min-height: 40px;
-    overflow: hidden;
-}
-.file-picker .fp-navbar .fp-viewbar {
-    margin: 4px;
 }
 
 .file-picker .fp-content {
@@ -170,18 +89,7 @@
     vertical-align: -15%;
     margin-right: 5px;
 }
-.fp-toolbar .fp-tb-search {
-    width: 235px;
-    height: 27px;
-}
-.fp-toolbar .fp-tb-search input {
-    background: #FFFFFF url('[[pix:a/search]]') no-repeat 7px 7px;
-    padding: 2px 6px 1px 27px;
-    width: 200px;
-    height: 27px;
-    border: 1px solid #BBBBBB;
-}
-.fp-viewbar {
+.fp-viewbaffr {
     float: right;
     height: 30px;
     border: 1px solid #CCC;
@@ -192,37 +100,37 @@
 .fp-repo-items fp-viewbar {
     margin: 4px;
 }
-.fp-viewbar a {
+.fp-viddewbar a {
     width: 30px;
     height: 30px;
     border-right: 1px solid #CCC;
     display: block;
     float:left;
 }
-.fp-viewbar a.checked:hover,
-.fp-viewbar a:hover {
+.fp-viddewbar a.checked:hover,
+.fp-viddewbar a:hover {
     background-image: radial-gradient(ellipse at center, #ffffff 60%,#dfdfdf 100%);
     background-color: #ebebeb;
 }
 
-.fp-viewbar a.checked,
-.fp-viewbar a:active {
+.fp-viddewbar a.checked,
+.fp-vieddwbar a:active {
     background-image: radial-gradient(ellipse at center, #ffffff 40%,#dfdfdf 100%);
     background-color: #dfdfdf;
 }
 
-.fp-viewbar a.fp-vb-icons {
+.fp-viewddbar a.fp-vb-icons {
     border-radius: 4px 0 0 4px;
 }
-.fp-viewbar a.fp-vb-tree {
+.fp-vieddwbar a.fp-vb-tree {
     border-right: 0;
     border-radius: 0 4px 4px 0;
 }
-.fp-viewbar a img {
+.fp-vieddwbar a img {
     margin: 7px;
 }
 
-.fp-viewbar.disabled a {
+.fp-viewddbar.disabled a {
     opacity: .45;
     background: none;
     cursor: default;
@@ -231,9 +139,6 @@
 .file-picker .fp-clear-left {
     clear: left;
 }
-.file-picker .fp-pathbar {
-    display: table-row;
-}
 .fp-pathbar.empty {
     display: none;
 }
@@ -257,7 +162,7 @@
 }
 .fp-pathbar .fp-path-folder-name {
     margin-left: 32px;
-    line-height: 20px;
+
 }
 // Icon view (File Picker and File Manager)
 .fp-iconview .fp-file {
@@ -306,20 +211,6 @@
     border: 0 solid #BBBBBB;
     width: 100%;
 }
-#filesskin .file-picker .yui3-datatable-header {
-    background: #FFFFFF;
-    border-bottom: 1px solid #CCCCCC;
-    border-left: 0 solid #FFFFFF;
-    color: #555555;
-}
-#filesskin .file-picker .yui3-datatable-odd .yui3-datatable-cell {
-    background-color: #F6F6F6;
-    border-left: 0 solid #F6F6F6;
-}
-#filesskin .file-picker .yui3-datatable-even .yui3-datatable-cell {
-    background-color: #FFFFFF;
-    border-left: 0 solid #FFFFFF;
-}
 // Tree view (File Manager only)
 
 // first or middle sibling, no children
@@ -497,24 +388,6 @@ a.ygtvspacer:hover {
     width: 100%;
     display: table;
 }
-.file-picker .fp-login-form table {
-    margin: 0 auto;
-}
-.file-picker .fp-login-form p {
-    text-align: center;
-    margin-top: 3em;
-}
-.file-picker .fp-login-form .fp-login-input label {
-    text-align: right;
-    display: block;
-}
-.file-picker .fp-login-form .fp-login-input .input {
-    text-align: left;
-}
-.file-picker .fp-login-form input[type="checkbox"]{
-    width: 15px;
-    height: 15px;
-}
 // Upload on fp-content (File Picker only)
 .file-picker .fp-upload-form {
     height: 100%;
@@ -528,10 +401,6 @@ a.ygtvspacer:hover {
 .file-picker.fp-dlg {
     text-align: center;
 }
-.file-picker.fp-dlg .fp-dlg-text {
-    padding: 30px 20px 10px;
-    font-size: 12px;
-}
 .file-picker.fp-dlg .fp-dlg-buttons {
     margin: 0 20px;
 }
@@ -539,18 +408,6 @@ a.ygtvspacer:hover {
 .file-picker.fp-msg {
     text-align: center;
 }
-.file-picker.fp-msg .fp-msg-text {
-    padding: 40px 20px 10px 20px;
-    min-width: 200px;
-    max-width: 500px;
-    max-height: 300px;
-    overflow: auto;
-    font-size: 12px;
-}
-.file-picker.fp-msg.fp-msg-error .fp-msg-text {
-    padding: 40px 20px 10px 20px;
-    font-size: 12px;
-}
 // Error on fp-content (File Picker only)
 .file-picker .fp-content-error {
     height: 100%;
@@ -558,14 +415,6 @@ a.ygtvspacer:hover {
     display: table;
     text-align: center;
 }
-.file-picker .fp-content-error .fp-error {
-    height: 100%;
-    width: 100%;
-    display: table-cell;
-    vertical-align: middle;
-    padding: 40px 20px 10px 20px;
-    font-size: 12px;
-}
 // Lazy loading on fp-content (File Picker only)
 .file-picker .fp-nextpage {
     clear: both;
@@ -590,14 +439,6 @@ a.ygtvspacer:hover {
     text-align: center;
     margin-top: 20px;
 }
-.fp-select .fp-hr {
-    clear: both;
-    height: 1px;
-    background-color: #FFFFFF;
-    border-bottom: 1px solid #BBBBBB;
-    width: auto;
-    margin: 10px 0;
-}
 .fp-select table {
     padding: 0 0 10px;
 }
@@ -705,86 +546,17 @@ a.ygtvspacer:hover {
         text-align: right;
     }
 }
-.filemanager .fp-navbar {
-    background: #F2F2F2;
-    border: 1px solid #BBBBBB;
-    border-bottom: none;
-}
 .filemanager-toolbar{
     padding: 4px;
     overflow: hidden;
 }
-.fp-pathbar {
-    border-top: 1px solid #BBBBBB;
-    padding: 5px 8px 1px;
-    min-height: 20px;
-}
-
-.file-picker .fp-toolbar {
-    padding: 4px;
-}
-
-.fp-toolbar .fp-btn-add,
-.fp-toolbar .fp-btn-download,
-.fp-toolbar .fp-btn-mkdir,
-.fp-toolbar .fp-tb-help,
-.fp-toolbar .fp-tb-manage,
-.fp-toolbar .fp-tb-logout,
-.fp-toolbar .fp-tb-refresh
- {
-    border: 1px solid #CCC;
-    border-bottom: 1px solid #B3B3B3;
-    border-radius: 4px;
-    background: white;
-    width: 30px;
-    height: 30px;
-}
-
-.fp-toolbar a:hover {
-    background-image: radial-gradient(ellipse at center, #ffffff 60%,#dfdfdf 100%);
-    background-color: #ebebeb;
-}
-
-.fp-toolbar a:active {
-    background-image: radial-gradient(ellipse at center, #ffffff 40%,#dfdfdf 100%);
-    background-color: #dfdfdf;
-}
-
-.fp-btn-add a,
-.fp-btn-download a,
-.fp-btn-mkdir a,
-.fp-tb-help a,
-.fp-tb-manage a,
-.fp-tb-logout a,
-.fp-tb-refresh a
-{
-    display: block;
-    width: 30px;
-    height: 30px;
-    border-radius: 4px;
-}
-
-.fp-btn-add img,
-.fp-btn-download img,
-.fp-btn-mkdir img,
-.fp-tb-help img,
-.fp-tb-manage img,
-.fp-tb-logout img,
-.fp-tb-refresh img {
-    margin: 7px;
-}
 
 .filemanager .fp-pathbar.empty {
     display: none;
 }
 .filepicker-filelist,
 .filemanager-container {
-    background: #FFFFFF;
-    clear: both;
-    overflow: auto;
-    border: 1px solid #BBBBBB;
     min-height: 140px;
-    position: relative;
 }
 .filemanager .fp-content{
     overflow: auto;
@@ -795,6 +567,9 @@ a.ygtvspacer:hover {
 .filepicker-filelist {
     overflow: hidden;
 }
+.file-picker .yui3-datatable-header {
+    background: initial;
+}
 .fitem.disabled .filepicker-filelist,
 .fitem.disabled .filemanager-container {
     background-color: #EBEBE4;
@@ -1030,9 +805,6 @@ a.ygtvspacer:hover {
 .filemanager.fp-select .fp-reflist .fp-reflistloading {
     display: none;
 }
-.filemanager.fp-select .fp-refcount {
-    max-width: 265px;
-}
 .filemanager.fp-select .fp-reflist.fp-loading .fp-reflistloading {
     display: inline;
 }
@@ -1041,7 +813,6 @@ a.ygtvspacer:hover {
     border: 1px solid #BBBBBB;
     padding: 8px 7px;
     margin: 0;
-    max-width: 265px;
     max-height: 75px;
     overflow: auto;
 }
@@ -1060,16 +831,6 @@ a.ygtvspacer:hover {
 .filemanager.fp-dlg {
     text-align: center;
 }
-.filemanager.fp-dlg .fp-dlg-text {
-    padding: 0 10px;
-    min-width: 200px;
-    max-width: 340px;
-    max-height: 300px;
-    overflow: auto;
-    line-height: 22px;
-    margin: 40px 20px 20px;
-    font-size: 12px;
-}
 // file picker search dialog
 .file-picker div.bd {
     text-align: left;
@@ -1077,43 +838,13 @@ a.ygtvspacer:hover {
 
 // Upload form for file picker.
 .fp-formset {
-    max-width: 500px;
     padding: 10px;
     input[type="file"] {
         line-height: inherit;
     }
 }
- .fp-forminset {
-    max-width: 400px;
+.fp-forminset {
     padding: 0 10px;
-    .control-group.control-radio {
-        margin-bottom: 0;
-    }
-    .control-group {
-        label.control-label {
-           width: 105px;
-        }
-        label.control-radio {
-            float: right;
-            text-align: left;
-            width: 215px;
-        }
-        .controls {
-            margin-left: 125px;
-            select {
-                width: 100%;
-            }
-        }
-        .controls.control-radio input {
-                margin-top: 3px;
-        }
-    }
-    .fp-select-buttons {
-        float: none;
-    }
-    input[type="text"] {
-        width: 228px;
-    }
 }
 
 .fp-fileinfo .fp-value {
diff --git a/theme/noname/scss/moodle/forms.scss b/theme/noname/scss/moodle/forms.scss
index c617f81d818..5bb79aee547 100644
--- a/theme/noname/scss/moodle/forms.scss
+++ b/theme/noname/scss/moodle/forms.scss
@@ -128,17 +128,10 @@ input#id_externalurl {
 // Copying in Bootstrap styles.
 .form-item,
 .mform .fitem {
-    .form-horizontal {
-        @extend .control-group;
-    }
     margin-bottom: 10px;
     // Theres's a mysterious extra 10px inside this item,
     // so reduce margin by 10px from 20px standard to compensate.
 }
-.form-item .form-label,
-.mform .fitem div.fitemtitle .form-horizontal {
-    @extend .control-label;
-}
 .form-defaultinfo,
 .form-label .form-shortname {
     @extend .text-muted;
diff --git a/theme/noname/style/build.css b/theme/noname/style/build.css
index d291c7a01dd..b7f81af3556 100644
--- a/theme/noname/style/build.css
+++ b/theme/noname/style/build.css
@@ -9016,7 +9016,7 @@ body#page-lib-editor-tinymce-plugins-moodlemedia-preview {
   background-size: 100%; }
 
 .moodle-dialogue-base .moodle-dialogue-wrap .moodle-dialogue-hd.yui3-widget-hd {
-  min-height: initial;
+  min-height: 3rem;
   color: initial;
   background-color: initial;
   background: initial;
@@ -11459,30 +11459,6 @@ span.editinstructions {
     #course-category-listings.columns-3 #course-detail > div {
       background-color: #fff; } }
 
-.filemanager,
-.filepicker,
-.file-picker {
-  font-size: 11px; }
-
-.filemanager a,
-.file-picker a,
-.filemanager a:hover,
-.file-picker a:hover {
-  color: #555555;
-  text-decoration: none; }
-
-.filemanager input[type="text"],
-.file-picker input[type="text"] {
-  width: 265px; }
-
-.filemanager .fp-license td,
-.file-picker .fp-setlicense td {
-  max-width: 265px; }
-
-.filemanager .fp-license select,
-.file-picker .fp-setlicense select {
-  max-width: 100%; }
-
 .fp-content-center {
   height: 100%;
   width: 100%;
@@ -11495,27 +11471,6 @@ span.editinstructions {
 .yui3-panel-focused {
   outline: none; }
 
-#filesskin .yui3-panel-content {
-  padding-bottom: 20px;
-  background: #F2F2F2;
-  border-radius: 8px;
-  border: 1px solid #fff;
-  display: inline-block; }
-
-#filesskin .yui3-widget-hd {
-  border-radius: 10px 10px 0 0;
-  border-bottom: 1px solid #BBBBBB;
-  padding: 5px;
-  text-align: center;
-  font-size: 12px;
-  color: #333;
-  letter-spacing: 1px;
-  text-shadow: 1px 1px 1px #fff;
-  filter: dropshadow(color=#FFFFFF, offx=1, offy=1);
-  background-image: linear-gradient(to bottom, #fff 0%, #ccc 100%);
-  background-repeat: repeat-x;
-  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#FFFFFFFF', endColorstr='#FFCCCCCC', GradientType=0); }
-
 .fp-panel-button {
   background: #fff;
   padding: 3px 20px 2px 20px;
@@ -11524,46 +11479,12 @@ span.editinstructions {
   border-radius: 10px;
   display: inline-block; }
 
-.moodle-dialogue h3 {
-  font-size: 14px;
-  margin: 0;
-  line-height: 20px; }
-
-.moodle-dialogue-base .filepicker .moodle-dialogue-wrap .moodle-dialogue-bd {
-  padding: 0px; }
-
-#filesskin .file-picker.fp-generallayout {
-  width: 859px;
-  background: #FFFFFF;
-  border-radius: 10px;
-  border: 1px solid #CCCCCC;
-  position: relative; }
-
-.file-picker .fp-repo-area {
-  width: 180px;
-  overflow: auto;
-  display: inline-block;
-  height: 525px;
-  border-right: 1px solid #BBBBBB; }
-
-.file-picker .fp-repo-items {
-  float: none;
-  width: auto;
-  margin-left: 181px; }
-
-.moodle-dialogue-fullscreen .file-picker .fp-repo-items {
-  margin-left: 0px;
-  margin-right: 0px;
-  float: left; }
+.filepicker .yui3-widget-content-expanded {
+  height: auto; }
 
 .file-picker .fp-navbar {
-  background: #F2F2F2;
-  border-bottom: 1px solid #BBBBBB;
-  min-height: 40px;
-  overflow: hidden; }
-
-.file-picker .fp-navbar .fp-viewbar {
-  margin: 4px; }
+  border-bottom: 1px solid #e5e5e5;
+  min-height: 40px; }
 
 .file-picker .fp-content {
   background: #FFFFFF;
@@ -11621,18 +11542,7 @@ span.editinstructions {
   vertical-align: -15%;
   margin-right: 5px; }
 
-.fp-toolbar .fp-tb-search {
-  width: 235px;
-  height: 27px; }
-
-.fp-toolbar .fp-tb-search input {
-  background: #FFFFFF url("[[pix:a/search]]") no-repeat 7px 7px;
-  padding: 2px 6px 1px 27px;
-  width: 200px;
-  height: 27px;
-  border: 1px solid #BBBBBB; }
-
-.fp-viewbar {
+.fp-viewbaffr {
   float: right;
   height: 30px;
   border: 1px solid #CCC;
@@ -11643,34 +11553,34 @@ span.editinstructions {
 .fp-repo-items fp-viewbar {
   margin: 4px; }
 
-.fp-viewbar a {
+.fp-viddewbar a {
   width: 30px;
   height: 30px;
   border-right: 1px solid #CCC;
   display: block;
   float: left; }
 
-.fp-viewbar a.checked:hover,
-.fp-viewbar a:hover {
+.fp-viddewbar a.checked:hover,
+.fp-viddewbar a:hover {
   background-image: radial-gradient(ellipse at center, #ffffff 60%, #dfdfdf 100%);
   background-color: #ebebeb; }
 
-.fp-viewbar a.checked,
-.fp-viewbar a:active {
+.fp-viddewbar a.checked,
+.fp-vieddwbar a:active {
   background-image: radial-gradient(ellipse at center, #ffffff 40%, #dfdfdf 100%);
   background-color: #dfdfdf; }
 
-.fp-viewbar a.fp-vb-icons {
+.fp-viewddbar a.fp-vb-icons {
   border-radius: 4px 0 0 4px; }
 
-.fp-viewbar a.fp-vb-tree {
+.fp-vieddwbar a.fp-vb-tree {
   border-right: 0;
   border-radius: 0 4px 4px 0; }
 
-.fp-viewbar a img {
+.fp-vieddwbar a img {
   margin: 7px; }
 
-.fp-viewbar.disabled a {
+.fp-viewddbar.disabled a {
   opacity: .45;
   background: none;
   cursor: default; }
@@ -11678,9 +11588,6 @@ span.editinstructions {
 .file-picker .fp-clear-left {
   clear: left; }
 
-.file-picker .fp-pathbar {
-  display: table-row; }
-
 .fp-pathbar.empty {
   display: none; }
 
@@ -11703,8 +11610,7 @@ span.editinstructions {
   margin-left: 32px; }
 
 .fp-pathbar .fp-path-folder-name {
-  margin-left: 32px;
-  line-height: 20px; }
+  margin-left: 32px; }
 
 .fp-iconview .fp-file {
   float: left;
@@ -11749,20 +11655,6 @@ span.editinstructions {
   border: 0 solid #BBBBBB;
   width: 100%; }
 
-#filesskin .file-picker .yui3-datatable-header {
-  background: #FFFFFF;
-  border-bottom: 1px solid #CCCCCC;
-  border-left: 0 solid #FFFFFF;
-  color: #555555; }
-
-#filesskin .file-picker .yui3-datatable-odd .yui3-datatable-cell {
-  background-color: #F6F6F6;
-  border-left: 0 solid #F6F6F6; }
-
-#filesskin .file-picker .yui3-datatable-even .yui3-datatable-cell {
-  background-color: #FFFFFF;
-  border-left: 0 solid #FFFFFF; }
-
 .file-picker .ygtvtn,
 .filemanager .ygtvtn {
   background: url("[[pix:moodle|y/tn]]") 0 0 no-repeat;
@@ -11924,24 +11816,6 @@ a.ygtvspacer:hover {
   width: 100%;
   display: table; }
 
-.file-picker .fp-login-form table {
-  margin: 0 auto; }
-
-.file-picker .fp-login-form p {
-  text-align: center;
-  margin-top: 3em; }
-
-.file-picker .fp-login-form .fp-login-input label, .file-picker .fp-login-form .fp-login-input .que .correctness, .que .file-picker .fp-login-form .fp-login-input .correctness {
-  text-align: right;
-  display: block; }
-
-.file-picker .fp-login-form .fp-login-input .input {
-  text-align: left; }
-
-.file-picker .fp-login-form input[type="checkbox"] {
-  width: 15px;
-  height: 15px; }
-
 .file-picker .fp-upload-form {
   height: 100%;
   width: 100%;
@@ -11953,42 +11827,18 @@ a.ygtvspacer:hover {
 .file-picker.fp-dlg {
   text-align: center; }
 
-.file-picker.fp-dlg .fp-dlg-text {
-  padding: 30px 20px 10px;
-  font-size: 12px; }
-
 .file-picker.fp-dlg .fp-dlg-buttons {
   margin: 0 20px; }
 
 .file-picker.fp-msg {
   text-align: center; }
 
-.file-picker.fp-msg .fp-msg-text {
-  padding: 40px 20px 10px 20px;
-  min-width: 200px;
-  max-width: 500px;
-  max-height: 300px;
-  overflow: auto;
-  font-size: 12px; }
-
-.file-picker.fp-msg.fp-msg-error .fp-msg-text {
-  padding: 40px 20px 10px 20px;
-  font-size: 12px; }
-
 .file-picker .fp-content-error {
   height: 100%;
   width: 100%;
   display: table;
   text-align: center; }
 
-.file-picker .fp-content-error .fp-error {
-  height: 100%;
-  width: 100%;
-  display: table-cell;
-  vertical-align: middle;
-  padding: 40px 20px 10px 20px;
-  font-size: 12px; }
-
 .file-picker .fp-nextpage {
   clear: both; }
 
@@ -12121,77 +11971,16 @@ a.ygtvspacer:hover {
 .filemanager .fp-restrictions {
   text-align: right; }
 
-.filemanager .fp-navbar {
-  background: #F2F2F2;
-  border: 1px solid #BBBBBB;
-  border-bottom: none; }
-
 .filemanager-toolbar {
   padding: 4px;
   overflow: hidden; }
 
-.fp-pathbar {
-  border-top: 1px solid #BBBBBB;
-  padding: 5px 8px 1px;
-  min-height: 20px; }
-
-.file-picker .fp-toolbar {
-  padding: 4px; }
-
-.fp-toolbar .fp-btn-add,
-.fp-toolbar .fp-btn-download,
-.fp-toolbar .fp-btn-mkdir,
-.fp-toolbar .fp-tb-help,
-.fp-toolbar .fp-tb-manage,
-.fp-toolbar .fp-tb-logout,
-.fp-toolbar .fp-tb-refresh {
-  border: 1px solid #CCC;
-  border-bottom: 1px solid #B3B3B3;
-  border-radius: 4px;
-  background: white;
-  width: 30px;
-  height: 30px; }
-
-.fp-toolbar a:hover {
-  background-image: radial-gradient(ellipse at center, #ffffff 60%, #dfdfdf 100%);
-  background-color: #ebebeb; }
-
-.fp-toolbar a:active {
-  background-image: radial-gradient(ellipse at center, #ffffff 40%, #dfdfdf 100%);
-  background-color: #dfdfdf; }
-
-.fp-btn-add a,
-.fp-btn-download a,
-.fp-btn-mkdir a,
-.fp-tb-help a,
-.fp-tb-manage a,
-.fp-tb-logout a,
-.fp-tb-refresh a {
-  display: block;
-  width: 30px;
-  height: 30px;
-  border-radius: 4px; }
-
-.fp-btn-add img,
-.fp-btn-download img,
-.fp-btn-mkdir img,
-.fp-tb-help img,
-.fp-tb-manage img,
-.fp-tb-logout img,
-.fp-tb-refresh img {
-  margin: 7px; }
-
 .filemanager .fp-pathbar.empty {
   display: none; }
 
 .filepicker-filelist,
 .filemanager-container {
-  background: #FFFFFF;
-  clear: both;
-  overflow: auto;
-  border: 1px solid #BBBBBB;
-  min-height: 140px;
-  position: relative; }
+  min-height: 140px; }
 
 .filemanager .fp-content {
   overflow: auto;
@@ -12202,6 +11991,9 @@ a.ygtvspacer:hover {
 .filepicker-filelist {
   overflow: hidden; }
 
+.file-picker .yui3-datatable-header {
+  background: initial; }
+
 .fitem.disabled .filepicker-filelist,
 .fitem.disabled .filemanager-container {
   background-color: #EBEBE4; }
@@ -12427,9 +12219,6 @@ a.ygtvspacer:hover {
 .filemanager.fp-select .fp-reflist .fp-reflistloading {
   display: none; }
 
-.filemanager.fp-select .fp-refcount {
-  max-width: 265px; }
-
 .filemanager.fp-select .fp-reflist.fp-loading .fp-reflistloading {
   display: inline; }
 
@@ -12438,7 +12227,6 @@ a.ygtvspacer:hover {
   border: 1px solid #BBBBBB;
   padding: 8px 7px;
   margin: 0;
-  max-width: 265px;
   max-height: 75px;
   overflow: auto; }
 
@@ -12455,162 +12243,16 @@ a.ygtvspacer:hover {
 .filemanager.fp-dlg {
   text-align: center; }
 
-.filemanager.fp-dlg .fp-dlg-text {
-  padding: 0 10px;
-  min-width: 200px;
-  max-width: 340px;
-  max-height: 300px;
-  overflow: auto;
-  line-height: 22px;
-  margin: 40px 20px 20px;
-  font-size: 12px; }
-
 .file-picker div.bd {
   text-align: left; }
 
 .fp-formset {
-  max-width: 500px;
   padding: 10px; }
   .fp-formset input[type="file"] {
     line-height: inherit; }
 
 .fp-forminset {
-  max-width: 400px;
   padding: 0 10px; }
-  .fp-forminset .control-group.control-radio, .fp-forminset .form-item .control-radio.form-horizontal, .form-item .fp-forminset .control-radio.form-horizontal, .fp-forminset
-  .mform .fitem .control-radio.form-horizontal,
-  .mform .fitem .fp-forminset .control-radio.form-horizontal {
-    margin-bottom: 0; }
-  .fp-forminset .control-group label.control-label, .fp-forminset .form-item .form-horizontal label.control-label, .form-item .fp-forminset .form-horizontal label.control-label, .fp-forminset
-  .mform .fitem .form-horizontal label.control-label,
-  .mform .fitem .fp-forminset .form-horizontal label.control-label, .fp-forminset .control-group .que .control-label.correctness, .que .fp-forminset .control-group .control-label.correctness, .fp-forminset .form-item .form-horizontal .que .control-label.correctness, .que .fp-forminset .form-item .form-horizontal .control-label.correctness, .form-item .fp-forminset .form-horizontal .que .control-label.correctness, .que .form-item .fp-forminset .form-horizontal .control-label.correctness, .fp-forminset
-  .mform .fitem .form-horizontal .que .control-label.correctness, .que .fp-forminset
-  .mform .fitem .form-horizontal .control-label.correctness,
-  .mform .fitem .fp-forminset .form-horizontal .que .control-label.correctness, .que
-  .mform .fitem .fp-forminset .form-horizontal .control-label.correctness, .fp-forminset .control-group .que .form-item .correctness.form-label, .que .form-item .fp-forminset .control-group .correctness.form-label, .fp-forminset .que .form-item .form-horizontal .correctness.form-label, .que .fp-forminset .form-item .form-horizontal .correctness.form-label, .que .form-item .fp-forminset .form-horizontal .correctness.form-label, .fp-forminset
-  .mform .fitem .form-horizontal .que .form-item .correctness.form-label,
-  .mform .fitem .fp-forminset .form-horizontal .que .form-item .correctness.form-label, .fp-forminset .control-group .form-item .que .correctness.form-label, .form-item .que .fp-forminset .control-group .correctness.form-label, .fp-forminset .form-item .form-horizontal .que .correctness.form-label, .fp-forminset .form-item .que .form-horizontal .correctness.form-label, .form-item .fp-forminset .form-horizontal .que .correctness.form-label, .form-item .que .fp-forminset .form-horizontal .correctness.form-label, .fp-forminset
-  .mform .fitem .form-horizontal .form-item .que .correctness.form-label,
-  .mform .fitem .fp-forminset .form-horizontal .form-item .que .correctness.form-label, .fp-forminset .control-group .que
-  .mform .fitem div.fitemtitle .correctness.form-horizontal, .que
-  .mform .fitem div.fitemtitle .fp-forminset .control-group .correctness.form-horizontal, .fp-forminset .form-item .form-horizontal .que
-  .mform .fitem div.fitemtitle .correctness.form-horizontal, .form-item .fp-forminset .form-horizontal .que
-  .mform .fitem div.fitemtitle .correctness.form-horizontal, .fp-forminset .que .mform .fitem .form-horizontal div.fitemtitle .correctness.form-horizontal, .que .fp-forminset .mform .fitem .form-horizontal div.fitemtitle .correctness.form-horizontal, .fp-forminset .que .mform .fitem div.fitemtitle .form-horizontal .correctness.form-horizontal, .que .fp-forminset .mform .fitem div.fitemtitle .form-horizontal .correctness.form-horizontal, .que .mform .fitem .fp-forminset .form-horizontal div.fitemtitle .correctness.form-horizontal, .que .mform .fitem div.fitemtitle .fp-forminset .form-horizontal .correctness.form-horizontal, .fp-forminset .control-group
-  .mform .fitem div.fitemtitle .que .correctness.form-horizontal,
-  .mform .fitem div.fitemtitle .que .fp-forminset .control-group .correctness.form-horizontal, .fp-forminset .form-item .form-horizontal
-  .mform .fitem div.fitemtitle .que .correctness.form-horizontal, .form-item .fp-forminset .form-horizontal
-  .mform .fitem div.fitemtitle .que .correctness.form-horizontal, .fp-forminset .mform .fitem .form-horizontal div.fitemtitle .que .correctness.form-horizontal, .fp-forminset .mform .fitem div.fitemtitle .que .form-horizontal .correctness.form-horizontal, .mform .fitem .fp-forminset .form-horizontal div.fitemtitle .que .correctness.form-horizontal, .mform .fitem div.fitemtitle .que .fp-forminset .form-horizontal .correctness.form-horizontal, .fp-forminset .control-group .form-item label.form-label, .form-item .fp-forminset .control-group label.form-label, .fp-forminset .form-item .form-horizontal label.form-label, .form-item .fp-forminset .form-horizontal label.form-label, .fp-forminset
-  .mform .fitem .form-horizontal .form-item label.form-label,
-  .mform .fitem .fp-forminset .form-horizontal .form-item label.form-label, .fp-forminset .control-group
-  .mform .fitem div.fitemtitle label.form-horizontal,
-  .mform .fitem div.fitemtitle .fp-forminset .control-group label.form-horizontal, .fp-forminset .form-item .form-horizontal
-  .mform .fitem div.fitemtitle label.form-horizontal, .form-item .fp-forminset .form-horizontal
-  .mform .fitem div.fitemtitle label.form-horizontal, .fp-forminset .mform .fitem .form-horizontal div.fitemtitle label.form-horizontal, .fp-forminset .mform .fitem div.fitemtitle .form-horizontal label.form-horizontal, .mform .fitem .fp-forminset .form-horizontal div.fitemtitle label.form-horizontal, .mform .fitem div.fitemtitle .fp-forminset .form-horizontal label.form-horizontal {
-    width: 105px; }
-  .fp-forminset .control-group label.control-radio, .fp-forminset .form-item .form-horizontal label.control-radio, .form-item .fp-forminset .form-horizontal label.control-radio, .fp-forminset
-  .mform .fitem .form-horizontal label.control-radio,
-  .mform .fitem .fp-forminset .form-horizontal label.control-radio, .fp-forminset .control-group .que .control-radio.correctness, .que .fp-forminset .control-group .control-radio.correctness, .fp-forminset .form-item .form-horizontal .que .control-radio.correctness, .que .fp-forminset .form-item .form-horizontal .control-radio.correctness, .form-item .fp-forminset .form-horizontal .que .control-radio.correctness, .que .form-item .fp-forminset .form-horizontal .control-radio.correctness, .fp-forminset
-  .mform .fitem .form-horizontal .que .control-radio.correctness, .que .fp-forminset
-  .mform .fitem .form-horizontal .control-radio.correctness,
-  .mform .fitem .fp-forminset .form-horizontal .que .control-radio.correctness, .que
-  .mform .fitem .fp-forminset .form-horizontal .control-radio.correctness {
-    float: right;
-    text-align: left;
-    width: 215px; }
-  .fp-forminset .control-group .controls, .fp-forminset .form-item .form-horizontal .controls, .form-item .fp-forminset .form-horizontal .controls, .fp-forminset
-  .mform .fitem .form-horizontal .controls,
-  .mform .fitem .fp-forminset .form-horizontal .controls, .fp-forminset .control-group .form-item .form-setting, .form-item .fp-forminset .control-group .form-setting, .fp-forminset .form-item .form-horizontal .form-setting, .form-item .fp-forminset .form-horizontal .form-setting, .fp-forminset
-  .mform .fitem .form-horizontal .form-item .form-setting,
-  .mform .fitem .fp-forminset .form-horizontal .form-item .form-setting, .fp-forminset .control-group
-  .form-item .form-description,
-  .form-item .fp-forminset .control-group .form-description, .fp-forminset .form-item .form-horizontal .form-description, .form-item .fp-forminset .form-horizontal .form-description, .fp-forminset
-  .mform .fitem .form-horizontal
-  .form-item .form-description,
-  .mform .fitem .fp-forminset .form-horizontal
-  .form-item .form-description, .fp-forminset .control-group
-  .mform .fitem .felement,
-  .mform .fitem .fp-forminset .control-group .felement, .fp-forminset .form-item .form-horizontal
-  .mform .fitem .felement, .form-item .fp-forminset .form-horizontal
-  .mform .fitem .felement, .fp-forminset .mform .fitem .form-horizontal .felement, .mform .fitem .fp-forminset .form-horizontal .felement, .fp-forminset .control-group
-  #page-mod-forum-search .c1 .form-horizontal,
-  #page-mod-forum-search .c1 .fp-forminset .control-group .form-horizontal, .fp-forminset .form-item .form-horizontal
-  #page-mod-forum-search .c1 .form-horizontal,
-  #page-mod-forum-search .c1 .fp-forminset .form-item .form-horizontal .form-horizontal, .form-item .fp-forminset .form-horizontal
-  #page-mod-forum-search .c1 .form-horizontal,
-  #page-mod-forum-search .c1 .form-item .fp-forminset .form-horizontal .form-horizontal, .fp-forminset
-  .mform .fitem .form-horizontal
-  #page-mod-forum-search .c1 .form-horizontal,
-  #page-mod-forum-search .c1 .fp-forminset
-  .mform .fitem .form-horizontal .form-horizontal,
-  .mform .fitem .fp-forminset .form-horizontal
-  #page-mod-forum-search .c1 .form-horizontal,
-  #page-mod-forum-search .c1
-  .mform .fitem .fp-forminset .form-horizontal .form-horizontal {
-    margin-left: 125px; }
-    .fp-forminset .control-group .controls select, .fp-forminset .form-item .form-horizontal .controls select, .form-item .fp-forminset .form-horizontal .controls select, .fp-forminset
-    .mform .fitem .form-horizontal .controls select,
-    .mform .fitem .fp-forminset .form-horizontal .controls select, .fp-forminset .control-group .form-item .form-setting select, .form-item .fp-forminset .control-group .form-setting select, .fp-forminset .form-item .form-horizontal .form-setting select, .form-item .fp-forminset .form-horizontal .form-setting select, .fp-forminset
-    .mform .fitem .form-horizontal .form-item .form-setting select,
-    .mform .fitem .fp-forminset .form-horizontal .form-item .form-setting select, .fp-forminset .control-group
-    .form-item .form-description select,
-    .form-item .fp-forminset .control-group .form-description select, .fp-forminset .form-item .form-horizontal .form-description select, .form-item .fp-forminset .form-horizontal .form-description select, .fp-forminset
-    .mform .fitem .form-horizontal
-    .form-item .form-description select,
-    .mform .fitem .fp-forminset .form-horizontal
-    .form-item .form-description select, .fp-forminset .control-group
-    .mform .fitem .felement select,
-    .mform .fitem .fp-forminset .control-group .felement select, .fp-forminset .form-item .form-horizontal
-    .mform .fitem .felement select, .form-item .fp-forminset .form-horizontal
-    .mform .fitem .felement select, .fp-forminset .mform .fitem .form-horizontal .felement select, .mform .fitem .fp-forminset .form-horizontal .felement select, .fp-forminset .control-group
-    #page-mod-forum-search .c1 .form-horizontal select,
-    #page-mod-forum-search .c1 .fp-forminset .control-group .form-horizontal select, .fp-forminset .form-item .form-horizontal
-    #page-mod-forum-search .c1 .form-horizontal select,
-    #page-mod-forum-search .c1 .fp-forminset .form-item .form-horizontal .form-horizontal select, .form-item .fp-forminset .form-horizontal
-    #page-mod-forum-search .c1 .form-horizontal select,
-    #page-mod-forum-search .c1 .form-item .fp-forminset .form-horizontal .form-horizontal select, .fp-forminset
-    .mform .fitem .form-horizontal
-    #page-mod-forum-search .c1 .form-horizontal select,
-    #page-mod-forum-search .c1 .fp-forminset
-    .mform .fitem .form-horizontal .form-horizontal select,
-    .mform .fitem .fp-forminset .form-horizontal
-    #page-mod-forum-search .c1 .form-horizontal select,
-    #page-mod-forum-search .c1
-    .mform .fitem .fp-forminset .form-horizontal .form-horizontal select {
-      width: 100%; }
-  .fp-forminset .control-group .controls.control-radio input, .fp-forminset .form-item .form-horizontal .controls.control-radio input, .form-item .fp-forminset .form-horizontal .controls.control-radio input, .fp-forminset
-  .mform .fitem .form-horizontal .controls.control-radio input,
-  .mform .fitem .fp-forminset .form-horizontal .controls.control-radio input, .fp-forminset .control-group .form-item .control-radio.form-setting input, .form-item .fp-forminset .control-group .control-radio.form-setting input, .fp-forminset .form-item .form-horizontal .control-radio.form-setting input, .form-item .fp-forminset .form-horizontal .control-radio.form-setting input, .fp-forminset
-  .mform .fitem .form-horizontal .form-item .control-radio.form-setting input,
-  .mform .fitem .fp-forminset .form-horizontal .form-item .control-radio.form-setting input, .fp-forminset .control-group
-  .form-item .control-radio.form-description input,
-  .form-item .fp-forminset .control-group .control-radio.form-description input, .fp-forminset .form-item .form-horizontal .control-radio.form-description input, .form-item .fp-forminset .form-horizontal .control-radio.form-description input, .fp-forminset
-  .mform .fitem .form-horizontal
-  .form-item .control-radio.form-description input,
-  .mform .fitem .fp-forminset .form-horizontal
-  .form-item .control-radio.form-description input, .fp-forminset .control-group
-  .mform .fitem .control-radio.felement input,
-  .mform .fitem .fp-forminset .control-group .control-radio.felement input, .fp-forminset .form-item .form-horizontal
-  .mform .fitem .control-radio.felement input, .form-item .fp-forminset .form-horizontal
-  .mform .fitem .control-radio.felement input, .fp-forminset .mform .fitem .form-horizontal .control-radio.felement input, .mform .fitem .fp-forminset .form-horizontal .control-radio.felement input, .fp-forminset .control-group
-  #page-mod-forum-search .c1 .control-radio.form-horizontal input,
-  #page-mod-forum-search .c1 .fp-forminset .control-group .control-radio.form-horizontal input, .fp-forminset .form-item .form-horizontal
-  #page-mod-forum-search .c1 .control-radio.form-horizontal input,
-  #page-mod-forum-search .c1 .fp-forminset .form-item .form-horizontal .control-radio.form-horizontal input, .form-item .fp-forminset .form-horizontal
-  #page-mod-forum-search .c1 .control-radio.form-horizontal input,
-  #page-mod-forum-search .c1 .form-item .fp-forminset .form-horizontal .control-radio.form-horizontal input, .fp-forminset
-  .mform .fitem .form-horizontal
-  #page-mod-forum-search .c1 .control-radio.form-horizontal input,
-  #page-mod-forum-search .c1 .fp-forminset
-  .mform .fitem .form-horizontal .control-radio.form-horizontal input,
-  .mform .fitem .fp-forminset .form-horizontal
-  #page-mod-forum-search .c1 .control-radio.form-horizontal input,
-  #page-mod-forum-search .c1
-  .mform .fitem .fp-forminset .form-horizontal .control-radio.form-horizontal input {
-    margin-top: 3px; }
-  .fp-forminset .fp-select-buttons {
-    float: none; }
-  .fp-forminset input[type="text"] {
-    width: 228px; }
 
 .fp-fileinfo .fp-value {
   display: inline-block;
diff --git a/theme/noname/templates/core/filemanager_confirmdialog.mustache b/theme/noname/templates/core/filemanager_confirmdialog.mustache
new file mode 100644
index 00000000000..740806ed703
--- /dev/null
+++ b/theme/noname/templates/core/filemanager_confirmdialog.mustache
@@ -0,0 +1,5 @@
+<div class="filemanager fp-dlg">
+    <p class="fp-dlg-text"></p>
+    <button class="fp-dlg-butconfirm btn-primary btn">{{#str}}ok{{/str}}</button>
+    <button class="fp-dlg-butcancel btn-secondary btn">{{#str}}cancel{{/str}}</button>
+</div>
\ No newline at end of file
diff --git a/theme/noname/templates/core/filemanager_default_searchform.mustache b/theme/noname/templates/core/filemanager_default_searchform.mustache
new file mode 100644
index 00000000000..21e5223dd05
--- /dev/null
+++ b/theme/noname/templates/core/filemanager_default_searchform.mustache
@@ -0,0 +1,4 @@
+<div class="fp-def-search form-group">
+    <label class="sr-only">{{#str}}searchrepo, repository{{/str}}</label>
+    <input type="search" class="form-control" id="reposearch" name="s" placeholder="{{#str}}search, repository{{/str}}"/>
+</div>
\ No newline at end of file
diff --git a/theme/noname/templates/core/filemanager_fileselect.mustache b/theme/noname/templates/core/filemanager_fileselect.mustache
new file mode 100644
index 00000000000..75402a839d4
--- /dev/null
+++ b/theme/noname/templates/core/filemanager_fileselect.mustache
@@ -0,0 +1,65 @@
+<div class="filemanager fp-select">
+    <div class="fp-select-loading">
+        {{#pix}}i/loading_small{{/pix}}
+    </div>
+    <form class="form">
+        <div class="form-group">
+            <button class="fp-file-download btn btn-secondary">{{#str}}download{{/str}}</button>
+            <button class="fp-file-delete btn-secondary">{{#str}}delete{{/str}}</button>
+            <button class="fp-file-setmain btn-secondary">{{#str}}setmainfile, repository{{/str}}</button>
+            <span class="fp-file-setmain-help btn-secondary">{{helpicon}}</span>
+            <button class="fp-file-zip btn-secondary">{{#str}}zip, editor{{/str}}</button>
+            <button class="fp-file-unzip btn-secondary">{{#str}}unzip{{/str}}</button>
+        </div>
+
+                <div class="fp-saveas form-group row">
+                    <label class="form-control-label col-xs-4">{{#str}}name, repository{{/str}}</label>
+                    <div class="col-xs-8"><input class="form-control" type="text"/></div>
+                </div>
+                <div class="fp-author form-group row">
+                    <label class="form-control-label col-xs-4">{{#str}}author, repository{{/str}}</label>
+                    <div class="col-xs-8"><input class="form-control" type="text"/></div>
+
+                </div>
+                <div class="fp-license form-group row">
+                    <label class="form-control-label col-xs-4">{{#str}}chooselicense, repository{{/str}}</label>
+                    <div class="col-xs-8">
+                        <select class="form-control"></select>
+                    </div>
+                </div>
+                <div class="fp-path form-group row">
+                    <label class="form-control-label col-xs-4">{{#str}}path, repository{{/str}}</label>
+                    <div class="col-xs-8">
+                        <select class="form-control"></select>
+                    </div>
+                </div>
+                <div class="fp-original form-group row">
+                    <label class="form-control-label col-xs-4">{{#str}}original, repository{{/str}}</label>
+                    <div class="col-xs-8">
+                        <span class="fp-originloading">{{#pix}}i/loading_small{{/pix}} {{#str}}loading, repository{{/str}}</span><span class="fp-value"></span>
+                    </div>
+                </div>
+                <div class="fp-reflist form-group row">
+                    <label class="form-control-label col-xs-4">{{#str}}referenceslist, repository{{/str}}</label>
+                    <div class="col-xs-8">
+                        <p class="fp-refcount"></p>
+                        <span class="fp-reflistloading">{{#pix}}i/loading_small{{/pix}} {{#str}}loading, repository{{/str}}</span>
+                        <ul class="fp-value"></ul>
+                    </div>
+                </div>
+        <div class="fp-select-buttons form-group">
+            <button class="fp-file-update btn-primary btn">{{#str}}update{{/str}}</button>
+            <button class="fp-file-cancel btn-secondary btn">{{#str}}cancel{{/str}}</button>
+        </div>
+    </form>
+    <div class="fp-info clearfix">
+        <hr>
+        <p class="fp-thumbnail"></p>
+        <div class="fp-fileinfo">
+            <div class="fp-datemodified">{{#str}}lastmodified, repository{{/str}} <span class="fp-value"></span></div>
+            <div class="fp-datecreated">{{#str}}datecreated, repository{{/str}} <span class="fp-value"></span></div>
+            <div class="fp-size">{{#str}}size, repository{{/str}} <span class="fp-value"></span></div>
+            <div class="fp-dimensions">{{#str}}dimensions, repository{{/str}} <span class="fp-value"></span></div>
+        </div>
+    </div>
+</div>
diff --git a/theme/noname/templates/core/filemanager_loginform.mustache b/theme/noname/templates/core/filemanager_loginform.mustache
new file mode 100644
index 00000000000..5de0b3fc60e
--- /dev/null
+++ b/theme/noname/templates/core/filemanager_loginform.mustache
@@ -0,0 +1,30 @@
+<div class="fp-login-form">
+    <div class="fp-content-center">
+        <form class="form">
+            <div class="fp-formset">
+                <div class="fp-login-popup form-group">
+                    <div class="fp-popup">
+                        <button class="fp-login-popup-but btn-primary btn">{{#str}}login, repository{{/str}}</button>
+                    </div>
+                </div>
+                <div class="fp-login-textarea form-group">
+                    <textarea class="form-control"></textarea>
+                </div>
+                <div class="fp-login-select form-group">
+                    <label class="form-control-label"></label>
+                    <select class="form-control"></select>
+                </div>
+                {{{autofillhack}}}
+                <div class="fp-login-input form-group">
+                    <label class="form-control-label"></label>
+                    <input class="form-control"/>
+                </div>
+                <div class="fp-login-radiogroup form-group">
+                    <label class="form-control-label"></label>
+                    <div class="fp-login-radio"><input class="form-control" /> <label></label></div>
+                </div>
+            </div>
+            <p class="mdl-align"><button class="fp-login-submit btn-primary btn">{{#str}}submit, repository{{/str}}</button></p>
+        </form>
+    </div>
+</div>
\ No newline at end of file
diff --git a/theme/noname/templates/core/filemanager_modal_generallayout.mustache b/theme/noname/templates/core/filemanager_modal_generallayout.mustache
new file mode 100644
index 00000000000..6e40449d86e
--- /dev/null
+++ b/theme/noname/templates/core/filemanager_modal_generallayout.mustache
@@ -0,0 +1,61 @@
+<div tabindex="0" class="file-picker fp-generallayout container row" role="dialog" aria-live="assertive">
+    <div class="fp-repo-area col-md-3 nav nav-pills nav-stacked">
+            <div class="fp-repo nav-item">
+                <a href="#" class="nav-link"><img class="fp-repo-icon" alt=" " width="16" height="16" />&nbsp;<span class="fp-repo-name"></span></a>
+            </div>
+
+    </div>
+    <div class="col-md-9">
+        <div class="fp-repo-items" tabindex="0">
+            <div class="fp-navbar bg-faded p-x-1 card">
+                <div>
+                    <div class="fp-toolbar">
+                        <div class="fp-tb-back">
+                            <a href="#" class="btn btn-secondary">{{#str}}back, repository{{/str}}</a>
+                        </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="#">
+                                {{#pix}}a/refresh{{/pix}}
+                            </a>
+                        </div>
+                        <div class="fp-tb-logout">
+                            <a title="{{#str}}logout, repository{{/str}}" class="btn btn-secondary" href="#">
+                                {{#pix}}a/logout{{/pix}}
+                            </a>
+                        </div>
+                        <div class="fp-tb-manage">
+                            <a title="{{#str}}settings, repository{{/str}}" class="btn btn-secondary" href="#">
+                                {{#pix}}a/setting{{/pix}}
+                            </a>
+                        </div>
+                        <div class="fp-tb-help">
+                            <a title="{{#str}}help, repository{{/str}}" class="btn btn-secondary" href="#">
+                                {{#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="#">
+                            {{#pix}}fp/view_icon_active, theme{{/pix}}
+                        </a>
+                        <a role="button" title="{{#str}}displaydetails, repository{{/str}}" class="fp-vb-details btn btn-secondary" href="#">
+                            {{#pix}}fp/view_list_active, theme{{/pix}}
+                        </a>
+                        <a role="button" title="{{#str}}displaytree, repository{{/str}}" class="fp-vb-tree btn btn-secondary" href="#">
+                            {{#pix}}fp/view_tree_active, theme{{/pix}}
+                        </a>
+                    </div>
+                    <div class="fp-clear-left"></div>
+                </div>
+                <div class="fp-pathbar">
+                    <span class="fp-path-folder"><a class="fp-path-folder-name" href="#"></a></span>
+                </div>
+            </div>
+            <div class="fp-content card"></div>
+        </div>
+    </div>
+</div>
\ No newline at end of file
diff --git a/theme/noname/templates/core/filemanager_page_generallayout.mustache b/theme/noname/templates/core/filemanager_page_generallayout.mustache
new file mode 100644
index 00000000000..2d1ce01e876
--- /dev/null
+++ b/theme/noname/templates/core/filemanager_page_generallayout.mustache
@@ -0,0 +1,58 @@
+<div id="filemanager-{{{client_id}}}" class="filemanager fm-loading">
+    <div class="fp-restrictions">
+        {{{restrictions}}}
+        <span class="dnduploadnotsupported-message"> - {{#str}}dndnotsupported_insentence{{/str}}{{helpicon}}</span>
+    </div>
+    <div class="fp-navbar bg-faded p-x-1 card">
+        <div class="filemanager-toolbar">
+            <div class="fp-toolbar">
+                <div class="fp-btn-add">
+                    <a role="button" title="{{#str}}addfile, repository{{/str}}" class="btn btn-secondary" href="#">
+                        {{#pix}}a/add_file{{/pix}}
+                    </a>
+                </div>
+                <div class="fp-btn-mkdir">
+                    <a role="button" title="{{#str}}makeafolder{{/str}}" class="btn btn-secondary" href="#">
+                        {{#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="#">
+                        {{#pix}}a/download_all{{/pix}}
+                    </a>
+                </div>
+                <span class="fp-img-downloading">
+                    <span class="sr-only">{{#str}}loadinghelp{{/str}}</span>
+                    {{#pix}}i/loading_small{{/pix}}
+                </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="#">
+                    {{#pix}}fp/view_icon_active, theme{{/pix}}
+                </a>
+                <a title="{{#str}}displaydetails, repository{{/str}}" class="fp-vb-details btn btn-secondary" href="#">
+                    {{#pix}}fp/view_list_active, theme{{/pix}}
+                </a>
+                <a title="{{#str}}displaytree, repository{{/str}}" class="fp-vb-tree btn btn-secondary" href="#">
+                    {{#pix}}fp/view_tree_active, theme{{/pix}}
+                </a>
+            </div>
+        </div>
+        <div class="fp-pathbar">
+            <span class="fp-path-folder"><a class="fp-path-folder-name" href="#"></a></span>
+        </div>
+    </div>
+    <div class="filemanager-loading mdl-align">{{#pix}}i/loading_small{{/pix}}<span class="sr-only">{{#str}}loadinghelp{{/str}}</span></div>
+    <div class="filemanager-container card" >
+        <div class="fm-content-wrapper">
+            <div class="fp-content"></div>
+            <div class="fm-empty-container">
+                <div class="dndupload-message">{{#str}}dndenabled_inbox{{/str}}<br/><div class="dndupload-arrow"></div></div>
+            </div>
+            <div class="dndupload-target">{{#str}}droptoupload{{/str}}<br/><div class="dndupload-arrow"></div></div>
+            <div class="dndupload-progressbars"></div>
+            <div class="dndupload-uploadinprogress">{{#pix}}i/loading_small{{/pix}}<span class="sr-only">{{#str}}loadinghelp{{/str}}</span></div>
+        </div>
+        <div class="filemanager-updating">{{#pix}}i/loading_small{{/pix}}<span class="sr-only">{{#str}}loadinghelp{{/str}}</span></div>
+    </div>
+</div>
\ No newline at end of file
diff --git a/theme/noname/templates/core/filemanager_processexistingfile.mustache b/theme/noname/templates/core/filemanager_processexistingfile.mustache
new file mode 100644
index 00000000000..18714ac05a4
--- /dev/null
+++ b/theme/noname/templates/core/filemanager_processexistingfile.mustache
@@ -0,0 +1,8 @@
+<div class="file-picker fp-dlg">
+    <p class="fp-dlg-text"></p>
+    <div class="fp-dlg-buttons">
+        <button class="fp-dlg-butoverwrite btn btn-primary">{{#str}}overwrite, repository{{/str}}</button>
+        <button class="fp-dlg-butrename btn btn-primary"></button>
+        <button class="fp-dlg-butcancel btn btn-secondary">{{#str}}cancel{{/str}}</button>
+    </div>
+</div>
\ No newline at end of file
diff --git a/theme/noname/templates/core/filemanager_processexistingfilemultiple.mustache b/theme/noname/templates/core/filemanager_processexistingfilemultiple.mustache
new file mode 100644
index 00000000000..aae3125936f
--- /dev/null
+++ b/theme/noname/templates/core/filemanager_processexistingfilemultiple.mustache
@@ -0,0 +1,9 @@
+<div class="file-picker fp-dlg">
+    <p class="fp-dlg-text"></p>
+    <a class="fp-dlg-butoverwrite btn btn-primary" href="#">{{#str}}overwrite, repository{{/str}}</a>
+    <a class="fp-dlg-butrename btn btn-primary" href="#"></a>
+    <a class="fp-dlg-butcancel btn btn-secondary" href="#">{{#str}}cancel{{/str}}</a>
+    <br/>
+    <a class="fp-dlg-butoverwriteall btn btn-primary" href="#">{{#str}}overwriteall, repository{{/str}}</a>
+    <a class="fp-dlg-butrenameall btn btn-primary" href="#">{{#str}}renameall, repository{{/str}}</a>
+</div>
\ No newline at end of file
diff --git a/theme/noname/templates/core/filemanager_selectlayout.mustache b/theme/noname/templates/core/filemanager_selectlayout.mustache
new file mode 100644
index 00000000000..60c95810c2d
--- /dev/null
+++ b/theme/noname/templates/core/filemanager_selectlayout.mustache
@@ -0,0 +1,50 @@
+<div class="file-picker fp-select">
+    <div class="fp-select-loading">
+        <span class="sr-only">{{#str}}loadinghelp{{/str}}</span>
+        {{#pix}}i/loading_small{{/pix}}
+    </div>
+    <form class="form">
+        <div class="fp-forminset">
+                <div class="fp-linktype-2 form-group">
+                    <label class="form-control-label control-radio">{{#str}}makefileinternal, repository{{/str}}</label>
+                    <input class="form-control" type="radio"/>
+                </div>
+                <div class="fp-linktype-1 form-group">
+                    <label class="form-control-label control-radio">{{#str}}makefilelink, repository{{/str}}</label>
+                    <input class="form-control" type="radio"/>
+                </div>
+                <div class="fp-linktype-4 form-group">
+                    <label class="form-control-label control-radio">{{#str}}makefilereference, repository{{/str}}</label>
+                    <input class="form-control" type="radio"/>
+                </div>
+                <div class="fp-saveas form-group">
+                    <label class="form-control-label">{{#str}}saveas, repository{{/str}}</label>
+                    <input class="form-control" type="text"/>
+                </div>
+                <div class="fp-setauthor form-group">
+                    <label class="form-control-label">{{#str}}author, repository{{/str}}</label>
+                    <input class="form-control" type="text"/>
+                </div>
+                <div class="fp-setlicense form-group">
+                    <label class="form-control-label">{{#str}}chooselicense, repository{{/str}}</label>
+                    <select class="form-control"></select>
+                </div>
+        </div>
+       <div class="fp-select-buttons">
+            <button class="fp-select-confirm btn-primary btn">{{#str}}getfile, repository{{/str}}</button>
+            <button class="fp-select-cancel btn-secondary btn">{{#str}}cancel{{/str}}</button>
+        </div>
+    </form>
+    <div class="fp-info clearfix">
+        <hr>
+        <p class="fp-thumbnail"></p>
+        <div class="fp-fileinfo">
+            <div class="fp-datemodified">{{#str}}lastmodified, repository{{/str}}<span class="fp-value"></span></div>
+            <div class="fp-datecreated">{{#str}}datecreated, repository{{/str}}<span class="fp-value"></span></div>
+            <div class="fp-size">{{#str}}size, repository{{/str}}<span class="fp-value"></span></div>
+            <div class="fp-license">{{#str}}license, repository{{/str}}<span class="fp-value"></span></div>
+            <div class="fp-author">{{#str}}author, repository{{/str}}<span class="fp-value"></span></div>
+            <div class="fp-dimensions">{{#str}}dimensions, repository{{/str}}<span class="fp-value"></span></div>
+        </div>
+    </div>
+</div>
\ No newline at end of file
diff --git a/theme/noname/templates/core/filemanager_uploadform.mustache b/theme/noname/templates/core/filemanager_uploadform.mustache
new file mode 100644
index 00000000000..4caf07b08ca
--- /dev/null
+++ b/theme/noname/templates/core/filemanager_uploadform.mustache
@@ -0,0 +1,29 @@
+<div class="fp-upload-form">
+    <div class="fp-content-center">
+        <form enctype="multipart/form-data" method="POST" class="form">
+            <div class="fp-formset">
+                <div class="fp-file form-group">
+                    <label>{{#str}}attachment, repository{{/str}}</label>
+                    <div class="p-x-1">
+                        <input  type="file"/>
+                    </div>
+                </div>
+                <div class="fp-saveas form-group">
+                    <label>{{#str}}saveas, repository{{/str}}</label>
+                    <input type="text" class="form-control"/>
+                </div>
+                <div class="fp-setauthor form-group">
+                    <label>{{#str}}author, repository{{/str}}</label>
+                    <input type="text" class="form-control"/>
+                </div>
+                <div class="fp-setlicense control-group">
+                    <label>{{#str}}chooselicense, repository{{/str}}</label>
+                    <select class="form-control"></select>
+                </div>
+            </div>
+        </form>
+        <div class="mdl-align">
+            <button class="fp-upload-btn btn-primary btn">{{#str}}upload, repository{{/str}}</button>
+        </div>
+    </div>
+</div>
\ No newline at end of file