초기 PM 소스 전체 업로드

2026-06-12 17:14:03 +09:00
commit 4e33c9a02a
1769 changed files with 377797 additions and 0 deletions
--- a/libs/gsimViewer/system.css
+++ b/libs/gsimViewer/system.css
@@ -0,0 +1,489 @@
+@charset "utf-8";
+@import url("https://cdn.jsdelivr.net/gh/orioncactus/pretendard@v1.3.8/dist/web/static/pretendard.css");
+
+/* Copyright Ⓒ Hanmaceng Corp. All Rights Reserved. */
+/* 기술개발센터 김건우A 연구원 b25013@hanmaceng.co.kr */
+
+/* 버전 히스토리 */
+/* 2025-03-17 : -- root.css 정의 */
+/* 2025-03-19 : -- "root.css" → "system.css" 으로 이름 변경 */
+/* 2025-03-20 : -- '컴포넌트 정의'부분 수정 */
+/* 2025-03-20 : -- 'header'부분 수정 */
+/* 2025-03-20 : -- '컴포넌트 정의' - 스크롤바 추가 */
+/* 2025-03-25 : -- 'header'부분 수정 */
+/* 2025-03-28 : -- '프라이머리컬러스케일' 추가 */
+/* 2025-03-28 : -- 'header', 'footer' 리뉴얼 */
+/* 2025-03-31 : -- 'main'부분 수정 */
+/* 2025-03-31 : -- 'h2'정의 추가 */
+/* 2025-04-15 : -- 전면 리뉴얼 */
+
+/* -- ↓ -- style -- ↓ -- */
+
+/* 색상 및 시스템 정의 ===== ===== ===== ===== ===== */
+:root {
+    --color-red: #F21D0D;
+    --color-pink: #E8175E;
+    --color-magenta: #B92ED1;
+    --color-purple: #6D3DC2;
+    --color-navy: #4255bd;
+    --color-blue: #0D8DF2;
+    --color-cyan: #03AEFC;
+    --color-green: #4DB251;
+    --color-yellow: #FFBF00;
+    --color-orange: #FF9800;
+    --color-dahong: #FF3D00;
+    --color-brown: #A0705F;
+    --color-iron: #7F7F7F;
+    --color-steel: #688897;
+
+    --color-red-light: #FEE9E7;
+    --color-pink-light: #FDE8EF;
+    --color-magenta-light: #F8EBFB;
+    --color-purple-light: #F1ECF9;
+    --color-navy-light: #EDEEF9;
+    --color-blue-light: #E7F4FE;
+    --color-cyan-light: #E6F7FF;
+    --color-green-light: #EEF8EE;
+    --color-yellow-light: #FFF9E6;
+    --color-orange-light: #FFF5E6;
+    --color-dahong-light: #FFECE6;
+    --color-brown-light: #F6F1EF;
+    --color-iron-light: #F3F3F3;
+    --color-steel-light: #F0F4F5;
+
+    --color-red-medium: #FAA59E;
+    --color-pink-medium: #F6A2BF;
+    --color-magenta-medium: #E3ABEC;
+    --color-purple-medium: #C5B1E7;
+    --color-navy-medium: #B3BBE5;
+    --color-blue-medium: #9ED1FA;
+    --color-cyan-medium: #9ADFFE;
+    --color-green-medium: #B8E0B9;
+    --color-yellow-medium: #FFE599;
+    --color-orange-medium: #FFD699;
+    --color-dahong-medium: #FFB199;
+    --color-brown-medium: #D9C6BF;
+    --color-iron-medium: #CCCCCC;
+    --color-steel-medium: #C3CFD5;
+
+    /* 프라이머리컬러스케일 */
+    --primary-lv-0: #E9EEED;
+    --primary-lv-1: #D2DCDB;
+    --primary-lv-2: #A5B9B6;
+    --primary-lv-3: #789792;
+    --primary-lv-4: #4B746D;
+    --primary-lv-5: #35635C;
+    --primary-lv-6: #1E5149;
+    --primary-lv-7: #1B443D;
+    --primary-lv-8: #193833;
+    --primary-lv-9: #162A27;
+}
+
+
+/* 컴포넌트 정의 ===== ===== ===== ===== ===== */
+/* 폰트 고정값 */
+
+html {
+    /* font-size: clamp(0rem, 0.8dvw, 1.125rem) !important; */
+    font-size: 0.8333333dvw;
+}
+
+main {
+    display: flex;
+    height: calc(100dvh - 4.5rem);
+    width: 100%;
+    padding: 0.5rem;
+    gap: 0.5rem;
+    position: absolute;
+    z-index: 1;
+    top: 2.25rem;
+    /* overflow-y: auto; */
+}
+
+/* 가로 해상도 320px일때 */
+@media screen and (max-width:320px) {
+    main {
+        display: none !important;
+    }
+}
+
+body {
+    font-family: 'Pretendard';
+    color: #111;
+}
+
+/* 한줄 강조 emphasize-20px */
+h1 {
+    font-size: 1.25rem;
+    font-weight: 700;
+    line-height: 1.25rem;
+    letter-spacing: -0.0175rem;
+}
+
+/* 프로젝트 제목 project-title-16px */
+h2 {
+    font-size: 1rem;
+    font-weight: 500;
+    line-height: 1.25rem;
+    letter-spacing: -0.0175rem;
+}
+
+/* 본문 제목 title-14px */
+h3 {
+    font-size: 0.875rem;
+    font-weight: 500;
+    line-height: 1.25rem;
+    letter-spacing: -0.0175rem;
+}
+
+/* 본문 body-14px */
+h4 {
+    font-size: 0.875rem;
+    font-weight: 300;
+    line-height: 1.25rem;
+    letter-spacing: -0.0175rem;
+}
+
+/* 알약형 capsule-12px */
+h5 {
+    font-size: 0.75rem;
+    font-weight: 500;
+    line-height: 1.25rem;
+    letter-spacing: -0.0175rem;
+}
+
+/* 소본문 body-12px */
+h6 {
+    font-size: 0.75rem;
+    font-weight: 300;
+    line-height: 1.25rem;
+    letter-spacing: -0.0175rem;
+}
+
+/* 주석 caption */
+p {
+    font-size: 0.75rem;
+    font-weight: 300;
+    line-height: 1.25rem;
+    letter-spacing: -0.0175rem;
+
+    color: #777;
+}
+
+/* 파란색강조 */
+.type-em-blue {
+    color: var(--color-blue) !important;
+    font-weight: 500 !important;
+}
+
+/* 빨간색강조 */
+.type-em-red {
+    color: var(--color-dahong) !important;
+    font-weight: 500 !important;
+}
+
+/* 플레이스홀더 */
+.type-placeholder {
+    color: #aaa;
+}
+
+/* 스크롤바 */
+::-webkit-scrollbar {
+    width: 0.25rem;
+    height: 0.25rem;
+}
+
+::-webkit-scrollbar-track {
+    background: #eee;
+    border-radius: 0.25rem;
+}
+
+::-webkit-scrollbar-thumb {
+    background: #aaa;
+    border-radius: 0.25rem;
+}
+
+::-webkit-scrollbar-thumb:hover {
+    background: #aaa;
+    cursor: pointer;
+}
+
+/* 아이콘타입 버튼 */
+.xs-btn {
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    background-color: #fff;
+    min-height: 1.25rem;
+    max-height: 1.25rem;
+    min-width: 1.25rem;
+    max-width: 1.25rem;
+    border-radius: 0.25rem;
+    border: 0.0625rem solid #ddd;
+    cursor: pointer;
+}
+
+/* 텍스트타입 버튼 */
+.xs-btn-type {
+    background-color: #fff;
+    border-radius: 0.25rem;
+    border: 0.0625rem solid #ddd;
+    padding: 0 0.25rem;
+    min-height: 1.25rem;
+    max-height: 1.25rem;
+    max-width: fit-content;
+    min-width: fit-content;
+    cursor: pointer;
+}
+
+/* 아이콘+텍스트타입 버튼 */
+.xs-btn-type-icon {
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    background-color: #fff;
+    border-radius: 0.25rem;
+    border: 0.0625rem solid #ddd;
+    padding: 0 0.25rem 0 0.125rem;
+    gap: 0.125rem;
+    min-height: 1.25rem;
+    max-height: 1.25rem;
+    max-width: fit-content;
+    min-width: fit-content;
+    cursor: pointer;
+}
+
+/* 아이콘+텍스트타입 버튼 */
+.xs-btn-type-icon-header {
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    background-color: var(--primary-lv-5);
+    border-radius: 0.25rem;
+    border: 0.0625rem solid var(--primary-lv-4);
+    padding: 0 0.25rem 0 0.125rem;
+    color: #fff;
+    gap: 0.125rem;
+    min-height: 1.25rem;
+    max-height: 1.25rem;
+    max-width: fit-content;
+    min-width: fit-content;
+    cursor: pointer;
+}
+
+.xs-btn-type-icon-header:hover {
+    background-color: var(--primary-lv-4);
+}
+
+
+
+/* header.css 정의 ===== ===== ===== ===== ===== */
+header {
+    background-color: var(--primary-lv-6);
+    width: 100dvw;
+    min-height: 2.25rem;
+    max-height: 2.25rem;
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+    padding: 0 1rem;
+    color: #fff;
+    position: absolute;
+    z-index: 3;
+    top: 0;
+    pointer-events: all;
+}
+
+header h4 {
+    color: var(--primary-lv-3);
+}
+
+header a {
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    height: 2rem;
+}
+
+.header-left {
+    display: flex;
+    align-items: center;
+    gap: 0.25rem;
+}
+
+.end {
+    margin-left: 0.5rem;
+}
+
+.header-left h6 {
+    display: -webkit-box;
+    -webkit-line-clamp: 1;
+    -webkit-box-orient: vertical;
+    overflow: hidden;
+}
+
+.header-right h4 {
+    color: var(--primary-lv-3);
+}
+
+.header-right {
+    display: flex;
+    gap: 0.5rem;
+    max-width: fit-content;
+    min-width: fit-content;
+    margin-left: 0.25rem;
+    justify-content: flex-end;
+    align-items: center;
+}
+
+.header-name {
+    display: flex;
+    align-items: center;
+    gap: 0.25rem;
+}
+
+.header-name::before {
+    content: "";
+    width: 0.0625rem;
+    height: 0.75rem;
+    background-color: var(--primary-lv-2);
+    opacity: 0.4;
+    margin-right: 0.75rem;
+}
+
+.header-others {
+    display: flex;
+    align-items: center;
+    gap: 0.25rem;
+}
+
+.header-permission {
+    display: flex;
+    gap: 0.25rem;
+}
+
+.header-btn-admin {
+    display: flex;
+    gap: 0.125rem;
+    background-color: rgba(0, 0, 0, 0);
+    color: var(--primary-lv-3);
+    font-weight: 500;
+    cursor: pointer;
+    opacity: 0.4;
+}
+
+.header-btn-logout {
+    background-color: rgba(0, 0, 0, 0);
+    color: var(--primary-lv-3);
+    font-weight: 500;
+    cursor: pointer;
+    text-decoration: underline;
+    opacity: 0.4;
+}
+
+img[alt="hambuger"] {
+    display: none;
+}
+
+.header-others-number {
+    display: none;
+}
+
+
+/* footer.css 정의 ===== ===== ===== ===== ===== */
+footer {
+    background-color: #111;
+    width: 100dvw;
+    min-height: 2.25rem;
+    max-height: 2.25rem;
+    display: flex;
+    justify-content: space-between;
+    padding: 0 1rem;
+    color: #aaa;
+    position: absolute;
+    z-index: 3;
+    bottom: 0;
+    pointer-events: all;
+}
+
+footer p,
+footer h5 {
+    color: #aaa;
+}
+
+.footer-left {
+    display: flex;
+    align-items: center;
+    /* gap: 0.125rem; */
+}
+
+.footer-left a p {
+    text-decoration: underline;
+}
+
+.footer-middle {
+    display: flex;
+    align-items: center;
+    padding-right: 1rem;
+}
+
+footer button {
+    background-color: rgba(0, 0, 0, 0);
+}
+
+footer button p {
+    text-decoration: underline;
+}
+
+.coordinate {
+    cursor: pointer;
+}
+
+.getComponent {
+    margin-left: 0.25rem;
+}
+
+.footer-section {
+    margin-left: 2rem;
+    display: flex;
+    align-items: center;
+    gap: 0.25rem;
+}
+
+.footer-right {
+    display: flex;
+    align-items: center;
+    gap: 0.5rem;
+}
+
+.footer-gauge {
+    max-width: 6.25rem;
+    min-width: 6.25rem;
+    max-height: 0.25rem;
+    min-height: 0.25rem;
+    border-radius: 0.25rem;
+    background-color: rgba(119, 119, 119, 0.2);
+    margin-left: 0.5rem;
+}
+
+.footer-left span {
+    font-size: 0.75rem;
+    line-height: 1.25rem;
+    color: #aaa;
+}
+
+#scalebar_wrap {
+    justify-content: left !important;
+    height: 0.25rem;
+    background-color: #666;
+    opacity: 0.6;
+    border-radius: 0.25rem;
+    margin-left: 0.5rem;
+}
+
+#scalebar {
+    height: 0.25rem;
+    background-color: #fff;
+    border-radius: 0.25rem;
+
+}