src/theme/DocSidebar/Desktop/Content/styles.module.css - main - spirzen/it-knowledge-base

src/theme/DocSidebar/Desktop/Content/styles.module.css

94 строки2 KB

Spirzen

JS Rework and sidebar fixes

02 июн 2026, 20:19

02 июн 2026, 20:19ff007b4

/**
 * Базовые стили Content из стандартной темы Docusaurus + расширения.
 */

@media (min-width: 997px) {
  .menu {
    flex-grow: 1;
    padding: 0.5rem;
  }
  @supports (scrollbar-gutter: stable) {
    .menu {
      padding: 0.5rem 0 0.5rem 0.5rem;
      scrollbar-gutter: stable;
    }
  }

  .menuWithAnnouncementBar {
    margin-bottom: var(--docusaurus-announcement-bar-height);
  }
}

/* Fallback-вёрстка шапки, если глобальный CSS ещё не подгрузился */
:global(.it-sidebar-panel-head) {
  display: flex;
  align-items: center;
  gap: 0.5rem;
}

:global(.it-sidebar-panel-title),
:global(.it-sidebar-panel-sub) {
  display: block;
}

.sidebarSearchWrapper {
  padding: 0.25rem 0.5rem 0.5rem;
  border-bottom: 1px solid var(--ifm-color-emphasis-200);
}

.sidebarSearchInput {
  width: 100%;
  padding: 0.4rem 0.6rem;
  border-radius: 6px;
  border: 1px solid var(--ifm-color-emphasis-300);
  font-size: 0.85rem;
  background: var(--ifm-background-surface-color);
}

.sidebarSearchInput:focus-visible {
  outline: 2px solid var(--ifm-color-primary);
  outline-offset: 1px;
}

.sidebarQuickFilters {
  display: flex;
  flex-wrap: wrap;
  gap: 0.25rem;
  margin-top: 0.35rem;
}

.sidebarQuickFilter {
  border: none;
  padding: 0.15rem 0.45rem;
  border-radius: 999px;
  font-size: 0.75rem;
  cursor: pointer;
  background: var(--ifm-color-emphasis-100);
  color: var(--ifm-color-content-secondary);
}

.sidebarQuickFilterActive {
  background: var(--ifm-color-primary);
  color: #fff;
}

@media (min-width: 997px) {
  .resizeHandle {
    position: absolute;
    top: 0;
    right: -4px;
    width: 8px;
    height: 100%;
    cursor: col-resize;
    z-index: 12;
    touch-action: none;
    border-radius: 4px;
    background: transparent;
    transition: background-color 0.15s ease;
  }

  .resizeHandle:hover,
  .resizeHandleActive {
    background: color-mix(in srgb, var(--ifm-color-primary) 35%, transparent);
  }
}