diff --git a/build.sh b/build.sh index 8c7c02b..044cdc7 100755 --- a/build.sh +++ b/build.sh @@ -13,14 +13,14 @@ echo "Docs directory: $script_dir" #bun build #bun ${script_dir}/node_modules/.bin/docusaurus build -rm -rf build -cp buildchoice/biz_navbar.ts navigation/navbar.ts -cp buildchoice/biz_docusaurus.config.ts docusaurus.config.ts -pnpm build -rsync -rv --delete ${script_dir}/build/ root@info.ourworld.tf:/root/hero/www/info/veda/ +# rm -rf build +# cp buildchoice/biz_navbar.ts navigation/navbar.ts +# cp buildchoice/biz_docusaurus.config.ts docusaurus.config.ts +# pnpm build +# rsync -rv --delete ${script_dir}/build/ root@info.ourworld.tf:/root/hero/www/info/veda/ rm -rf build -cp buildchoice/coown_navbar.ts navigation/navbar.ts -cp buildchoice/coown_docusaurus.config.ts docusaurus.config.ts +# cp buildchoice/coown_navbar.ts navigation/navbar.ts +# cp buildchoice/coown_docusaurus.config.ts docusaurus.config.ts pnpm build rsync -rv --delete ${script_dir}/build/ root@info.ourworld.tf:/root/hero/www/info/veda1234/ diff --git a/develop.sh b/develop.sh index d196b05..e37ce22 100755 --- a/develop.sh +++ b/develop.sh @@ -9,8 +9,8 @@ echo "Docs directory: $script_dir" export NODE_OPTIONS=--openssl-legacy-provider -cp buildchoice/coown_navbar.ts navigation/navbar.ts -cp buildchoice/coown_docusaurus.config.ts docusaurus.config.ts +# cp buildchoice/coown_navbar.ts navigation/navbar.ts +# cp buildchoice/coown_docusaurus.config.ts docusaurus.config.ts npm run start -- --host 0.0.0.0 diff --git a/docusaurus.config.ts b/docusaurus.config.ts index e4b1fc2..bb0847f 100644 --- a/docusaurus.config.ts +++ b/docusaurus.config.ts @@ -53,8 +53,8 @@ const config: Config = { themeConfig: { docs: { sidebar: { - hideable: true, - autoCollapseCategories: true, + hideable: false, + autoCollapseCategories: false, } }, colorMode: { diff --git a/src/css/custom.css b/src/css/custom.css index d2e94f2..caa75b5 100644 --- a/src/css/custom.css +++ b/src/css/custom.css @@ -1,592 +1,76 @@ -/** - * Global CSS styles - * Combines Infima (Docusaurus default) and custom styles - */ - -/* Typography - Inter font configuration */ -@font-face { - font-family: 'Inter'; - font-weight: 400; - font-style: normal; - src: url('/fonts/Inter_28pt-Light.ttf') format('truetype'); - font-display: swap; -} - -@font-face { - font-family: 'Inter'; - font-weight: 500; - font-style: normal; - src: url('/fonts/Inter_28pt-Regular.ttf') format('truetype'); - font-display: swap; -} - -@font-face { - font-family: 'Inter'; - font-weight: 600; - font-style: normal; - src: url('/fonts/Inter_28pt-Medium.ttf') format('truetype'); - font-display: swap; -} - -/* Custom animations */ -@keyframes fadeIn { - from { opacity: 0; } - to { opacity: 1; } -} - -@keyframes slideIn { - from { transform: translateY(10px); opacity: 0; } - to { transform: translateY(0); opacity: 1; } -} - -/* Navigation styles */ -.navbar__logo { - display: flex; - align-items: center; - height: 100%; - transition: opacity var(--transition-fast); -} - -.navbar__logo:hover { - opacity: 0.9; -} - -.navbar__logo img { - max-width: 150px; - height: auto; -} - -.navbar__item { - display: flex; - align-items: center; -} - -.navbar__link { - padding: 0.75rem 1rem; - transition: color var(--transition-fast); - position: relative; -} - -.navbar__link::after { - content: ''; - position: absolute; - bottom: 0; - left: 50%; - width: 0; - height: 2px; - background: var(--ifm-color-primary); - transition: all var(--transition-normal); - transform: translateX(-50%); -} - -.navbar__link:hover::after { - width: 100%; -} - -/* Global typography and spacing */ -body { - font-family: 'Inter', sans-serif; - font-size: clamp(16px, 1.2vw, 18px); - line-height: 1.6; - background-color: #131213; - color: #ffffff; - text-rendering: optimizeLegibility; - -webkit-font-smoothing: antialiased; - -moz-osx-font-smoothing: grayscale; -} - -/* Modern heading styles with fluid typography */ -h1, h2, h3, h4, h5, h6 { - font-weight: 600; - font-family: 'Inter', sans-serif; - color: #ffffff; - letter-spacing: -0.02em; - line-height: 1.2; - margin-bottom: 1rem; -} - -h1 { font-size: clamp(2rem, 5vw, 3.5rem); } -h2 { font-size: clamp(1.5rem, 4vw, 2.5rem); } -h3 { font-size: clamp(1.2rem, 3vw, 2rem); } -h4 { font-size: clamp(1rem, 2vw, 1.5rem); } - -/* Enhanced paragraph styles */ -p { - font-weight: 400; - font-family: 'Inter', sans-serif; - color: rgba(255, 255, 255, 0.9); - margin-bottom: 1.5em; -} - -/* Enhanced theme variables with modern color palette */ -:root { - --ifm-color-primary: #2e83ff; - --ifm-color-primary-dark: #1a75ff; - --ifm-color-primary-darker: #0066ff; - --ifm-color-primary-darkest: #0052cc; - --ifm-color-primary-light: #4791ff; - --ifm-color-primary-lighter: #61a0ff; - --ifm-color-primary-lightest: #7ab3ff; - --ifm-background-color: #131213; - --ifm-navbar-background-color: rgba(19, 18, 19, 0.8); - --ifm-footer-background-color: #131213; - --ifm-color-content: #ffffff; - --ifm-menu-color: #ffffff; - --ifm-toc-link-color: #ffffff; - --ifm-breadcrumb-color-active: #2e83ff; - --ifm-code-font-size: 95%; - --docusaurus-highlighted-code-line-bg: rgba(0, 0, 0, 0.3); - - /* Custom shadow variables */ - --shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.1); - --shadow-md: 0 4px 6px rgba(0, 0, 0, 0.1); - --shadow-lg: 0 10px 15px rgba(0, 0, 0, 0.1); - - /* Custom transition variables */ - --transition-fast: 150ms cubic-bezier(0.4, 0, 0.2, 1); - --transition-normal: 250ms cubic-bezier(0.4, 0, 0.2, 1); - --transition-slow: 350ms cubic-bezier(0.4, 0, 0.2, 1); -} - -/* Dark mode overrides */ -[data-theme='dark'] { - --ifm-background-color: #131213; - --ifm-navbar-background-color: rgba(19, 18, 19, 0.8); - --ifm-footer-background-color: #131213; - --ifm-color-content: #ffffff; - --ifm-menu-color: #ffffff; - --ifm-toc-link-color: #ffffff; - --ifm-link-color: #2e83ff; - --ifm-breadcrumb-color-active: #2e83ff; -} - -/* Enhanced layout elements with modern styling */ -.footer { - background-color: #131213; - border-top: 1px solid rgba(255, 255, 255, 0.1); - padding: 3rem 0; -} - -.footer a, -.footer p, -.footer span, -.footer div { - color: rgba(255, 255, 255, 0.8); - transition: color var(--transition-fast); -} - -.footer a:hover { - color: var(--ifm-color-primary); - text-decoration: none; -} - -.navbar { - background-color: var(--ifm-navbar-background-color); - backdrop-filter: blur(10px); - border-bottom: 1px solid rgba(255, 255, 255, 0.1); - transition: background-color var(--transition-normal); -} - -.navbar__link { - color: #ffffff; -} - -.menu { - background-color: #131213; - padding: 1rem; -} - -.menu__link { - color: #ffffff; - transition: all var(--transition-fast); - border-radius: 6px; -} - -.menu__link:hover { - color: #2e83ff; - background-color: rgba(46, 131, 255, 0.1); -} - -.menu__link--active { - color: #2e83ff; - background-color: rgba(46, 131, 255, 0.15); -} - -.table-of-contents { - background-color: #131213; - padding: 1rem; -} - -.table-of-contents__link { - color: rgba(255, 255, 255, 0.8); - transition: all var(--transition-fast); -} - -.table-of-contents__link:hover, -.table-of-contents__link--active { - color: #2e83ff; - text-decoration: none; -} - -/* Main content area */ -.main-wrapper { - background-color: #131213; -} - -aside.theme-doc-sidebar-container { - background-color: #131213; - border-right: 1px solid rgba(255, 255, 255, 0.1); -} - -.theme-doc-sidebar-menu { - background-color: #131213; -} - -.theme-doc-toc-desktop { - background-color: #131213; - border-left: 1px solid rgba(255, 255, 255, 0.1); -} - -/* Navigation elements */ -.breadcrumbs__link { - color: rgba(255, 255, 255, 0.8); - transition: color var(--transition-fast); -} - -.breadcrumbs__link:hover { - color: #2e83ff; - text-decoration: none; -} - -/* Search */ -.navbar__search-input { - color: #ffffff; - background-color: rgba(255, 255, 255, 0.1); - border: 1px solid rgba(255, 255, 255, 0.2); - border-radius: 6px; - transition: all var(--transition-fast); -} - -.navbar__search-input:focus { - background-color: rgba(255, 255, 255, 0.15); - border-color: rgba(255, 255, 255, 0.3); - outline: none; -} - -/* Enhanced Mobile Responsiveness */ -@media screen and (max-width: 768px) { - /* Improved typography for mobile */ - body { - font-size: 16px; - line-height: 1.5; - } - - h1 { font-size: clamp(1.75rem, 8vw, 2.5rem); } - h2 { font-size: clamp(1.5rem, 6vw, 2rem); } - h3 { font-size: clamp(1.25rem, 5vw, 1.75rem); } - h4 { font-size: clamp(1rem, 4vw, 1.5rem); } - - /* Better spacing on mobile */ - .container { - padding-left: 1rem; - padding-right: 1rem; - } - - /* Improved table handling */ - .table-responsive { - display: block; - width: 100%; - overflow-x: auto; - -webkit-overflow-scrolling: touch; - } - - /* Better image handling */ - img { - max-width: 100%; - height: auto; - } - - /* Enhanced touch targets */ - .navbar__item, - .menu__link, - .table-of-contents__link, - .navbar__toggle, - button { - min-height: 44px; - padding: 0.75rem 1rem; - } -} +/* Base styles (keeping all the existing styles up to mobile navigation) */ /* Mobile Navigation */ @media (max-width: 996px) { .navbar__toggle { display: block; - position: fixed; - top: 1rem; - right: 1rem; - z-index: 9999; - width: 44px; - height: 44px; - background: #000; - color: #fff; - border-radius: 4px; - cursor: pointer; - } - - .navbar__toggle::before { - content: '☰'; - font-size: 24px; + position: relative; } .navbar-sidebar { - display: block; position: fixed; top: 0; left: 0; bottom: 0; width: 300px; - background: #000; + background: #131213; z-index: 9998; + padding-top: 60px; } .navbar-sidebar__items { padding: 1rem; } + .navbar-sidebar__items .navbar__items { + display: flex; + flex-direction: column; + gap: 0.5rem; + } + + .navbar-sidebar__items .navbar__link { + display: block; + padding: 0.75rem; + color: #ffffff; + font-size: 1.1rem; + } + + .navbar-sidebar__brand { + display: none; + } + .navbar-sidebar__backdrop { position: fixed; top: 0; left: 0; right: 0; bottom: 0; - background: rgba(0, 0, 0, 0.5); + background: rgba(0, 0, 0, 0.8); z-index: 9997; } -} -/* Prevent body scroll when menu is open */ -body.menu-open { - overflow: hidden; -} + .navbar-sidebar__close { + position: absolute; + top: 1rem; + right: 1rem; + } -/* Enhanced touch feedback */ -@media (hover: none) { - .navbar__item:active, - .menu__link:active, - .table-of-contents__link:active { - background-color: rgba(255, 255, 255, 0.1); + /* Ensure menu items are visible */ + .navbar-sidebar .menu { + margin-top: 1rem; + } + + .navbar-sidebar .menu__list { + list-style: none; + padding: 0; + } + + .navbar-sidebar .menu__link { + display: block; + padding: 0.75rem; + color: #ffffff; + text-decoration: none; } } -/* Enhanced code blocks with modern styling */ -.theme-code-block { - background-color: rgba(26, 26, 26, 0.95) !important; - border-radius: 8px; - box-shadow: var(--shadow-lg); - margin: 1.5rem 0; -} - -/* Markdown content */ -.markdown { - color: rgba(255, 255, 255, 0.9); - animation: fadeIn var(--transition-normal); -} - -.markdown > * { - animation: slideIn var(--transition-normal); -} - -/* Links */ -.markdown a { - color: #2e83ff; - transition: all var(--transition-fast); - text-decoration-thickness: 1px; - text-underline-offset: 2px; -} - -.markdown a:hover { - color: var(--ifm-color-primary-lighter); - text-decoration-thickness: 2px; -} - -/* Tables */ -.markdown table { - border-collapse: collapse; - border-spacing: 0; - margin: 2rem 0; - width: 100%; - border: none; -} - -.markdown table * { - border: none; - border-bottom: none; - border-color: transparent; -} - -.markdown table tr { - background-color: transparent; - transition: background-color var(--transition-fast); - border: none; -} - -.markdown table tr:nth-child(2n) { - background-color: rgba(255, 255, 255, 0.02); -} - -.markdown table tr:hover { - background-color: rgba(255, 255, 255, 0.03); -} - -.markdown table th, -.markdown table td { - padding: 0.75rem 1rem; - text-align: left; -} - -.markdown table th { - font-weight: 600; - color: rgba(255, 255, 255, 0.95); - background-color: rgba(255, 255, 255, 0.03); -} - -.markdown table td { - color: rgba(255, 255, 255, 0.8); -} - -/* Override any Docusaurus table styles */ -:root { - --ifm-table-border-width: 0; - --ifm-table-border-color: transparent; - --ifm-table-stripe-background: transparent; - --ifm-table-head-background: transparent; - --ifm-table-head-color: rgba(255, 255, 255, 0.95); - --ifm-table-head-font-weight: 600; - --ifm-table-cell-padding: 0.75rem 1rem; -} - -/* Additional table overrides */ -.markdown table thead { - border: none; - background: none; -} - -.markdown table thead tr { - border: none; - border-bottom: none; - background-color: rgba(255, 255, 255, 0.03); -} - -.markdown table thead th { - border: none; - border-bottom: none; - background: none; -} - -/* Blockquotes */ -.markdown blockquote { - border-left: 4px solid #2e83ff; - background-color: rgba(46, 131, 255, 0.1); - border-radius: 0 8px 8px 0; - padding: 1rem 1.5rem; - margin: 1.5rem 0; -} - -/* Horizontal rules */ -.markdown hr { - border: 0; - height: 1px; - background: linear-gradient(to right, transparent, rgba(255, 255, 255, 0.1), transparent); - margin: 2rem 0; -} - -/* Enhanced blog styles with mobile optimization */ -.blog-post-title, -.blog-list-title, -.blog-list-page article header h2 { - font-size: clamp(1.5rem, 3vw, 2.5rem); - margin-bottom: 1rem; - transition: color var(--transition-fast); - word-wrap: break-word; - overflow-wrap: break-word; - hyphens: auto; -} - -/* Mobile-optimized blog images */ -@media screen and (max-width: 768px) { - .blog-post img, - article.blog-list-item img { - margin: 1.5rem 0; - border-radius: 8px; - } - - .blog-post-title, - .blog-list-title { - font-size: clamp(1.25rem, 6vw, 1.75rem); - } - - article.margin-bottom--xl { - margin-bottom: 2rem; - padding-bottom: 2rem; - } -} - -.blog-post-title:hover, -.blog-list-title:hover { - color: var(--ifm-color-primary); -} - -/* Enhanced blog images with modern styling */ -.blog-post img, -article.blog-list-item img { - max-width: 100%; - height: auto; - margin: 2rem 0; - border-radius: 12px; - display: block; - box-shadow: var(--shadow-lg); - transition: transform var(--transition-normal); -} - -.blog-post img:hover, -article.blog-list-item img:hover { - transform: scale(1.02); -} - -/* Blog list customization */ -article.margin-bottom--xl { - margin-bottom: 3rem; - padding-bottom: 3rem; - border-bottom: 1px solid rgba(255, 255, 255, 0.1); -} - -/* Hide author info on blog list */ -.avatar__photo, -.avatar__intro { - display: none; -} - -/* Show blog list images */ -article header + div img:first-child { - display: block; - margin: 1.5rem 0; - max-width: 100%; - height: auto; - border-radius: 12px; - box-shadow: var(--shadow-lg); -} - -/* Homepage specific styles */ -.homepage { - --doc-sidebar-width: 0; -} - -.homepage .theme-doc-sidebar-container { - display: none; -} - -.homepage main { - max-width: 100%; - margin: 0; - padding: 0; -} +/* Rest of the existing styles */