MDL-38903 File picker: making upload form with more semantic HTML

lang/en/repository.php

@@ -45,8 +45,8 @@
 $string['areauserpersonal'] = 'Private files';
 $string['areauserprofile'] = 'Profile';
 $string['attachedfiles'] = 'Attached files';
-$string['attachment'] = 'Attachment';
-$string['author'] = 'Author';
+$string['attachment'] = 'Attachment:';
+$string['author'] = 'Author:';
 $string['back'] = '« Back';
 $string['backtodraftfiles'] = '« Back to draft files manager';
 $string['cachecleared'] = 'Cached files are removed';
@@ -82,11 +82,11 @@
 $string['createrepository'] = 'Create a repository instance';
 $string['createxxinstance'] = 'Create "{$a}" instance';
 $string['date'] = 'Date';
-$string['datecreated'] = 'Created';
+$string['datecreated'] = 'Created:';
 $string['deleted'] = 'Repository deleted';
 $string['deleterepository'] = 'Delete this repository';
 $string['detailview'] = 'View details';
-$string['dimensions'] = 'Dimensions';
+$string['dimensions'] = 'Dimensions:';
 $string['disabled'] = 'Disabled';
 $string['displaydetails'] = 'Display folder with file details';
 $string['displayicons'] = 'Display folder with file icons';
@@ -129,7 +129,7 @@
 $string['hidden'] = 'Hidden';
 $string['help'] = 'Help';
 $string['choosealink'] = 'Choose a link...';
-$string['chooselicense'] = 'Choose license';
+$string['chooselicense'] = 'Choose license:';
 $string['iconview'] = 'View as icons';
 $string['imagesize'] = '{$a->width} x {$a->height} px';
 $string['instance'] = 'instance';
@@ -145,10 +145,11 @@
 $string['invalidparams'] = 'Invalid parameters';
 $string['isactive'] = 'Active?';
 $string['keyword'] = 'Keyword';
+$string['lastmodified'] = 'Last modified:';
 $string['linkexternal'] = 'Link external';
 $string['listview'] = 'View as list';
 $string['loading'] = 'Loading...';
-$string['login'] = 'Login';
+$string['login'] = 'Login to your account';
 $string['logout'] = 'Logout';
 $string['lostsource'] = 'Error. Source is missing. {$a}';
 $string['makefileinternal'] = 'Make a copy of the file';
@@ -158,6 +159,7 @@
 $string['manageurl'] = 'Manage';
 $string['manageuserrepository'] = 'Manage individual repository';
 $string['moving'] = 'Moving';
+$string['name'] = 'Name:';
 $string['newfolder'] = 'New folder';
 $string['newfoldername'] = 'New folder name:';
 $string['noenter'] = 'Nothing entered';
@@ -177,6 +179,7 @@
 $string['on'] = 'Enabled and visible';
 $string['overwrite'] = 'Overwrite';
 $string['overwriteall'] = 'Overwrite all';
+$string['path'] = 'Path:';
 $string['personalrepositories'] = 'Available repository instances';
 $string['plugin'] = 'Repository plug-ins';
 $string['pluginerror'] = 'Errors in repository plugin.';
@@ -198,7 +201,7 @@
 $string['repositoryicon'] = 'Repository icon';
 $string['repositoryerror'] = 'Remote repository returned error: {$a}';
 $string['save'] = 'Save';
-$string['saveas'] = 'Save as';
+$string['saveas'] = 'Save as:';
 $string['saved'] = 'Saved';
 $string['saving'] = 'Saving';
 $string['automatedbackup'] = 'Automated backups';
@@ -211,7 +214,7 @@
 $string['setmainfile'] = 'Set main file';
 $string['setmainfile_help'] = 'If there are multiple files in the folder, the main file is the one that appears on the view page. Other files such as images or videos may be embedded in it. In filemanager the main file is indicated with a title in bold.';
 $string['siteinstances'] = 'Repositories instances of the site';
-$string['size'] = 'Size';
+$string['size'] = 'Size:';
 $string['submit'] = 'Submit';
 $string['sync'] = 'Sync';
 $string['syncfiletimeout'] = 'Sync file timeout';

repository/flickr_public/lang/en/repository_flickr_public.php

@@ -33,7 +33,7 @@
 $string['by-nd'] = 'Attribution-NoDerivs license';
 $string['by-sa'] = 'Attribution-ShareAlike license';
 $string['callbackurl'] = 'Callback URL';
-$string['commercialuse'] = 'I want to be able to use the images commercially';
+$string['commercialuse'] = 'I want to use the images commercially';
 $string['configplugin'] = 'Flickr public configuration';
 $string['creativecommonscommercial'] = 'Only creative commons commercial';
 $string['emailaddress'] = 'Email address';

repository/flickr_public/lib.php

