From 85efd50db4b04dfd01adde07c44c41dfb86093e8 Mon Sep 17 00:00:00 2001
From: Zacharie <guetzac@gmail.com>
Date: Wed, 12 Aug 2020 14:53:51 +0200
Subject: [PATCH] Issue #1208 : Minor design fixes

---
 admin/cat_modify.php                         |  4 +-
 admin/themes/default/template/cat_modify.tpl | 61 +++++++++++---------
 admin/themes/default/theme.css               | 27 ++++++---
 3 files changed, 55 insertions(+), 37 deletions(-)

diff --git a/admin/cat_modify.php b/admin/cat_modify.php
index 64ffe55c4..0cef6fc1b 100644
--- a/admin/cat_modify.php
+++ b/admin/cat_modify.php
@@ -357,7 +357,7 @@ $result = query2array($query);
 if (count($result) > 0) {
   $template->assign(
     array(
-      'INFO_CREATION' => l10n('Created on %s',format_date($result[0]['occured_on']))
+      'INFO_CREATION' => l10n('Created on %s',format_date($result[0]['occured_on'], array('month','year')))
       )
     );
 }
@@ -380,7 +380,7 @@ if ($result[0]['COUNT(*)'] > 0) {
 
 $template->assign(array(
   'INFO_ID' => l10n('Numeric identifier : %d',$category['id']),
-  'INFO_LAST_MODIFIED'=> l10n('Edited on %s',format_date($category['lastmodified']))
+  'INFO_LAST_MODIFIED'=> l10n('Edited on %s',format_date($category['lastmodified'], array('month','year')))
     )
   );
 
diff --git a/admin/themes/default/template/cat_modify.tpl b/admin/themes/default/template/cat_modify.tpl
index 3f349c75a..aac99ad14 100644
--- a/admin/themes/default/template/cat_modify.tpl
+++ b/admin/themes/default/template/cat_modify.tpl
@@ -231,17 +231,19 @@ function cropImage() {
   {/if}
 
     <div class="catInfo">
-      {if isset($INFO_CREATION)}
-        <span class="icon-green">{$INFO_CREATION}</span>
-      {/if}
-      <span class="icon-purple">{$INFO_LAST_MODIFIED}</span>
-      {if isset($INFO_PHOTO)}
-        <span class="icon-yellow" title="{$INFO_TITLE}">{$INFO_PHOTO}</span>
-      {/if}
-      {if isset($INFO_DIRECT_SUB)}
-        <span class="icon-blue">{$INFO_DIRECT_SUB}</span>
-      {/if}
-      <span class="icon-red" >{$INFO_ID}</span>
+      <div class="container">
+        {if isset($INFO_CREATION)}
+          <span class="icon-yellow">{$INFO_CREATION}</span>
+        {/if}
+        <span class="icon-red">{$INFO_LAST_MODIFIED}</span>
+        {if isset($INFO_PHOTO)}
+          <span class="icon-purple" title="{$INFO_TITLE}">{$INFO_PHOTO}</span>
+        {/if}
+        {if isset($INFO_DIRECT_SUB)}
+          <span class="icon-blue">{$INFO_DIRECT_SUB}</span>
+        {/if}
+        <span class="icon-green" >{$INFO_ID}</span>
+      </div>
     </div>
 
     <div class="catAction">
@@ -271,25 +273,28 @@ function cropImage() {
 
     <div class="catLock">
     <div class="container">
-      <strong>{'Publication'|@translate}</strong>
       <div>
-        <span class="label">{'Unlock'|@translate}</span>
-        <label class="switch">
-          <input type="checkbox" name="visible" id="toggleSelectionMode" value="true" {if $CAT_VISIBLE == "true"}checked{/if}>
-          <span class="slider round"></span>
-        </label>
-        <span class="label">{'Lock'|@translate}</span>    
+        <strong>{'Publication'|@translate}</strong>
+        <div class="switch-input">
+          <span class="label">{'Unlock'|@translate}</span>
+          <label class="switch">
+            <input type="checkbox" name="visible" id="toggleSelectionMode" value="true" {if $CAT_VISIBLE == "true"}checked{/if}>
+            <span class="slider round"></span>
+          </label>
+          <span class="label">{'Lock'|@translate}</span>
+        </div>    
       </div>
     {if isset($CAT_COMMENTABLE)}
-      <strong>{'Comments'|@translate}</strong>
       <div>
-        <span class="label">{'Forbidden'|@translate}</span>
-        <label class="switch">
-          <input type="checkbox" name="commentable" id="commentable" value="true" {if $CAT_COMMENTABLE == "true"}checked{/if}>
-          <span class="slider round"></span>
-        </label>
-        <span class="label">{'Authorized'|@translate}</span>
-        <br>
+        <strong>{'Comments'|@translate}</strong>
+        <div class="switch-input">
+          <span class="label">{'Forbidden'|@translate}</span>
+          <label class="switch">
+            <input type="checkbox" name="commentable" id="commentable" value="true" {if $CAT_COMMENTABLE == "true"}checked{/if}>
+            <span class="slider round"></span>
+          </label>
+          <span class="label">{'Authorized'|@translate}</span>
+        <div>
         <label id="applytoSubAction">
         <label class="font-checkbox"><span class="icon-check"></span><input type="checkbox" name="apply_commentable_on_sub"></label>
           {'Apply to sub-albums'|@translate}
@@ -320,12 +325,12 @@ function cropImage() {
     <strong>{'Parent album'|@translate}</strong>
     <br>
     <select data-selectize="categories" data-value="{$parent_category|@json_encode|escape:html}"
-        name="parent" style="width:600px"></select>
+        name="parent" style="width:100%"></select>
   </p>
 {/if}
 
   <p style="margin:0">
-    <button name="submit" type="submit" class="buttonLike">
+    <button name="submit" type="submit" class="buttonGradient">
       <i class="icon-floppy"></i> {'Save Settings'|@translate}
     </button>
   </p>
diff --git a/admin/themes/default/theme.css b/admin/themes/default/theme.css
index ef316f6f6..1654a6cd4 100644
--- a/admin/themes/default/theme.css
+++ b/admin/themes/default/theme.css
@@ -403,7 +403,7 @@ LI.menuLi {
 #catHeader .albumThumbnailActions a:hover {
   color: #3C3C3C;
   text-decoration: none;
-  background-color: #ff7700bd;
+  background-color: #ff7700;
 }
 
 #catHeader .catInfo, #catHeader .catAction {
@@ -411,10 +411,16 @@ LI.menuLi {
 }
 
 #catHeader .catInfo {
+  display: flex;
+  justify-content: center;
+}
+
+#catHeader .catInfo .container{
   display: flex;
   flex-direction: column;
-  align-items: center;
-  justify-content: space-evenly;
+  align-items: baseline;
+  justify-content: space-between;
+  height: 100%;
 }
 
 #catHeader .catInfo span {
@@ -428,6 +434,7 @@ LI.menuLi {
   position: relative;
   justify-content: center;
   align-items: center;
+  overflow: hidden;
 }
 
 #catHeader .catAction .container {
@@ -454,7 +461,7 @@ LI.menuLi {
 }
 
 #catHeader .catAction a:hover {
-  color: #3C3C3C;
+  color: #ff7700;
   text-decoration: none;
 }
 
@@ -472,24 +479,30 @@ LI.menuLi {
 
 #catHeader .catLock .container{
   position: relative;
+  height: 100%;
 }
 
 #catHeader .catLock strong {
   color: #3C3C3C;
   font-size: 16px;
+  margin-bottom: 15px;
+  display: block;
 }
 
 #catHeader .catLock .container > div {
-  margin-top: 15px;
-  margin-bottom: 20px;
+  margin-bottom: 40px;
 }
 
 #catHeader .catLock > div .label {
   font-size: 14px;
 }
 
+#catHeader .catLock .switch {
+  margin: 0 5px;
+}
+
 #catModify input[type="text"], #catModify textarea{
-  width: 50%;
+  width: 98%;
   background-color: #f8f8f8;
   padding: 8px;
   border-radius: 4px;