@tnotesjs/core 0.0.2 → 0.0.4

package/vitepress/theme/styles/components/swiper.scss

@@ -1,255 +1,255 @@
-/**
- * Swiper 组件全局样式
- * 由于 Swiper 组件动态生成 DOM，所有样式都需要是全局的
- */
-
-/* ===================================== */
-/* #region Swiper Tabs                   */
-/* ===================================== */
-
-.tn-swiper-tabs {
-  position: relative;
-  z-index: 20;
-  display: flex;
-  overflow-x: auto;
-  overflow-y: hidden;
-  gap: 0.5rem;
-  background: var(--vp-c-bg);
-  border-bottom: 1px solid var(--vp-c-divider);
-  border-radius: 8px 8px 0 0;
-  background-color: var(--vp-code-tab-bg);
-  box-shadow: inset 0 -1px var(--vp-code-tab-divider);
-}
-
-.tn-swiper-tabs::-webkit-scrollbar {
-  height: 4px;
-}
-
-.tn-swiper-tabs::-webkit-scrollbar-track {
-  background: transparent;
-}
-
-.tn-swiper-tabs::-webkit-scrollbar-thumb {
-  background: var(--vp-c-divider);
-  border-radius: 2px;
-}
-
-.tn-swiper-tabs::-webkit-scrollbar-thumb:hover {
-  background: var(--vp-c-text-3);
-}
-
-/* #endregion */
-
-/* ===================================== */
-/* #region Tab 按钮                      */
-/* ===================================== */
-
-.tn-tab {
-  position: relative;
-  padding: 0.25rem 0.75rem;
-  line-height: 2rem;
-  border-bottom: 1px solid transparent;
-  background: transparent;
-  cursor: pointer;
-  font-size: 0.875rem;
-  white-space: nowrap;
-  color: var(--vp-code-tab-text-color);
-  transition: color 0.25s ease, transform 0.2s ease;
-  border: none;
-}
-
-.tn-tab::after {
-  position: absolute;
-  right: 8px;
-  bottom: -1px;
-  left: 8px;
-  z-index: 1;
-  height: 2px;
-  border-radius: 2px;
-  content: '';
-  background-color: transparent;
-  transition: background-color 0.25s ease;
-}
-
-.tn-tab:hover {
-  color: var(--vp-code-tab-active-text-color);
-  transform: translateY(-1px);
-}
-
-.tn-tab.active {
-  color: var(--vp-code-tab-active-text-color);
-  font-weight: 500;
-}
-
-.tn-tab.active::after {
-  background-color: var(--vp-code-tab-active-bar-color);
-}
-
-/* #endregion */
-
-/* ===================================== */
-/* #region Tab 导航按钮                  */
-/* ===================================== */
-
-.tn-tab-nav {
-  position: absolute;
-  top: 50%;
-  transform: translateY(-50%);
-  background: transparent;
-  border: none;
-  font-size: 0.8rem;
-  cursor: pointer;
-  color: var(--vp-code-tab-text-color);
-  padding: 0 0.3rem;
-  transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
-  user-select: none;
-  border-radius: 4px;
-  line-height: 1;
-}
-
-/* 只对翻页按钮（非分隔符）生效的 hover 样式 */
-.tn-tab-prev:hover,
-.tn-tab-next:hover {
-  color: var(--vp-code-tab-active-bar-color);
-  font-size: 1rem;
-  transform: translateY(-50%) scale(1.5);
-}
-
-.tn-tab-nav:active {
-  transform: translateY(-50%) scale(0.95);
-}
-
-.tn-tab-prev {
-  left: 0.5rem;
-}
-
-.tab-tab-line {
-  position: absolute;
-  left: 1.1rem;
-  top: 50%;
-  transform: translateY(-50%);
-  color: var(--vp-code-tab-active-bar-color);
-  user-select: none;
-  opacity: 0.5;
-  /* 移除 cursor，表示不可交互 */
-  cursor: default;
-}
-
-.tn-tab-next {
-  left: 1.5rem;
-}
-
-/* #endregion */
-
-/* ===================================== */
-/* #region Swiper 容器                   */
-/* ===================================== */
-
-.swiper-container {
-  width: 100%;
-  position: relative;
-  overflow: hidden;
-  margin: 1rem 0;
-  transition: height 0.3s ease;
-  border-radius: 0 0 8px 8px;
-  background: var(--vp-c-bg-soft);
-}
-
-.swiper-container img {
-  display: block;
-  max-width: 100%;
-  margin: 0 auto;
-  height: auto;
-  object-fit: contain;
-  transition: opacity 0.3s ease;
-}
-
-.tn-swiper {
-  margin: 1.5rem 0;
-  border-radius: 8px;
-  overflow: hidden;
-  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
-  transition: box-shadow 0.3s ease;
-}
-
-.tn-swiper:hover {
-  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.15);
-}
-
-.swiper-slide {
-  animation: swiperFadeIn 0.3s ease-out;
-}
-
-/* #endregion */
-
-/* ===================================== */
-/* #region 暗色模式                      */
-/* ===================================== */
-
-html.dark .tn-swiper {
-  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.3);
-}
-
-html.dark .tn-swiper:hover {
-  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.4);
-}
-
-html.dark .swiper-container {
-  background: var(--vp-c-bg);
-}
-
-/* #endregion */
-
-/* ===================================== */
-/* #region 响应式                        */
-/* ===================================== */
-
-@media (max-width: 640px) {
-  .tn-swiper-tabs {
-    gap: 0.25rem;
-  }
-
-  .tn-tab {
-    padding: 0.2rem 0.5rem;
-    font-size: 0.8rem;
-    line-height: 1.8rem;
-  }
-
-  .tn-tab-nav {
-    font-size: 0.7rem;
-    padding: 0 0.2rem;
-  }
-
-  .tn-tab-nav:hover {
-    font-size: 0.85rem;
-  }
-
-  .tn-tab-prev {
-    left: 0.3rem;
-  }
-
-  .tab-tab-line {
-    left: 0.8rem;
-  }
-
-  .tn-tab-next {
-    left: 1.2rem;
-  }
-}
-
-/* #endregion */
-
-/* ===================================== */
-/* #region 动画                          */
-/* ===================================== */
-
-@keyframes swiperFadeIn {
-  from {
-    opacity: 0;
-  }
-  to {
-    opacity: 1;
-  }
-}
-
-/* #endregion */
+/**
+ * Swiper 组件全局样式
+ * 由于 Swiper 组件动态生成 DOM，所有样式都需要是全局的
+ */
+
+/* ===================================== */
+/* #region Swiper Tabs                   */
+/* ===================================== */
+
+.tn-swiper-tabs {
+  position: relative;
+  z-index: 20;
+  display: flex;
+  overflow-x: auto;
+  overflow-y: hidden;
+  gap: 0.5rem;
+  background: var(--vp-c-bg);
+  border-bottom: 1px solid var(--vp-c-divider);
+  border-radius: 8px 8px 0 0;
+  background-color: var(--vp-code-tab-bg);
+  box-shadow: inset 0 -1px var(--vp-code-tab-divider);
+}
+
+.tn-swiper-tabs::-webkit-scrollbar {
+  height: 4px;
+}
+
+.tn-swiper-tabs::-webkit-scrollbar-track {
+  background: transparent;
+}
+
+.tn-swiper-tabs::-webkit-scrollbar-thumb {
+  background: var(--vp-c-divider);
+  border-radius: 2px;
+}
+
+.tn-swiper-tabs::-webkit-scrollbar-thumb:hover {
+  background: var(--vp-c-text-3);
+}
+
+/* #endregion */
+
+/* ===================================== */
+/* #region Tab 按钮                      */
+/* ===================================== */
+
+.tn-tab {
+  position: relative;
+  padding: 0.25rem 0.75rem;
+  line-height: 2rem;
+  border-bottom: 1px solid transparent;
+  background: transparent;
+  cursor: pointer;
+  font-size: 0.875rem;
+  white-space: nowrap;
+  color: var(--vp-code-tab-text-color);
+  transition: color 0.25s ease, transform 0.2s ease;
+  border: none;
+}
+
+.tn-tab::after {
+  position: absolute;
+  right: 8px;
+  bottom: -1px;
+  left: 8px;
+  z-index: 1;
+  height: 2px;
+  border-radius: 2px;
+  content: '';
+  background-color: transparent;
+  transition: background-color 0.25s ease;
+}
+
+.tn-tab:hover {
+  color: var(--vp-code-tab-active-text-color);
+  transform: translateY(-1px);
+}
+
+.tn-tab.active {
+  color: var(--vp-code-tab-active-text-color);
+  font-weight: 500;
+}
+
+.tn-tab.active::after {
+  background-color: var(--vp-code-tab-active-bar-color);
+}
+
+/* #endregion */
+
+/* ===================================== */
+/* #region Tab 导航按钮                  */
+/* ===================================== */
+
+.tn-tab-nav {
+  position: absolute;
+  top: 50%;
+  transform: translateY(-50%);
+  background: transparent;
+  border: none;
+  font-size: 0.8rem;
+  cursor: pointer;
+  color: var(--vp-code-tab-text-color);
+  padding: 0 0.3rem;
+  transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
+  user-select: none;
+  border-radius: 4px;
+  line-height: 1;
+}
+
+/* 只对翻页按钮（非分隔符）生效的 hover 样式 */
+.tn-tab-prev:hover,
+.tn-tab-next:hover {
+  color: var(--vp-code-tab-active-bar-color);
+  font-size: 1rem;
+  transform: translateY(-50%) scale(1.5);
+}
+
+.tn-tab-nav:active {
+  transform: translateY(-50%) scale(0.95);
+}
+
+.tn-tab-prev {
+  left: 0.5rem;
+}
+
+.tab-tab-line {
+  position: absolute;
+  left: 1.1rem;
+  top: 50%;
+  transform: translateY(-50%);
+  color: var(--vp-code-tab-active-bar-color);
+  user-select: none;
+  opacity: 0.5;
+  /* 移除 cursor，表示不可交互 */
+  cursor: default;
+}
+
+.tn-tab-next {
+  left: 1.5rem;
+}
+
+/* #endregion */
+
+/* ===================================== */
+/* #region Swiper 容器                   */
+/* ===================================== */
+
+.swiper-container {
+  width: 100%;
+  position: relative;
+  overflow: hidden;
+  margin: 1rem 0;
+  transition: height 0.3s ease;
+  border-radius: 0 0 8px 8px;
+  background: var(--vp-c-bg-soft);
+}
+
+.swiper-container img {
+  display: block;
+  max-width: 100%;
+  margin: 0 auto;
+  height: auto;
+  object-fit: contain;
+  transition: opacity 0.3s ease;
+}
+
+.tn-swiper {
+  margin: 1.5rem 0;
+  border-radius: 8px;
+  overflow: hidden;
+  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
+  transition: box-shadow 0.3s ease;
+}
+
+.tn-swiper:hover {
+  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.15);
+}
+
+.swiper-slide {
+  animation: swiperFadeIn 0.3s ease-out;
+}
+
+/* #endregion */
+
+/* ===================================== */
+/* #region 暗色模式                      */
+/* ===================================== */
+
+html.dark .tn-swiper {
+  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.3);
+}
+
+html.dark .tn-swiper:hover {
+  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.4);
+}
+
+html.dark .swiper-container {
+  background: var(--vp-c-bg);
+}
+
+/* #endregion */
+
+/* ===================================== */
+/* #region 响应式                        */
+/* ===================================== */
+
+@media (max-width: 640px) {
+  .tn-swiper-tabs {
+    gap: 0.25rem;
+  }
+
+  .tn-tab {
+    padding: 0.2rem 0.5rem;
+    font-size: 0.8rem;
+    line-height: 1.8rem;
+  }
+
+  .tn-tab-nav {
+    font-size: 0.7rem;
+    padding: 0 0.2rem;
+  }
+
+  .tn-tab-nav:hover {
+    font-size: 0.85rem;
+  }
+
+  .tn-tab-prev {
+    left: 0.3rem;
+  }
+
+  .tab-tab-line {
+    left: 0.8rem;
+  }
+
+  .tn-tab-next {
+    left: 1.2rem;
+  }
+}
+
+/* #endregion */
+
+/* ===================================== */
+/* #region 动画                          */
+/* ===================================== */
+
+@keyframes swiperFadeIn {
+  from {
+    opacity: 0;
+  }
+  to {
+    opacity: 1;
+  }
+}
+
+/* #endregion */

