From 9b2e5c7298632002a3358af7be6bf6044b37fded Mon Sep 17 00:00:00 2001
From: Kazhnuz <kazhnuz@kobold.cafe>
Date: Sat, 18 Jan 2025 15:44:13 +0100
Subject: [PATCH] =?UTF-8?q?=F0=9F=9A=B8=20(admin):=20rework=20settings?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 bl-kernel/admin/views/settings.php | 170 +++++++++++++++++++----------
 1 file changed, 111 insertions(+), 59 deletions(-)

diff --git a/bl-kernel/admin/views/settings.php b/bl-kernel/admin/views/settings.php
index fce2fb4b..48fa9233 100644
--- a/bl-kernel/admin/views/settings.php
+++ b/bl-kernel/admin/views/settings.php
@@ -2,17 +2,20 @@
 
 <?php echo Bootstrap::formOpen(array('id' => 'jsform', 'class' => 'tab-content')); ?>
 
-<div class="align-middle">
-	<div class="float-right mt-1">
-		<button type="submit" class="btn btn-primary btn-sm" name="save"><?php $L->p('Save') ?></button>
-		<a class="btn btn-secondary btn-sm" href="<?php echo HTML_PATH_ADMIN_ROOT . 'dashboard' ?>" role="button"><?php $L->p('Cancel') ?></a>
-	</div>
+<div class="d-flex justify-content-between mb-2">
 	<?php echo Bootstrap::pageTitle(array('title' => $L->g('Settings'), 'icon' => 'cog')); ?>
+	<div>
+		<button type="submit" class="btn btn-primary" name="save"><?php $L->p('Save') ?></button>
+		<a class="btn btn-secondary" href="<?php echo HTML_PATH_ADMIN_ROOT . 'dashboard' ?>" role="button"><?php $L->p('Cancel') ?></a>
+	</div>
 </div>
 
+<div class="d-flex align-items-start">
+
+<div>
 <!-- TABS -->
-<nav class="mb-3">
-	<div class="nav nav-tabs" id="nav-tab" role="tablist">
+<nav>
+	<div class="nav flex-column nav-pills me-3" id="nav-tab" role="tablist">
 		<a class="nav-item nav-link active" id="nav-general-tab" data-bs-toggle="tab" data-bs-target="#general" role="tab" aria-controls="nav-general" aria-selected="false"><?php $L->p('General') ?></a>
 		<a class="nav-item nav-link" id="nav-advanced-tab" data-bs-toggle="tab" data-bs-target="#advanced" role="tab" aria-controls="nav-advanced" aria-selected="false"><?php $L->p('Advanced') ?></a>
 		<a class="nav-item nav-link" id="nav-seo-tab" data-bs-toggle="tab" data-bs-target="#seo" role="tab" aria-controls="nav-seo" aria-selected="false"><?php $L->p('SEO') ?></a>
@@ -24,6 +27,8 @@
 	</div>
 </nav>
 
