Skip to content

Commit 10d8414

Browse files
zealsprincezealsprince
committed
Merge branch 'dev' of github.com:hivecom/hivecom.net into dev
2 parents 4ce1e89 + f9e9f77 commit 10d8414

33 files changed

+339
-261
lines changed

‎app/assets/index.scss‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -18,7 +18,7 @@
1818

1919
--dark-color-text: #fff;
2020
--dark-color-text-lighter: rgb(110, 110, 110);
21-
--dark-color-border-weak: rgb(24, 24, 24);
21+
--dark-color-border-weak: #181818;
2222

2323
// Light theme colors
2424
--light-color-bg: #eee;

‎app/components/Admin/Announcements/AnnouncementDetails.vue‎

Lines changed: 13 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -43,12 +43,12 @@ function handleDelete(announcement: Tables<'announcements'>) {
4343
@close="handleClose"
4444
>
4545
<template #header>
46-
<Flex x-between y-center>
47-
<Flex column :gap="0">
46+
<Flex x-between y-center class="pr-s">
47+
<Flex column gap="xxs">
4848
<h4>Announcement Details</h4>
49-
<span v-if="props.announcement" class="text-color-light text-xxs">
49+
<p v-if="props.announcement" class="text-color-light text-m">
5050
{{ props.announcement.title }}
51-
</span>
51+
</p>
5252
</Flex>
5353
<Flex y-center gap="s">
5454
<AdminActions
@@ -66,25 +66,25 @@ function handleDelete(announcement: Tables<'announcements'>) {
6666
<Flex v-if="props.announcement" column gap="m" class="announcement-details">
6767
<Flex column gap="m" expand>
6868
<!-- Basic info -->
69-
<Card>
69+
<Card class="card-bg">
7070
<Flex column gap="l" expand>
71-
<Grid class="announcement-details__item" expand :columns="2">
71+
<Grid class="announcement-details__item" expand columns="1fr 2fr">
7272
<span class="text-color-light text-bold">ID:</span>
7373
<span>{{ props.announcement.id }}</span>
7474
</Grid>
7575

76-
<Grid class="announcement-details__item" expand :columns="2">
76+
<Grid class="announcement-details__item" expand columns="1fr 2fr">
7777
<span class="text-color-light text-bold">Title:</span>
7878
<span>{{ props.announcement.title }}</span>
7979
</Grid>
8080

81-
<Grid class="announcement-details__item" expand :columns="2">
81+
<Grid class="announcement-details__item" expand columns="1fr 2fr">
8282
<span class="text-color-light text-bold">Pinned:</span>
8383
<Icon v-if="props.announcement.pinned" name="ph:push-pin-fill" class="color-accent" />
8484
<span v-else class="text-color-light">No</span>
8585
</Grid>
8686

87-
<Grid class="announcement-details__item" expand :columns="2">
87+
<Grid class="announcement-details__item" expand columns="1fr 2fr">
8888
<span class="text-color-light text-bold">Published:</span>
8989
<TimestampDate
9090
:date="props.announcement.published_at"
@@ -93,14 +93,14 @@ function handleDelete(announcement: Tables<'announcements'>) {
9393
/>
9494
</Grid>
9595

96-
<Grid v-if="props.announcement.link" class="announcement-details__item" expand :columns="2">
96+
<Grid v-if="props.announcement.link" class="announcement-details__item" expand columns="1fr 2fr">
9797
<span class="text-color-light text-bold">Link:</span>
9898
<NuxtLink external :href="props.announcement.link" target="_blank" class="color-accent text-m">
9999
{{ props.announcement.link }}
100100
</NuxtLink>
101101
</Grid>
102102

103-
<Grid v-if="props.announcement.tags && props.announcement.tags.length > 0" class="announcement-details__item" expand :columns="2">
103+
<Grid v-if="props.announcement.tags && props.announcement.tags.length > 0" class="announcement-details__item" expand columns="1fr 2fr">
104104
<span class="text-color-light text-bold">Tags:</span>
105105
<div class="tags-display">
106106
<Badge
@@ -117,7 +117,7 @@ function handleDelete(announcement: Tables<'announcements'>) {
117117
</Card>
118118

119119
<!-- Description -->
120-
<Card v-if="props.announcement.description" separators>
120+
<Card v-if="props.announcement.description" separators class="card-bg">
121121
<template #header>
122122
<h6>Description</h6>
123123
</template>
@@ -126,7 +126,7 @@ function handleDelete(announcement: Tables<'announcements'>) {
126126
</Card>
127127

128128
<!-- Markdown Content -->
129-
<Card v-if="props.announcement.markdown" separators>
129+
<Card v-if="props.announcement.markdown" separators class="card-bg">
130130
<template #header>
131131
<h6>Content</h6>
132132
</template>

‎app/components/Admin/Announcements/AnnouncementForm.vue‎

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -305,11 +305,11 @@ function handleTagInputEnter() {
305305
@close="handleClose"
306306
>
307307
<template #header>
308-
<Flex column :gap="0">
308+
<Flex column gap="xxs">
309309
<h4>{{ props.isEditMode ? 'Edit Announcement' : 'Add Announcement' }}</h4>
310-
<span v-if="props.isEditMode && props.announcement" class="text-color-light text-xxs">
310+
<p v-if="props.isEditMode && props.announcement" class="text-color-light text-m">
311311
{{ props.announcement.title }}
312-
</span>
312+
</p>
313313
</Flex>
314314
</template>
315315

‎app/components/Admin/Assets/AssetDetails.vue‎

Lines changed: 51 additions & 43 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
<script setup lang="ts">
22
import type { CmsAsset } from '@/lib/cmsAssets'
3-
import { Button, Card, CopyClipboard, Flex, Grid, Sheet } from '@dolanske/vui'
3+
import { Button, Card, CopyClipboard, Flex, Grid, Input, Sheet } from '@dolanske/vui'
44
55
import { computed } from 'vue'
66
import { formatBytes, isImageAsset } from '@/lib/cmsAssets'
@@ -28,7 +28,7 @@ const markdownSnippet = computed(() => assetUrl.value ? `![${props.asset?.name ?
2828
2929
const isMobile = useBreakpoint('<xs')
3030
const showActionLabels = computed(() => !isMobile.value)
31-
const actionButtonSize = computed(() => showActionLabels.value ? 'm' as const : 's' as const)
31+
// const actionButtonSize = computed(() => showActionLabels.value ? 'm' as const : 's' as const)
3232
3333
function closeDrawer() {
3434
isOpen.value = false
@@ -61,15 +61,17 @@ function requestRename() {
6161
@close="closeDrawer"
6262
>
6363
<template #header>
64-
<Flex x-between y-center>
64+
<Flex x-between y-center class="pr-s">
6565
<Flex column gap="xxs">
6666
<h4>Asset Details</h4>
67-
<span class="text-xs text-color-light">{{ props.asset?.name }}</span>
67+
<p class="text-m text-color-light">
68+
{{ props.asset?.name }}
69+
</p>
6870
</Flex>
6971
<Flex gap="xs" y-center>
7072
<Button
7173
v-if="props.canRename"
72-
:size="actionButtonSize"
74+
size="s"
7375
variant="gray"
7476
:square="!showActionLabels"
7577
@click="requestRename"
@@ -84,7 +86,7 @@ function requestRename() {
8486
</Button>
8587
<Button
8688
v-if="props.canDelete"
87-
:size="actionButtonSize"
89+
size="s"
8890
variant="danger"
8991
:square="!showActionLabels"
9092
@click="requestDelete"
@@ -106,31 +108,31 @@ function requestRename() {
106108
<img :src="assetUrl" :alt="props.asset?.name ?? 'Preview'">
107109
</div>
108110

109-
<Card>
111+
<Card class="card-bg">
110112
<Flex column gap="l" expand>
111-
<Grid class="asset-details__item" expand :columns="2">
113+
<Grid class="asset-details__item" expand columns="1fr 2fr">
112114
<span class="text-color-light text-bold">Path:</span>
113115
<span>{{ props.asset?.path }}</span>
114116
</Grid>
115117

116-
<Grid class="asset-details__item" expand :columns="2">
118+
<Grid class="asset-details__item" expand columns="1fr 2fr">
117119
<span class="text-color-light text-bold">Size:</span>
118120
<span>{{ formatBytes(props.asset.size) }}</span>
119121
</Grid>
120122

121-
<Grid class="asset-details__item" expand :columns="2">
123+
<Grid class="asset-details__item" expand columns="1fr 2fr">
122124
<span class="text-color-light text-bold">Content Type:</span>
123125
<span>{{ props.asset.mimeType ?? 'Unknown' }}</span>
124126
</Grid>
125127

126-
<Grid class="asset-details__item" expand :columns="2">
128+
<Grid class="asset-details__item" expand columns="1fr 2fr">
127129
<span class="text-color-light text-bold">Created:</span>
128130
<span>
129131
{{ props.asset.created_at ? new Date(props.asset.created_at).toLocaleString() : '—' }}
130132
</span>
131133
</Grid>
132134

133-
<Grid class="asset-details__item" expand :columns="2">
135+
<Grid class="asset-details__item" expand columns="1fr 2fr">
134136
<span class="text-color-light text-bold">Updated:</span>
135137
<span>
136138
{{ props.asset.updated_at ? new Date(props.asset.updated_at).toLocaleString() : '—' }}
@@ -139,38 +141,44 @@ function requestRename() {
139141
</Flex>
140142
</Card>
141143

142-
<Card v-if="assetUrl" class="asset-details__clipboard">
143-
<Flex column gap="s" expand>
144-
<div>
145-
<span class="text-xs text-color-light">Public URL</span>
146-
<Flex gap="s" class="mt-xxs">
147-
<CopyClipboard :text="assetUrl" confirm>
148-
<Button variant="gray">
149-
Copy URL
150-
</Button>
151-
</CopyClipboard>
152-
<Button variant="gray" @click="openInNewTab">
153-
Open
144+
<Card v-if="assetUrl" class="asset-details__clipboard card-bg">
145+
<Flex column gap="l" expand>
146+
<Flex y-end expand gap="xs">
147+
<Input
148+
class="flex-1"
149+
expand
150+
readonly
151+
:model-value="assetUrl"
152+
label="Public URL"
153+
/>
154+
<CopyClipboard :text="assetUrl" confirm>
155+
<Button square variant="gray">
156+
<Icon name="ph:copy" size="18" />
157+
</Button>
158+
</CopyClipboard>
159+
<Button square variant="gray" @click="openInNewTab">
160+
<!-- Open -->
161+
<Icon name="ph:arrow-square-out" size="18" />
162+
</Button>
163+
</Flex>
164+
165+
<Flex v-if="markdownSnippet" y-end expand gap="xs">
166+
<Input
167+
class="flex-1"
168+
expand
169+
readonly
170+
:model-value="markdownSnippet"
171+
label="Markdown snippet"
172+
/>
173+
<CopyClipboard :text="markdownSnippet" confirm>
174+
<Button square variant="gray">
175+
<Icon name="ph:copy" size="18" />
154176
</Button>
155-
</Flex>
156-
<div class="asset-details__code mt-xs">
157-
{{ assetUrl }}
158-
</div>
159-
</div>
160-
161-
<div v-if="markdownSnippet">
162-
<span class="text-xs text-color-light">Markdown Snippet</span>
163-
<Flex gap="s" class="mt-xxs">
164-
<CopyClipboard :text="markdownSnippet" confirm>
165-
<Button variant="gray">
166-
Copy Markdown
167-
</Button>
168-
</CopyClipboard>
169-
</Flex>
170-
<div class="asset-details__code mt-xs">
171-
{{ markdownSnippet }}
172-
</div>
173-
</div>
177+
</CopyClipboard>
178+
<Button square variant="gray" @click="openInNewTab">
179+
<Icon name="ph:arrow-square-out" size="18" />
180+
</Button>
181+
</Flex>
174182
</Flex>
175183
</Card>
176184
</Flex>

‎app/components/Admin/Assets/AssetUpload.vue‎

Lines changed: 6 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -197,25 +197,26 @@ function updateFileName(id: string, value: string) {
197197
<Sheet
198198
:open="isOpen"
199199
position="right"
200-
separator
200+
:card="{ separators: true }"
201201
:size="520"
202202
@close="closeDrawer"
203203
>
204204
<template #header>
205-
<Flex column gap="xs">
205+
<Flex column gap="xxs">
206206
<h4>Upload Assets</h4>
207-
<p class="text-color-light text-s">
207+
<p class="text-color-light text-m">
208208
Upload images into the hivecom-cms bucket for use inside markdown content.
209209
</p>
210210
</Flex>
211211
</template>
212212

213213
<Flex column gap="m" class="upload-drawer">
214-
<Card class="upload-drawer__destination">
214+
<Card class="upload-drawer__destination card-bg">
215215
<Flex column gap="xs">
216-
<span class="text-xs text-color-light">Destination Folder</span>
216+
<!-- <span class="text-xs text-color-light">Destination Folder</span> -->
217217
<Input
218218
v-model="targetFolder"
219+
label="Destination folder"
219220
placeholder="Optional subfolder (e.g. banners/motd)"
220221
:disabled="uploading"
221222
expand

‎app/components/Admin/Complaints/ComplaintDetails.vue‎

Lines changed: 9 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -27,7 +27,6 @@ const { canDeleteComplaints } = useAdminPermissions()
2727
2828
const isMobile = useBreakpoint('<xs')
2929
const showActionLabels = computed(() => !isMobile.value)
30-
const actionButtonSize = computed(() => showActionLabels.value ? 'm' as const : 's' as const)
3130
3231
// Define model for sheet visibility
3332
const isOpen = defineModel<boolean>('isOpen')
@@ -201,11 +200,11 @@ function confirmDeleteComplaint() {
201200
@close="handleClose"
202201
>
203202
<template #header>
204-
<Flex x-between y-center gap="l">
203+
<Flex x-between y-center gap="l" class="pr-s">
205204
<h4>Complaint #{{ complaint?.id }}</h4>
206205
<Button
207206
v-if="canDeleteComplaints"
208-
:size="actionButtonSize"
207+
size="s"
209208
variant="danger"
210209
:square="!showActionLabels"
211210
@click="handleDeleteComplaint"
@@ -222,7 +221,7 @@ function confirmDeleteComplaint() {
222221
</template>
223222

224223
<div v-if="complaint" class="complaint-details">
225-
<Card separators>
224+
<Card separators class="card-bg">
226225
<template #header>
227226
<Flex column gap="m">
228227
<!-- Header row with title and badge -->
@@ -246,7 +245,7 @@ function confirmDeleteComplaint() {
246245

247246
<template #footer>
248247
<!-- Metadata row -->
249-
<Flex column gap="s" class="complaint-header-meta" expand>
248+
<Flex column gap="s" expand>
250249
<!-- Context and date info -->
251250
<Flex gap="l" wrap expand>
252251
<Flex gap="xs" y-center expand x-between>
@@ -284,7 +283,7 @@ function confirmDeleteComplaint() {
284283

285284
<h5>Response</h5>
286285
<!-- Response section -->
287-
<Card v-if="complaint.response && !isEditingResponse" separators>
286+
<Card v-if="complaint.response && !isEditingResponse" separators class="card-bg">
288287
<template #header>
289288
<div v-if="complaint.response">
290289
<Flex gap="m" y-center>
@@ -298,7 +297,7 @@ function confirmDeleteComplaint() {
298297
<Flex gap="xs">
299298
<Button
300299
variant="gray"
301-
:size="actionButtonSize"
300+
size="s"
302301
:square="!showActionLabels"
303302
@click="handleEditResponse"
304303
>
@@ -312,7 +311,7 @@ function confirmDeleteComplaint() {
312311
</Button>
313312
<Button
314313
variant="danger"
315-
:size="actionButtonSize"
314+
size="s"
316315
:square="!showActionLabels"
317316
@click="handleRemoveResponse"
318317
>
@@ -368,7 +367,7 @@ function confirmDeleteComplaint() {
368367
<!-- Acknowledge button -->
369368
<Button
370369
v-if="status === 'pending'"
371-
:size="actionButtonSize"
370+
size="s"
372371
variant="accent"
373372
:square="!showActionLabels"
374373
@click="handleAcknowledge"
@@ -385,7 +384,7 @@ function confirmDeleteComplaint() {
385384
<!-- Respond/Update button -->
386385
<Button
387386
v-if="complaint && ((canRespond && responseText.trim() && !complaint.response) || isEditingResponse)"
388-
:size="actionButtonSize"
387+
size="s"
389388
variant="success"
390389
:loading="isSubmitting"
391390
:square="!showActionLabels"

0 commit comments

Comments
 (0)