minhnhat/cms.uldp.edu.vn
1
0
Fork 0
forked from UKSOURCE/cms.hailearning.edu.vn
Code Pull Requests Activity

fix: Improve formatting and spacing in blog edit and index pages

Browse Source
This commit is contained in:
Wini_Fy
2026-02-03 17:04:54 +07:00
parent 538317eade
commit 8ceb5684e4
2 changed files with 137 additions and 127 deletions
Download Patch File Download Diff File Expand all files Collapse all files

66
views/admin/blog/edit.ejs
View File

@@ -211,28 +211,30 @@
<label class="form-label fw-medium">Categories</label> <label class="form-label fw-medium">Categories</label>
<div class="d-flex gap-2 mb-2"> <div class="d-flex gap-2 mb-2">
<input type="text" class="form-control form-control-sm" <input type="text" class="form-control form-control-sm"
id="newCategoryInput" id="newCategoryInput" placeholder="Enter new category name">
placeholder="Enter new category name">
<button type="button" class="btn btn-sm btn-outline-primary" <button type="button" class="btn btn-sm btn-outline-primary"
id="addCategoryBtn"> id="addCategoryBtn">
<i class="fas fa-plus me-1"></i>Add <i class="fas fa-plus me-1"></i>Add
</button> </button>
</div> </div>
<div class="form-check-group" id="categoriesContainer" style="max-height: 300px; overflow-y: auto;"> <div class="form-check-group" id="categoriesContainer"
style="max-height: 300px; overflow-y: auto;">
<% categories.forEach(category=> { %> <% categories.forEach(category=> { %>
<div class="form-check d-flex align-items-center justify-content-between mb-2" data-category-id="<%= category._id %>"> <div class="form-check d-flex align-items-center justify-content-between mb-2"
data-category-id="<%= category._id %>">
<div class="d-flex align-items-center"> <div class="d-flex align-items-center">
<input class="form-check-input" type="checkbox" <input class="form-check-input" type="checkbox"
name="category" value="<%= category.name %>" name="category" value="<%= category.name %>"
id="category_<%= category._id %>" <%=blog.category && id="category_<%= category._id %>" <%=blog.category
blog.category.includes(category.name) ? 'checked' : '' && blog.category.includes(category.name) ? 'checked'
%>> : '' %>>
<label class="form-check-label ms-2" <label class="form-check-label ms-2"
for="category_<%= category._id %>"> for="category_<%= category._id %>">
<%= category.name %> <%= category.name %>
</label> </label>
</div> </div>
<button type="button" class="btn btn-sm btn-outline-danger delete-category-btn" <button type="button"
class="btn btn-sm btn-outline-danger delete-category-btn"
data-category-id="<%= category._id %>" data-category-id="<%= category._id %>"
data-category-name="<%= category.name %>" data-category-name="<%= category.name %>"
title="Delete category"> title="Delete category">
@@ -241,7 +243,8 @@
</div> </div>
<% }); %> <% }); %>
</div> </div>
<div class="form-text">Select one or more categories for this blog post.</div> <div class="form-text">Select one or more categories for this blog post.
</div>
</div> </div>
<!-- Tags Column --> <!-- Tags Column -->
@@ -249,29 +252,31 @@
<label class="form-label fw-medium">Tags</label> <label class="form-label fw-medium">Tags</label>
<div class="d-flex gap-2 mb-2"> <div class="d-flex gap-2 mb-2">
<input type="text" class="form-control form-control-sm" <input type="text" class="form-control form-control-sm"
id="newTagInput" id="newTagInput" placeholder="Enter new tag name">
placeholder="Enter new tag name">
<button type="button" class="btn btn-sm btn-outline-primary" <button type="button" class="btn btn-sm btn-outline-primary"
id="addTagBtn"> id="addTagBtn">
<i class="fas fa-plus me-1"></i>Add <i class="fas fa-plus me-1"></i>Add
</button> </button>
</div> </div>
<div class="form-check-group" id="tagsContainer" style="max-height: 300px; overflow-y: auto;"> <div class="form-check-group" id="tagsContainer"
style="max-height: 300px; overflow-y: auto;">
<% tags.forEach(tag=> { %> <% tags.forEach(tag=> { %>
<div class="form-check d-flex align-items-center justify-content-between mb-2" data-tag-id="<%= tag._id %>"> <div class="form-check d-flex align-items-center justify-content-between mb-2"
data-tag-id="<%= tag._id %>">
<div class="d-flex align-items-center"> <div class="d-flex align-items-center">
<input class="form-check-input" type="checkbox" name="tags" <input class="form-check-input" type="checkbox"
value="<%= tag.name %>" id="tag_<%= tag._id %>" name="tags" value="<%= tag.name %>"
<%=blog.tags && blog.tags.includes(tag.name) ? 'checked' id="tag_<%= tag._id %>" <%=blog.tags &&
: '' %>> blog.tags.includes(tag.name) ? 'checked' : '' %>>
<label class="form-check-label ms-2" for="tag_<%= tag._id %>"> <label class="form-check-label ms-2"
for="tag_<%= tag._id %>">
<%= tag.name %> <%= tag.name %>
</label> </label>
</div> </div>
<button type="button" class="btn btn-sm btn-outline-danger delete-tag-btn" <button type="button"
class="btn btn-sm btn-outline-danger delete-tag-btn"
data-tag-id="<%= tag._id %>" data-tag-id="<%= tag._id %>"
data-tag-name="<%= tag.name %>" data-tag-name="<%= tag.name %>" title="Delete tag">
title="Delete tag">
<i class="fas fa-trash"></i> <i class="fas fa-trash"></i>
</button> </button>
</div> </div>
@@ -314,7 +319,8 @@
Mark as Featured Post Mark as Featured Post
</label> </label>
</div> </div>
<div class="form-text">Featured posts can be highlighted on the blog page.</div> <div class="form-text">Featured posts can be highlighted on the blog
page.</div>
</div> </div>
</div> </div>
</div> </div>
@@ -902,8 +908,8 @@
</script> </script>
<!-- Delete Category Confirmation Modal --> <!-- Delete Category Confirmation Modal -->
<div class="modal fade" id="deleteCategoryModal" tabindex="-1" aria-labelledby="deleteCategoryModalLabel" aria-hidden="true" <div class="modal fade" id="deleteCategoryModal" tabindex="-1" aria-labelledby="deleteCategoryModalLabel"
data-bs-backdrop="true" data-bs-keyboard="true"> aria-hidden="true" data-bs-backdrop="true" data-bs-keyboard="true">
<div class="modal-dialog modal-dialog-centered"> <div class="modal-dialog modal-dialog-centered">
<div class="modal-content"> <div class="modal-content">
<div class="modal-header bg-danger text-white"> <div class="modal-header bg-danger text-white">
@@ -914,7 +920,8 @@
aria-label="Close"></button> aria-label="Close"></button>
</div> </div>
<div class="modal-body"> <div class="modal-body">
<p>Are you sure you want to delete the category "<span id="deleteCategoryName" class="fw-bold"></span>"?</p> <p>Are you sure you want to delete the category "<span id="deleteCategoryName" class="fw-bold"></span>"?
</p>
<p class="text-danger mb-0"> <p class="text-danger mb-0">
<small> <small>
<i class="fas fa-exclamation-triangle me-1"></i>This action cannot be undone.</small> <i class="fas fa-exclamation-triangle me-1"></i>This action cannot be undone.</small>
@@ -961,16 +968,19 @@
<style> <style>
/* Fix modal z-index */ /* Fix modal z-index */
#deleteCategoryModal, #deleteTagModal { #deleteCategoryModal,
#deleteTagModal {
z-index: 2050 !important; z-index: 2050 !important;
} }
#deleteCategoryModal .modal-content, #deleteTagModal .modal-content { #deleteCategoryModal .modal-content,
#deleteTagModal .modal-content {
z-index: 2070 !important; z-index: 2070 !important;
position: relative; position: relative;
} }
#deleteCategoryModal.show, #deleteTagModal.show { #deleteCategoryModal.show,
#deleteTagModal.show {
display: block !important; display: block !important;
} }
</style> </style>