summaryrefslogtreecommitdiff
path: root/front-end/src
diff options
context:
space:
mode:
Diffstat (limited to 'front-end/src')
-rw-r--r--front-end/src/assets/main.scss15
-rw-r--r--front-end/src/bootstrap/style/etc.scss16
-rw-r--r--front-end/src/main.ts11
-rw-r--r--front-end/src/views/Account/components/settings/PasswordReset.vue4
-rw-r--r--front-end/src/views/Blog/components/Posts/PostEdit.vue2
-rw-r--r--front-end/src/views/Blog/components/Posts/PostTable.vue8
-rw-r--r--front-end/src/views/Blog/form-helpers/channels.ts18
-rw-r--r--front-end/src/views/Blog/form-helpers/posts.ts21
8 files changed, 50 insertions, 45 deletions
diff --git a/front-end/src/assets/main.scss b/front-end/src/assets/main.scss
index bbe9e5b..168a034 100644
--- a/front-end/src/assets/main.scss
+++ b/front-end/src/assets/main.scss
@@ -1,3 +1,18 @@
#footer-content .footer-lower{
@apply hidden;
+}
+
+.env-bg {
+ font-family: "Source Sans Pro", Geneva, Verdana, sans-serif;
+ background: #f7f7f7;
+ @apply dark:bg-dark-900;
+ @apply text-gray-700 dark:text-gray-300;
+}
+
+.env-bg-gradient {
+ background: #98E4C8;
+ background: -webkit-linear-gradient(bottom right, #98E4C8, #2C6BC3);
+ background: -moz-linear-gradient(bottom right, #98E4C8, #2C6BC3);
+ background: linear-gradient(to top left, #98E4C8, #2C6BC3);
+ @apply text-gray-700;
} \ No newline at end of file
diff --git a/front-end/src/bootstrap/style/etc.scss b/front-end/src/bootstrap/style/etc.scss
index 5d65ff4..58297e5 100644
--- a/front-end/src/bootstrap/style/etc.scss
+++ b/front-end/src/bootstrap/style/etc.scss
@@ -14,22 +14,6 @@ footer .footer-content .router-link-active {
@apply mb-0 text-xl;
}
-
-.env-bg {
- font-family: "Nunito";
- background: #f7f7f7;
- @apply dark:bg-dark-900;
- @apply text-gray-700 dark:text-gray-300;
-}
-
-.env-bg-gradient {
- background: #98E4C8;
- background: -webkit-linear-gradient(bottom right, #98E4C8, #2C6BC3);
- background: -moz-linear-gradient(bottom right, #98E4C8, #2C6BC3);
- background: linear-gradient(to top left, #98E4C8, #2C6BC3);
- @apply text-gray-700;
-}
-
.app-component-entry {
@apply flex flex-col flex-auto mb-10;
diff --git a/front-end/src/main.ts b/front-end/src/main.ts
index 8acd355..36fb4ab 100644
--- a/front-end/src/main.ts
+++ b/front-end/src/main.ts
@@ -21,8 +21,8 @@ import { createVnApp } from './bootstrap'
import './bootstrap/style/all.scss'
import './assets/main.scss'
-//Use the Nunito font
-import "@fontsource/nunito"
+//Import font data
+import "@fontsource/source-sans-pro"
/* FONT AWESOME CONFIG */
import { library } from '@fortawesome/fontawesome-svg-core'
@@ -70,6 +70,13 @@ createVnApp({
//Add the router
app.use(router)
+ //Add the home-page component
+ router.addRoute({
+ path: '/',
+ name: 'Home',
+ redirect: { path: '/' }
+ })
+
//Configure account page redirect to profile
router.addRoute({
path: '/account',
diff --git a/front-end/src/views/Account/components/settings/PasswordReset.vue b/front-end/src/views/Account/components/settings/PasswordReset.vue
index b3312db..b1389ac 100644
--- a/front-end/src/views/Account/components/settings/PasswordReset.vue
+++ b/front-end/src/views/Account/components/settings/PasswordReset.vue
@@ -60,7 +60,7 @@
</template>
<script setup lang="ts">
-import { toSafeInteger } from 'lodash-es';
+import { isEmpty, toSafeInteger } from 'lodash-es';
import useVuelidate from '@vuelidate/core'
import { required, maxLength, minLength, helpers } from '@vuelidate/validators'
import { useUser, apiCall, useMessage, useWait, useConfirm, useVuelidateWrapper } from '@vnuge/vnlib.browser'
@@ -130,7 +130,7 @@ const rules = computed(() =>{
maxLength: helpers.withMessage('Repeast password must have less than 128 characters', maxLength(128))
},
totpCode:{
- required: helpers.withMessage('TOTP code cannot be empty', required),
+ required: helpers.withMessage('TOTP code cannot be empty', (value:string) => showTotpCode.value ? !isEmpty(value) : true),
minLength: helpers.withMessage('TOTP code must be at least 6 characters', minLength(6)),
maxLength: helpers.withMessage('TOTP code must have less than 12 characters', maxLength(12))
}
diff --git a/front-end/src/views/Blog/components/Posts/PostEdit.vue b/front-end/src/views/Blog/components/Posts/PostEdit.vue
index 724a8d7..e55deee 100644
--- a/front-end/src/views/Blog/components/Posts/PostEdit.vue
+++ b/front-end/src/views/Blog/components/Posts/PostEdit.vue
@@ -132,7 +132,7 @@ const onDelete = async () => {
const setMeAsAuthor = () => {
apiCall(async () => {
const { first, last } = await getProfile<{first?:string, last?:string, email:string}>();
- v$.value.author.$model = `${first} ${last}`
+ v$.value.author.$model = `${first ?? ''} ${last ?? ''}`
})
}
diff --git a/front-end/src/views/Blog/components/Posts/PostTable.vue b/front-end/src/views/Blog/components/Posts/PostTable.vue
index 734d340..96c511c 100644
--- a/front-end/src/views/Blog/components/Posts/PostTable.vue
+++ b/front-end/src/views/Blog/components/Posts/PostTable.vue
@@ -39,10 +39,11 @@
</template>
<script setup lang="ts">
-import { toRefs } from 'vue';
+import { toRefs, watch } from 'vue';
import { filter as _filter, truncate } from 'lodash-es';
import { useClipboard } from '@vueuse/core';
import { PostMeta } from '@vnuge/cmnext-admin';
+import { useGeneralToaster } from '@vnuge/vnlib.browser';
const emit = defineEmits(['reload', 'open-edit'])
@@ -52,11 +53,14 @@ const props = defineProps<{
const { posts } = toRefs(props)
-const { copy } = useClipboard()
+const { copy, copied } = useClipboard()
+const { info } = useGeneralToaster()
const openEdit = async (post: PostMeta) => emit('open-edit', post)
const getDateString = (time?: number) => new Date((time || 0) * 1000).toLocaleString();
const getSummaryString = (summary?: string) => truncate(summary || '', { length: 40 })
const getPostId = (post: PostMeta) => truncate(post.id || '', { length: 20 })
+
+watch(copied, (c) => c ? info({'title':'Copied to clipboard'}) : null)
</script> \ No newline at end of file
diff --git a/front-end/src/views/Blog/form-helpers/channels.ts b/front-end/src/views/Blog/form-helpers/channels.ts
index 7b98d4e..eefb2bc 100644
--- a/front-end/src/views/Blog/form-helpers/channels.ts
+++ b/front-end/src/views/Blog/form-helpers/channels.ts
@@ -136,26 +136,26 @@ export const getChannelForm = (editMode?: Ref<boolean>) => {
]
}
- const alphaNumSpace = helpers.regex(/^[a-zA-Z0-9 ]*$/);
+ const alphaNumSpace = helpers.regex(/^[a-zA-Z0-9\&\|\.\,\? ]*$/);
const httpUrl = helpers.regex(/^(http|https):\/\/[^ "]+$/);
const channelRules = {
name: {
required: helpers.withMessage('Channel name is required', required),
- maxlength: helpers.withMessage('Channel name must be less than 50 characters', maxLength(50)),
+ maxlength: helpers.withMessage('Channel name must be less than 64 characters', maxLength(64)),
alphaNumSpace: helpers.withMessage('Channel name must be alphanumeric', alphaNumSpace),
},
path: {
required: helpers.withMessage('Channel path is required', required),
- maxlength: helpers.withMessage('Channel path must be less than 50 characters', maxLength(50)),
+ maxlength: helpers.withMessage('Channel path must be less than 64 characters', maxLength(64)),
},
index: {
required: helpers.withMessage('Channel index is required', required),
- maxlength: helpers.withMessage('Channel index must be less than 50 characters', maxLength(50)),
+ maxlength: helpers.withMessage('Channel index must be less than 64 characters', maxLength(64)),
},
content: {
required: helpers.withMessage('Channel content directory is required', required),
- maxlength: helpers.withMessage('Channel content directory must be less than 50 characters', maxLength(50)),
+ maxlength: helpers.withMessage('Channel content directory must be less than 64 characters', maxLength(64)),
},
example: {}
}
@@ -168,24 +168,24 @@ export const getChannelForm = (editMode?: Ref<boolean>) => {
},
path: {
required: helpers.withMessage('Channel feed path is required', required),
- maxlength: helpers.withMessage('Channel feed path must be less than 50 characters', maxLength(50)),
+ maxlength: helpers.withMessage('Channel feed path must be less than 64 characters', maxLength(64)),
},
image: {
maxlength: helpers.withMessage('Channel feed image must be less than 200 characters', maxLength(200)),
},
contact: {
- maxlength: helpers.withMessage('Channel feed contact must be less than 50 characters', maxLength(50)),
+ maxlength: helpers.withMessage('Channel feed contact must be less than 64 characters', maxLength(64)),
},
description: {
alphaNumSpace: helpers.withMessage('Channel feed description must be alphanumeric', alphaNumSpace),
- maxlength: helpers.withMessage('Channel feed description must be less than 50 characters', maxLength(200)),
+ maxlength: helpers.withMessage('Channel feed description must be less than 250 characters', maxLength(250)),
},
maxItems: {
numeric: helpers.withMessage('Channel feed max items must be a number', numeric),
},
author: {
alphaNumSpace: helpers.withMessage('Channel feed author must be alphanumeric', alphaNumSpace),
- maxlength: helpers.withMessage('Channel feed author must be less than 50 characters', maxLength(50)),
+ maxlength: helpers.withMessage('Channel feed author must be less than 64 characters', maxLength(64)),
}
}
diff --git a/front-end/src/views/Blog/form-helpers/posts.ts b/front-end/src/views/Blog/form-helpers/posts.ts
index da805e7..f4cc4f7 100644
--- a/front-end/src/views/Blog/form-helpers/posts.ts
+++ b/front-end/src/views/Blog/form-helpers/posts.ts
@@ -29,32 +29,28 @@ export const getPostForm = () => {
type: 'text',
label: 'Post Title',
name: 'title',
- placeholder: 'Enter the title of the post',
- description: 'A simple human readable title for the post'
+ placeholder: 'Enter the title of the post'
},
{
id: 'post-author',
type: 'text',
label: 'Post Author',
name: 'author',
- placeholder: 'Enter the author of the post',
- description: 'The author of the post'
+ placeholder: 'The author of the post',
},
{
id: 'post-tags',
type: 'text',
label: 'Post Tags',
name: 'tags',
- placeholder: 'Enter the tags for the post',
- description: 'A comma separated list of tags for the post'
+ placeholder: 'Ex: tag1,tag2',
},
{
id: 'post-image',
type: 'text',
label: 'Post Image',
name: 'image',
- placeholder: 'Enter the image url for the post',
- description: 'The full http url to the post image'
+ placeholder: 'Enter the full external image url',
},
{
id: 'post-summary',
@@ -70,29 +66,28 @@ export const getPostForm = () => {
label: 'Post Id',
name: 'id',
placeholder: '',
- description: 'The id of the post, this cannot be changed',
disabled: true,
}
]
}
});
- const alphaNumSpace = helpers.regex(/^[a-zA-Z0-9 ]*$/);
+ const alphaNumSpace = helpers.regex(/^[a-zA-Z0-9\?\\\&\|\\/\-\.\, ]*$/);
const httpUrl = helpers.regex(/^(http|https):\/\/[^ "]+$/);
const rules = {
title: {
required: helpers.withMessage('Post title is required', required),
- maxlength: helpers.withMessage('Post title must be less than 50 characters', maxLength(50)),
+ maxlength: helpers.withMessage('Post title must be less than 64 characters', maxLength(64)),
alphaNumSpace: helpers.withMessage('Post title must be alphanumeric', alphaNumSpace),
},
summary: {
required: helpers.withMessage('Post summary is required', required),
- maxlength: helpers.withMessage('Post summary must be less than 50 characters', maxLength(200)),
+ maxlength: helpers.withMessage('Post summary must be less than 250 characters', maxLength(250)),
},
author: {
required: helpers.withMessage('Post author is required', required),
- maxlength: helpers.withMessage('Post author must be less than 50 characters', maxLength(50)),
+ maxlength: helpers.withMessage('Post author must be less than 64 characters', maxLength(64)),
},
tags: {},
image: {