Hextra v0.13

Hextra v0.13.0 تجربه جستجوی کاملاً جدیدی که در موبایل و دسکتاپ به‌روانی کار می‌کند، شورت‌کد گالری جدید با لایت‌باکس، هشدارهای جمع‌شدنی، بسته‌های آیکون راه دور و رندر بهبودیافته نوت‌بوک‌های Jupyter را به همراه بهبودهای پایداری جستجو و رفع اشکالات ارائه می‌دهد.

راهنمای ارتقا

برای بیشتر سایت‌ها تغییر شکست‌آمیزی وجود ندارد. با استفاده از Hugo Modules به‌روزرسانی کنید:

hugo mod get -u github.com/imfing/hextra

اگر رابط کاربری جستجو را با CSS سفارشی کرده‌اید، بخش تغییرات CSS جستجو را ببینید.

نکات برجسته

• تجربه جستجوی کاملاً جدید که در موبایل و دسکتاپ به‌روانی کار می‌کند
• شورت‌کد گالری با لایت‌باکس PhotoSwipe و چیدمان‌های شبکه‌ای، کاروسلی و موزاییکی
• هشدارهای جمع‌شدنی با عنوان سفارشی، سازگار با calloutهای Obsidian
• بسته‌های آیکون راه دور: Lucide، Tabler Icons و Simple Icons
• رندر بهبودیافته نوت‌بوک‌های Jupyter با نشانگرهای In/Out و انواع خروجی بیشتر
• پارشیال‌های سفارشی بخش‌های صفحه برای درج محتوا در اطراف بدنه صفحه
• اثرانگشت‌گذاری ایندکس جستجو و نتایج جستجوی تمیزتر

ویژگی‌های جدید

تجربه جستجوی جدید

جستجو به‌طور کامل به‌صورت یک دیالوگ به سبک پالت فرمان بازطراحی شده و اکنون در موبایل و دسکتاپ به‌روانی کار می‌کند. در دسکتاپ، در هر صفحه ⌘+K (در Windows و Linux، Ctrl+K) یا / را فشار دهید تا باز شود. در موبایل، روی آیکون جستجو در نوار ناوبری ضربه بزنید تا همان دیالوگ کامل جستجو باز شود.

نتایج با برچسب‌های مسیر راهنما (breadcrumb) نمایش داده می‌شوند تا مشخص باشد هر نتیجه در کجای سایت قرار دارد، کل دیالوگ با صفحه‌کلید قابل استفاده است و باز و بسته شدن آن با انیمیشن‌های نرم همراه است. برای استفاده از دکمه فقط-آیکون در دسکتاپ نیز، params.icon را روی آیتم منوی جستجو تنظیم کنید:

menu:
  main:
    - name: Search
      weight: 5
      params:
        type: search
        icon: search

نتایج جستجو نیز اکنون تمیزتر هستند: تگ‌های HTML از گزیده‌ها حذف می‌شوند، نشانه‌گذاری درون‌خطی در انکرهای سرتیتر به‌درستی مدیریت می‌شود و فایل داده جستجو در محیط تولید اثرانگشت‌گذاری می‌شود تا به‌روزرسانی‌های ایندکس بلافاصله پس از استقرار اعمال شوند.

شورت‌کد گالری

شورت‌کد gallery جدید مجموعه‌ای از تصاویر را با لایت‌باکس تعاملی PhotoSwipe نمایش می‌دهد که شامل نمایش تمام‌صفحه، ناوبری قبلی/بعدی، زیرنویس و پشتیبانی از صفحه‌کلید است.

{{< gallery >}}
  {{< gallery-item src="https://picsum.photos/id/1015/1600/1200" thumb="https://picsum.photos/id/1015/800/600" width="1600" height="1200" caption="دره رودخانه" >}}
  {{< gallery-item src="https://picsum.photos/id/1018/1600/1200" thumb="https://picsum.photos/id/1018/800/600" width="1600" height="1200" caption="دریاچه کوهستانی" >}}
  {{< gallery-item src="https://picsum.photos/id/1019/1600/1200" thumb="https://picsum.photos/id/1019/800/600" width="1600" height="1200" caption="مسیر جنگلی" >}}
{{< /gallery >}}

سه نوع چیدمان از طریق پارامتر type در دسترس است: چیدمان یکنواخت grid (پیش‌فرض)، کاروسل carousel با اسکرول افقی و چیدمان mosaic که در آن آیتم‌ها می‌توانند چند ستون یا ردیف را در بر بگیرند. منابع بسته صفحه محلی، دارایی‌های سراسری، فایل‌های استاتیک و URLهای راه دور همگی به‌عنوان منبع تصویر پشتیبانی می‌شوند.

هشدارهای جمع‌شدنی

هشدارها اکنون از نحو گسترش‌یافته‌ای برای محتوای جمع‌شونده و عنوان‌های سفارشی پشتیبانی می‌کنند. برای جمع‌شدنی کردن هشدار، + یا - را بعد از نوع هشدار اضافه کنید و برای تنظیم عنوان، متنی بعد از نشانگر بنویسید. این نحو با calloutهای Obsidian سازگار است.

