Can a NavMenu be responsive in element-ui?

Question

I'm trying to make a responsive SPA based on vue.js and element-ui components. It has a responsive layout out of the box and it works fine, but I can't figure out how to make NavMenu (el-menu) component to move up or to hide under a 'burger' on mobile devices.
Current result is just a vertical menu above content, so you need to scroll down a while.
My app.vue layout:

<el-row>
    <el-col>
        <el-row type="flex" justify="space-between" align="middle">
            <el-col :span="6">
                <img src="/Assets/images/logo.png" width="64px" align="left" />
                <h2>Admin</h2>
            </el-col>
            <el-col :span="2">
                <sign-in></sign-in>
            </el-col>
        </el-row>
        <el-row :gutter="10">
            <el-col :xs="3" :lg="8" :xl="3">
                <el-menu v-if="user.authenticated" style="min-height: 960px; background-color: #fff" v-bind:router="true">
                    <el-menu-item index="/offers">
                        <i class="el-icon-star-off"></i>
                        <span>Offers</span>
                    </el-menu-item>
                    ...
                </el-menu>
            </el-col>
            <el-col :xs="21" :lg="16" :xl="21">
                <router-view style="width:100%;"></router-view>
            </el-col>
        </el-row>
    </el-col>
</el-row>

Answer 1

The Element, it is not designed for a mobile platform, it is for a backstage management system. I'm not sure whether the team has a plan for supporting responsive design or not. On the other hand, the Element team provides a responsive grid system to make a flexible layout.

If you consider building a responsive navigation menu, then you have to implement it for yourself to achieve your cases.

Just to make people's life a little more convenient, I've created a simple responsive menu template using Element a couple of days ago.

Hope this helps you, to get some ideas.