Kyeongmin/C.E.L_Slide_test2
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Add Type B slide pipeline and recipe rendering updates

Browse Source
This commit is contained in:
이경민
2026-04-15 16:39:50 +09:00
parent 51548fdc41
commit 66c00924ed
22 changed files with 6260 additions and 1322 deletions
Download Patch File Download Diff File Expand all files Collapse all files

307
samples/src/components/dx.astro Normal file
View File

@@ -0,0 +1,307 @@
---
/* [dx2.astro] 격식 있는 비교표 스타일 */
---
<div class="table-wrapper">
<table class="formal-table">
<colgroup>
<col width="13%" />
<col width="29%" />
<col width="29%" />
<col width="30%" />
</colgroup>
<thead>
<tr>
<th class="category-header">구분</th>
<th class="stakeholder-header client">발주자</th>
<th class="stakeholder-header contractor">시공자</th>
<th class="stakeholder-header designer">설계자</th>
</tr>
</thead>
<tbody>
<tr class="highlight-row">
<td class="category-cell"><strong>필요 역량</strong></td>
<td class="center-text">실행 의지와 합리적 판단 역량</td>
<td class="center-text">기술 투자와 운영 역량</td>
<td class="center-text">기술개발 투자에 의한 S/W 역량</td>
</tr>
<tr>
<td class="category-cell"
>수작업 의존 <br />→<br /> S/W 기반 체계화</td
>
<td>
<ul>
<li>
행정서류 자동 생성 및 최소화로 <strong
>업무 생산성 향상</strong
>
</li>
<li>
건설기간 단축, 건설비 및 유지관리비 <strong
>총비용 최소화</strong
>
</li>
</ul>
</td>
<td>
<ul>
<li>
체계적 공정/자원 관리를 통한 <strong
>신뢰성 확보 및 생산성 향상</strong
>
</li>
<li>
Model에서의 도면 추출로 쉽고 정확한
<strong>시공상세도 작성 용이</strong>
</li>
<li>
시스템 구축 시, 품질·안전·관리 등에 필요한
<strong>도서 작성 용이</strong>
</li>
</ul>
</td>
<td>
<ul>
<li>
SW기반 설계프로세스 체계화로 <strong
>설계 생산성 향상</strong
>
</li>
<li>
프로젝트 정보의 일관 유지 및 관리를 통한 <strong
>오류 최소화</strong
>
</li>
<li>
다양한 성과물과 정보물 활용으로 추가 <strong
>부가가치 창출</strong
>
</li>
</ul>
</td>
</tr>
<tr>
<td class="category-cell">2D<br />→<br />3D 기반 인지·검토</td>
<td>
<ul>
<li>
3D 모델을 통한 직관적 시각화로 <strong
>품질 향상 및 안전성 제고</strong
>
</li>
<li>
건설단계별 수행상태에 대한 쉬운 이해로 관리 <strong
>편의성 증대</strong
>
</li>
</ul>
</td>
<td>
<ul>
<li style="letter-spacing: -0.9px;">
직관적 시각화로 계획시공 등을 관리하여 <strong
>안전성 제고 및 품질 향상</strong
>
</li>
<li>
중간태, 완성태 측량을 통한<br />시·공간적 관리의 <strong
>편리성 향상</strong
>
</li>
</ul>
</td>
<td>
<ul>
<li>
3D 모델을 통한 확인/검증으로 설계
<strong>오류 최소화 및 Claim 예방</strong>
</li>
</ul>
</td>
</tr>
<tr>
<td class="category-cell"
>문서 중심<br />→<br />데이터 통합 기반 협업</td
>
<td>
<ul>
<li>
현장 실무자와 발주자의 원활한 의사소통으로 <strong
>오류 최소화</strong
>
</li>
<li>
디지털 환경 구축을 통한 건설 <strong
>정보 통합관리 활용성 강화</strong
>
</li>
</ul>
</td>
<td>
<ul>
<li>
불필요한 행정서류 감소를 통한 <strong
>협업 및 의사소통 효율 향상</strong
>
</li>
</ul>
</td>
<td>
<ul>
<li>
설계 신뢰도 확보 및 발주자 <br />이익 기여로 <strong
>상호신뢰 증진</strong
>
</li>
</ul>
</td>
</tr>
<tr>
<td class="category-cell"
>사후 대응<br />→<br />사전 검증 중심 관리</td
>
<td>
<ul>
<li>
설계변경, 민원, 재작업, 소송 등의 <strong
>사전 예방, 최소화</strong
>
</li>
</ul>
</td>
<td>
<ul>
<li>
설계 및 시공 오류 예방과 원활한 의사 소통으로 <strong
>공사 Risk 최소화</strong
>
</li>
</ul>
</td>
<td>
<ul>
<li>
시공 전 설계검증 강화로<br />
<strong>설계 책임 리스크 감소</strong>
</li>
</ul>
</td>
</tr>
</tbody>
</table>
</div>
<style>
/* [테이블 기본 설정] */
.table-wrapper {
overflow-x: auto; /* 모바일에서 표가 잘리지 않고 스크롤되게 함 */
margin-top: 1.95rem;
font-family: "Pretendard", sans-serif;
}
.formal-table {
width: 100%;
border-collapse: collapse; /* 선 겹침 방지 */
border-top: 1px solid #333; /* 맨 위 굵은 선 */
border-bottom: 1px solid #333; /* 맨 아래 선 */
background: white;
font-size: 0.9rem;
table-layout: fixed; /* 칸 너비 고정 */
min-width: 800px; /* 표가 너무 찌그러지지 않게 최소 너비 확보 */
}
/* [헤더 스타일] - 주체별 색상 구분 */
th {
padding: 0.8rem;
color: white;
font-weight: 700;
text-align: center;
border-left: 1px solid rgba(255, 255, 255, 0.2);
}
th:first-child {
border-left: none;
}
.category-header {
background: rgb(126, 126, 126);
} /* 구분: 회색 */
.client {
background: rgb(126, 126, 126);
} /* 발주자: 파랑 */
.contractor {
background: rgb(126, 126, 126);
} /* 시공자: 주황 */
.designer {
background: rgb(126, 126, 126);
} /* 설계자: 초록 */
/* [셀 스타일] */
td {
padding: 1rem;
border-bottom: 1px solid #ddd; /* 가로 줄 */
border-left: 1px solid #eee; /* 세로 줄 (연하게) */
color: #333;
vertical-align: middle; /* 세로 중앙 정렬 */
word-break: keep-all; /* 단어 끊김 방지 */
}
td:first-child {
border-left: none;
}
/* [1열: 구분] 스타일 */
.category-cell {
background: #f9f9f9;
font-weight: 700;
text-align: center;
color: #444;
}
/* [행: 필요 역량] 강조 스타일 */
.highlight-row td {
background: #f0f7ff; /* 아주 연한 파란색 배경 */
border-bottom: 2px solid #ddd; /* 구분선 강조 */
}
.highlight-row .center-text {
font-weight: 700;
color: #000;
}
/* 텍스트 정렬 유틸리티 */
.center-text {
text-align: center;
}
.text-gray {
color: #aaa;
}
/* [리스트 스타일] - 깔끔한 점 목록 */
ul {
margin: 0;
padding-left: 1.2rem;
}
li {
margin-bottom: 0.5rem;
line-height: 1.6;
list-style-type: disc; /* 기본 점 */
/* 👇 [핵심] 이 두 줄을 추가/수정 하세요! */
letter-spacing: -0.02em; /* 글자 사이를 좁혀서 더 많이 들어가게 함 */
word-break: keep-all; /* 단어가 중간에 끊기지 않게 함 */
}
li:last-child {
margin-bottom: 0;
}
/* 강조 글씨 */
strong {
font-weight: 700;
color: #000;
background: rgba(0, 0, 0, 0.05); /* 형광펜 효과 아주 연하게 */
padding: 0 2px;
}
</style>