Standard themes for smartphones had Black themes only, but they now have White as well after the 2018 Summer release.
An unexpected appearance might be shown when switching the theme to White, if a user created the screen for smartphones with the version earlier than 2018 Spring.
We have taken the measure described below for the existing screens of iAP.

Firstly, check the appearance difference between each theme module. The following is the color information for each theme.

[Appearance of swatch sets] 
・https://www.intra-mart.jp/document/library/iap/public/development/script_programming_guide/texts/application/im_sp/smartphone_theme/index.html#%E3%83%86%E3%83%BC%E3%83%9E%E3%81%A8%E3%82%B9%E3%82%A6%E3%82%A9%E3%83%83%E3%83%81

[Black theme] 
theme_black.PNG

[White theme] 
theme_white.PNG

[How to judge handling method availability]
Layout might collapse if any of the following conditions is applicable when using a White theme:
There are some parts where color information is specified using a unique css or js, not using the jQueryMobile swatch.
Example: Color information of background-color or text-shadow
There are some icons which cannot be displayed on the white background or were created by yourself.
Example: Icons to be placed mainly in the footer such as im-smart-icon-common-32-mail and im-smart-icon-common-32-more
There are some parts where data-theme="c" is specified.
You can determine whether there are applicable parts or not by the above-mentioned method. Follow the direction below if some response seems required.


[Modifying methods] 
■　Response policy for when there are some parts where color information is specified using a unique css or js, not a jQueryMobile swatch 
･ Color is fixed when you specify color information with a unique css or js, no matter what theme you chose. Therefore, please consider to use a swatch, not a unique css (Response by the data-theme attribute). 
･ You need to create a unique css available for a White theme if impossible to deal with the problem by data-theme. The class of im_theme_smartphone_white is provided in the body element of the White theme. Create the css for the White theme using this class.
･ If you can decide that you do not need to deal with it from the view point of layout across a screen, there is no need to do so. 


■ Response policy for when an icon which cannot be displayed in the white background is used or created of your own accord
･ Icons in white based color might be invisible (indistinct) on a White theme. Create an icon visible on both Black and White backgrounds if you want to use your own icon.
･ iAP icons are visible in the both themes because they have white lines on the gray background. Use a class in which “-2” is added to the existing class name if you use the existing icon.
Example: Specify im-smart-icon-common-32-home-2 when im-smart-icon-common-32-home is specified
･ You do not need to modify the parts where data-theme="a" or data-theme="c" is not specified in an element to display an icon as the backgrounds there will not be white.


■ Response policy for when there is a part where data-theme="c" is specified
･ Parts where data-theme="c" is specified will be black when a White theme is applied. For the iAP screen, data-theme="d" is specified to make those parts remain white even when a White theme is applied. 
You can make the background color of element white in both the existing Black and White themes by specifying “d”.
･ You do not need any modification if there is no problem about being black. 


■ Response policy for cases which do not fall under any of the above
･ The descriptions above are the handling methods for problems occurred in the iAP screens. There supposed to be no other problems, but please check your screen in a White theme to see whether it does not show unexpected appearance, just to make sure.

-- Target ------------------------------------------------------------------------
iAP/Accel Platform/2018 Summer or later
----------------------------------------------------------------------------------

FAQID:692