Changing the markup/styles for the progress window on the files tab
authorLaury GvR <laury@gaslightmedia.com>
Mon, 10 Apr 2017 14:35:49 +0000 (10:35 -0400)
committerLaury GvR <laury@gaslightmedia.com>
Mon, 10 Apr 2017 14:35:49 +0000 (10:35 -0400)
css/admin.css
views/admin/member/memberInfo.html
views/admin/member/memberInfo/editFiles.html

index bc384a8..f74aa7b 100644 (file)
@@ -402,6 +402,9 @@ td.glm-nowrap {
     background-color: #eee;
     font-size: .8em;
 }
+#glm-admin-content-container #glm-table-files {
+    width: 100%;
+}
 .glm-galleryFiles .glm-galleryContainer a {
     display: block;
     margin-top: 10px;
@@ -410,6 +413,27 @@ td.glm-nowrap {
 .glm-galleryFiles .glm-galleryContainer {
     height: 5em;
 }
+#glm-admin-content-container .glm-row, .glm-admin-table.glm-admin-table-inner .glm-fileUploadStatus .glm-row {
+    margin-bottom: 0px;
+}
+#glm-admin-content-container .glm-fileUploadStatus {
+    height: 10em;
+}
+.glm-fileUploadStatus .glm-statusPrompt {
+    padding: 0 15px;
+    text-align: right;
+    width: 15%;
+    float: left;
+}
+.glm-fileUploadStatus .glm-statusValue {
+    padding: 0;
+    text-align: left;
+    width: auto;
+    float: left;
+}
+.glm-fileUploadStatus .glm-statusValue.glm-progressBarWrapper {
+    width: 65%;
+}
 .glm-galleryContainer
 {
     clear: both;
index 83b3926..0d9a6f0 100644 (file)
         <a id="glm-member-info-files" data-show-table="glm-table-files" class="glm-member-info-tab nav-tab">Files</a>
 
 <!-- Not using credit cards currently        <a id="glm-member-info-ccards" data-show-table="glm-table-ccards" class="glm-member-info-tab nav-tab">Credit Cards</a>  -->
-        <a id="glm-member-info-files" data-show-table="glm-table-files" class="glm-member-info-tab nav-tab">Files</a>
 <!-- Not using this yet       <a id="glm-member-info-additional" data-show-table="glm-table-media" class="glm-member-info-tab nav-tab">Additional Data Fields</a>-->
         {if $memberUpdated}<span class="glm-notice glm-flash-updated glm-right">{$terms.term_member_cap} Profile Updated</span>{/if}
         {if $memberUpdateError}<span class="glm-error glm-flash-updated glm-right">{$terms.term_member_cap} Profile Update Error</span>{/if}
index c2cfb4c..37e7e48 100644 (file)
@@ -1,7 +1,7 @@
 <div id="glm-table-files" class="glm-admin-table glm-admin-table-outer glm-hidden glm-member-info-table">
     <h2>Files</h2>
     
-    <div class="glm-admin-table glm-admin-table-inner-wrapper glm-small-8">
+    <div class="glm-admin-table glm-admin-table-inner-wrapper glm-small-12 glm-medium-8">
         <div class="glm-row glm-admin-table glm-admin-table-inner">
             <div class="glm-item-container glm-filesContainer">
                 {if $memberInfoID}
                             <b><u>Uploading File { thisFile } of { numbFiles }</u></b>
                             <table class="glm-statusTable">
                                 <div class="glm-row">
+                                    <div style="float: right; margin: .2em .2em 0 0;" id="fileUploadCancel" class="button button-primary glm-right">Cancel Upload</div>
                                     <div class="glm-statusFileTD" rowspan="5">
                                         <div class="glm-statusFileContainer">
                                         </div>
                                     </div>
                                 </div>
                                 <div class="glm-row">
-                                    <div><div style="float: right; margin: .2em .2em 0 0;" id="fileUploadCancel" class="button button-primary glm-right">Cancel Upload</div></div>
                                     <div class="glm-statusPrompt">Name: </div><div class="glm-statusValue">{ fileName }</div>
                                 </div>
                                 <div class="glm-row"><div class="glm-statusPrompt">Type: </div><div class="glm-statusValue">{ fileType }</div></div>
                                 <div class="glm-row"><div class="glm-statusPrompt">Size: </div><div class="glm-statusValue">{ fileSize }</div></div>
-                                <div class="glm-row"><div class="glm-statusPrompt">Progress: </div><div class="glm-statusValue"><div class="glm-progressBarContainer"><div class="glm-progressBar"></div></div></div></div>
+                                <div class="glm-row"><div class="glm-statusPrompt">Progress: </div><div class="glm-statusValue glm-progressBarWrapper"><div class="glm-progressBarContainer"><div class="glm-progressBar"></div></div></div></div>
                             </table>
                             <!-- End of template -->
 
@@ -51,7 +51,7 @@
                                 <div class="glm-file glm-small-12 glm-large-6 glm-left">
                                     <a target="_blank" href="{$glmPluginMediaUrl}/files/{ filename }">{ file_name }</a>
                                 </div>
-                                <div class="glm-fileData glm-small-12 glm-large-4 glm-right">
+                                <div class="glm-fileData glm-small-12 glm-large-4 glm-left">
                                     <div class="glm-statusTable">
                                         <h4>File Name:</h4>
                                         <div><input id="file_caption_{ id }" type="text" name="file_caption[{ id }]" value="" class="glm-form-text-input-small" disabled></div>
@@ -59,8 +59,8 @@
                                 </div>
                                 <div class="glm-fileDeleteButton glm-small-12 glm-large-2 glm-right">
                                     <div>
+                                        <div><h4 class="glm-notice" style="font-size: 12px; color: #F18004; margin: -4px 0 4px;">New Upload</h4></div>
                                         <div><h4>Delete:</h4><div><input type="checkbox" name="file_delete[{ id }]" disabled></div></div>
-                                        <div><h4 class="glm-notice" style="font-size: 1.2em;">New Upload</h4></div>
                                     </div>
                                     <input type="hidden" name="file_position[{$i.id}]" value="{$i.position}">
                                 </div>