Improve/fix label management (#6212)

* add the slider

* the styles

* add the title

* improve the column layout

4 files changed, 56 insertions, 2 deletions

diff --git a/app/Controllers/tagController.php b/app/Controllers/tagController.php
index 091da6a6f..d998045a4 100644
--- a/app/Controllers/tagController.php
+++ b/app/Controllers/tagController.php
@@ -195,6 +195,8 @@ class FreshRSS_tag_Controller extends FreshRSS_ActionController {
 	}
 
 	public function indexAction(): void {
+		FreshRSS_View::prependTitle(_t('sub.menu.label_management') . ' · ');
+
 		if (!FreshRSS_Auth::hasAccess()) {
 			Minz_Error::error(403);
 		}
diff --git a/app/views/tag/index.phtml b/app/views/tag/index.phtml
index 3f6cf8945..9b86b7496 100644
--- a/app/views/tag/index.phtml
+++ b/app/views/tag/index.phtml
@@ -29,10 +29,30 @@
 
 	<?php if (count($this->tags) > 0): ?>
 	<h2><?= _t('gen.action.manage') ?></h2>
-	<ul>
+	<ul id="tagsList" <?= (count($this->tags) > 11) ? 'class="listInColumns"' : '' ?>>
 	<?php foreach ($this->tags as $tag): ?>
-		<li><a href="<?= _url('tag', 'update', 'id', $tag->id()) ?>"><?= $tag->name() ?></a></li>
+		<li>
+			<a href="<?= _url('tag', 'update', 'id', $tag->id()) ?>" class="configure open-slider" title="<?= _t('gen.action.manage') ?>">
+				<?= _i('configure') ?>
+			</a>
+			<?= $tag->name() ?>
+		</li>
 	<?php endforeach; ?>
 	</ul>
 	<?php endif; ?>
 </main>
+
+<?php $class = isset($this->tag) ? ' active' : ''; ?>
+<aside id="slider" class="<?= $class ?>">
+	<a class="toggle_aside" href="#close"><img class="icon" src="../themes/icons/close.svg" loading="lazy" alt="❌"></a>
+	<div id="slider-content">
+		<?php
+			if (isset($this->tag)) {
+				$this->renderHelper('tag/update');
+			}
+		?>
+	</div>
+</aside>
+<a href="#" id="close-slider">
+	<?= _i('close') ?>
+</a>
diff --git a/p/themes/base-theme/frss.css b/p/themes/base-theme/frss.css
index 3c6ec6159..58a6ac795 100644
--- a/p/themes/base-theme/frss.css
+++ b/p/themes/base-theme/frss.css
@@ -97,6 +97,22 @@ ul, ol, dd {
 	padding: 0;
 }
 
+ul.listInColumns {
+	column-count: 5;
+	column-width: 250px;
+	max-width: 1700px;
+}
+
+ul.listInColumns li {
+	white-space: nowrap;
+	text-overflow: ellipsis;
+	overflow: hidden;
+}
+
+#tagsList {
+	list-style: none;
+}
+
 /*=== Titles */
 h1 {
 	margin: 1rem 0 0.5rem;
diff --git a/p/themes/base-theme/frss.rtl.css b/p/themes/base-theme/frss.rtl.css
index a3982402f..6936af33a 100644
--- a/p/themes/base-theme/frss.rtl.css
+++ b/p/themes/base-theme/frss.rtl.css
@@ -97,6 +97,22 @@ ul, ol, dd {
 	padding: 0;
 }
 
+ul.listInColumns {
+	column-count: 5;
+	column-width: 250px;
+	max-width: 1700px;
+}
+
+ul.listInColumns li {
+	white-space: nowrap;
+	text-overflow: ellipsis;
+	overflow: hidden;
+}
+
+#tagsList {
+	list-style: none;
+}
+
 /*=== Titles */
 h1 {
 	margin: 1rem 0 0.5rem;