@live-change/content-frontend 0.9.32 → 0.9.34

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (9) hide show
  1. package/front/src/NavBar.vue +28 -28
  2. package/front/src/components/ContentAdminButtons.vue +1 -1
  3. package/front/src/components/ContentEditor.vue +1 -1
  4. package/front/src/components/ContentPreview.vue +1 -1
  5. package/front/src/components/MetadataEditor.vue +2 -1
  6. package/front/src/components/NotAuthorizedAdminButtons.vue +1 -1
  7. package/front/src/components/NotFoundAdminButtons.vue +1 -1
  8. package/front/src/components/PagesList.vue +3 -3
  9. package/package.json +14 -14
package/front/src/NavBar.vue CHANGED
@@ -2,16 +2,16 @@
2
2
  <div class="surface-overlay py-3 px-6 shadow-2 flex align-items-center justify-content-between
3
3
  relative sticky top-0 z-5"
4
4
  style="min-height: 80px" key="navbar">
5
- <img src="/images/logo.svg" alt="Image" height="40" class="mr-0 lg:mr-6">
5
+ <img src="/images/logo.svg" alt="Image" height="40" class="mr-0 lg:mr-12">
6
6
  <div class="hidden lg:flex">
7
7
  <!-- place for desktop menu -->
8
8
  </div>
9
- <div class="flex flex-grow-1"></div>
9
+ <div class="flex grow"></div>
10
10
  <UserIcon />
11
11
 
12
12
 
13
- <div class="static w-auto w-full surface-overlay left-0 top-100 z-1 shadow-none hidden">
14
- <ul class="list-none p-0 m-0 flex align-items-center select-none flex-row border-top-none">
13
+ <div class="static w-auto w-full bg-surface-0 dark:bg-surface-900 left-0 top-full z-10 shadow-none hidden">
14
+ <ul class="list-none p-0 m-0 flex items-center select-none flex-row border-t-0">
15
15
  <li>
16
16
  <a v-ripple class="flex p-3 px-3 align-items-center text-600 hover:text-900 hover:surface-100
17
17
  font-medium border-round cursor-pointer transition-colors transition-duration-150 p-ripple">
@@ -28,48 +28,48 @@
28
28
  </div>
29
29
 
30
30
 
31
- <a v-ripple class="cursor-pointer block lg:hidden text-700 p-ripple ml-2 hover:surface-100 p-2"
32
- v-styleclass="{ selector: '@next', enterClass: 'hidden', leaveToClass: 'hidden', hideOnOutsideClick: true }">
31
+ <a v-ripple class="cursor-pointer block lg:hidden text-surface-700 dark:text-surface-100 p-ripple ml-2 hover:bg-surface-100 dark:hover:bg-surface-700 p-2"
32
+ v-styleclass="{ selector: '@next', enterFromClass: 'hidden', leaveToClass: 'hidden', hideOnOutsideClick: true }">
33
33
  <i class="pi pi-bars text-4xl"></i>
34
34
  </a>
35
- <div class="align-items-center flex-grow-1 justify-content-between hidden absolute lg:static w-full surface-overlay left-0 top-100 z-1 shadow-2 lg:shadow-none">
36
- <ul class="list-none p-0 m-0 flex lg:align-items-center select-none flex-column lg:flex-row">
35
+ <div class="items-center grow justify-between hidden absolute lg:static w-full bg-surface-0 dark:bg-surface-900 left-0 top-full z-10 shadow lg:shadow-none">
36
+ <ul class="list-none p-0 m-0 flex lg:items-center select-none flex-col lg:flex-row">
37
37
  <li>
38
- <a v-ripple class="flex px-6 p-3 lg:px-3 lg:py-2 align-items-center text-600 hover:text-900 hover:surface-100 font-medium border-round cursor-pointer transition-colors transition-duration-150 p-ripple">
38
+ <a v-ripple class="flex px-12 p-4 lg:px-4 lg:py-2 items-center text-surface-600 dark:text-surface-200 hover:text-surface-900 dark:hover:text-surface-0 hover:bg-surface-100 dark:hover:bg-surface-700 font-medium rounded-border cursor-pointer transition-colors duration-150 p-ripple">
39
39
  <i class="pi pi-home mr-2"></i>
40
40
  <span>Home</span>
41
41
  </a>
42
42
  </li>
43
43
  <li class="lg:relative">