package/vitepress/theme/styles/index.scss

@@ -1,25 +1,25 @@
-/**
- * 样式入口文件
- * 按顺序导入所有样式，确保正确的层叠优先级
- */
-
-/* 1. 基础层：CSS 变量和全局重置 */
-@use './base';
-
-/* 2. VitePress 覆盖层：覆盖默认主题样式 */
-@use './vitepress-override';
-
-/* 3. 布局层：全局布局样式 */
-@use './layout';
-
-/* 4. 组件全局层：跨组件共享的样式 */
-@use './components/swiper';
-@use './components/markmap';
-@use './components/collapse';
-/**
- * !404 不是一个有效的 Sass 标识符（不能以数字开头），需要为它添加一个别名
- */
-@use './components/404' as notfound;
-
-/* 5. 工具类和动画 */
-@use './utilities';
+/**
+ * 样式入口文件
+ * 按顺序导入所有样式，确保正确的层叠优先级
+ */
+
+/* 1. 基础层：CSS 变量和全局重置 */
+@use './base';
+
+/* 2. VitePress 覆盖层：覆盖默认主题样式 */
+@use './vitepress-override';
+
+/* 3. 布局层：全局布局样式 */
+@use './layout';
+
+/* 4. 组件全局层：跨组件共享的样式 */
+@use './components/swiper';
+@use './components/markmap';
+@use './components/collapse';
+/**
+ * !404 不是一个有效的 Sass 标识符（不能以数字开头），需要为它添加一个别名
+ */
+@use './components/404' as notfound;
+
+/* 5. 工具类和动画 */
+@use './utilities';

