From 1582e9e84cc0ee975e50ae8dfbd3ee9d7134b6ac Mon Sep 17 00:00:00 2001
From: king <heoseungpil@gmail.com>
Date: Thu, 17 Sep 2026 14:53:17 +0900
Subject: [PATCH] =?UTF-8?q?fix(project):=20=EB=82=B4=20=EC=97=85=EB=AC=B4?=
 =?UTF-8?q?=20=ED=8C=A8=EB=84=90=20=EA=B0=9C=EC=88=98=20=EB=B0=B0=EC=A7=80?=
 =?UTF-8?q?=EB=A5=BC=20=ED=94=84=EB=A1=9C=EC=A0=9D=ED=8A=B8=20=EC=9D=B4?=
 =?UTF-8?q?=EB=A6=84=20=EC=95=84=EB=9E=98=20=EC=A4=84=EB=A1=9C=20=EC=9D=B4?=
 =?UTF-8?q?=EB=8F=99?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- 이름과 같은 줄에서 폭을 다투다 이름이 2줄로 꺾이던 문제 수정 — 이름
  span 을 flex:1 로 만들어 실제 컨테이너 폭에 맞춰 한 줄 말줄임표 처리.
  (헤드리스 크롬으로 긴 이름 강제 렌더해 width/scrollWidth/offsetHeight
  실측 확인 — 한 줄 유지됨)
- 개수 배지를 .pj-mytree-tasks(접히는 업무 목록)의 형제로 옮겨 폴더를
  접어도 계속 보이게 함

Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
---
 app/modules/project/templates/project/inbox.html   |  2 +-
 app/modules/project/templates/project/index.html   | 14 ++++++++------
 app/modules/project/templates/project/project.html | 14 ++++++++------
 app/static/project.css                             |  8 ++++++--
 4 files changed, 23 insertions(+), 15 deletions(-)

diff --git a/app/modules/project/templates/project/inbox.html b/app/modules/project/templates/project/inbox.html
index 59839b8..cd71ca6 100644
--- a/app/modules/project/templates/project/inbox.html
+++ b/app/modules/project/templates/project/inbox.html
@@ -1,7 +1,7 @@
 {% extends "erp_base.html" %}
 
 {% block head_extra %}
-<link rel="stylesheet" href="/static/project.css?v=20260917w" />
+<link rel="stylesheet" href="/static/project.css?v=20260917x" />
 <link rel="stylesheet" href="/static/vendor/material-symbols/material-symbols.css" />
 {% endblock %}
 
diff --git a/app/modules/project/templates/project/index.html b/app/modules/project/templates/project/index.html
index 0255bcd..5c45313 100644
--- a/app/modules/project/templates/project/index.html
+++ b/app/modules/project/templates/project/index.html
@@ -1,7 +1,7 @@
 {% extends "erp_base.html" %}
 
 {% block head_extra %}
-<link rel="stylesheet" href="/static/project.css?v=20260917w" />
+<link rel="stylesheet" href="/static/project.css?v=20260917x" />
 <link rel="stylesheet" href="/static/vendor/material-symbols/material-symbols.css" />
 {% endblock %}
 
@@ -156,11 +156,13 @@
             <a class="pj-mytree-proj" href="/project/p/{{ p.id }}">
               <span class="pj-mytree-proj-name">{{ p.name }}</span>
             </a>
-            <span class="pj-mytree-counts">
-              <span class="pj-mtc">전체<span class="pj-mtc-num pj-mtc-total">{{ p.total }}</span></span>
-              <span class="pj-mtc">진행<span class="pj-mtc-num pj-mtc-open">{{ p.open }}</span></span>
-              <span class="pj-mtc">완료<span class="pj-mtc-num pj-mtc-done">{{ p.done }}</span></span>
-            </span>
+          </div>
+          <!-- 폴더를 접어도(is-collapsed 는 .pj-mytree-tasks 만 숨김) 계속 보이도록
+               업무 목록과 별개 형제로 둔다. -->
+          <div class="pj-mytree-counts">
+            <span class="pj-mtc">전체<span class="pj-mtc-num pj-mtc-total">{{ p.total }}</span></span>
+            <span class="pj-mtc">진행<span class="pj-mtc-num pj-mtc-open">{{ p.open }}</span></span>
+            <span class="pj-mtc">완료<span class="pj-mtc-num pj-mtc-done">{{ p.done }}</span></span>
           </div>
           <ul class="pj-mytree-tasks">
             {% for t in p.tasks %}
