intel-xdkappframework

style element into intelxdk appframework app according to os theme


in a Intel-Xdk AppFramework 3 application i would like to style a card element according to the current os Theme.

I want the Header of the card to be the same color of the header of the page , how do i do?

card:

<div class="widget uib_w_2 widget-container content-area vertical-col  uib-card d-margins section-dimension-2 cpad-1" data-uib="layout/card" data-ver="0">
                <section class="card-header widget-container content-area vertical-col">card header</section>
                <p>card content</p>
            </div>

Solution

  • The card element in Intel XDK's App designer is not part of the AppFramework UI elements, its a custom element for all frameworks, so you have manually add set a class and add css to match the frameworks header color :(

    Checkout example css for osTheme here and add custom css like this:

    .ios7 .card-header {...}
    .android .card-header {...}
    ...