+</div>
+
 <?php
 // Token CSRF
 echo Bootstrap::formInputHidden(array(
@@ -32,54 +37,63 @@ echo Bootstrap::formInputHidden(array(
 ));
 ?>
 
+<div class="tab-content w-100">
 <!-- General tab -->
+
 <div class="tab-pane fade show active" id="general" role="tabpanel" aria-labelledby="general-tab">
 
-	<?php
-	echo Bootstrap::formTitle(array('title' => $L->g('Site')));
+	<div class="card">
+		<h6 class="card-header"><?php echo $L->g('Site'); ?></h6>
+		<div class="card-body">
+			<?php
+			//echo Bootstrap::formTitle(array('title' => $L->g('Site')));
 
-	echo Bootstrap::formInputText(array(
-		'name' => 'title',
-		'label' => $L->g('Site title'),
-		'value' => $site->title(),
-		'class' => '',
-		'placeholder' => '',
-		'tip' => $L->g('use-this-field-to-name-your-site')
-	));
+			echo Bootstrap::formInputText(array(
+				'name' => 'title',
+				'label' => $L->g('Site title'),
+				'value' => $site->title(),
+				'class' => '',
+				'placeholder' => '',
+				'tip' => $L->g('use-this-field-to-name-your-site')
+			));
 
-	echo Bootstrap::formInputText(array(
-		'name' => 'slogan',
-		'label' => $L->g('Site slogan'),
-		'value' => $site->slogan(),
-		'class' => '',
-		'placeholder' => '',
-		'tip' => $L->g('use-this-field-to-add-a-catchy-phrase')
-	));
+			echo Bootstrap::formInputText(array(
+				'name' => 'slogan',
+				'label' => $L->g('Site slogan'),
+				'value' => $site->slogan(),
+				'class' => '',
+				'placeholder' => '',
+				'tip' => $L->g('use-this-field-to-add-a-catchy-phrase')
+			));
 
-	echo Bootstrap::formInputText(array(
-		'name' => 'description',
-		'label' => $L->g('Site description'),
-		'value' => $site->description(),
-		'class' => '',
-		'placeholder' => '',
-		'tip' => $L->g('you-can-add-a-site-description-to-provide')
-	));
+			echo Bootstrap::formInputText(array(
+				'name' => 'description',
+				'label' => $L->g('Site description'),
+				'value' => $site->description(),
+				'class' => '',
+				'placeholder' => '',
+				'tip' => $L->g('you-can-add-a-site-description-to-provide')
+			));
 
-	echo Bootstrap::formInputText(array(
-		'name' => 'footer',
-		'label' => $L->g('Footer text'),
-		'value' => $site->footer(),
-		'class' => '',
-		'placeholder' => '',
-		'tip' => $L->g('you-can-add-a-small-text-on-the-bottom')
-	));
-	?>
+			echo Bootstrap::formInputText(array(
+				'name' => 'footer',
+				'label' => $L->g('Footer text'),
+				'value' => $site->footer(),
+				'class' => '',
+				'placeholder' => '',
+				'tip' => $L->g('you-can-add-a-small-text-on-the-bottom')
+			));
+			?>
+		</div>
+	</div>
 </div>
 
 <!-- Advanced tab -->
 <div class="tab-pane fade" id="advanced" role="tabpanel" aria-labelledby="advanced-tab">
 	<?php
-	echo Bootstrap::formTitle(array('title' => $L->g('Content')));
+	//echo Bootstrap::formTitle(array('title' => $L->g('Content')));
+
+	echo Bootstrap::cardBegin($L->g('Content'));
 
 	echo Bootstrap::formInputText(array(
 		'name' => 'itemsPerPage',
@@ -99,7 +113,9 @@ echo Bootstrap::formInputHidden(array(
 		'tip' => $L->g('order-the-content-by-date-to-build-a-blog')
 	));
 
-	echo Bootstrap::formTitle(array('title' => $L->g('Predefined pages')));
+	echo Bootstrap::cardEnd();
+
+	echo Bootstrap::cardBegin($L->g('Predefined pages'));
 
 	// Homepage
 	try {
@@ -196,7 +212,11 @@ echo Bootstrap::formInputHidden(array(
 	</script>
 
 	<?php
-	echo Bootstrap::formTitle(array('title' => $L->g('Email account settings')));
+
+	echo Bootstrap::cardEnd();
+
+	echo Bootstrap::cardBegin($L->g('Email account settings'));
+	//echo Bootstrap::formTitle(array('title' => $L->g('Email account settings')));
 
 	echo Bootstrap::formInputText(array(
 		'name' => 'emailFrom',
@@ -207,7 +227,9 @@ echo Bootstrap::formInputHidden(array(
 		'tip' => $L->g('Emails will be sent from this address')
 	));
 
-	echo Bootstrap::formTitle(array('title' => $L->g('Autosave')));
+	echo Bootstrap::cardEnd();
+
+	echo Bootstrap::cardBegin($L->g('Autosave'));
 
 	echo Bootstrap::formInputText(array(
 		'name' => 'autosaveInterval',
@@ -218,7 +240,9 @@ echo Bootstrap::formInputHidden(array(
 		'tip' => $L->g('Number in minutes for every execution of autosave')
 	));
 
-	echo Bootstrap::formTitle(array('title' => $L->g('Site URL')));
+	echo Bootstrap::cardEnd();
+
+	echo Bootstrap::cardBegin($L->g('Site URL'));
 
 	echo Bootstrap::formInputText(array(
 		'name' => 'url',
@@ -230,7 +254,9 @@ echo Bootstrap::formInputHidden(array(
 		'placeholder' => 'https://'
 	));
 
-	echo Bootstrap::formTitle(array('title' => $L->g('Page content')));
+	echo Bootstrap::cardEnd();
+
+	echo Bootstrap::cardBegin($L->g('Page content'));
 
 	echo Bootstrap::formSelect(array(
 		'name' => 'markdownParser',
@@ -241,7 +267,9 @@ echo Bootstrap::formInputHidden(array(
 		'tip' => $L->g('Enable the markdown parser for the content of the page.')
 	));
 
-	echo Bootstrap::formTitle(array('title' => $L->g('URL Filters')));
+	echo Bootstrap::cardEnd();
+
+	echo Bootstrap::cardBegin($L->g('URL Filters'));
 
 	echo Bootstrap::formInputText(array(
 		'name' => 'uriPage',
@@ -279,13 +307,15 @@ echo Bootstrap::formInputHidden(array(
 		'tip' => DOMAIN . $site->uriFilters('blog'),
 		'disabled' => Text::isEmpty($site->uriFilters('blog'))
 	));
+
+	echo Bootstrap::cardEnd();
 	?>
 </div>
 
 <!-- SEO tab -->
 <div class="tab-pane fade" id="seo" role="tabpanel" aria-labelledby="seo-tab">
 	<?php
-	echo Bootstrap::formTitle(array('title' => $L->g('Extreme friendly URL')));
+	echo Bootstrap::cardBegin($L->g('Extreme friendly URL'));
 
 	echo Bootstrap::formSelect(array(
 		'name' => 'extremeFriendly',
@@ -296,7 +326,9 @@ echo Bootstrap::formInputHidden(array(
 		'tip' => $L->g('Allow unicode characters in the URL and some part of the system.')
 	));
 
-	echo Bootstrap::formTitle(array('title' => $L->g('Title formats')));
+	echo Bootstrap::cardEnd();
+
+	echo Bootstrap::cardBegin($L->g('Title formats'));
 
 	echo Bootstrap::formInputText(array(
 		'name' => 'titleFormatHomepage',
@@ -337,12 +369,17 @@ echo Bootstrap::formInputHidden(array(
 		'tip' => $L->g('Variables allowed') . ' <code>{{tag-name}}</code> <code>{{site-title}}</code> <code>{{site-slogan}}</code> <code>{{site-description}}</code>',
 		'placeholder' => ''
 	));
+
+	echo Bootstrap::cardEnd();
 	?>
 </div>
 
 <!-- Social Network tab -->
 <div class="tab-pane fade" id="social" role="tabpanel" aria-labelledby="social-tab">
 	<?php
+
+	echo Bootstrap::cardBegin($L->g('Social Networks'));
+
 	echo Bootstrap::formInputText(array(
 		'name' => 'twitter',
 		'label' => 'Twitter',
@@ -450,13 +487,15 @@ echo Bootstrap::formInputHidden(array(
 		'placeholder' => '',
 		'tip' => ''
 	));
+
+	echo Bootstrap::cardEnd();
 	?>
 </div>
 
 <!-- Images tab -->
 <div class="tab-pane fade" id="images" role="tabpanel" aria-labelledby="images-tab">
 	<?php
-	echo Bootstrap::formTitle(array('title' => $L->g('Thumbnails')));
+	echo Bootstrap::cardBegin($L->g('Thumbnails'));
 
 	echo Bootstrap::formInputText(array(
 		'name' => 'thumbnailWidth',
@@ -485,7 +524,9 @@ echo Bootstrap::formInputHidden(array(
 		'tip' => $L->g('Thumbnail quality in percentage')
 	));
 
-	echo Bootstrap::formTitle(array('title' => $L->g('Avatar')));
+	echo Bootstrap::cardEnd();
+
+	echo Bootstrap::cardBegin($L->g('Avatar'));
 
 	echo Bootstrap::formInputText(array(
 		'name' => 'avatarWidth',
@@ -513,13 +554,15 @@ echo Bootstrap::formInputHidden(array(
 		'placeholder' => '',
 		'tip' => $L->g('Avatar quality in percentage')
 	));
+
+	echo Bootstrap::cardEnd();
 	?>
 </div>
 
 <!-- Timezone and language tab -->
 <div class="tab-pane fade" id="language" role="tabpanel" aria-labelledby="language-tab">
 	<?php
-	echo Bootstrap::formTitle(array('title' => $L->g('Language and timezone')));
+	echo Bootstrap::cardBegin($L->g('Language and timezone'));
 
 	echo Bootstrap::formSelect(array(
 		'name' => 'language',
@@ -548,7 +591,7 @@ echo Bootstrap::formInputHidden(array(
 		'tip' => $L->g('with-the-locales-you-can-set-the-regional-user-interface')
 	));
 
-	echo Bootstrap::formTitle(array('title' => $L->g('Date and time formats')));
+	//echo Bootstrap::formTitle(array('title' => $L->g('Date and time formats')));
 
 	echo Bootstrap::formInputText(array(
 		'name' => 'dateFormat',
@@ -558,13 +601,16 @@ echo Bootstrap::formInputHidden(array(
 		'placeholder' => '',
 		'tip' => $L->g('Current format') . ': ' . Date::current($site->dateFormat())
 	));
+
+	echo Bootstrap::cardEnd();
 	?>
 </div>
 
 <!-- Custom fields -->
 <div class="tab-pane fade" id="custom-fields" role="tabpanel" aria-labelledby="custom-fields-tab">
 	<?php
-	echo Bootstrap::formTitle(array('title' => $L->g('Custom fields')));
+
+	echo Bootstrap::cardBegin($L->g('Custom fields'));
 
 	echo Bootstrap::formTextarea(array(
 		'name' => 'customFields',
@@ -575,23 +621,26 @@ echo Bootstrap::formInputHidden(array(
 		'tip' => $L->g('define-custom-fields-for-the-content'),
 		'rows' => 15
 	));
+
+	echo Bootstrap::cardEnd();
 	?>
 </div>
 
 <!-- Site logo tab -->
 <div class="tab-pane fade" id="logo" role="tabpanel" aria-labelledby="logo-tab">
 	<?php
-	echo Bootstrap::formTitle(array('title' => $L->g('Site logo')));
+
+	echo Bootstrap::cardBegin($L->g('Site logo'));
 	?>
 
 	<div class="container">
 		<div class="row">
 			<div class="col-lg-4 col-sm-12 p-0 pr-2">
 				<div class="custom-file">
-					<input id="jssiteLogoInputFile" class="custom-file-input" type="file" name="inputFile">
+					<input id="jssiteLogoInputFile" class="form-control custom-file-input" type="file" name="inputFile">
 					<label for="jssiteLogoInputFile" class="custom-file-label"><?php $L->p('Upload image'); ?></label>
 				</div>
-				<button id="jsbuttonRemoveLogo" type="button" class="btn btn-primary w-100 mt-4 mb-4"><i class="fa fa-trash"></i><?php $L->p('Remove logo') ?></button>
+				<button id="jsbuttonRemoveLogo" type="button" class="btn btn-danger w-100 mt-4 mb-4"><i class="fa fa-trash"></i><?php $L->p('Remove logo') ?></button>
 			</div>
 			<div class="col-lg-8 col-sm-12 p-0 text-center">
 				<img id="jssiteLogoPreview" class="img-fluid img-thumbnail" alt="Site logo preview" src="<?php echo ($site->logo() ? DOMAIN_UPLOADS . $site->logo(false) . '?version=' . time() : HTML_PATH_CORE_IMG . 'default.svg') ?>" />
@@ -624,6 +673,7 @@ echo Bootstrap::formInputHidden(array(
 			});
 		});
 	</script>
+	<?php echo Bootstrap::cardEnd(); ?>
 </div>
 
 <?php echo Bootstrap::formClose(); ?>
@@ -641,3 +691,5 @@ echo Bootstrap::formInputHidden(array(
 		}
 	});
 </script>
+</div>
+</div>
\ No newline at end of file