🔥 Meet Our New Project: t0ggles - Your Ultimate Project Management Tool!

Theme Based Rendering

When we develop Framework7 app for multiple platforms with multiple themes (ios, md) we need to control which elements will appear for one or another theme, like showing different icon for iOS and MD themes.

There are special classes that allow to control this:

This is, for example how we hide Navbar's back button text for MD theme:

<div class="navbar">
  <div class="navbar-bg"></div>
  <div class="navbar-inner sliding">
    <div class="left">
      <a href="#" class="link back">
        <i class="icon icon-back"></i>
        <!-- back button text will be visible only in iOS theme -->
        <span class="if-not-md">Back</span>
      </a>
    </div>
    ...
  </div>
</div>