package/vitepress/theme/styles/layout.scss

@@ -1,62 +1,62 @@
-/**
- * 布局层样式
- * - 全局布局控制
- * - 响应式布局
- * - 特殊布局模式（侧边栏隐藏、全屏等）
- */
-
-/* ===================================== */
-/* #region 侧边栏隐藏模式                */
-/* ===================================== */
-
-.hide-sidebar .VPSidebar {
-  transform: translateX(-100%);
-  pointer-events: none;
-  transition: transform 0.25s ease, opacity 0.25s ease;
-}
-
-.hide-sidebar .VPNavBar {
-  background-color: var(--vp-nav-bg-color) !important;
-}
-
-/* 主体内容往左补齐，与导航栏标题左对齐 */
-.hide-sidebar .VPContent {
-  margin-left: 0 !important;
-  padding-left: calc((100vw - var(--vp-layout-max-width)) / 2) !important;
-}
-
-.hide-sidebar .VPDoc .content-container {
-  max-width: calc(
-    var(--vp-sidebar-width) + var(--tn-content-width, 688px) +
-      var(--vp-sidebar-width)
-  ) !important;
-}
-
-/* #endregion */
-
-/* ===================================== */
-/* #region 全屏内容模式                  */
-/* ===================================== */
-
-.content-fullscreen .VPSidebar,
-.content-fullscreen .VPNav,
-.content-fullscreen .VPDocFooter,
-.content-fullscreen .VPNavBar {
-  display: none !important;
-}
-
-.content-fullscreen .VPContent {
-  margin: 0 !important;
-  padding: 0 2rem !important;
-  max-width: 100% !important;
-}
-
-.content-fullscreen body {
-  overflow: auto;
-}
-
-.content-fullscreen .VPDoc .content-container {
-  max-width: none !important;
-}
-
-/* #endregion */
+/**
+ * 布局层样式
+ * - 全局布局控制
+ * - 响应式布局
+ * - 特殊布局模式（侧边栏隐藏、全屏等）
+ */
+
+/* ===================================== */
+/* #region 侧边栏隐藏模式                */
+/* ===================================== */
+
+.hide-sidebar .VPSidebar {
+  transform: translateX(-100%);
+  pointer-events: none;
+  transition: transform 0.25s ease, opacity 0.25s ease;
+}
+
+.hide-sidebar .VPNavBar {
+  background-color: var(--vp-nav-bg-color) !important;
+}
+
+/* 主体内容往左补齐，与导航栏标题左对齐 */
+.hide-sidebar .VPContent {
+  margin-left: 0 !important;
+  padding-left: calc((100vw - var(--vp-layout-max-width)) / 2) !important;
+}
+
+.hide-sidebar .VPDoc .content-container {
+  max-width: calc(
+    var(--vp-sidebar-width) + var(--tn-content-width, 688px) +
+      var(--vp-sidebar-width)
+  ) !important;
+}
+
+/* #endregion */
+
+/* ===================================== */
+/* #region 全屏内容模式                  */
+/* ===================================== */
+
+.content-fullscreen .VPSidebar,
+.content-fullscreen .VPNav,
+.content-fullscreen .VPDocFooter,
+.content-fullscreen .VPNavBar {
+  display: none !important;
+}
+
+.content-fullscreen .VPContent {
+  margin: 0 !important;
+  padding: 0 2rem !important;
+  max-width: 100% !important;
+}
+
+.content-fullscreen body {
+  overflow: auto;
+}
+
+.content-fullscreen .VPDoc .content-container {
+  max-width: none !important;
+}
+
+/* #endregion */