@@ -397,7 +397,7 @@ public function print_search() {
         $str .= '<input type="hidden" name="repo_id" value="'.$this->id.'" />';
         $str .= '<input type="hidden" name="ctx_id" value="'.$this->context->id.'" />';
         $str .= '<input type="hidden" name="seekey" value="'.sesskey().'" />';
-        $str .= '<label>'.get_string('fulltext', 'repository_flickr_public').': </label><br/><input name="s" value="" /><br/>';
+        $str .= '<label>'.get_string('fulltext', 'repository_flickr_public').'</label><br/><input name="s" value="" /><br/>';
         $str .= '<label>'.get_string('tag', 'repository_flickr_public').'</label><br /><input type="text" name="flickr_tag" /><br />';
         return $str;
     }

theme/base/style/filemanager.css

@@ -423,6 +423,23 @@ a.ygtvspacer:hover {color:transparent;text-decoration:none;}
 .dir-rtl .filemanager-container .yui3-skin-sam .yui3-datatable-header {text-align:right;}
 .dir-rtl .filemanager .fp-restrictions { text-align: left; }
 
+/*
+ * Forms for file picker.
+ */
+.fp-formset {margin:0 auto;width:500px;}
+.fp-formset div {text-align:left;}
+.fp-formset .controls {text-align:left;}
+.fp-formset label {display:block;float:left;width:210px;text-align:right;margin:0 10px 0 0;}
+.fp-formset .fp-popup { text-align: center; }
+.fp-formset .fp-setlicense select {width:280px;}
+.fp-forminset label {display:block;float:left;width:95px;text-align:right;margin:0 10px 0 0;}
+.fp-forminset .controls {float:left;}
+.dir-rtl .fp-forminset label {display:block;float:right;width:95px;text-align:right;margin:0 0 0 10px;}
+.dir-rtl .fp-forminset .controls {float:right;}
+.dir-rtl .fp-forminset .fp-select-buttons {float:left;}
+.dir-rtl .fp-forminset .fp-setlicense select, .dir-rtl .fp-forminset .fp-license select {width:248px;}
+.dir-rtl .fp-formset label {float:right;text-align:left; margin:0 0 0 10px;}
+.dir-rtl .fp-formset div {text-align:right;}
 
 /**
  * Responsive styles for the filepicker
@@ -437,5 +454,7 @@ a.ygtvspacer:hover {color:transparent;text-decoration:none;}
     .fp-content .mdl-right {text-align:left;}
     .dir-rtl .fp-content .mdl-right {text-align:right;}
     .fp-repo-items .fp-navbar {border-top:1px solid rgb(187, 187, 187);}
+    .fp-formset, .fp-forminset {margin:0 10px;width:auto;}
+    .fp-formset label, .fp-forminset label {float:none;width:210px;text-align:left;margin:5px 0;}
+    .dir-rtl .fp-formset label, .dir-rtl .fp-forminset label {text-align:right;float:none;}
 }
-

theme/bootstrapbase/less/moodle/filemanager.less

@@ -1196,4 +1196,59 @@ a.ygtvspacer:hover {
             left: 0;
         }
     }
-}
+}
+// Upload form for file picker.
+.fp-formset {
+    max-width: 500px;
+    padding: 10px;
+    input[type="file"] {
+        line-height: inherit;
+    }
+}
+.fp-forminset {
+    max-width: 400px;
+    padding: 10px;
+    .control-group {
+        label.control-label {
+           width: 105px;
+        }
+        .controls {
+            margin-left: 125px;
+        }
+    }
+    .fp-select-buttons {
+        float: none;
+    }
+
+}
+
+.dir-rtl .fp-forminset {
+    max-width: 400px;
+    .control-group {
+        label.control-label {
+            float: right;
+            text-align: left;
+        }
+        .controls {
+            margin-left: 0;
+            margin-right: 125px;
+        }
+    }
+    .fp-select-buttons {
+        float: left;
+    }
+    input[type="text"] {
+        width: 248px;
+    }
+}
+
+.dir-rtl .filepicker .fp-formset {
+    label {
+        float: right;
+        text-align: left;
+    }
+    .controls {
+        margin-left: 0;
+        text-align: right;
+    }
+}

theme/bootstrapbase/less/moodle/responsive.less

@@ -99,9 +99,11 @@
         }
     }
 
+    .fp-formset div {
+        height: auto;
+    }
 }
 
-// login page
 @media (min-width: 1200px) {
     .loginbox.twocolumns .loginpanel {
         margin-left: 0;
@@ -537,3 +539,26 @@
        text-align: left;
    }
 }
+
+
+// File Picker.
+@media (max-width: 768px) {
+    .fp-forminset .control-group .controls {
+        margin-left: 0;
+    }
+    .dir-rtl .fp-formset .control-group {
+        label.control-label {
+            text-align: right;
+            float: none;
+        }
+    }
+    .dir-rtl .fp-forminset .control-group {
+        label.control-label {
+            text-align: right;
+            float: none;
+        }
+        .controls {
+            margin-right: 0;
+        }
+    }
+}