Uploaded image for project: 'PUBLIC - Liferay Portal Community Edition'
  1. PUBLIC - Liferay Portal Community Edition
  2. LPS-72671

Color Scheme Picker lacks visual response for custom themes

    Details

      Description

      **Brief Summary

      For a custom theme with color schemes, clicking on the color scheme selector does not provide any visual response, though the "selected" class is applied correctly.  This lack of visual response, coupled with the fact that older versions of portal used a radio button input instead leads to confusion  

      Reproduction

      • Generate a non-default color scheme for the custom theme.  A simple way to do this, which will create one non-default color scheme is to paste the following into liferay_look_and_feel.xml in the src/WEB-INF directory of the custom theme directory:

       

      <color-scheme id="01" name="Default">
        <default-cs>true</default-cs>
        <css-class&gt;default</css-class&gt;
        <color-scheme-images-path>${images-path}/color_schemes/${css-class}</color-scheme-images-path>
      </color-scheme>
      <color-scheme id="02" name="Marx">
        <css-class&gt;marx</css-class&gt;
      </color-scheme>
      
      • Then, put in the css styling for the color scheme.  Assuming the previous code was pasted in, create directory src/css/color_schemes in the custom theme directory, and create marx.css:
      body.marx {
        color: #F00 !important;
      }
      
      • Then edit src/css/_custom.scss, adding the line 
        @import "color_schemes/marx";

        in the beginning of the file

      • In the src/images directory, create directories color_schemes/default and color_schemes/marx, and place unique thumbnail images thumbnail.png pictures into each of those two directories.  **
      • Deploy the theme to have access to this new theme with color schemes.
      • Go to ** Public Pages > Configure, and change the theme to the custom theme.  Underneath the Theme is a row with two color schemes, Default and Marx.  
      • Clicking on either color scheme provides no visual response.

      Expected Results

      The chosen color scheme's thumbnail image in the color scheme picker has changed in such a way to indicate it was selected by the user

      Actual Results

      No visual changes occur within the color scheme picker; the all color scheme thumbnail images remains unchanged.

        Attachments

        1. 7.0.x-private.png
          7.0.x-private.png
          41 kB
        2. aspect-ratio.png
          aspect-ratio.png
          2 kB
        3. avbt.png
          avbt.png
          216 kB
        4. color_schemes_thumbnail_images.zip
          4 kB
        5. fixed.png
          fixed.png
          55 kB
        6. Screen Shot 2017-08-31 at 3.41.13 PM.png
          Screen Shot 2017-08-31 at 3.41.13 PM.png
          82 kB

          Issue Links

            Activity

              People

              • Votes:
                0 Vote for this issue
                Watchers:
                0 Start watching this issue

                Dates

                • Created:
                  Updated:
                  Resolved:
                  Days since last comment:
                  2 years, 2 weeks, 2 days ago

                  Packages

                  Version Package
                  7.0.X EE
                  7.0.4 CE GA5
                  7.1.X
                  Master