Content Management and Capture

Content Management and Capture

Come for answers. Stay for best practices. All we’re missing is you.

 View Only
Expand all | Collapse all

Change viewer banner color and text and icon color of viewer

  • 1.  Change viewer banner color and text and icon color of viewer

    Posted Tue November 03, 2020 07:38 PM

    Hi, I have a requirement where i need to change viewer banner background color and text and icon color to be different from icn banner and icon and text color. Unfortunately, both icn and viewer takes colors from theme. Is there a way i can use different colors for viewer and different for icn using css. Thanks



    #IBMContentNavigator(ICN)
    #Support
    #SupportMigration


  • 2.  RE: Change viewer banner color and text and icon color of viewer
    Best Answer

    Posted Wed November 04, 2020 01:44 AM

    Hi Amit,

    You may add viewerToolbarContainer to css to use different colors.

    .ecm.icn .ecmBanner.viewerToolbarContainer { background: #4392f0; }

    Regards,

    Angie



    #IBMContentNavigator(ICN)
    #Support
    #SupportMigration


  • 3.  RE: Change viewer banner color and text and icon color of viewer
    Best Answer

    Posted Wed November 04, 2020 03:33 AM

    Thanks Angie,


    what about the text and icon color of viewer banner. Even those are inheriting from the theme?



    #IBMContentNavigator(ICN)
    #Support
    #SupportMigration


  • 4.  RE: Change viewer banner color and text and icon color of viewer
    Best Answer

    Posted Wed November 04, 2020 06:08 AM

    Hi Amit,

    The following css works for me.

    .ecm.icn .ecmBanner.viewerToolbarContainer * { color: #1f2125; } .ecm.icn .ecmBanner.viewerToolbarContainer .dijitIcon, .ecm.icn .ecmBanner.viewerToolbarContainer .dijitArrowButtonInner { filter: invert(100%); }

    The "filter" changes the color of the background images. You may also create your own background images and set them for your icons.

    Regards,

    Angie



    #IBMContentNavigator(ICN)
    #Support
    #SupportMigration