brand-top.vue 1.32 KB
<template>
    <div class="top-box clearfix">
        <i class="back"></i>
        <div class="right">
            <i class="favorite"></i>
            <a class="share" href="{{shareData}}"></a>
            <i class="filter"></i>
        </div>
    </div>
</template>

<style>
    .top-box {
        width: 100%;
        height: 60px;
        position: fixed;
        top: 60px;
        left: 0;
        z-index: 99;

        .back {
            width: 60px;
            height: 60px;
            float: left;
            background: url("/channel/back.png") no-repeat;
        }

        .right {
            height: 60px;
            float: right;

            i {
                width: 60px;
                height: 60px;
                margin: 0 5px;
                display: inline-block;
            }

            .favorite {
                background: url("/channel/favorite.png") no-repeat;
            }

            .share {
                width: 60px;
                height: 60px;
                margin: 0 5px;
                display: inline-block;
                background: url("/channel/share.png") no-repeat;
            }

            .filter {
                background: url("/channel/filter.png") no-repeat;
            }
        }
    }
</style>

<script>
    module.exports = {
        props: ['shareData']
    };
</script>