<template>
    <div class="title-image">
        <title-floor v-bind:title="{name: floor.title, moreName: floor.moreName, moreUrl: floor.moreUrl}"></title-floor>
        <a class="image" v-bind:href="floor.image.url">
            <img v-bind:src="floor.image.src | resize 750 364">
        </a>
    </div>
</template>

<script>
    const titleFloor = require('component/resources/title-floor.vue');

    module.exports = {
        props: ['floor'],
        components: {
            titleFloor: titleFloor
        }
    };
</script>

<style>
    .title-image {
        a {
            display: block;
        }

        .image {
            width: 100%;
            height: 364px;
        }

        img {
            width: 100%;
            height: 100%;
        }
    }
</style>