diff --git a/src/assets/layout/_responsive.scss b/src/assets/layout/_responsive.scss index 6579252..fc4bdb4 100644 --- a/src/assets/layout/_responsive.scss +++ b/src/assets/layout/_responsive.scss @@ -22,6 +22,7 @@ height: 100vh; border-top-left-radius: 0; border-bottom-left-radius: 0; + border-right: 1px solid var(--surface-border); box-shadow: 0px 3px 5px rgba(0, 0, 0, 0.02), 0px 0px 2px rgba(0, 0, 0, 0.05), diff --git a/src/assets/layout/_topbar.scss b/src/assets/layout/_topbar.scss index 2350b9c..405177b 100644 --- a/src/assets/layout/_topbar.scss +++ b/src/assets/layout/_topbar.scss @@ -71,7 +71,7 @@ } .layout-menu-button { - margin-left: 2rem; + margin-right: 0.5rem; } .layout-topbar-menu-button { @@ -97,24 +97,19 @@ @media (max-width: 991px) { .layout-topbar { + padding: 0 2rem; + .layout-topbar-logo-container { width: auto; - order: 2; } .layout-menu-button { margin-left: 0; margin-right: 1rem; - order: 1; } .layout-topbar-menu-button { display: inline-flex; - order: 4; - } - - .layout-topbar-actions { - order: 3; } .layout-topbar-menu { diff --git a/src/layout/AppTopbar.vue b/src/layout/AppTopbar.vue index 8449a36..58231d3 100644 --- a/src/layout/AppTopbar.vue +++ b/src/layout/AppTopbar.vue @@ -8,6 +8,9 @@ const { onMenuToggle, toggleDarkMode, isDarkTheme } = useLayout();