Add buttons to plugin cleaning job

- #12 - #11
aljawaid · May 8, 2023 · 0fb14ab · 0fb14ab
1 parent 7cd41a5
commit 0fb14ab
Show file tree

Hide file tree

Showing 2 changed files with 99 additions and 12 deletions.
diff --git a/Assets/css/content-cleaner.css b/Assets/css/content-cleaner.css
@@ -171,6 +171,11 @@ li.more {
     display: block;
 }
 
+.plugin-job-content {
+    margin-bottom: 7px;
+    display: block;
+}
+
 .job-tables, .job-result, .job-table-size {
     font-size: .9em;
 }
@@ -534,12 +539,16 @@ li.job-columns-list ol.column-list {
 }
 
 fieldset.plugin-job-wrapper {
-    padding: 10px 15px 15px 10px;
+    padding: 10px 15px 7px 10px;
     position: relative;
     display: block;
     width: auto;
 }
 
+#PluginJobWrapper {
+    height: unset;
+}
+
 .job-plugin-table {
     margin-block-end: 5px;
 }
@@ -555,6 +564,14 @@ fieldset.plugin-job-wrapper .form-actions {
     right: 13px;
 }
 
+#DeepCleanFormActions {
+    position: unset;
+    right: 13px;
+    display: block;
+    margin: auto;
+    text-align: right;
+}
+
 li.job-plugin-version, li.no-tables {
     background: none;
 }
@@ -594,3 +611,57 @@ span.tooltip.content-cleaner-tooltip i.fa-info-circle {
     vertical-align: middle !important;
     color: #737272;
 }
+
+.deep-clean-panel {
+    border-radius: var(--border-radius-c-cleaner);
+    padding: 0 1px 3px 5px;
+    border: 1px solid #000;
+    color: var(--color-primary);
+    background-color: #fcfcfc;
+    display: inline-block;
+    margin-right: 15px;
+}
+
+li.deep-clean-panel-title {
+    text-transform: uppercase;
+    font-size: .8em;
+    font-weight: 600;
+    color: var(--pp-grey);
+    white-space: break-spaces;
+    word-break: break-word;
+    width: 60px;
+    text-align: center;
+    vertical-align: bottom;
+}
+
+ul.plugin-btn-list {
+    list-style-type: none;
+}
+
+ul.plugin-btn-list li {
+    display: inline-block;
+}
+
+ul.plugin-btn-list li a.job-btn {
+    font-size: .9em;
+}
+
+ul.plugin-btn-list li a.job-btn span.plugin-icon {
+    width: 16px;
+    height: 16px;
+    color: red;
+}
+
+li.plugin-btn-item {
+    margin-right: 10px;
+}
+
+#DeletePluginButton:hover {
+    background: var(--pp-white);
+}
+
+#DeletePluginButton {
+    background: var(--pp-green);
+    color: var(--pp-white);
+    border-color: var(--pp-green-dark);
+}
diff --git a/Template/cleaning-jobs/plugin-clean.php b/Template/cleaning-jobs/plugin-clean.php
@@ -1,7 +1,7 @@
 <!-- ContentCleaner: PLUGIN CLEANING -->
 <?php foreach ($deletable_plugins as $plugin): ?>
     <div class="job-section-wrapper">
-        <fieldset class="job-wrapper plugin-job-wrapper">
+        <fieldset id="PluginJobWrapper" class="job-wrapper plugin-job-wrapper">
             <legend class="job-title">
                 <span class="content-cleaner-icon"></span> <?= t('%s Plugin', $plugin['plugin_title']) ?>
                 <span class="job-number-wrapper" title="<?= t('Cleaning Job Number') ?>">
@@ -22,7 +22,7 @@
             <p class="job-desc">
                 <?= t('Remove all traces, content and plugin registration data for %s.', $plugin['plugin_title']) ?>
             </p>
-            <div class="job-content">
+            <div class="plugin-job-content">
                 <ul class="job-tables fa-ul">
                     <li class="job-tables-title">
                         <i class="fa fa-table fa-li" aria-hidden="true"></i><?= t('Plugin Tables') ?>
@@ -123,17 +123,33 @@
                     </li>
                 </ul>
             </div>
-            <div class="form-actions plugin-job-form-actions">
-                <div class="panel">
-                    <h5><?= t('Plugin Deep Cleaning') ?></h5>
-                    <ul class="">
-                        <li class=""><a href="" class=""><span class="plugin-icon"></span><?= t('Plugin Tables') ?></a></li>
-                        <li class=""><a href="" class=""><span class="plugin-icon"></span><?= t('Core Table Columns') ?></a></li>
-                        <li class=""><a href="" class=""><span class="plugin-icon"></span><?= t('Core Table Entries') ?></a></li>
-                        <li class=""><a href="" class=""><span class="plugin-icon"></span><?= t('Plugin Registration') ?></a></li>
+            <div id="DeepCleanFormActions" class="form-actions plugin-job-form-actions">
+                <div class="deep-clean-panel">
+                    <ul class="plugin-btn-list">
+                        <li class="deep-clean-panel-title"><?= t('Deep Cleaning') ?></li>
+                        <li class="plugin-btn-item">
+                            <a href="" class="btn job-btn js-modal-confirm">
+                                <span class="plugin-icon"></span> <?= t('Plugin Tables') ?>
+                            </a>
+                        </li>
+                        <li class="plugin-btn-item">
+                            <a href="" class="btn job-btn js-modal-confirm">
+                                <span class="plugin-icon"></span> <?= t('Core Table Columns') ?>
+                            </a>
+                        </li>
+                        <li class="plugin-btn-item">
+                            <a href="" class="btn job-btn js-modal-confirm">
+                                <span class="plugin-icon"></span> <?= t('Core Table Entries') ?>
+                            </a>
+                        </li>
+                        <li class="plugin-btn-item">
+                            <a href="" class="btn job-btn js-modal-confirm">
+                                <span class="plugin-icon"></span> <?= t('Plugin Registration') ?>
+                            </a>
+                        </li>
                     </ul>
                 </div>
-                <a href="<?= $this->url->href('PluginCleaningController', 'confirmDeletePlugin', array(
+                <a id="DeletePluginButton" href="<?= $this->url->href('PluginCleaningController', 'confirmDeletePlugin', array(
                     'plugin_job_name' => $plugin['plugin_title'],
                     'job_number' => $plugin['job_number'],
                     'plugin_name' => $plugin['plugin_name'],