diff --git a/.eslintrc.js b/.eslintrc.js
index d7d8d4bd4..56a90856f 100644
--- a/.eslintrc.js
+++ b/.eslintrc.js
@@ -12,6 +12,8 @@ module.exports = {
"vue/no-unused-vars": 0,
"vue/no-mutating-props": 0,
"vue/valid-v-on": 0,
+ "vue/valid-v-for": 0,
+ "@typescript-eslint/no-empty-function": 0,
"no-undef": 0
},
};
diff --git a/components.d.ts b/components.d.ts
index ac91d0ad3..cd2606f24 100644
--- a/components.d.ts
+++ b/components.d.ts
@@ -8,6 +8,7 @@ declare module 'vue' {
DisclosureButton: typeof import('@headlessui/vue')['DisclosureButton']
DisclosurePanel: typeof import('@headlessui/vue')['DisclosurePanel']
EditorBase: typeof import('E:/dev/projects/write-better/src/components/editor/EditorBase.vue')['default']
+ EditorHeader: typeof import('E:/dev/projects/write-better/src/components/editor/EditorHeader.vue')['default']
HeroIcon: typeof import('E:/dev/projects/write-better/src/components/utils/HeroIcon.vue')['default']
LangSwitcher: typeof import('E:/dev/projects/write-better/src/components/utils/LangSwitcher.vue')['default']
Popover: typeof import("@headlessui/vue")["Popover"];
diff --git a/src/components/editor/EditorBase.vue b/src/components/editor/EditorBase.vue
index eade921dd..4c94df5a9 100644
--- a/src/components/editor/EditorBase.vue
+++ b/src/components/editor/EditorBase.vue
@@ -16,14 +16,21 @@
w-11/12
md:h-editor
h-screen
- md:p-5
- p-0
bg-gray-700
overflow-y-auto
rounded-sm
shadow-lg
"
>
+
+
+ {{ page.raw }}
+
@@ -31,10 +38,16 @@
diff --git a/src/components/editor/EditorHeader.vue b/src/components/editor/EditorHeader.vue
new file mode 100644
index 000000000..2e21ba1d9
--- /dev/null
+++ b/src/components/editor/EditorHeader.vue
@@ -0,0 +1,10 @@
+
+
+
diff --git a/src/components/editor/TextInput.vue b/src/components/editor/TextInput.vue
index 3a9d16803..e7c7a76af 100644
--- a/src/components/editor/TextInput.vue
+++ b/src/components/editor/TextInput.vue
@@ -1,8 +1,8 @@
diff --git a/src/store/module/context.ts b/src/store/module/context.ts
index 1ddaf14da..7a123df3e 100644
--- a/src/store/module/context.ts
+++ b/src/store/module/context.ts
@@ -1,6 +1,18 @@
+import { ContextState, ContextStatePageContent } from '@/types/context'
+
export default {
- state: () => ({}),
- mutations: {},
+ namespaced: true,
+ state: () =>
+ ({
+ entity: 0,
+ page: [],
+ } as ContextState),
+ mutations: {
+ addInPage(state: any, content: ContextStatePageContent) {
+ state.entity++
+ state.page.push(content)
+ },
+ },
actions: {},
getters: {},
}
diff --git a/src/store/module/editor.ts b/src/store/module/editor.ts
index 53a033cec..54fbd0c41 100644
--- a/src/store/module/editor.ts
+++ b/src/store/module/editor.ts
@@ -1,17 +1,47 @@
import { EditorState } from '@/types/editor'
export default {
+ namespaced: true,
state: () =>
({
styles: {
input: {
fontFamily: 'font-raleway',
fontSize: 'text-xs',
- fontColor: 'text-gray-100',
+ fontColor: 'text-black dark:text-gray-100',
+ },
+ show: {
+ fontFamily: 'font-raleway',
+ fontColor: 'text-black dark:text-gray-100',
+ paragraph: {
+ fontFamily: 'font-raleway',
+ fontColor: 'text-black dark:text-gray-100',
+ fontSize: 'text-xs',
+ fontWeight: 'font-normal',
+ },
+ heading: {
+ one: {
+ fontFamily: 'font-raleway',
+ fontColor: 'text-black dark:text-gray-100',
+ fontSize: 'text-3xl',
+ fontWeight: 'font-bold',
+ },
+ two: {
+ fontFamily: 'font-raleway',
+ fontColor: 'text-black dark:text-gray-100',
+ fontSize: 'text-2xl',
+ fontWeight: 'font-bold',
+ },
+ three: {
+ fontFamily: 'font-raleway',
+ fontColor: 'text-black dark:text-gray-100',
+ fontSize: 'text-xl',
+ fontWeight: 'font-semibold',
+ },
+ },
},
},
- contentRaw: {},
- contentShow: {},
+ content: {},
} as EditorState),
mutations: {},
actions: {},
diff --git a/src/tailwind.css b/src/tailwind.css
index 9d3f9966e..3385cafef 100644
--- a/src/tailwind.css
+++ b/src/tailwind.css
@@ -16,6 +16,10 @@
.wb-title {
@apply text-4xl opacity-70 hover:text-gray-700 dark:hover:text-white cursor-default;
}
+
+ .wb-text {
+ @apply text-black dark:text-gray-200;
+ }
}
@layer utilities {
diff --git a/src/types/context.ts b/src/types/context.ts
new file mode 100644
index 000000000..9cb454ea9
--- /dev/null
+++ b/src/types/context.ts
@@ -0,0 +1,9 @@
+export interface ContextState {
+ page: Array
+}
+
+export interface ContextStatePageContent {
+ id: number
+ type: string
+ raw: string
+}
diff --git a/src/types/editor.ts b/src/types/editor.ts
index 41b195dac..a7fac099f 100644
--- a/src/types/editor.ts
+++ b/src/types/editor.ts
@@ -1,19 +1,18 @@
export interface EditorState {
styles: EditorStateStyles
- contentRaw: EditorStateContentRaw
- contentShow: EditorStateContentShow
}
export interface EditorStateStyles {
input: EditorStateInput
+ show: EditorStateShow
}
-
export interface EditorStateInput {
fontFamily: string
fontSize: string
fontColor: string
}
-export interface EditorStateContentRaw {}
-
-export interface EditorStateContentShow {}
+export interface EditorStateShow {
+ fontFamily: string
+ fontColor: string
+}