generated from Seekra/repository-template
fix(sidebar): do not show sidebar expanding button on small screens when sidebar is not expanded
This commit is contained in:
@@ -32,9 +32,9 @@ const toggleSidebar = function toggleSidebar () {
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<nav class="sidebar">
|
||||
<nav class="sidebar" :class="{ expanded }">
|
||||
<div class="sidebar-controls">
|
||||
<SidebarExpandButton @click="toggleSidebar" />
|
||||
<SidebarExpandButton @click="toggleSidebar" class="sidebar-expand-button" />
|
||||
</div>
|
||||
<div class="sidebar-content" v-if="props.expanded">
|
||||
<slot />
|
||||
@@ -56,6 +56,12 @@ const toggleSidebar = function toggleSidebar () {
|
||||
margin-bottom: 8px;
|
||||
}
|
||||
|
||||
@media (max-width: 48rem) {
|
||||
.sidebar:not(.expanded) .sidebar-expand-button {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
.sidebar-content {
|
||||
padding: 20px;
|
||||
padding-top: 0;
|
||||
|
||||
Reference in New Issue
Block a user