44
- <a v-ripple class="flex px-6 p-3 lg:px-3 lg:py-2 align-items-center text-600 hover:text-900 hover:surface-100 font-medium border-round cursor-pointer transition-colors transition-duration-150 p-ripple"
45
- v-styleclass="{ selector: '@next', enterClass: 'hidden', enterActiveClass: 'scalein', leaveToClass: 'hidden', leaveActiveClass: 'fadeout', hideOnOutsideClick: true }">
44
+ <a v-ripple class="flex px-12 p-4 lg:px-4 lg:py-2 items-center text-surface-600 dark:text-surface-200 hover:text-surface-900 dark:hover:text-surface-0 hover:bg-surface-100 dark:hover:bg-surface-700 font-medium rounded-border cursor-pointer transition-colors duration-150 p-ripple"
45
+ v-styleclass="{ selector: '@next', enterFromClass: 'hidden', enterActiveClass: 'scalein', leaveToClass: 'hidden', leaveActiveClass: 'fadeout', hideOnOutsideClick: true }">
46
46
  <i class="pi pi-users mr-2"></i>
47
47
  <span>Customers</span>
48
- <i class="pi pi-angle-down ml-auto lg:ml-3"></i>
48
+ <i class="pi pi-angle-down ml-auto lg:ml-4"></i>
49
49
  </a>
50
- <ul class="list-none py-3 px-6 m-0 lg:px-0 lg:py-0 border-round shadow-0 lg:shadow-2 lg:border-1 border-50 lg:absolute surface-overlay hidden origin-top w-full lg:w-15rem cursor-pointer">
50
+ <ul class="list-none py-4 px-12 m-0 lg:px-0 lg:py-0 rounded-border shadow-0 lg:shadow lg:border border-surface-50 dark:border-surface-800 lg:absolute bg-surface-0 dark:bg-surface-900 hidden origin-top w-full lg:w-60 cursor-pointer">
51
51
  <li>
52
- <a v-ripple class="flex p-3 align-items-center text-600 hover:text-900 hover:surface-100 transition-colors transition-duration-150 p-ripple">
52
+ <a v-ripple class="flex p-4 items-center text-surface-600 dark:text-surface-200 hover:text-surface-900 dark:hover:text-surface-0 hover:bg-surface-100 dark:hover:bg-surface-700 transition-colors duration-150 p-ripple">
53
53
  <i class="pi pi-user-plus mr-2"></i>
54
54
  <span class="font-medium">Add New</span>
55
55
  </a>
56
56
  </li>
57
57
  <li class="relative">
58
- <a v-ripple class="flex p-3 align-items-center text-600 hover:text-900 hover:surface-100 transition-colors transition-duration-150 p-ripple"
59
- v-styleclass="{ selector: '@next', enterClass: 'hidden', enterActiveClass: 'scalein', leaveToClass: 'hidden', leaveActiveClass: 'fadeout', hideOnOutsideClick: true }">
58
+ <a v-ripple class="flex p-4 items-center text-surface-600 dark:text-surface-200 hover:text-surface-900 dark:hover:text-surface-0 hover:bg-surface-100 dark:hover:bg-surface-700 transition-colors duration-150 p-ripple"
59
+ v-styleclass="{ selector: '@next', enterFromClass: 'hidden', enterActiveClass: 'scalein', leaveToClass: 'hidden', leaveActiveClass: 'fadeout', hideOnOutsideClick: true }">
60
60
  <i class="pi pi-search mr-2"></i>
61
61
  <span class="font-medium">Search</span>
62
62
  <i class="pi pi-angle-down ml-auto lg:-rotate-90"></i>
63
63
  </a>
64
- <ul class="list-none py-3 pl-3 m-0 lg:px-0 lg:py-0 border-round shadow-0 lg:shadow-2 lg:border-1 border-50 lg:absolute surface-overlay hidden origin-top w-full lg:w-15rem cursor-pointer left-100 top-0">
64
+ <ul class="list-none py-4 pl-4 m-0 lg:px-0 lg:py-0 rounded-border shadow-0 lg:shadow lg:border border-surface-50 dark:border-surface-800 lg:absolute bg-surface-0 dark:bg-surface-900 hidden origin-top w-full lg:w-60 cursor-pointer left-full top-0">
65
65
  <li>