diff --git a/app/modules/project/templates/project/project.html b/app/modules/project/templates/project/project.html
index bb6dcf7..b660d2d 100644
--- a/app/modules/project/templates/project/project.html
+++ b/app/modules/project/templates/project/project.html
@@ -1,7 +1,7 @@
 {% extends "erp_base.html" %}
 
 {% block head_extra %}
-<link rel="stylesheet" href="/static/project.css?v=20260917w" />
+<link rel="stylesheet" href="/static/project.css?v=20260917x" />
 <!-- 구글 머티리얼 심볼(담당자 아이콘 등) — self-host -->
 <link rel="stylesheet" href="/static/vendor/material-symbols/material-symbols.css" />
 <!-- 타임라인 vis-timeline — self-host -->
@@ -207,11 +207,13 @@
             <a class="pj-mytree-proj" href="/project/p/{{ p.id }}">
               <span class="pj-mytree-proj-name">{{ p.name }}</span>
             </a>
-            <span class="pj-mytree-counts">
-              <span class="pj-mtc">전체<span class="pj-mtc-num pj-mtc-total">{{ p.total }}</span></span>
-              <span class="pj-mtc">진행<span class="pj-mtc-num pj-mtc-open">{{ p.open }}</span></span>
-              <span class="pj-mtc">완료<span class="pj-mtc-num pj-mtc-done">{{ p.done }}</span></span>
-            </span>
+          </div>
+          <!-- 폴더를 접어도(is-collapsed 는 .pj-mytree-tasks 만 숨김) 계속 보이도록
+               업무 목록과 별개 형제로 둔다. -->
+          <div class="pj-mytree-counts">
+            <span class="pj-mtc">전체<span class="pj-mtc-num pj-mtc-total">{{ p.total }}</span></span>
+            <span class="pj-mtc">진행<span class="pj-mtc-num pj-mtc-open">{{ p.open }}</span></span>
+            <span class="pj-mtc">완료<span class="pj-mtc-num pj-mtc-done">{{ p.done }}</span></span>
           </div>
           <ul class="pj-mytree-tasks">
             {% for t in p.tasks %}
diff --git a/app/static/project.css b/app/static/project.css
index cc82cdf..cd58d00 100644
--- a/app/static/project.css
+++ b/app/static/project.css
@@ -406,8 +406,12 @@
 .pj-mytree-toggle:hover { background: #f1f2f4; }
 .pj-mytree-proj { display: flex; align-items: center; gap: 7px; text-decoration: none; color: #1e1f21; font-weight: 700; font-size: 13.5px; padding: 4px 2px; border-radius: 7px; flex: 1 1 auto; min-width: 0; }
 .pj-mytree-proj:hover { background: #f6f7f8; }
-/* 프로젝트 이름 오른쪽 — 전체/진행/완료 개수(숫자는 색깔 있는 동그라미 안에) */
-.pj-mytree-counts { display: flex; align-items: center; gap: 7px; flex: 0 0 auto; padding-right: 4px; }
+/* 긴 이름이 밀려도 2줄로 안 꺾이게 — 말줄임표로. */
+.pj-mytree-proj-name { display: block; flex: 1 1 auto; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
+/* 프로젝트 이름 "아래" 줄에 전체/진행/완료 개수(숫자는 색깔 있는 동그라미 안에).
+   .pj-mytree-tasks(업무 목록)와 형제라 폴더를 접어도(is-collapsed) 계속 보인다.
+   왼쪽 여백은 토글 버튼 폭(26px)만큼 줘서 프로젝트 이름과 줄을 맞춘다. */
+.pj-mytree-counts { display: flex; align-items: center; gap: 7px; margin: 1px 0 4px 26px; }
 .pj-mtc { display: inline-flex; align-items: center; gap: 3px; font-size: 10.5px; color: #9aa1a9; font-weight: 600; }
 .pj-mtc-num {
   display: inline-flex; align-items: center; justify-content: center;