{ + if (v.action === "drawer") { + setToolbarSignal({ + ...toolbarSignal(), + isDrawerOpen: !toolbarSignal().isDrawerOpen + }); + } else if (v.action){ + setToolbarSignal({ + ...toolbarSignal(), + activeTool: v.action, + }) + } + }} + classList={{ + "toolbar-item": v.type !== "pagination-indicator", + "toolbar-item-separator": v.type === "separator", + "toolbar-item-pagination-indicator": v.type === "pagination-indicator", + "toolbar-item-active": toolbarSignal().activeTool===v.action + }} use:gest={null}> + {v.type === "separator" ?

: v.type === 'button' ? ( + <> + {v.action === "drawer" && toolbarSignal().isDrawerOpen === true ? ( +

+ ) : <> +

+ } +

+ + ) : v.type === "pagination-indicator" ? <> +

123

/500

+ : void 0} +

+ ) +} +function App() { + + const [toolbarSignal, setToolbarSignal] = createSignal({ + isDrawerOpen: false, + activeTool: "mouse", + backgroundColor: "" + }); + + const [toolbarItems, setToolbarItems] = createSignal([ + {type: 'button', icon: iconCursor, solidIcon: iconSolidCursor, name: "鼠標模式", action: "mouse"}, + {type: 'button', icon: iconPen, solidIcon: iconSolidPen, name: "批註模式", action: "pen"}, + {type: 'button', icon: iconEraser, name: "橡皮擦模式"}, + {type: 'button', icon: iconTrash, name: "清空畫布"}, + {type: "separator"}, + {type: "button", icon: iconBlackBoard, name: "小黑板"}, + {type: "button", icon: iconShapes, name: "形狀與幾何工具"}, + {type: "button", icon: iconUndo, name: "撤銷操作"}, + {type: "button", icon: iconRedo, name: "重做操作"}, + {type: "separator"}, + {type: "button", action: "hidden", icon: iconEyeOff, name: "隱藏"}, + {type: "button", action: "drawer", icon: iconMore} + ]) + + const [leftBottomSidebarItems, setLeftBottomSidebarItems] = createSignal([ + {type: 'button', icon: iconArrowLeft, name: "上一頁"}, + {type: "separator"}, + {type: "pagination-indicator"}, + {type: "separator"}, + {type: 'button', icon: iconArrowRight, name: "下一頁"}, + ]) + const [rightBottomSidebarItems, setRightBottomSidebarItems] = createSignal([ + {type: 'button', icon: iconListDetails, name: "頁面列表"}, + {type: "separator"}, + {type: 'button', icon: iconArrowLeft, name: "上一頁"}, + {type: 'button', icon: iconArrowRight, name: "下一頁"}, + ]) + + const [drawerItems, setDrawerItems] = createSignal([ + {icon: iconClock, name: "計時器"}, + {icon: iconLassoSelect, name: "套索選擇"}, + {icon: iconWandSparkles, name: "魔法棒"}, + {icon: iconScissors, name: "截圖"}, + {icon: iconRuler, name: "尺規"}, + {icon: iconAddPictures, name: "加圖片"}, + {icon: iconText, name: "加文本"}, + {icon: iconHistory, name: "歷史記錄"}, + {icon: iconDianming, name: "隨機點名"}, + {icon: iconHand, name: "漫遊"} + ]) + + return ( + <> +

+ {/*Main Toolbar*/} +

+ +

+ {/*Main Toolbar Right Container*/} +

+ {/*Main Toolbar Left Container*/} + + + ) +} + +export default App diff --git a/src/renderer/src/Imports.js b/src/renderer/src/Imports.js new file mode 100644 index 0000000..a8477a5 --- /dev/null +++ b/src/renderer/src/Imports.js @@ -0,0 +1,32 @@ +import iconCursor from './assets/icons/lined/cursor.svg'; +import iconPen from './assets/icons/lined/pen.svg'; +import iconEraser from './assets/icons/lined/eraser.svg'; +import iconTrash from './assets/icons/lined/trash.svg'; +import iconLassoSelect from './assets/icons/lined/lasso-select.svg'; +import iconWandSparkles from './assets/icons/lined/wand-sparkles.svg'; +import iconScissors from './assets/icons/lined/scissors.svg'; +import iconShapes from './assets/icons/lined/shapes.svg'; +import iconUndo from './assets/icons/lined/undo.svg'; +import iconRedo from './assets/icons/lined/redo.svg'; +import iconMore from './assets/icons/lined/more.svg'; +import iconClock from './assets/icons/lined/clock.svg'; +import iconBlackBoard from './assets/icons/lined/blackboard.svg'; +import iconRuler from './assets/icons/lined/ruler.svg'; +import iconAddPictures from './assets/icons/lined/add-pictures.svg'; +import iconHistory from './assets/icons/lined/history.svg'; +import iconDianming from './assets/icons/lined/dianming.svg'; +import iconMonitorX from './assets/icons/lined/monitor-x.svg'; +import iconGrid from './assets/icons/lined/grid.svg'; +import iconEyeOff from './assets/icons/lined/eye-off.svg'; +import iconText from './assets/icons/lined/text.svg'; +import iconHand from './assets/icons/lined/hand.svg'; +import iconArrowLeft from './assets/icons/lined/arrow-left.svg'; +import iconArrowRight from './assets/icons/lined/arrow-right.svg'; +import iconListDetails from './assets/icons/lined/list-details.svg'; +import iconSolidCursor from "./assets/icons/solid/cursor.svg" +import iconSolidPen from './assets/icons/solid/pen.svg'; + +import brandTransparentWatermark from './assets/brand/transparent.watermark.svg'; + +export {brandTransparentWatermark}; +export {iconCursor, iconPen, iconEraser, iconTrash, iconArrowRight, iconSolidPen, iconSolidCursor, iconListDetails, iconArrowLeft, iconMonitorX, iconHand, iconText, iconEyeOff, iconGrid, iconUndo, iconHistory, iconDianming, iconAddPictures, iconRuler, iconBlackBoard, iconLassoSelect, iconClock, iconMore, iconShapes, iconScissors, iconWandSparkles, iconRedo}; \ No newline at end of file diff --git a/src/renderer/src/assets/brand/transparent.watermark.svg b/src/renderer/src/assets/brand/transparent.watermark.svg new file mode 100644 index 0000000..2c7a108 --- /dev/null +++ b/src/renderer/src/assets/brand/transparent.watermark.svg @@ -0,0 +1,24 @@ + diff --git a/src/renderer/src/assets/icons/lined/add-pictures.svg b/src/renderer/src/assets/icons/lined/add-pictures.svg new file mode 100644 index 0000000..0ad7a33 --- /dev/null +++ b/src/renderer/src/assets/icons/lined/add-pictures.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/src/renderer/src/assets/icons/lined/arrow-left.svg b/src/renderer/src/assets/icons/lined/arrow-left.svg new file mode 100644 index 0000000..767960b --- /dev/null +++ b/src/renderer/src/assets/icons/lined/arrow-left.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/src/renderer/src/assets/icons/lined/arrow-right.svg b/src/renderer/src/assets/icons/lined/arrow-right.svg new file mode 100644 index 0000000..3f2baf2 --- /dev/null +++ b/src/renderer/src/assets/icons/lined/arrow-right.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/src/renderer/src/assets/icons/lined/blackboard.svg b/src/renderer/src/assets/icons/lined/blackboard.svg new file mode 100644 index 0000000..e64a2ae --- /dev/null +++ b/src/renderer/src/assets/icons/lined/blackboard.svg @@ -0,0 +1,5 @@ + \ No newline at end of file diff --git a/src/renderer/src/assets/icons/lined/clock.svg b/src/renderer/src/assets/icons/lined/clock.svg new file mode 100644 index 0000000..920515d --- /dev/null +++ b/src/renderer/src/assets/icons/lined/clock.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/src/renderer/src/assets/icons/lined/cursor.svg b/src/renderer/src/assets/icons/lined/cursor.svg new file mode 100644 index 0000000..7fc8e3c --- /dev/null +++ b/src/renderer/src/assets/icons/lined/cursor.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/src/renderer/src/assets/icons/lined/dianming.svg b/src/renderer/src/assets/icons/lined/dianming.svg new file mode 100644 index 0000000..1bffd72 --- /dev/null +++ b/src/renderer/src/assets/icons/lined/dianming.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/src/renderer/src/assets/icons/lined/eraser.svg b/src/renderer/src/assets/icons/lined/eraser.svg new file mode 100644 index 0000000..c2ea4f4 --- /dev/null +++ b/src/renderer/src/assets/icons/lined/eraser.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/src/renderer/src/assets/icons/lined/eye-off.svg b/src/renderer/src/assets/icons/lined/eye-off.svg new file mode 100644 index 0000000..827c096 --- /dev/null +++ b/src/renderer/src/assets/icons/lined/eye-off.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/src/renderer/src/assets/icons/lined/grid.svg b/src/renderer/src/assets/icons/lined/grid.svg new file mode 100644 index 0000000..c49cba2 --- /dev/null +++ b/src/renderer/src/assets/icons/lined/grid.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/src/renderer/src/assets/icons/lined/hand.svg b/src/renderer/src/assets/icons/lined/hand.svg new file mode 100644 index 0000000..0af7523 --- /dev/null +++ b/src/renderer/src/assets/icons/lined/hand.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/src/renderer/src/assets/icons/lined/history.svg b/src/renderer/src/assets/icons/lined/history.svg new file mode 100644 index 0000000..b81d42b --- /dev/null +++ b/src/renderer/src/assets/icons/lined/history.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/src/renderer/src/assets/icons/lined/lasso-select.svg b/src/renderer/src/assets/icons/lined/lasso-select.svg new file mode 100644 index 0000000..6f6e557 --- /dev/null +++ b/src/renderer/src/assets/icons/lined/lasso-select.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/src/renderer/src/assets/icons/lined/list-details.svg b/src/renderer/src/assets/icons/lined/list-details.svg new file mode 100644 index 0000000..5ba8d6f --- /dev/null +++ b/src/renderer/src/assets/icons/lined/list-details.svg @@ -0,0 +1,9 @@ + \ No newline at end of file diff --git a/src/renderer/src/assets/icons/lined/monitor-x.svg b/src/renderer/src/assets/icons/lined/monitor-x.svg new file mode 100644 index 0000000..fcb1407 --- /dev/null +++ b/src/renderer/src/assets/icons/lined/monitor-x.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/src/renderer/src/assets/icons/lined/more.svg b/src/renderer/src/assets/icons/lined/more.svg new file mode 100644 index 0000000..391f3f5 --- /dev/null +++ b/src/renderer/src/assets/icons/lined/more.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/src/renderer/src/assets/icons/lined/pen.svg b/src/renderer/src/assets/icons/lined/pen.svg new file mode 100644 index 0000000..8fb90d3 --- /dev/null +++ b/src/renderer/src/assets/icons/lined/pen.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/src/renderer/src/assets/icons/lined/redo.svg b/src/renderer/src/assets/icons/lined/redo.svg new file mode 100644 index 0000000..c575a37 --- /dev/null +++ b/src/renderer/src/assets/icons/lined/redo.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/src/renderer/src/assets/icons/lined/ruler.svg b/src/renderer/src/assets/icons/lined/ruler.svg new file mode 100644 index 0000000..18d641c --- /dev/null +++ b/src/renderer/src/assets/icons/lined/ruler.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/src/renderer/src/assets/icons/lined/scissors.svg b/src/renderer/src/assets/icons/lined/scissors.svg new file mode 100644 index 0000000..60e19e5 --- /dev/null +++ b/src/renderer/src/assets/icons/lined/scissors.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/src/renderer/src/assets/icons/lined/shapes.svg b/src/renderer/src/assets/icons/lined/shapes.svg new file mode 100644 index 0000000..4b3ed5d --- /dev/null +++ b/src/renderer/src/assets/icons/lined/shapes.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/src/renderer/src/assets/icons/lined/text.svg b/src/renderer/src/assets/icons/lined/text.svg new file mode 100644 index 0000000..be92535 --- /dev/null +++ b/src/renderer/src/assets/icons/lined/text.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/src/renderer/src/assets/icons/lined/trash.svg b/src/renderer/src/assets/icons/lined/trash.svg new file mode 100644 index 0000000..4816f15 --- /dev/null +++ b/src/renderer/src/assets/icons/lined/trash.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/src/renderer/src/assets/icons/lined/undo.svg b/src/renderer/src/assets/icons/lined/undo.svg new file mode 100644 index 0000000..7d9af66 --- /dev/null +++ b/src/renderer/src/assets/icons/lined/undo.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/src/renderer/src/assets/icons/lined/wand-sparkles.svg b/src/renderer/src/assets/icons/lined/wand-sparkles.svg new file mode 100644 index 0000000..a88ad4b --- /dev/null +++ b/src/renderer/src/assets/icons/lined/wand-sparkles.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/src/renderer/src/assets/icons/solid/cursor.svg b/src/renderer/src/assets/icons/solid/cursor.svg new file mode 100644 index 0000000..d92ad1c --- /dev/null +++ b/src/renderer/src/assets/icons/solid/cursor.svg @@ -0,0 +1,5 @@ + diff --git a/src/renderer/src/assets/icons/solid/pen.svg b/src/renderer/src/assets/icons/solid/pen.svg new file mode 100644 index 0000000..ea48361 --- /dev/null +++ b/src/renderer/src/assets/icons/solid/pen.svg @@ -0,0 +1,4 @@ + diff --git a/src/renderer/src/main.jsx b/src/renderer/src/main.jsx new file mode 100644 index 0000000..742783d --- /dev/null +++ b/src/renderer/src/main.jsx @@ -0,0 +1,7 @@ +import '@unocss/reset/tailwind-compat.css' +import 'virtual:uno.css' + +import { render } from 'solid-js/web' +import App from './App' + +render(() => , document.getElementById('root')) diff --git a/src/renderer/src/styles/index.css b/src/renderer/src/styles/index.css new file mode 100644 index 0000000..176d558 --- /dev/null +++ b/src/renderer/src/styles/index.css @@ -0,0 +1,312 @@ +/*Styles Reset*/ +* { + -webkit-tap-highlight-color: rgba(255, 255, 255, 0); +} + +/*Container CSS*/ +.zph-container { + width: 100vw; + height: 100vh; + overflow: hidden; + position: relative; + background-color: transparent; + user-select: none; +} +.zph-container.window-border { + @apply ring-1 ring-inset ring-red-600 ; +} +.zph-container.window-black { + background-color: black !important; +} + +/*Main Toolbar*/ +.main-toolbar-container { + position: absolute; + pointer-events: none; + left: 0; + right: 0; + width: 100vw; + height: fit-content; + display: flex; + align-items: center; + justify-content: center; + z-index: 50; + @apply bottom-1; +} +.main-toolbar-container>div { + flex-shrink: 0 !important; + overflow: hidden; + pointer-events: auto; + height: 100vh; + position: relative; + @apply rounded-md shadow-md ring-1 ring-inset ring-zinc-700; + transition-duration: 200ms; + transition-property: max-height; + transition-timing-function: cubic-bezier(0.16, 1, 0.3, 1); +} + +.main-toolbar-container[data-mode="default"]>div { + @apply max-h-9; +} +.main-toolbar-container[data-mode="drawer"]>div { + @apply max-h-48; +} +.absolute-toolbar-space { + position: absolute; + bottom: 0; + left: 0; + width: fit-content; + display: flex; + flex-direction: column; + justify-content: end; + align-items: center; + @apply h-48; +} +.absolute-toolbar-space .toolbar-buttons { + display: flex; + flex-direction: row; + align-items: center; + justify-content: center; + flex-shrink: 0; + transition-duration: 200ms; + transition-property: padding-bottom; + transition-timing-function: cubic-bezier(0.16, 1, 0.3, 1); + @apply h-9 w-fit px-1; +} +.main-toolbar-container[data-mode="default"] .absolute-toolbar-space .toolbar-buttons { + @apply pb-0; +} +.main-toolbar-container[data-mode="drawer"] .absolute-toolbar-space .toolbar-buttons { + @apply pb-1.5; +} +.toolbar-item { + display: flex; + align-items: center; + justify-content: center; + background-color: transparent; + position: relative; + @apply h-9 w-8 ; +} +.toolbar-item>img , .toolbar-item img { + -webkit-user-drag: none !important; + @apply h-5 w-5; +} +.toolbar-item-separator { + display: flex; + align-items: center; + justify-content: center; + @apply h-9 w-1.5; +} +.toolbar-item-separator>div { + @apply h-5 w-px bg-white/50 +} + +/*Drawer*/ +.drawer-container { + position: relative; + display: flex; + flex-direction: column; + align-items: center; + justify-content: center; + padding: 0.75rem; + width: 100%; + @apply mb-1 grow; +} +.drawer-bottom-separator { + position: absolute; + bottom: 0.1rem; + left: 0; + right: 0; + height: 1px; + display: flex; + align-items: center; + justify-content: center; + +} +.drawer-bottom-separator>div { + height: 1px; + transition-delay: 50ms; + transition-duration: 200ms; + transition-property: width; + transition-timing-function: cubic-bezier(0.33, 1, 0.68, 1); + @apply bg-zinc-500 rounded-full ; +} +.drawer-open-button-state { + @apply h-8 w-8 bg-blue-500/50 rounded-md flex items-center justify-center; +} + +.main-toolbar-container[data-mode="default"] .drawer-bottom-separator>div { + @apply w-0; +} +.main-toolbar-container[data-mode="drawer"] .drawer-bottom-separator>div { + @apply w-100%; +} +.drawer-items { + display: grid; + grid-template-columns:repeat(5, minmax(0, 1fr)); + width: 100%; + height: 100%; + @apply p-2 gap-2; +} +.drawer-item { + display: flex; + flex-direction: column; + align-items: center; + justify-content: center; + @apply h-full w-full; +} +.drawer-item img { + -webkit-user-drag: none !important; +} +.drawer-item .drawer-item-text { + font-size: 0.72rem; + @apply text-white mt-1; +} + +/*Toolbar Left Right Containers*/ +.toolbar-right-container , .toolbar-left-container{ + position: absolute; + display: flex; + align-items: center; + justify-content: center; + flex-direction: row; + left: 0; + right: 0; + width: 100vw; + z-index: 50; + pointer-events: none; + @apply bottom-1; +} +.toolbar-right-container:nth-child(0) , .toolbar-left-container:last-child { + @apply shrink-0 h-9 bg-transparent; +} +.end-slideshow-button *,.mainmenu-button * { + -webkit-user-drag: none !important; +} +.end-slideshow-button { + pointer-events: auto; + color: white; + display: flex; + align-items: center; + justify-content: center; + flex-shrink: 0; + @apply h-9 w-9 rounded-md bg-red-700/75 ring-1 ring-inset ring-red-500 shadow-md; +} +.mainmenu-button { + pointer-events: auto; + color: white; + display: flex; + align-items: center; + justify-content: center; + flex-shrink: 0; + @apply h-9 w-9 rounded-md shadow-md ring-1 ring-inset ring-zinc-700; +} + +/*BottomSidebar*/ +.bottom-sidebar-container { + position: absolute; + pointer-events: none; + right: 0; + width: 100vw; + height: fit-content; + display: flex; + align-items: center; + z-index: 50; + @apply bottom-1 +} +.bottom-sidebar-container._left { + justify-content: start; + left: 0.25rem; +} +.bottom-sidebar-container._right { + justify-content: end; + right: 0.25rem; +} +.bottom-sidebar-container>div { + flex-shrink: 0 !important; + overflow: hidden; + pointer-events: auto; + position: relative; + @apply h-9 rounded-md shadow-md ring-1 ring-inset ring-zinc-700; + transition-duration: 200ms; + transition-property: max-height; + transition-timing-function: cubic-bezier(0.16, 1, 0.3, 1); +} +.absolute-bottom-sidebar-space { + position: absolute; + bottom: 0; + left: 0; + width: fit-content; + display: flex; + flex-direction: column; + justify-content: end; + align-items: center; + @apply h-9; +} +.absolute-bottom-sidebar-space .toolbar-buttons { + display: flex; + flex-direction: row; + align-items: center; + justify-content: center; + flex-shrink: 0; + transition-duration: 200ms; + transition-property: padding-bottom; + transition-timing-function: cubic-bezier(0.16, 1, 0.3, 1); + @apply h-9 w-fit px-1; +} + +/*Pagination Indicator*/ +.pagination-indicator { + display: flex; + align-items: center; + justify-content: center; + width: 4.5rem; + @apply h-9; +} +.pagination-indicator .now-page-text { + @apply text-white text-3.5 font-bold leading-none mr-0.5; +} +.pagination-indicator .total-page-text { + @apply text-white text-3 leading-none; +} + +/*Toolbar Item Animation*/ +.toolbar-item .tb-animate-bg{ + position: absolute; + inset: 0; + display: flex; + align-items: center; + justify-content: center; + transition-property: all; + z-index: 0; + transition-timing-function: cubic-bezier(0.85, 0, 0.15, 1); !important; + @apply duration-100 scale-75 opacity-0; +} +.toolbar-item>img.icon-solid , .toolbar-item img.icon-solid { + display: none; +} +.toolbar-item .tb-animate-bg>div { + @apply h-7.5 w-7.5 bg-zinc-300/12 rounded-0.275rem; +} +.toolbar-item.toolbar-item-active .tb-animate-bg>div { + @apply bg-blue-300/15 ring-1 ring-inset ring-blue-400/50 +} +.toolbar-item.gest-pointer-down .tb-animate-bg , .toolbar-item.toolbar-item-active .tb-animate-bg{ + @apply scale-100 opacity-100; +} +.toolbar-item.gest-pointer-down>img.icon-solid , .toolbar-item.gest-pointer-down img.icon-solid , +.toolbar-item.toolbar-item-active>img.icon-solid , .toolbar-item.toolbar-item-active img.icon-solid{ + display: block; +} +.toolbar-item.gest-pointer-down>img.icon , .toolbar-item.gest-pointer-down img.icon , +.toolbar-item.toolbar-item-active>img.icon , .toolbar-item.toolbar-item-active img.icon{ + display: none; +} + +/*Watermark*/ +.brand-watermark { + position: absolute; + top: 0.25rem; + left: 0.25rem; + @apply h-6; +} \ No newline at end of file diff --git a/src/renderer/src/utils/gest.js b/src/renderer/src/utils/gest.js new file mode 100644 index 0000000..bfd1093 --- /dev/null +++ b/src/renderer/src/utils/gest.js @@ -0,0 +1,23 @@ +import {onCleanup} from "solid-js"; + +/** + * gest.js用於為Pointer events添加可選的CSS Selector +* */ +export default function gest(el, accessor) { + function onPointerDown() { + el.classList.add('gest-pointer-down'); + } + function onPointerUp() { + el.classList.remove('gest-pointer-down'); + } + function onPointerOut() { + el.classList.remove('gest-pointer-down'); + } + el.addEventListener('pointerdown', onPointerDown); + el.addEventListener('pointerup', onPointerUp); + el.addEventListener('pointerout', onPointerOut); + onCleanup(()=>{ + el.removeEventListener('pointerdown', onPointerDown); + el.removeEventListener('pointerup', onPointerUp); + }) +} \ No newline at end of file diff --git a/uno.config.js b/uno.config.js new file mode 100644 index 0000000..50167c4 --- /dev/null +++ b/uno.config.js @@ -0,0 +1,28 @@ +import {defineConfig, presetUno} from 'unocss' +import transformerDirectives from '@unocss/transformer-directives' +import transformerVariantGroup from '@unocss/transformer-variant-group' + + +export default defineConfig({ + presets: [ + presetUno({ + dark: "class", + }) + ], + content: { + pipeline: { + include: [ + // the default + /\.(vue|svelte|[jt]sx|mdx?|astro|elm|php|phtml|html)($|\?)/, + // include js/ts files + 'src/**/*.{js,ts,jsx,tsx,css,less,sass}', + ], + // exclude files + // exclude: [] + }, + }, + transformers: [ + transformerDirectives(), + transformerVariantGroup(), + ], +})