Updated blog admin styles.

parpalak · Mar 28, 2024 · 02c16d3 · 02c16d3
1 parent 48d918a
commit 02c16d3
Show file tree

Hide file tree

Showing 6 changed files with 67 additions and 47 deletions.
diff --git a/_extensions/s2_blog/admin.css b/_extensions/s2_blog/admin.css
@@ -1,38 +1,29 @@
-.bitbtn.add_post, #blog_tab:before, .sort .buttons .favorite, .sort .buttons .notfavorite {
-	background-image: url(data:image/png;base64,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);
+.sort .buttons .favorite:before {
+	content: '★';
+	color: #ffbf00;
+	font-size: 20px;
+	line-height: 16px;
+	}
+.sort .buttons .notfavorite:before {
+	content: '☆';
+	font-size: 20px;
+	line-height: 16px;
 	}
-
 .find_posts:before {
 	content: '🔍';
 	vertical-align: -1px;
 	padding: 0 1px;
 	}
-
-#blog_tab:before {
-	background-position: 0 -32px;
-	}
-
-.sort .buttons .favorite {
-	background-position: 0 -16px;
-	}
-.sort .buttons .notfavorite {
-	background-position: 0 0;
+.add_post:before {
+	content: '➕';
+	vertical-align: -1px;
+	padding: 0 1px;
 	}
 
-.tags_list span {
-	color: #fff;
-	font-weight: bold;
-	background: #093;
-	}
-	.tags_list span:not(:empty) {
-		-moz-border-radius: 4px;
-		-webkit-border-radius: 4px;
-		border-radius: 4px;
-		padding: 0 1px;
-		}
-
-.bitbtn.add_post {
-	background-position: 1px -51px;
+#blog_tab:before {
+	content: '📄';
+	background: none;
+	margin: 0 4px 0 0;
 	}
 
 #blog_wrapper {
@@ -47,4 +38,30 @@
 .s2_blog_tags,
 .s2_blog_label {
 	white-space: nowrap;
+	}
+
+.hidden .s2_blog_title {
+	text-decoration-line: line-through;
+	}
+
+.s2_blog_title_cell {
+	display: flex;
+	text-overflow: ellipsis;
+	overflow: hidden;
+	margin-right: 1em;
+	}
+	.s2_blog_title {
+		flex: 0 0 auto;
+		}
+	.s2_blog_text_extra {
+		margin: 0 0 0 2em;
+		color: #b4b4b4;
+		white-space: nowrap;
+		flex: 1 1 auto;
+		max-width: 10vw;
+		}
+
+
+@media screen and (max-width: 850px) {
+	.s2_blog_text_extra {display: none;}
 	}
diff --git a/_extensions/s2_blog/blog.js b/_extensions/s2_blog/blog.js
@@ -73,13 +73,11 @@ function ToggleFavBlog (eItem, iId)
 {
 	GETAsyncRequest(sUrl + "action=flip_favorite_post&id=" + iId, function (http)
 	{
-		var temp = eItem.getAttribute('data-class');
-		eItem.setAttribute('data-class', eItem.getAttribute('class'));
-		eItem.setAttribute('class', temp);
+		eItem.classList.toggle('favorite');
+		eItem.classList.toggle('notfavorite');
 
-		temp = eItem.getAttribute('data-alt');
-		eItem.setAttribute('data-alt', eItem.getAttribute('alt'));
-		eItem.setAttribute('alt', temp);
+		temp = eItem.getAttribute('data-title');
+		eItem.setAttribute('data-title', eItem.getAttribute('title'));
 		eItem.setAttribute('title', temp);
 	});
 	return false;

diff --git a/_extensions/s2_blog/blog_lib.php b/_extensions/s2_blog/blog_lib.php
@@ -541,7 +541,7 @@ function s2_blog_output_post_list ($criteria)
 	$raw_sub_query = $s2_db->build($sub_query);
 
 	$query = array(
-		'SELECT'	=> 'id, title, published, commented, ('.$raw_sub_query.') as comment_count, create_time, label, favorite, user_id',
+		'SELECT'	=> 'id, title, published, commented, ('.$raw_sub_query.') as comment_count, create_time, label, favorite, user_id, SUBSTR(text, 1, 200) AS text',
 		'FROM'		=> 's2_blog_posts AS p',
 		'WHERE'		=> $condition,
 		'ORDER BY'	=> 'create_time DESC'
@@ -581,7 +581,7 @@ function s2_blog_output_post_list ($criteria)
 
 			$buttons = array();
 			if ($s2_user['edit_site'])
-				$buttons['favorite'] = '<img class="'.($row['favorite'] ? 'favorite' : 'notfavorite').'" data-class="'.(!$row['favorite'] ? 'favorite' : 'notfavorite').'" src="i/1.gif" alt="'.($row['favorite'] ? Lang::get('Undo favorite', 's2_blog') : Lang::get('Do favorite', 's2_blog')).'" data-alt="'.(!$row['favorite'] ? Lang::get('Undo favorite', 's2_blog') : Lang::get('Do favorite', 's2_blog')).'" onclick="return ToggleFavBlog(this, '.$row['id'].');">';
+				$buttons['favorite'] = '<button class="icon-button '.($row['favorite'] ? 'favorite' : 'notfavorite').'" data-class="'.(!$row['favorite'] ? 'favorite' : 'notfavorite').'" title="'.($row['favorite'] ? Lang::get('Undo favorite', 's2_blog') : Lang::get('Do favorite', 's2_blog')).'" data-title="'.(!$row['favorite'] ? Lang::get('Undo favorite', 's2_blog') : Lang::get('Do favorite', 's2_blog')).'" onclick="return ToggleFavBlog(this, '.$row['id'].');"></button>';
 			if ($s2_user['edit_site'] || $s2_user['id'] == $row['user_id'])
 				$buttons['delete'] = '<img class="delete" src="i/1.gif" alt="'.$lang_admin['Delete'].'" onclick="return DeleteRecord(this, '.$row['id'].', \''.s2_htmlencode(addslashes(sprintf(Lang::get('Delete warning', 's2_blog'), $row['title']))).'\');">';
 
@@ -593,10 +593,23 @@ function s2_blog_output_post_list ($criteria)
 
 			($hook = s2_hook('fn_s2_blog_output_post_list_pre_row_mrg')) ? eval($hook) : null;
 
-			$body .= '<tr'.$class.'><td><a href="#" onclick="return EditRecord('.$row['id'].'); ">'.s2_htmlencode($row['title']).'</a></td><td class="s2_blog_date">'.$date.'</td><td class="s2_blog_tags">'.$tags.'</td><td class="s2_blog_label">'.$row['label'].'</td><td>'.$comment.'</td><td>'.$buttons.'</td></tr>';
+            $body .= '<tr' . $class . '>' .
+                '<td class="s2_blog_title_cell"><a class="s2_blog_title" href="#" onclick="return EditRecord(' . $row['id'] . '); ">' . s2_htmlencode($row['title']) . '</a><span class="s2_blog_text_extra">' . s2_htmlencode(strip_tags($row['text'])) . '</td>' .
+                '<td class="s2_blog_date">' . $date . '</td>' .
+                '<td class="s2_blog_tags">' . $tags . '</td>' .
+                '<td class="s2_blog_label">' . $row['label'] . '</td>' .
+                '<td>' . $comment . '</td>' .
+                '<td>' . $buttons . '</td>' .
+                '</tr>';
 		}
 
-		echo '<table width="100%" class="sort"><thead><tr><td class="sortable">'.Lang::get('Post', 's2_blog').'</td><td width="80" class="sortable curcol_up">'.$lang_admin['Date'].'</td><td width="20%" class="sortable">'.Lang::get('Tags').'</td><td width="5%" class="sortable">'.Lang::get('Label', 's2_blog').'</td><td width="36" class="sortable">'.Lang::get('Comments').'</td><td width="36">&nbsp;</td></tr></thead><tbody>'.$body.'</tbody></table>';
+        echo '<table width="100%" class="sort"><thead class="sticky"><tr>' .
+            '<td class="sortable">' . Lang::get('Post', 's2_blog') . '</td>' .
+            '<td width="80" class="sortable curcol_up">' . $lang_admin['Date'] . '</td>' .
+            '<td width="20%" class="sortable">' . Lang::get('Tags') . '</td>' .
+            '<td width="5%" class="sortable">' . Lang::get('Label', 's2_blog') . '</td>' .
+            '<td width="36" class="sortable">' . Lang::get('Comments') . '</td>' . '<td width="36">&nbsp;</td>' .
+            '</tr></thead><tbody>' . $body . '</tbody></table>';
 	}
 	else
 		echo '<div class="info-box"><p>'.Lang::get('No posts found', 's2_blog').'</p></div>';

diff --git a/_extensions/s2_blog/hooks/ai_pre_edit.php b/_extensions/s2_blog/hooks/ai_pre_edit.php
@@ -30,7 +30,7 @@
 							<td><input style="width: 10em;" type="text" name="posts[start_time]" size="20" value="" /></td>
 							<td class="label"><?php echo Lang::get('Search label', 's2_blog'); ?></td>
 							<td><input type="text" name="posts[text]" size="40" value="" /></td>
-							<td align="right"><input class="bitbtn add_post" name="button" type="button" value="<?php echo Lang::get('Create new', 's2_blog'); ?>" onclick="return CreateBlankRecord();" /></td>
+                            <td></td>
 						</tr>
 						<tr>
 							<td class="label"><?php echo Lang::get('End time', 's2_blog'); ?></td>
@@ -44,7 +44,7 @@
 							<td><input style="width: 10em;" type="text" name="posts[author]" size="20" value="" /></td>
 							<td style="padding-left: 0.5em;"><label><input type="checkbox" name="posts[hidden]" value="1" checked="checked" /><?php echo Lang::get('Only hidden', 's2_blog'); ?></label></td>
                             <td><button class="find_posts long-button" name="button" type="submit" onclick="return LoadPosts();"><?php echo Lang::get('Show posts', 's2_blog'); ?></button></td>
-							<td></td>
+                            <td align="right"><button class="add_post long-button" name="button" type="button" onclick="return CreateBlankRecord();"><?php echo Lang::get('Create new', 's2_blog'); ?></button></td>
 						</tr>
 					</table>
 				</form>

diff --git a/_extensions/s2_blog/i/icons.png b/_extensions/s2_blog/i/icons.png
diff --git a/_extensions/s2_blog/i/index.html b/_extensions/s2_blog/i/index.html