<template>
    <div>
        <div class = "mobile_show">
            <slot></slot>
        </div>
        <svg width="424px" height="876px" viewBox="0 0 424 876" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
            <!-- Generator: Sketch 43.1 (39012) - http://www.bohemiancoding.com/sketch -->
            <title>iPhone 6 Minimal Wireframe</title>
            <desc>Created with Sketch.</desc>
            <defs>
                <rect id="path-1" x="5" y="6" width="413.15331" height="864" rx="60"></rect>
                <rect id="path-2" x="24" y="104" width="375" height="667" rx="5"></rect>
                <ellipse id="path-3" cx="211.616725" cy="819.589041" rx="29.6167247" ry="29.5890411"></ellipse>
            </defs>
            <g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
                <g id="iPhone-6-Minimal-Wireframe">
                    <g id="phone">
                        <use fill="#FFFFFF" fill-rule="evenodd" xlink:href="#path-1"></use>
                        <rect stroke="#dadada" stroke-width="6" x="2" y="3" width="419.15331" height="870" rx="64"></rect>
                    </g>
                    <g id="screen">
                        <use fill="#FFFFFF" fill-rule="evenodd" xlink:href="#path-2"></use>
                        <rect stroke="#dadada" stroke-width="4" x="26" y="106" width="371" height="663" rx="5"></rect>
                    </g>
                    <g id="side-bottom" transform="translate(-1.000000, 767.397260)" fill="#D4DEE0">
                        <rect id="Rectangle-3" x="419.076655" y="0" width="5.92334495" height="14.7945205"></rect>
                        <rect id="Rectangle-3-Copy" x="0" y="0" width="5.92334495" height="14.7945205"></rect>
                    </g>
                    <g id="home-button">
                        <use fill="#FFFFFF" fill-rule="evenodd" xlink:href="#path-3"></use>
                        <ellipse stroke="#dadada" stroke-width="4" cx="211.616725" cy="819.589041" rx="31.6167247" ry="31.5890411"></ellipse>
                    </g>
                    <g id="side-top" transform="translate(-1.000000, 68.657534)" fill="#dadada">
                        <rect id="Rectangle-3" x="419.076655" y="0" width="5.92334495" height="14.7945205"></rect>
                        <rect id="Rectangle-3-Copy" x="0" y="0" width="5.92334495" height="14.7945205"></rect>
                    </g>
                    <g id="top" transform="translate(136.717770, 48.904110)">
                        <rect id="speaker" fill="#999" x="42.9442509" y="4.43835616" width="66.6376307" height="5.91780822" rx="2.95890411"></rect>
                        <g id="sensor">
                            <ellipse id="Oval-2" fill="#dadada" cx="6.66376307" cy="6.65753425" rx="6.66376307" ry="6.65753425"></ellipse>
                            <ellipse id="Oval-2" fill="#999" cx="6.66376307" cy="6.65753425" rx="3.70209059" ry="3.69863014"></ellipse>
                        </g>
                    </g>
                </g>
            </g>
        </svg>
    </div>
</template>
<style scoped>
    .mobile_show{
        padding:0px;
        position: absolute;
        left:27px;
        top:107px;
        width:370px;
        height:661px;
        border-radius: 5px;
        background:#fff;
        overflow-y: scroll;
        overflow-x: hidden;
    }
</style>