> [!TIP]- آیا هشدارها جمع‌شدنی هستند؟
> بله. هشدارهای جمع‌شدنی هنگام بسته بودن، محتوا را پنهان می‌کنند.

بسته‌های آیکون راه دور

علاوه بر مجموعه داخلی Heroicons، اکنون می‌توان آیکون‌ها را در صورت نیاز از بسته‌های آیکون راه دور با استفاده از پیشوند ارائه‌دهنده بارگذاری کرد:

ارائه‌دهندگان پشتیبانی‌شده Lucide، Tabler Icons و Simple Icons هستند. آیکون‌ها در زمان ساخت واکشی می‌شوند و در هر جایی که Hextra نام آیکون می‌پذیرد کار می‌کنند، از جمله کارت‌ها، تب‌ها، نشان‌ها، callout‌ها و آیتم‌های منوی نوار ناوبری.

برای نمونه، در نشان‌ها و کارت‌ها:

{{< badge content="Hugo" icon="simple:hugo" >}}
{{< badge content="Markdown" icon="simple:markdown" >}}

{{< cards >}}
  {{< card link="https://lucide.dev/icons/" title="Lucide" icon="lucide:feather" >}}
  {{< card link="https://tabler.io/icons" title="Tabler Icons" icon="tabler:brand-tabler" >}}
  {{< card link="https://simpleicons.org/" title="Simple Icons" icon="simple:simpleicons" >}}
{{< /cards >}}

رندر بهبودیافته نوت‌بوک Jupyter

شورت‌کد jupyter به‌طور قابل توجهی بهبود یافته و اکنون از ردیابی خطاها (traceback)، جریان‌های stderr، SVG، Markdown، LaTeX، JSON، سلول‌های خام، پیوست‌ها، ابرداده خروجی و ابرداده نمایانی سلول پشتیبانی می‌کند. نشانگرهای اجرای In [N]:/Out[N]: به سبک Jupyter را می‌توان با پارامتر جدید prompts نمایش داد:

{{< jupyter src="notebook.ipynb" prompts=true >}}

بخش‌های سفارشی صفحه

هوک‌های سفارشی‌سازی جدید به شما امکان می‌دهند با ایجاد هر یک از این پارشیال‌ها در سایت خود، محتوا را در اطراف بدنه هر صفحه درج کنید:

layouts/_partials/custom/page-begin.html
layouts/_partials/custom/content-begin.html
layouts/_partials/custom/content-end.html
layouts/_partials/custom/page-end.html

هر پارشیال صفحه فعلی Hugo را به‌عنوان زمینه دریافت می‌کند.

تغییرات CSS جستجو

جعبه جستجوی درون‌خطی با یک دیالوگ جایگزین شده است، بنابراین کلاس hextra-search-wrapper دیگر وجود ندارد. اگر رابط کاربری جستجو را با CSS سفارشی کرده‌اید، به‌جای آن از کلاس‌های جدید hextra-search-trigger و hextra-search-dialog استفاده کنید. فهرست کامل کلاس‌های جستجو در مستندات CSS سفارشی آمده است.

رفع اشکالات

• رندر فوری نمودارهای Mermaid که هنگام بارگذاری صفحه قابل مشاهده هستند
• اصلاح مقیاس‌بندی نمودارهای Mermaid هنگام ترجیح حرکت کاهش‌یافته
• انتخاب CSS سازگار KaTeX برای رندرکننده ریاضی Hugo
• بازگشت به درخت صفحات در منوی موبایل وقتی نوار کناری هیچ آیتم مبتنی بر صفحه ندارد
• تعیین مسیر پیوندهای Markdown نسبی به صفحه در هوک رندر پیوند
• مدیریت نشانه‌گذاری درون‌خطی در فرگمنت‌های سرتیتر برای جستجو
• به‌روزرسانی کلیدهای پیکربندی زبان Hugo به قراردادهای جدید
• آیتم‌های منوی آیکون‌دار نوار ناوبری اکنون با پیوندهای tel: و سایر پیوندهای غیر HTTP کار می‌کنند
• رفع فاصله‌های جاافتاده بین ویژگی‌های HTML در کارت‌ها و پیوندها، و تگ‌های بسته‌نشده در شورت‌کدهای hero تودرتو
• رفع خطاهای ساخت شورت‌کد گالری در Windows

مشارکت‌کنندگان

از مشارکت‌کنندگان این انتشار سپاسگزاریم:

• @bombsimon - حذف تگ‌های HTML از نتایج جستجو
• @yuri1969 - رفع مقیاس‌بندی نمودار Mermaid با حرکت کاهش‌یافته
• @muhammadkholidb - نمایش مستندات Roled در ویترین
• @farmacia-cambie - پشتیبانی از پیوندهای tel: در آیتم‌های منوی آیکون‌دار نوار ناوبری
• @hoshsadiq - رفع فاصله‌گذاری ویژگی‌های HTML و شورت‌کدهای hero تودرتو
• @avighnac - رفع ساخت شورت‌کد گالری در Windows

تغییرات کامل: https://github.com/imfing/hextra/compare/v0.12.3...v0.13.0