Theme Configuration
AtlasX Web Application (Berlin Template) สามารถกำหนดรูปแบบธีมของแอพพลิเคชั่นได้จาก variable ของ scss
Variable Configuration
ไปที่ไฟล์ ClientApp/src/styles.scss แล้วกำหนดค่าต่างๆ ให้กับ variable ตามต้องการ
:root {
--navbar-height: 80px;
--navbar-bg-c: #140e52;
--navbar-c: #fff;
--navbar-active-c: #52eac8;
--navbar-hover-c: #52eac8;
--navbar-separator-bg-c: rgba(255, 255, 255, 0.3);
--navbar-dropdown-menu-bg-c: #fff;
--mobile-navbar-height: 70px;
--mobile-navbar-bg-c: #2a217d;
--mobile-navbar-c: #fff;
--mobile-navbar-active-c: #52eac8;
--mobile-navbar-hover-c: #52eac8;
--mobile-navbar-separator-bg-c: rgba(255, 255, 255, 0.3);
--mobile-submenu-bg-c: #fff;
--mobile-submenu-primary-c: #4f4f4f;
--mobile-submenu-secondary-c: #4f4f4f;
--mobile-submenu-active-c: #52eac8;
--mobile-submenu-hover-c: #52eac8;
--mobile-submenu-separator-bg-c: #f2f2f2;
--mobile-backdrop-bg-c: rgba(0, 0, 0, 0.4);
--sider-bg-c: #140e52;
--sider-c: #fff;
--sider-active-c: #52eac8;
--sider-hover-c: #52eac8;
--sider-hover-bg-c: rgba(255, 255, 255, 0.4);
--max-content-width: 2000px;
}