Floating save zone in Write panel

Fixes #925
textpattern · Aug 18, 2017 · f6d6a7b · f6d6a7b
1 parent 29d7bf0
commit f6d6a7b
Show file tree

Hide file tree

Showing 5 changed files with 85 additions and 7 deletions.
diff --git a/textpattern/admin-themes/hive/assets/css/textpattern.css b/textpattern/admin-themes/hive/assets/css/textpattern.css
@@ -3451,6 +3451,32 @@ button {
     margin-top: -1em;
     color: #777777;
   }
+  /**
+ * Sticky save button region.
+ *
+ * Example HTML:
+ *
+ * <div class="txp-save-zone">
+ *     <p class="txp-save"></p>
+ *     <p class="txp-actions"></p>
+ * </div>
+ */
+  .txp-save-zone {
+    position: -webkit-sticky;
+    position: sticky;
+    top: 2.75em;
+    margin: -1.25em 0 1em;
+    padding: 1px 1em 0;
+    border: 1px solid #d4d4d4;
+    border-top: 0;
+    background: #ffffff;
+    -webkit-box-shadow: 0 0.2em 0.25em rgba(0, 0, 0, 0.15);
+            box-shadow: 0 0.2em 0.25em rgba(0, 0, 0, 0.15);
+    z-index: 999;
+  }
+  .txp-save-zone .txp-actions {
+    margin-bottom: 0.5em;
+  }
   /* Content -> Articles panel - additional layout
    ========================================================================== */
   /**
@@ -6074,6 +6100,20 @@ button {
   #page-form .txp-actions a {
     margin-top: 0.5em;
   }
+  /**
+     * Unsticky save button region.
+     */
+  .txp-save-zone {
+    position: inherit;
+    margin: 0;
+    padding: 0;
+    border: 0;
+    -webkit-box-shadow: none;
+            box-shadow: none;
+  }
+  .txp-save-zone .txp-actions {
+    margin-bottom: 1em;
+  }
 }
 
 /* ==========================================================================

diff --git a/textpattern/admin-themes/hive/assets/css/textpattern.min.css b/textpattern/admin-themes/hive/assets/css/textpattern.min.css
diff --git a/textpattern/admin-themes/hiveneutral/assets/css/textpattern.css b/textpattern/admin-themes/hiveneutral/assets/css/textpattern.css
@@ -3406,6 +3406,30 @@ button {
     margin-top: -1em;
     color: #777777;
   }
+  /**
+ * Sticky save button region.
+ *
+ * Example HTML:
+ *
+ * <div class="txp-save-zone">
+ *     <p class="txp-save"></p>
+ *     <p class="txp-actions"></p>
+ * </div>
+ */
+  .txp-save-zone {
+    position: -webkit-sticky;
+    position: sticky;
+    top: 2.75em;
+    margin: -1.25em 0 1em;
+    padding: 1px 1em 0;
+    border: 1px solid #d4d4d4;
+    border-top: 0;
+    background: #f7f7f7;
+    z-index: 999;
+  }
+  .txp-save-zone .txp-actions {
+    margin-bottom: 0.5em;
+  }
   /* Content -> Articles panel - additional layout
    ========================================================================== */
   /**
@@ -5998,6 +6022,18 @@ button {
   #page-form .txp-actions a {
     margin-top: 0.5em;
   }
+  /**
+     * Unsticky save button region.
+     */
+  .txp-save-zone {
+    position: inherit;
+    margin: 0;
+    padding: 0;
+    border: 0;
+  }
+  .txp-save-zone .txp-actions {
+    margin-bottom: 1em;
+  }
 }
 
 /* ==========================================================================
@@ -6440,9 +6476,9 @@ button {
   .dropdown-menu li.selected {
     background: #d4e7f8;
   }
-  table,
-  .switcher-list,
-  .ui-menu {
+  .ui-menu,
+  .switcher-list li.active,
+  .ui-tabs-vertical .ui-tabs-nav .ui-tabs-active {
     background: #ffffff;
   }
 }
diff --git a/textpattern/admin-themes/hiveneutral/assets/css/textpattern.min.css b/textpattern/admin-themes/hiveneutral/assets/css/textpattern.min.css
diff --git a/textpattern/include/txp_article.php b/textpattern/include/txp_article.php
@@ -861,7 +861,8 @@ function article_edit($message = '', $concurrent = false, $refresh_partials = fa
 
     // Sidebar column (only shown if in text editing view).
     if ($view == 'text') {
-        echo n.'<div class="txp-layout-4col-alt">';
+        echo n.'<div class="txp-layout-4col-alt">'.
+            n.'<div class="txp-save-zone">';
 
         // 'Publish/Save' button.
         if (empty($ID)) {
@@ -881,7 +882,8 @@ function article_edit($message = '', $concurrent = false, $refresh_partials = fa
             echo graf(fInput('submit', 'save', gTxt('save'), 'publish'), array('class' => 'txp-save'));
         }
 
-        echo $partials['actions']['html'];
+        echo $partials['actions']['html'].
+            n.'</div>';
 
         // Prev/next article links.
         echo $partials['article_nav']['html'];