alex/fox
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Merge branch 'fix/nav-drawer#VEGA-4802' into 'main'

Browse Source 
VEGA-4802 Адаптация бокового меню

See merge request common/vega/beecloud-docs!27
This commit is contained in:
Речкина Елена Валерьевна
2025-08-22 06:45:33 +00:00
parent ea158a44b0 6b8bccff1d
commit 71c9bcb05a
4 changed files with 156 additions and 58 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/.vitepress/config.mts
+39 -34
View File
@@ -121,57 +121,57 @@ export default defineConfig({
'/platform/': [
{
text: 'Платформа Beeline Cloud', link: '/platform/index.md',
collapsed: true,
items: [
{text: 'Сервисы', link: '/platform/services/services.md'},
{text: 'Техническая поддержка', link: '/platform/support/support-overview.md'},
],
},
},
{text: 'Сервисы', link: '/platform/services/services.md'},
{text: 'Техническая поддержка', link: '/platform/support/support-overview.md'},
],
'/start/': [
{
text: 'Начало работы в Beeline Cloud', link: '/start/index.md',
collapsed: true,
items: [
{text: 'Начать работу', link: '/start/getting-started.md'},
{text: 'Бесплатный период', link: '/start/trial.md'},
{text: 'Платное использование', link: '/start/organization.md'},
],
},
],
},
{text: 'Начать работу', link: '/start/getting-started.md'},
{text: 'Бесплатный период', link: '/start/trial.md'},
{text: 'Платное использование', link: '/start/organization.md'},
],
// '/billing/': [
// ],
'/vdc/': [
{
text: 'Виртуальные дата-центры на VMware', link: '/vdc/index.md',
collapsed: true,
text: 'Виртуальные дата-центры на VMware', link: '/vdc/index.md',
},
{
text: 'Обзор сервиса', link: '/vdc/vdc-overview.md'
},
{
text: 'Быстрый старт', link: '/vdc/vdc-getting-started.md'
},
{
text: 'Виртуальные дата-центры', link: '/vdc/vdc-how-to/vdc-index.md',
collapsed: true,
items: [
{text: 'Обзор сервиса', link: '/vdc/vdc-overview.md'},
{text: 'Быстрый старт', link: '/vdc/vdc-getting-started.md'},
{text: 'Виртуальные дата-центры', link: '/vdc/vdc-how-to/vdc-index.md',
collapsed: true,
items: [
{ text: 'Создание дата-центра', link: '/vdc/vdc-how-to/vdc-create.md' },
{ text: 'Вход в дата-центр', link: '/vdc/vdc-how-to/vdc-enter.md' },
{ text: 'Управление дата-центром', link: '/vdc/vdc-how-to/vdc-manage.md' },
{ text: 'Двухфакторная аутентификация', link: '/vdc/vdc-how-to/vdc-2fa.md',
collapsed: true,
items: [
{text: 'Подключение 2FA', link: '/vdc/vdc-how-to/vdc-2fa-start.md'},
{text: 'Управление 2FA', link: '/vdc/vdc-how-to/vdc-2fa-manage.md'},
{text: 'Подключение 2FA', link: '/vdc/vdc-how-to/vdc-2fa-start.md'},
{text: 'Управление 2FA', link: '/vdc/vdc-how-to/vdc-2fa-manage.md'},
],
},
],
},
// { text: 'Тарификация', link: '/vdc/vdc-tarif.md' },
],
},
// { text: 'Тарификация', link: '/vdc/vdc-tarif.md' },
],
'/compute/': [
{
text: 'Виртуальные машины', link: '/compute/index.md',
collapsed: true,
text: 'Виртуальные машины', link: '/compute/index.md',
},
// {text: 'Быстрый старт', link: '/compute/compute-getting-started.md'},
{ text: 'Обзор сервиса', link: '/compute/compute-overview.md' },
{ text: 'Виртуальные машины', link: '/compute/compute-how-to/compute-index.md',
collapsed: true,
items: [
{text: 'Обзор сервиса', link: '/compute/compute-overview.md'},
// {text: 'Быстрый старт', link: '/compute/compute-getting-started.md'},
@@ -195,16 +195,21 @@ export default defineConfig({
},
],
},
{ text: 'Диски', link: '/compute/compute-how-to/compute-disks.md' },
{ text: 'IP-адреса', link: '/compute/compute-how-to/compute-ip.md' },
{ text: 'Группы размещения', link: '/compute/compute-how-to/compute-affinity.md' },
{ text: 'Практические руководства', link: '/compute/compute-guide/compute-guide-index.md',
collapsed: true,
items: [
{ text: 'Подключение по SSH к ВМ закрытого контура', link: '/compute/compute-guide/compute-guide-ssh-inside.md' },
],
},
],
'/admin/': [
{
text: 'Аккаунт Beeline Cloud', link: '/admin/index.md',
collapsed: true,
items: [
{text: 'Управление ключевыми парами', link: '/admin/ssh.md'},
],
},
},
{text: 'Управление ключевыми парами', link: '/admin/ssh.md'},
],
},
},
src/.vitepress/theme/components/CustomNavBar.vue
+1 -1
View File
@@ -174,7 +174,7 @@ watchPostEffect(() => {
position: relative;
z-index: 1;
padding-right: 32px;
padding-left: var(--vp-sidebar-width);
padding-left: 0px;
}
}
src/.vitepress/theme/components/CustomSidebar.vue
+6 -19
View File
@@ -60,9 +60,8 @@ watch(
bottom: 0;
left: 0;
z-index: var(--vp-z-index-sidebar);
padding: 32px 32px 96px 32px;
width: 256px;
max-width: 320px;
padding: 0px 0px 96px 0px;
width: 320px;
background-color: var(--vp-sidebar-bg-color);
opacity: 0;
box-shadow: var(--vp-c-shadow-3);
@@ -88,8 +87,6 @@ watch(
@media (min-width: 960px) {
.VPSidebar {
padding-top: var(--vp-nav-height);
// width: var(--vp-sidebar-width);
// max-width: 100%;
background-color: var(--vp-sidebar-bg-color);
opacity: 1;
visibility: visible;
@@ -98,13 +95,6 @@ watch(
}
}
@media (min-width: 1440px) {
.VPSidebar {
// padding-left: max(32px, calc((100% - (var(--vp-layout-max-width) - 64px)) / 2));
// width: calc((100% - (var(--vp-layout-max-width) - 64px)) / 2 + var(--vp-sidebar-width) - 32px);
}
}
@media (min-width: 960px) {
.curtain {
position: sticky;
@@ -121,17 +111,14 @@ watch(
.nav {
outline: 0;
}
.group + .group {
border-top: 1px solid var(--vp-c-divider);
padding-top: 10px;
padding-top: 24px;
width: 100%;
}
@media (min-width: 960px) {
.group {
padding-top: 10px;
width: calc(var(--vp-sidebar-width) - 64px);
width: 100%;
}
}
</style>
src/.vitepress/theme/scss/components/vp-sidebar.scss
+110 -4
View File
@@ -1,7 +1,113 @@
@use '@beeline/design-tokens/scss/tokens/components/navigationDrawer';
@use '@beeline/design-tokens/scss/tokens/themes/theme-variables' as theme;
.VPSidebar {
&Item {
.text {
font-size: 15px;
}
--vp-sidebar-bg-color: var(--vp-c-bg);
}
.VPSidebar .VPSidebarItem .item {
margin: 4px 0;
}
.VPSidebar .VPSidebarItem .link {
display: flex;
align-items: center;
}
.indicator {
border-top-right-radius: navigationDrawer.$navigation-drawer-item-indicator-border-radius-topright !important;
border-bottom-right-radius: navigationDrawer.$navigation-drawer-item-indicator-border-radius-bottomright !important;
position: absolute !important;
left: 0 !important;
}
.VPSidebarItem.is-active > .item .link > .text {
color: theme.$color-text-active !important;
font-weight: 500 !important;
line-height: 20px !important;
}
.VPSidebarItem {
.item {
padding: 12px 32px !important;
border-top-right-radius: 12px !important;
border-bottom-right-radius: 12px !important;
color: theme.$color-text-inactive;
&:hover {
background-color: navigationDrawer.$navigation-drawer-item-hover-background-color !important;
color: theme.$color-text-inactive;
}
}
&.is-active > .item > .indicator {
border-left: navigationDrawer.$navigation-drawer-item-indicator-width solid
navigationDrawer.$navigation-drawer-item-activated-indicator-color !important;
}
}
.VPSidebarItem.collapsible {
.items {
margin-left: 16px;
.item {
padding: 12px 16px 12px 56px !important;
border-top-left-radius: 12px !important;
border-bottom-left-radius: 12px !important;
}
}
&.is-active,
&.has-active {
> .item {
.indicator {
display: block !important;
border-left: navigationDrawer.$navigation-drawer-item-indicator-width solid
navigationDrawer.$navigation-drawer-item-activated-indicator-color !important;
}
.text {
color: theme.$color-text-active !important;
font-weight: 500 !important;
}
}
}
.items .VPSidebarItem.is-active > .item {
background-color: navigationDrawer.$navigation-drawer-item-hover-background-color !important;
.text {
color: theme.$color-text-active !important;
font-weight: 500 !important;
}
}
}
.VPSidebarItem.collapsible .items .item .indicator {
display: none !important;
}
.text {
padding: 0px !important;
font-weight: 400 !important;
font-size: 15px !important;
line-height: 18px !important;
letter-spacing: 0.2px !important;
transition-property: all;
transition-duration: 150ms;
transition-timing-function: ease-in-out;
color: theme.$color-text-inactive !important;
}
.VPSidebarItem .items {
border-left: 0px !important;
}
.VPSidebarItem {
padding-bottom: 0px !important;
}
.VPLocalNav.has-sidebar {
padding-left: 320px !important;
}