66
- <a v-ripple class="flex p-3 align-items-center text-600 hover:text-900 hover:surface-100 transition-colors transition-duration-150 p-ripple">
66
+ <a v-ripple class="flex p-4 items-center text-surface-600 dark:text-surface-200 hover:text-surface-900 dark:hover:text-surface-0 hover:bg-surface-100 dark:hover:bg-surface-700 transition-colors duration-150 p-ripple">
67
67
  <i class="pi pi-shopping-cart mr-2"></i>
68
68
  <span class="font-medium">Purchases</span>
69
69
  </a>
70
70
  </li>
71
71
  <li class="relative">
72
- <a v-ripple class="flex p-3 align-items-center text-600 hover:text-900 hover:surface-100 transition-colors transition-duration-150 p-ripple">
72
+ <a v-ripple class="flex p-4 items-center text-surface-600 dark:text-surface-200 hover:text-surface-900 dark:hover:text-surface-0 hover:bg-surface-100 dark:hover:bg-surface-700 transition-colors duration-150 p-ripple">
73
73
  <i class="pi pi-comments mr-2"></i>
74
74
  <span class="font-medium">Messages</span>
75
75
  </a>
@@ -79,31 +79,31 @@
79
79
  </ul>
80
80
  </li>
81
81
  <li>
82
- <a v-ripple class="flex px-6 p-3 lg:px-3 lg:py-2 align-items-center text-600 hover:text-900 hover:surface-100 font-medium border-round cursor-pointer transition-colors transition-duration-150 p-ripple">
82
+ <a v-ripple class="flex px-12 p-4 lg:px-4 lg:py-2 items-center text-surface-600 dark:text-surface-200 hover:text-surface-900 dark:hover:text-surface-0 hover:bg-surface-100 dark:hover:bg-surface-700 font-medium rounded-border cursor-pointer transition-colors duration-150 p-ripple">
83
83
  <i class="pi pi-calendar mr-2"></i>
84
84
  <span>Calendar</span>
85
85
  </a>
86
86
  </li>
87
87
  <li>
88
- <a v-ripple class="flex px-6 p-3 lg:px-3 lg:py-2 align-items-center text-600 hover:text-900 hover:surface-100 font-medium border-round cursor-pointer transition-colors transition-duration-150 p-ripple">
88
+ <a v-ripple class="flex px-12 p-4 lg:px-4 lg:py-2 items-center text-surface-600 dark:text-surface-200 hover:text-surface-900 dark:hover:text-surface-0 hover:bg-surface-100 dark:hover:bg-surface-700 font-medium rounded-border cursor-pointer transition-colors duration-150 p-ripple">
89
89
  <i class="pi pi-chart-line mr-2"></i>
90
90
  <span>Stats</span>
91
91
  </a>
92
92
  </li>
93
93
  </ul>
94
- <ul class="list-none p-0 m-0 flex lg:align-items-center select-none flex-column lg:flex-row border-top-1 surface-border lg:border-top-none">
94
+ <ul class="list-none p-0 m-0 flex lg:items-center select-none flex-col lg:flex-row border-t border-surface lg:border-t-0">
95
95
  <li>
96
- <a v-ripple class="flex px-6 p-3 lg:px-3 lg:py-2 align-items-center text-600 hover:text-900 hover:surface-100 font-medium border-round cursor-pointer transition-colors transition-duration-150 p-ripple">
96
+ <a v-ripple class="flex px-12 p-4 lg:px-4 lg:py-2 items-center text-surface-600 dark:text-surface-200 hover:text-surface-900 dark:hover:text-surface-0 hover:bg-surface-100 dark:hover:bg-surface-700 font-medium rounded-border cursor-pointer transition-colors duration-150 p-ripple">
97
97
  <i class="pi pi-inbox text-base lg:text-2xl mr-2 lg:mr-0"></i>
98
98
  <span class="block lg:hidden font-medium">Inbox</span>
99
99
  </a>
100
100
  </li>
