<?xml version="1.0" encoding="utf-8" ?>

<template namespace="VankeMainTabBoard_iPhone" version="1">
    
    <linear class="wrapper" orientation="h">
        <image id="bg"/>
        
        <linear orientation="v" class="item">
            <button id="home" class="icon active" />
        </linear>
        
        <linear orientation="v" class="item">
            <button id="affairs" class="icon" />
        </linear>
        
        <linear orientation="v" class="item">
            <button id="report" class="icon" />
        </linear>
        
        <linear orientation="v" class="item">
            <button id="me" class="icon" />
        </linear>
  
    </linear>
    
    <style type="text/css">
        #bg {
            image-mode: fit;
            position: absolute;
            left: 0;
            top: 0;
            background-color: white;
        }
        
        .wrapper {
            width: 100%;
            height: 100%;
        }
        
        .item {
            width: 25%;
            height: 100%;
            color: gray;
            font-size: 13px;
            font-weight: lighter;
            v-align: center;
        }
        
        .icon {
            height: 40px;
            image-mode: center;
        }
        
        #home {
            image-src: url(home.png);
        }
        
        #home.active {
            image-src: url(home_checked.png);
        }
        
        #affairs {
            image-src: url(business.png);
        }
        
        #affairs.active {
            image-src: url(business_checked.png);
        }
        
        #report {
            image-src: url(tabbar_report_uncheck.png);
        }
        
        #report.active {
            image-src: url(tabbar_report_checked_red.png);
        }
        
        #me {
            image-src: url(user.png);
        }
        
        #me.active {
            image-src: url(user_checked.png);
        }
    </style>
</template>

