Documentation

1. theme_color
   - for colour customization . Colors are in array

   "theme_color": "theme-color-default",
   colors: {
       "--primary": "#3a57e8",
       "--info": "#08B1BA",
   },
   choices: 'theme-color-default', 'theme-color-blue', 'theme-color-gray', 'theme-color-red', 'theme-color-yellow', 'theme-color-pink'
   

You can work on color customizer using Live Customizer in two different ways:

1. You can change the color with the property name and its value here by declaring property name and its values in Database->Seeds->AppSettingSeeder.php file.
   - This is the example of AppSettingSeeder.php file.

   'value' => '{
   	"saveLocal": "",
   	"storeKey": "huisetting",
   	"setting": {
   	    "app_name": { "value" : "Hope UI"},
   	    "theme_color": { "value": "theme-color-default" },
   	}
   }',

   After making changes in seeder it is necessary to run php spark migrate:refresh to save changes in database.
2. You can change page-appearance from your database for that open table with name app_setting.In the cloumn name value change the value for variable theme_color for colour customizer.

You can change the color with a single action.

1. By changing some colors of variables in a file. Example is given below.

File Structure

• gulp+scss+hbs
  • src
    • assets
      • scss
        • hope-ui-design-system
          • _variable.scss

If you wish to change the color of defined variable, you can follow the below action.

For example you have to change the color of variable $primary as #6610f2 then change the variable color in variable.scss file.

$primary:       #6610f2 !default;
$info:          $#3a57e8 !default;