diff --git a/docs/.vitepress/theme/components/Settings.vue b/docs/.vitepress/theme/components/Settings.vue index a0c4bee..e8353e5 100644 --- a/docs/.vitepress/theme/components/Settings.vue +++ b/docs/.vitepress/theme/components/Settings.vue @@ -7,11 +7,13 @@ const settingsStore = useSettingsStore() const primaryColor = ref(settingsStore.theme.primaryColor) const backgroundColor = ref(settingsStore.theme.backgroundColor) const blurAmount = ref(settingsStore.theme.blurAmount) +const videoBrightness = ref(settingsStore.theme.videoBrightness) watch(() => settingsStore.theme, (newTheme) => { primaryColor.value = newTheme.primaryColor backgroundColor.value = newTheme.backgroundColor blurAmount.value = newTheme.blurAmount + videoBrightness.value = newTheme.videoBrightness }, { deep: true }) const presetColors = [ @@ -36,6 +38,7 @@ const activeSection = ref('video') const sections = [ { id: 'video', name: '视频背景', icon: 'M15 10l4.553-2.276A1 1 0 0121 8.618v6.764a1 1 0 01-1.447.894L15 14M5 18h8a2 2 0 002-2V8a2 2 0 00-2-2H5a2 2 0 00-2 2v8a2 2 0 002 2z' }, + { id: 'brightness', name: '视频亮度', icon: 'M12 3v1m0 16v1m9-9h-1M4 12H3m15.364 6.364l-.707-.707M6.343 6.343l-.707-.707m12.728 0l-.707.707M6.343 17.657l-.707.707M16 12a4 4 0 11-8 0 4 4 0 018 0z' }, { id: 'theme', name: '主题颜色', icon: 'M7 21a4 4 0 01-4-4V5a2 2 0 012-2h4a2 2 0 012 2v12a4 4 0 01-4 4zm0 0h12a2 2 0 002-2v-4a2 2 0 00-2-2h-2.343M11 7.343l1.657-1.657a2 2 0 012.828 0l2.829 2.829a2 2 0 010 2.828l-8.486 8.485M7 17h.01' }, { id: 'background', name: '窗口背景', icon: 'M4 5a1 1 0 011-1h14a1 1 0 011 1v2a1 1 0 01-1 1H5a1 1 0 01-1-1V5zM4 13a1 1 0 011-1h6a1 1 0 011 1v6a1 1 0 01-1 1H5a1 1 0 01-1-1v-6zM16 13a1 1 0 011-1h2a1 1 0 011 1v6a1 1 0 01-1 1h-2a1 1 0 01-1-1v-6z' }, { id: 'blur', name: '模糊程度', icon: 'M15 12a3 3 0 11-6 0 3 3 0 016 0z M2.458 12C3.732 7.943 7.523 5 12 5c4.478 0 8.268 2.943 9.542 7-1.274 4.057-5.064 7-9.542 7-4.477 0-8.268-2.943-9.542-7z' } @@ -62,11 +65,17 @@ function updateBlur(amount: number) { settingsStore.updateTheme({ blurAmount: amount }) } +function updateBrightness(value: number) { + videoBrightness.value = value + settingsStore.updateTheme({ videoBrightness: value }) +} + function resetSettings() { settingsStore.resetTheme() primaryColor.value = settingsStore.theme.primaryColor backgroundColor.value = settingsStore.theme.backgroundColor blurAmount.value = settingsStore.theme.blurAmount + videoBrightness.value = settingsStore.theme.videoBrightness } function getVideoThumb(thumb: string) { @@ -127,6 +136,28 @@ function getVideoThumb(thumb: string) { +
+

视频亮度

+

调整视频遮罩亮度

+
+
+ 预览效果 +
+
+ + {{ Math.round(videoBrightness * 100) }}% +
+
+
+

主题颜色

自定义主题强调色

diff --git a/docs/.vitepress/theme/components/VideoBackground.vue b/docs/.vitepress/theme/components/VideoBackground.vue index 233d376..f6a8ca6 100644 --- a/docs/.vitepress/theme/components/VideoBackground.vue +++ b/docs/.vitepress/theme/components/VideoBackground.vue @@ -1,5 +1,5 @@