[ CSS ] 공통적용 CSS 파일 생성 후 애플리케이션에 일괄 적용합니다.

공통 CSS 파일을 아래와 같이 생성 후 저장합니다.

● 파일: ndream_css.css

/* 저장 버튼 오른쪽여백 */ .b_save_css {     right: 0px; } /* 엑셀다운로드 버튼 글자색 및 오른쪽여백 */ .b_excel_dowload_css {     color: rgb(25, 27, 116);       right: 0px; } /* 행추가 버튼 글자색 및 오른쪽여백 */ .b_add_row_css {     color:rgb(25, 27, 116);     right: 4px; } /* 행삭제 버튼 폰트색 */ .b_del_row_css {     color: red;  } /* ------------------------------------------------------------- */ /* 조회조건 마진 및 바탕색 */ .t-Region-body, .t-Body-contentInner {         padding: 8px;     background-color:#fbfdff; } .t-Region-buttons t-Region-buttons--top {     border-width: 2px;     border-color: #56A9F6; } /* 조회/초기화 버튼 폰트색/마진/정렬 */ .b_reset_css,  .b_search_css {     color: rgb(25, 27, 116);     align-content: flex-start;     margin-left: 4px;     float: right;     } /* 입력항목 바탕색 */ .text_field,  .password, .apex-item-datepicker,  .popup_lov.apex-item-text.apex-item-popup-lov,  .selectlist.apex-item-select,  .textarea.apex-item-textarea,  .number_field.apex-item-text.apex-item-number {     background-color: #ffffff; } /* ------------------------------------------------------------- */ /* 그리드 헤더 폰트색 및 바탕색 */ .a-GV-header, .t-Region-header, .t-Region-headerItems {     background-color: #ffffff;     color: rgb(25, 27, 116); } .t-Region-header {     border-width: 2px;     border-color: #56A9F6; } /* 그리드 셀 라인색 */ .a-GV-cell {     border-color: #f5f5f5; } /* 그리드 선택행 색상 */ .a-GV-table.tr.is-selected {     background-color: #c7fdff; } /* 그리드 읽기전용 색상 */ .a-GV--editMode .a-GV-row.is-readonly  .a-GV-cell,  .a-GV--editMode  .a-GV-cell.is-readonly {     background-color: #EEF6FE; } /* 그리드 키항목 글자색 및 굵게 */ .required_css, .a-GV--editMode .a-GV-cell.is-readonly {     color: #56A9F6;     font-weight: bold; } /* ------------------------------------------------------------- */ /* 페이지 풋터 영역 숨기기 */ .t-Footer {     display: none; }

애플리케이션에 일괄 반영을 위하여 "Shared Components" 버튼을 클릭합니다.

 

애플리케이션에 일괄 반영을 위하여 "Create File" 버튼을 클릭합니다.

 

애플리케이션에 일괄 반영을 위하여 아래와 같이 처리합니다.

● Content: ndream_css.css (해당 파일을 드래그합니다.)  - Create 버튼을 클릭합니다.

 

파일을 저장하면 아래와 같이 파일내용 및 파일위치를 확인합니다.

 

파일 저장 후 기본 CSS 및 미니 CSS가 생성됩니다.

● 경로: #WORKSPACE_FILES#ndream_css#MIN#.css

 

애플리케이션에 전체 반영을 위하여 아래와 같이 적용합니다.

● CSS  - File URLs: #WORKSPACE_FILES#ndream_css#MIN#.css

버튼(엑셀다운로드, 행추가, 행삭제) 색상 및 폰트, 입력항목 색상, 페이지 풋터 숨기기, 조회영역 마진 및 버튼 위치, 그리드 색상

● 그리드에서 입력할 시 필수 항목표기는 화면별로 적용합니다. ● CSS  - Inline

/* 그리드 헤더 필수항목 '*' 표기 */ #GRID_MAIN_ig  th[data-idx="1"]::before, th[data-idx="2"]::before, th[data-idx="3"]::before, th[data-idx="4"]::before, th[data-idx="5"]::before, th[data-idx="6"]::before, th[data-idx="7"]::before, th[data-idx="8"]::before, th[data-idx="9"]::before {         content: '* ';     color: red; }