101
- <li class="border-top-1 surface-border lg:border-top-none">
102
- <a v-ripple class="flex px-6 p-3 lg:px-3 lg:py-2 align-items-center hover:surface-100 font-medium border-round cursor-pointer transition-colors transition-duration-150 p-ripple">
103
- <img src="/images/empty-user-photo.svg" class="mr-3 lg:mr-0 border-circle" style="width: 28px; height: 28px"/>
101
+ <li class="border-t border-surface lg:border-t-0">
102
+ <a v-ripple class="flex px-12 p-4 lg:px-4 lg:py-2 items-center hover:bg-surface-100 dark:hover:bg-surface-700 font-medium rounded-border cursor-pointer transition-colors duration-150 p-ripple">
103
+ <img src="/images/empty-user-photo.svg" class="mr-4 lg:mr-0 rounded-full" style="width: 28px; height: 28px"/>
104
104
  <div class="block lg:hidden">
105
- <div class="text-900 font-medium">Josephine Lillard</div>
106
- <span class="text-600 font-medium text-sm">Marketing Specialist</span>
105
+ <div class="text-surface-900 dark:text-surface-0 font-medium">Josephine Lillard</div>
106
+ <span class="text-surface-600 dark:text-surface-200 font-medium text-sm">Marketing Specialist</span>
107
107
  </div>
108
108
  </a>
109
109
  </li>
package/front/src/components/ContentAdminButtons.vue CHANGED
@@ -1,5 +1,5 @@
1
1
  <template>
2
- <div class="absolute top-0 right-0 pr-4 max-h-0 flex align-items-center z-5">
2
+ <div class="absolute top-0 right-0 pr-6 max-h-0 flex items-center z-50">
3
3
  <router-link :to="editorRoute(objectType, object)" class="no-underline">
4
4
  <Button icon="pi pi-pencil"
5
5
  class="p-button p-button-icon-only p-button-rounded p-button-warning mr-2" />
package/front/src/components/ContentEditor.vue CHANGED
@@ -13,7 +13,7 @@
13
13
  <Button icon="pi pi-eye" label="Preview" class="p-button-secondary p-button-sm mr-1 mb-1" />
14
14
  </router-link>
15
15
 
16
- <div class="p-buttonset mr-1 mb-1 border-round">
16
+ <div class="p-buttonset mr-1 mb-1 rounded-border">
17
17
  <Button type="button"
18
18
  class="p-button p-component p-button-sm p-button-outlined p-button-secondary cursor-auto inline-block"
19
19
  :class="{ 'p-disabled': saveState == 'saving' }">
package/front/src/components/ContentPreview.vue CHANGED
@@ -1,7 +1,7 @@
1
1
  <template>
2
2
 
3
3
  <LimitedAccess :requiredRoles="['writer']" :objectType="objectType" :object="object" hidden>
4
- <div class="absolute top-0 right-0 pr-4 max-h-0 flex align-items-center z-5">
4
+ <div class="absolute top-0 right-0 pr-6 max-h-0 flex items-center z-50">
5
5
  <Badge severity="warning" value="This is page preview" class="mr-2" />
6
6
  <router-link :to="editorRoute(objectType, object)" class="no-underline">
7
7
  <Button icon="pi pi-pencil"
package/front/src/components/MetadataEditor.vue CHANGED
@@ -3,12 +3,13 @@
3
3
  <auto-editor :definition="editableDefinition" v-model="editable" :rootValue="editable" i18n="content.metadata." />
4
4
  <Button label="Save metadata" icon="pi pi-save" :disabled="!changed || error" @click="save" />
5
5
  <div>
6
- <small v-if="error" class="p-error">Fix errors above to save</small>
6
+ <Message v-if="error" severity="error" variant="simple" size="small">Fix errors above to save</Message>
7
7
  </div>
8
8
  </template>
9
9
 
10
10
  <script setup>
11
11
  import Button from 'primevue/button'
12
+ import Message from "primevue/message"
12
13
  import { AutoInput, AutoField, AutoEditor } from '@live-change/frontend-auto-form'
13
14
 
14
15
  import "@live-change/image-frontend"
package/front/src/components/NotAuthorizedAdminButtons.vue CHANGED
@@ -1,5 +1,5 @@
1
1
  <template>
2
- <div class="absolute top-0 right-0 pr-4 max-h-0 flex align-items-center z-5">
2
+ <div class="absolute top-0 right-0 pr-6 max-h-0 flex items-center z-50">
3
3
  <router-link :to="editorRoute(objectType, object)" class="no-underline">
4
4
  <Button icon="pi pi-pencil"
5
5
  class="p-button p-button-icon-only p-button-rounded p-button-warning mr-2" />
package/front/src/components/NotFoundAdminButtons.vue CHANGED
@@ -1,5 +1,5 @@
1
1
  <template>
