LESS및 특성 파일을 사용하여 사용자 인터페이스 사용자 정의

LESS및 특성 파일을 사용하여 사용자 인터페이스를 사용자 정의할 수 있습니다. LESS및 특성 파일은 애플리케이션에서 공통 스타일을 적용해야 하는 경우 여러 CSS 항목을 수정하는 수고를 덜어 줍니다.

1. 다음 방법 중 하나로 CSS를 사용자 정의하십시오.
   • 애플리케이션에서 사용자 인터페이스 요소의 색상과 같은 특정 특성을 사용자 정의하려면 다음 단계를 수행하십시오.
     1. 특성 파일 (예: properties.txt ) 을 작성하고 수정하려는 메소드 또는 특성만 포함시키십시오. 애플리케이션에서 정의한 것과 동일한 메소드 또는 특성을 사용하고 필수 값을 지정해야 합니다. 애플리케이션과 함께 제공되는 적절한 특성 파일에서 메소드 또는 특성을 참조할 수 있습니다.
     2. <INSTALL_DIR>/bin 폴더에서 ./sci_ant.sh -f compileLessAndGenerateCSSForStore.xml -DcustomLessFileLoc=/data/temp/CustomFiles/ Ant 스크립트를 실행하십시오. 여기서 /data/temp/CustomFiles/ 는 사용자 정의 LESS및 특성 파일의 위치를 나타냅니다.
        다음 .css 파일은 필수 변경사항을 포함하도록 업데이트되며 <INSTALL_DIR>/repository/eardata/wsc/war/wsc/resources/css/ 디렉토리에서 사용 가능합니다.

        • desktop.css
        • desktop_rtl.css
        • mobile.css
        • mobile_rtl.css
   • 애플리케이션에서 패널의 글꼴 크기와 같은 특정 CSS 항목을 수정하려면 다음 단계를 수행하십시오.
     1. .less 파일 (예: newstyles.less ) 을 작성하고 수정하려는 CSS 항목만 포함시키십시오. 애플리케이션에서 정의한 것과 동일한 속성 이름을 사용하고 필요한 값을 지정해야 합니다. 애플리케이션과 함께 제공되는 .less 파일을 참조할 수 있습니다.
     2. <INSTALL_DIR>/bin 폴더에서 다음 Ant 스크립트를 실행하십시오. ./sci_ant.sh -f compileLessAndGenerateCSSForStore.xml -DcustomLessFileLoc=/data/temp/CustomFiles/ 여기서 /data/temp/CustomFiles/ 는 사용자 정의 LESS및 특성 파일의 위치를 나타냅니다.
        다음 .css 파일은 필수 변경사항을 포함하도록 업데이트되며 <INSTALL_DIR>/repository/eardata/wsc/war/wsc/resources/css/ 디렉토리에서 사용 가능합니다.

        • desktop.css
        • desktop_rtl.css
        • mobile.css
        • mobile_rtl.css
   • 마찬가지로 애플리케이션을 확장하여 더 많은 화면을 추가하는 경우 사용자 정의 특성 및 메소드를 정의하고 Ant 스크립트를 실행하십시오. .css 파일은 확장 화면의 스타일을 포함하도록 업데이트됩니다.
   또는 다음 방법으로 Ant 스크립트를 실행할 수 있습니다.

   • ./sci_ant.sh -f compileLessAndGenerateCSSForStore.xml: .less 파일의 위치를 제공하도록 프롬프트가 표시됩니다.
   • ./sci_ant.sh -f compileLessAndGenerateCSSForStore.xml -DcustomLessFileLoc=: .less 파일의 위치를 제공하라는 프롬프트가 표시되지 않습니다. 이 명령을 실행하여 애플리케이션에서 제공하는 기본 스타일로 되돌릴 수 있습니다.
2. 애플리케이션을 사용자 정의한 후 요구사항에 따라 애플리케이션 WAR 또는 EAR을 빌드하고 배치하십시오.