kjh2064/taxbaik
1
0
Fork 0
Code Issues 1 Pull Requests Actions Packages Projects Releases Wiki Activity

Standardize blog editor and content styles
TaxBaik CI/CD / build-and-deploy (push) Failing after 54s
Details

Browse Source
This commit is contained in:
김재현
2026-07-09 13:11:46 +09:00
parent 350be8e390
commit 98bb05a084
4 changed files with 124 additions and 50 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/TaxBaik.Web/Pages/Shared/_BlogEditor.cshtml
+21 -25
View File
@@ -1,6 +1,6 @@
@model TaxBaik.Web.Pages.Shared.BlogEditorModel
<section class="container-xl admin-page-shell admin-editor-root" data-blog-editor-root>
<section class="container-xl admin-page-shell admin-editor-root blog-editor-shell" data-blog-editor-root>
<div class="row g-3">
<div class="col-12">
<div class="page-header d-print-none mb-4">
@@ -27,19 +27,19 @@
<input class="form-control" id="Input_Title" name="Input.Title" value="@Model.Title" />
<span class="text-danger small" data-valmsg-for="Input.Title" data-valmsg-replace="true"></span>
</div>
<div class="mb-3">
<div class="mb-3 editor-block">
<label class="form-label">본문</label>
<div class="d-flex flex-wrap gap-2 admin-editor-toolbar">
<button type="button" class="btn btn-sm btn-outline-secondary" data-blog-command="bold">Bold</button>
<button type="button" class="btn btn-sm btn-outline-secondary" data-blog-command="italic">Italic</button>
<button type="button" class="btn btn-sm btn-outline-secondary" data-blog-command="insertUnorderedList">UL</button>
<button type="button" class="btn btn-sm btn-outline-secondary" data-blog-command="formatBlock" data-blog-value="h2">H2</button>
<button type="button" class="btn btn-sm btn-outline-secondary" data-blog-command="formatBlock" data-blog-value="blockquote">Quote</button>
<div class="editor-toolbar" role="toolbar" aria-label="블로그 편집 도구">
<button type="button" class="btn btn-sm btn-outline-secondary" data-blog-command="bold">굵게</button>
<button type="button" class="btn btn-sm btn-outline-secondary" data-blog-command="italic">기울임</button>
<button type="button" class="btn btn-sm btn-outline-secondary" data-blog-command="insertUnorderedList">목록</button>
<button type="button" class="btn btn-sm btn-outline-secondary" data-blog-command="formatBlock" data-blog-value="h2">제목 2</button>
<button type="button" class="btn btn-sm btn-outline-secondary" data-blog-command="formatBlock" data-blog-value="blockquote">인용</button>
</div>
<div class="form-control admin-editor-content" data-blog-editor contenteditable="true">@Html.Raw(Model.Content)</div>
<div class="form-hint text-muted small mt-2">HTML 태그는 그대로 저장되고 홈페이지에서 렌더링됩니다.</div>
<div class="editor-surface" data-blog-editor contenteditable="true" aria-label="블로그 본문 편집기">@Html.Raw(Model.Content)</div>
<div class="form-hint text-muted small mt-2">편집 결과는 HTML로 저장되고, 홈페이지에서도 같은 스타일 규칙으로 렌더링됩니다.</div>
</div>
<div class="row g-3">
<div class="row g-3 blog-meta-grid">
<div class="col-md-4">
<label class="form-label" for="Input_CategoryId">카테고리</label>
<input class="form-control" id="Input_CategoryId" name="Input.CategoryId" value="@Model.CategoryId" />
@@ -62,30 +62,26 @@
</div>
</div>
</div>
<div class="card-footer bg-white d-flex justify-content-between">
@if (Model.IsEdit)
{
<button class="btn btn-outline-danger" type="submit" formaction="@Model.DeleteAction" formmethod="post" onclick="return confirm('삭제하시겠습니까?');">삭제</button>
}
else
{
<a class="btn btn-outline-secondary" href="/admin/blog">취소</a>
}
<div class="d-flex gap-2">
<div class="card-footer bg-white d-flex flex-wrap justify-content-between gap-2">
<div class="d-flex flex-wrap gap-2">
@if (Model.IsEdit)
{
<a class="btn btn-outline-secondary" href="/admin/blog">취소</a>
<button class="btn btn-outline-danger" type="submit" formaction="@Model.DeleteAction" formmethod="post" onclick="return confirm('삭제하시겠습니까?');">삭제</button>
}
<button class="btn btn-primary" type="submit">저장</button>
<a class="btn btn-outline-secondary" href="/admin/blog">취소</a>
</div>
<button class="btn btn-primary" type="submit">저장</button>
</div>
</form>
</div>
<div class="col-lg-4">
<div class="card admin-page-card h-100">
<div class="card-header"><h3 class="card-title">미리보기</h3></div>
<div class="card-header d-flex align-items-center justify-content-between gap-2">
<h3 class="card-title mb-0">실시간 미리보기</h3>
<span class="badge bg-secondary-lt text-secondary">공통 스타일</span>
</div>
<div class="card-body">
<article class="markdown-body admin-editor-preview" data-blog-preview>@Html.Raw(Model.Content)</article>
<article class="content-prose blog-preview-pane" data-blog-preview>@Html.Raw(Model.Content)</article>
</div>
</div>
</div>