fix(project): 설명란 이미지 버튼을 이모지 대신 material-symbols 아이콘으로
🖼️ 이모지가 브라우저마다 색이 진하고 크기가 커서 옆 B/I/U 버튼들과 줄이 안 맞고 튀어 보였다. 이미 쓰고 있는 material-symbols-outlined 폰트의 "image" 아이콘으로 교체하고 16px로 맞춰 다른 서식 버튼과 높이/정렬이 같아지게 함. Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
This commit is contained in:
@@ -1,7 +1,7 @@
|
|||||||
{% extends "erp_base.html" %}
|
{% extends "erp_base.html" %}
|
||||||
|
|
||||||
{% block head_extra %}
|
{% block head_extra %}
|
||||||
<link rel="stylesheet" href="/static/project.css?v=20260917b" />
|
<link rel="stylesheet" href="/static/project.css?v=20260917c" />
|
||||||
<link rel="stylesheet" href="/static/vendor/material-symbols/material-symbols.css" />
|
<link rel="stylesheet" href="/static/vendor/material-symbols/material-symbols.css" />
|
||||||
{% endblock %}
|
{% endblock %}
|
||||||
|
|
||||||
|
|||||||
@@ -1,7 +1,7 @@
|
|||||||
{% extends "erp_base.html" %}
|
{% extends "erp_base.html" %}
|
||||||
|
|
||||||
{% block head_extra %}
|
{% block head_extra %}
|
||||||
<link rel="stylesheet" href="/static/project.css?v=20260917b" />
|
<link rel="stylesheet" href="/static/project.css?v=20260917c" />
|
||||||
<link rel="stylesheet" href="/static/vendor/material-symbols/material-symbols.css" />
|
<link rel="stylesheet" href="/static/vendor/material-symbols/material-symbols.css" />
|
||||||
{% endblock %}
|
{% endblock %}
|
||||||
|
|
||||||
@@ -307,7 +307,7 @@
|
|||||||
<button type="button" class="pj-desc-fmtbtn" data-cmd="createLink" title="링크 삽입">🔗</button>
|
<button type="button" class="pj-desc-fmtbtn" data-cmd="createLink" title="링크 삽입">🔗</button>
|
||||||
<button type="button" class="pj-desc-fmtbtn" data-cmd="removeFormat" title="서식 지우기">✕서식</button>
|
<button type="button" class="pj-desc-fmtbtn" data-cmd="removeFormat" title="서식 지우기">✕서식</button>
|
||||||
<span class="pj-desc-fmtsep"></span>
|
<span class="pj-desc-fmtsep"></span>
|
||||||
<label class="pj-desc-fmtbtn" id="pj-desc-imgbtn" title="이미지 추가">🖼️<input type="file" id="pj-desc-img-input" accept="image/*" hidden /></label>
|
<label class="pj-desc-fmtbtn" id="pj-desc-imgbtn" title="이미지 추가"><span class="material-symbols-outlined">image</span><input type="file" id="pj-desc-img-input" accept="image/*" hidden /></label>
|
||||||
</div>
|
</div>
|
||||||
<div class="pj-desc-wrap">
|
<div class="pj-desc-wrap">
|
||||||
<div class="pj-desc-editor" id="pj-t-desc" contenteditable="true" data-placeholder="설명을 입력하세요… (이미지는 붙여넣기 또는 위 버튼으로 추가)"></div>
|
<div class="pj-desc-editor" id="pj-t-desc" contenteditable="true" data-placeholder="설명을 입력하세요… (이미지는 붙여넣기 또는 위 버튼으로 추가)"></div>
|
||||||
|
|||||||
@@ -1,7 +1,7 @@
|
|||||||
{% extends "erp_base.html" %}
|
{% extends "erp_base.html" %}
|
||||||
|
|
||||||
{% block head_extra %}
|
{% block head_extra %}
|
||||||
<link rel="stylesheet" href="/static/project.css?v=20260917b" />
|
<link rel="stylesheet" href="/static/project.css?v=20260917c" />
|
||||||
<!-- 구글 머티리얼 심볼(담당자 아이콘 등) — self-host -->
|
<!-- 구글 머티리얼 심볼(담당자 아이콘 등) — self-host -->
|
||||||
<link rel="stylesheet" href="/static/vendor/material-symbols/material-symbols.css" />
|
<link rel="stylesheet" href="/static/vendor/material-symbols/material-symbols.css" />
|
||||||
<!-- 타임라인 vis-timeline — self-host -->
|
<!-- 타임라인 vis-timeline — self-host -->
|
||||||
@@ -294,7 +294,7 @@
|
|||||||
<button type="button" class="pj-desc-fmtbtn" data-cmd="createLink" title="링크 삽입">🔗</button>
|
<button type="button" class="pj-desc-fmtbtn" data-cmd="createLink" title="링크 삽입">🔗</button>
|
||||||
<button type="button" class="pj-desc-fmtbtn" data-cmd="removeFormat" title="서식 지우기">✕서식</button>
|
<button type="button" class="pj-desc-fmtbtn" data-cmd="removeFormat" title="서식 지우기">✕서식</button>
|
||||||
<span class="pj-desc-fmtsep"></span>
|
<span class="pj-desc-fmtsep"></span>
|
||||||
<label class="pj-desc-fmtbtn" id="pj-desc-imgbtn" title="이미지 추가">🖼️<input type="file" id="pj-desc-img-input" accept="image/*" hidden /></label>
|
<label class="pj-desc-fmtbtn" id="pj-desc-imgbtn" title="이미지 추가"><span class="material-symbols-outlined">image</span><input type="file" id="pj-desc-img-input" accept="image/*" hidden /></label>
|
||||||
</div>
|
</div>
|
||||||
<div class="pj-desc-wrap">
|
<div class="pj-desc-wrap">
|
||||||
<div class="pj-desc-editor" id="pj-t-desc" contenteditable="true" data-placeholder="설명을 입력하세요… (이미지는 붙여넣기 또는 위 버튼으로 추가)"></div>
|
<div class="pj-desc-editor" id="pj-t-desc" contenteditable="true" data-placeholder="설명을 입력하세요… (이미지는 붙여넣기 또는 위 버튼으로 추가)"></div>
|
||||||
|
|||||||
@@ -606,6 +606,10 @@
|
|||||||
}
|
}
|
||||||
.pj-desc-fmtbtn:hover { background: #f1f2f4; }
|
.pj-desc-fmtbtn:hover { background: #f1f2f4; }
|
||||||
.pj-desc-fmtbtn.is-active { background: var(--pj-accent-tint); border-color: var(--pj-accent); color: var(--pj-accent-dark); }
|
.pj-desc-fmtbtn.is-active { background: var(--pj-accent-tint); border-color: var(--pj-accent); color: var(--pj-accent-dark); }
|
||||||
|
/* 이미지 추가 버튼(label)도 다른 버튼과 같은 높이/굵기로 — material-symbols
|
||||||
|
기본 24px 아이콘을 그대로 두면 이 버튼만 커 보이고 줄도 어긋난다. */
|
||||||
|
.pj-desc-fmtbtn .material-symbols-outlined { font-size: 16px; line-height: 1; }
|
||||||
|
label.pj-desc-fmtbtn { line-height: 26px; }
|
||||||
.pj-desc-fmtsep { width: 1px; height: 16px; background: #e2e4ea; margin: 0 4px; }
|
.pj-desc-fmtsep { width: 1px; height: 16px; background: #e2e4ea; margin: 0 4px; }
|
||||||
.pj-desc-editor {
|
.pj-desc-editor {
|
||||||
min-height: 64px; max-height: 260px; overflow-y: auto; padding: 8px 10px;
|
min-height: 64px; max-height: 260px; overflow-y: auto; padding: 8px 10px;
|
||||||
|
|||||||
Reference in New Issue
Block a user