2
- <div class="absolute top-0 right-0 pr-4 max-h-0 flex align-items-center z-5">
2
+ <div class="absolute top-0 right-0 pr-6 max-h-0 flex items-center z-50">
3
3
  <Button icon="pi pi-plus"
4
4
  class="p-button p-button-icon-only p-button-rounded p-button-danger"
5
5
  @click="createContent" />
package/front/src/components/PagesList.vue CHANGED
@@ -1,7 +1,7 @@
1
1
  <template>
2
- <div class="w-full sm:w-12 md:w-9 lg:w-7 surface-card p-4 shadow-2 border-round">
3
- <div class="text-center mb-5">
4
- <div class="text-900 text-3xl font-medium mb-3">
2
+ <div class="w-full sm:w-full md:w-9/12 lg:w-7/12 bg-surface-0 dark:bg-surface-900 p-6 shadow rounded-border">
3
+ <div class="text-center mb-8">
4
+ <div class="text-surface-900 dark:text-surface-0 text-3xl font-medium mb-4">
5
5
  Pages list
6
6
  </div>
7
7
  </div>
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@live-change/content-frontend",
3
- "version": "0.9.32",
3
+ "version": "0.9.34",
4
4
  "scripts": {
5
5
  "memDev": "node server/start.js memDev --enableSessions --initScript ./init.js --dbAccess",
6
6
  "localDevInit": "rm tmp.db; lcli localDev --enableSessions --initScript ./init.js",
@@ -22,16 +22,16 @@
22
22
  "type": "module",
23
23
  "dependencies": {
24
24
  "@fortawesome/fontawesome-free": "^6.7.2",
25
- "@live-change/cli": "^0.9.32",
26
- "@live-change/dao": "^0.9.32",
27
- "@live-change/dao-vue3": "^0.9.32",
28
- "@live-change/dao-websocket": "^0.9.32",
29
- "@live-change/framework": "^0.9.32",
30
- "@live-change/image-service": "^0.9.32",
31
- "@live-change/session-service": "^0.9.32",
32
- "@live-change/url-frontend": "^0.9.32",
33
- "@live-change/vue3-components": "^0.9.32",
34
- "@live-change/vue3-ssr": "^0.9.32",
25
+ "@live-change/cli": "^0.9.34",
26
+ "@live-change/dao": "^0.9.34",
27
+ "@live-change/dao-vue3": "^0.9.34",
28
+ "@live-change/dao-websocket": "^0.9.34",
29
+ "@live-change/framework": "^0.9.34",
30
+ "@live-change/image-service": "^0.9.34",
31
+ "@live-change/session-service": "^0.9.34",
32
+ "@live-change/url-frontend": "^0.9.34",
33
+ "@live-change/vue3-components": "^0.9.34",
34
+ "@live-change/vue3-ssr": "^0.9.34",
35
35
  "@vueuse/core": "^12.3.0",
36
36
  "codeceptjs-assert": "^0.0.5",
37
37
  "compression": "^1.7.5",
@@ -42,7 +42,7 @@
42
42
  "pretty-bytes": "^6.1.1",
43
43
  "primeflex": "^3.3.1",
44
44
  "primeicons": "^7.0.0",
45
- "primevue": "^3.52.0",
45
+ "primevue": "^4.2.5",
46
46
  "rollup-plugin-node-builtins": "^2.1.2",
47
47
  "rollup-plugin-visualizer": "5.14.0",
48
48
  "serialize-javascript": "^6.0.2",
@@ -52,7 +52,7 @@
52
52
  "vue3-scroll-border": "0.1.6"
53
53
  },
54
54
  "devDependencies": {
55
- "@live-change/codeceptjs-helper": "^0.9.32",
55
+ "@live-change/codeceptjs-helper": "^0.9.34",
56
56
  "codeceptjs": "^3.6.10",
57
57
  "generate-password": "1.7.1",
58
58
  "playwright": "1.49.1",
@@ -63,5 +63,5 @@
63
63
  "author": "Michał Łaszczewski <michal@laszczewski.pl>",
64
64
  "license": "ISC",
65
65
  "description": "",
66
- "gitHead": "41022fc283020e2da3e82aa27274401052d2379a"
66
+ "gitHead": "e5f22de77fe6a3c0a0e1b91d17593e195aaae3b3"
67
67
  }