diff options
Diffstat (limited to 'front-end/src')
-rw-r--r-- | front-end/src/assets/main.scss | 15 | ||||
-rw-r--r-- | front-end/src/bootstrap/style/etc.scss | 16 | ||||
-rw-r--r-- | front-end/src/main.ts | 11 | ||||
-rw-r--r-- | front-end/src/views/Account/components/settings/PasswordReset.vue | 4 | ||||
-rw-r--r-- | front-end/src/views/Blog/components/Posts/PostEdit.vue | 2 | ||||
-rw-r--r-- | front-end/src/views/Blog/components/Posts/PostTable.vue | 8 | ||||
-rw-r--r-- | front-end/src/views/Blog/form-helpers/channels.ts | 18 | ||||
-rw-r--r-- | front-end/src/views/Blog/form-helpers/posts.ts | 21 |
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: { |