kmcom-nuxt-layers 1.6.32 → 1.6.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.
- package/layers/content/app/pages/blog/[slug].vue +8 -6
- package/layers/content/app/pages/blog/index.vue +12 -10
- package/layers/content/app/pages/gallery/[slug]/[imageId].vue +8 -6
- package/layers/content/app/pages/gallery/[slug]/index.vue +7 -5
- package/layers/content/app/pages/gallery/index.vue +12 -10
- package/layers/content/app/pages/portfolio/[slug].vue +7 -5
- package/layers/content/app/pages/portfolio/index.vue +12 -10
- package/layers/core/nuxt.config.ts +1 -1
- package/layers/layout/app/components/Layout/Main.vue +5 -1
- package/layers/layout/app/components/Layout/Section/index.vue +23 -23
- package/layers/layout/nuxt.config.ts +5 -0
- package/layers/motion/nuxt.config.ts +5 -0
- package/layers/routing/nuxt.config.ts +5 -0
- package/layers/shader/nuxt.config.ts +5 -0
- package/layers/theme/nuxt.config.ts +5 -0
- package/package.json +1 -1
|
@@ -1,12 +1,14 @@
|
|
|
1
1
|
<script setup lang="ts">
|
|
2
|
-
definePageMeta({ name: 'content-blog-slug' })
|
|
2
|
+
definePageMeta({ name: 'content-blog-slug' })
|
|
3
3
|
|
|
4
|
-
const route = useRoute()
|
|
5
|
-
const slug = route.params.slug as string
|
|
4
|
+
const route = useRoute()
|
|
5
|
+
const slug = route.params.slug as string
|
|
6
6
|
</script>
|
|
7
7
|
|
|
8
8
|
<template>
|
|
9
|
-
<
|
|
10
|
-
<
|
|
11
|
-
|
|
9
|
+
<LayoutSection>
|
|
10
|
+
<LayoutGridItem>
|
|
11
|
+
<BlogArticle :slug="slug" />
|
|
12
|
+
</LayoutGridItem>
|
|
13
|
+
</LayoutSection>
|
|
12
14
|
</template>
|
|
@@ -1,15 +1,17 @@
|
|
|
1
1
|
<script setup lang="ts">
|
|
2
|
-
useSeoMeta({
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
})
|
|
2
|
+
useSeoMeta({
|
|
3
|
+
title: 'Blog',
|
|
4
|
+
description: 'Latest articles and updates',
|
|
5
|
+
})
|
|
6
6
|
</script>
|
|
7
7
|
|
|
8
8
|
<template>
|
|
9
|
-
<
|
|
10
|
-
<
|
|
11
|
-
|
|
12
|
-
<
|
|
13
|
-
|
|
14
|
-
|
|
9
|
+
<LayoutSection>
|
|
10
|
+
<LayoutGridItem>
|
|
11
|
+
<UPageHeader title="Blog" description="Latest articles and updates" />
|
|
12
|
+
<UPageBody>
|
|
13
|
+
<BlogList />
|
|
14
|
+
</UPageBody>
|
|
15
|
+
</LayoutGridItem>
|
|
16
|
+
</LayoutSection>
|
|
15
17
|
</template>
|
|
@@ -1,11 +1,13 @@
|
|
|
1
1
|
<script setup lang="ts">
|
|
2
|
-
const route = useRoute()
|
|
3
|
-
const slug = route.params.slug as string
|
|
4
|
-
const index = Number(route.params.imageId)
|
|
2
|
+
const route = useRoute()
|
|
3
|
+
const slug = route.params.slug as string
|
|
4
|
+
const index = Number(route.params.imageId)
|
|
5
5
|
</script>
|
|
6
6
|
|
|
7
7
|
<template>
|
|
8
|
-
<
|
|
9
|
-
<
|
|
10
|
-
|
|
8
|
+
<LayoutSection>
|
|
9
|
+
<LayoutGridItem>
|
|
10
|
+
<GalleryImageDetail :slug="slug" :index="index" />
|
|
11
|
+
</LayoutGridItem>
|
|
12
|
+
</LayoutSection>
|
|
11
13
|
</template>
|
|
@@ -1,10 +1,12 @@
|
|
|
1
1
|
<script setup lang="ts">
|
|
2
|
-
const route = useRoute()
|
|
3
|
-
const slug = route.params.slug as string
|
|
2
|
+
const route = useRoute()
|
|
3
|
+
const slug = route.params.slug as string
|
|
4
4
|
</script>
|
|
5
5
|
|
|
6
6
|
<template>
|
|
7
|
-
<
|
|
8
|
-
<
|
|
9
|
-
|
|
7
|
+
<LayoutSection>
|
|
8
|
+
<LayoutGridItem>
|
|
9
|
+
<GalleryDetail :slug="slug" />
|
|
10
|
+
</LayoutGridItem>
|
|
11
|
+
</LayoutSection>
|
|
10
12
|
</template>
|
|
@@ -1,15 +1,17 @@
|
|
|
1
1
|
<script setup lang="ts">
|
|
2
|
-
useSeoMeta({
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
})
|
|
2
|
+
useSeoMeta({
|
|
3
|
+
title: 'Gallery',
|
|
4
|
+
description: 'Photo collections and visual work',
|
|
5
|
+
})
|
|
6
6
|
</script>
|
|
7
7
|
|
|
8
8
|
<template>
|
|
9
|
-
<
|
|
10
|
-
<
|
|
11
|
-
|
|
12
|
-
<
|
|
13
|
-
|
|
14
|
-
|
|
9
|
+
<LayoutSection>
|
|
10
|
+
<LayoutGridItem>
|
|
11
|
+
<UPageHeader title="Gallery" description="Photo collections and visual work" />
|
|
12
|
+
<UPageBody>
|
|
13
|
+
<GalleryGrid />
|
|
14
|
+
</UPageBody>
|
|
15
|
+
</LayoutGridItem>
|
|
16
|
+
</LayoutSection>
|
|
15
17
|
</template>
|
|
@@ -1,10 +1,12 @@
|
|
|
1
1
|
<script setup lang="ts">
|
|
2
|
-
const route = useRoute()
|
|
3
|
-
const slug = route.params.slug as string
|
|
2
|
+
const route = useRoute()
|
|
3
|
+
const slug = route.params.slug as string
|
|
4
4
|
</script>
|
|
5
5
|
|
|
6
6
|
<template>
|
|
7
|
-
<
|
|
8
|
-
<
|
|
9
|
-
|
|
7
|
+
<LayoutSection>
|
|
8
|
+
<LayoutGridItem>
|
|
9
|
+
<PortfolioDetail :slug="slug" />
|
|
10
|
+
</LayoutGridItem>
|
|
11
|
+
</LayoutSection>
|
|
10
12
|
</template>
|
|
@@ -1,15 +1,17 @@
|
|
|
1
1
|
<script setup lang="ts">
|
|
2
|
-
useSeoMeta({
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
})
|
|
2
|
+
useSeoMeta({
|
|
3
|
+
title: 'Portfolio',
|
|
4
|
+
description: 'Featured projects and work',
|
|
5
|
+
})
|
|
6
6
|
</script>
|
|
7
7
|
|
|
8
8
|
<template>
|
|
9
|
-
<
|
|
10
|
-
<
|
|
11
|
-
|
|
12
|
-
<
|
|
13
|
-
|
|
14
|
-
|
|
9
|
+
<LayoutSection>
|
|
10
|
+
<LayoutGridItem>
|
|
11
|
+
<UPageHeader title="Portfolio" description="Featured projects and work" />
|
|
12
|
+
<UPageBody>
|
|
13
|
+
<PortfolioList />
|
|
14
|
+
</UPageBody>
|
|
15
|
+
</LayoutGridItem>
|
|
16
|
+
</LayoutSection>
|
|
15
17
|
</template>
|
|
@@ -27,7 +27,11 @@ const { mode } = useGridConfig()
|
|
|
27
27
|
</script>
|
|
28
28
|
|
|
29
29
|
<template>
|
|
30
|
-
<component
|
|
30
|
+
<component
|
|
31
|
+
:is="tag"
|
|
32
|
+
:class="mode !== 'disabled' ? 'mastmain' : undefined"
|
|
33
|
+
:style="mode !== 'disabled' ? { paddingInline: 'var(--grid-padding, clamp(1rem, 2.5vw, 2rem))' } : undefined"
|
|
34
|
+
>
|
|
31
35
|
<slot />
|
|
32
36
|
</component>
|
|
33
37
|
</template>
|
|
@@ -1,20 +1,20 @@
|
|
|
1
1
|
<script setup lang="ts">
|
|
2
|
-
/**
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
interface Props {
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
}
|
|
2
|
+
/**
|
|
3
|
+
* BaseSection - Full-viewport section using subgrid
|
|
4
|
+
*
|
|
5
|
+
* Inherits the parent MastMain's 18-column grid lines using CSS subgrid.
|
|
6
|
+
* Spans 12 rows (1 viewport height) for full-screen sections.
|
|
7
|
+
* Child GridItem elements position themselves on these inherited grid lines.
|
|
8
|
+
*
|
|
9
|
+
* @prop {boolean} fullHeight - Optional min-height safety net
|
|
10
|
+
* @prop {boolean} fullWidth - Break outside the grid gutters for edge-to-edge content
|
|
11
|
+
*/
|
|
12
|
+
interface Props {
|
|
13
|
+
fullHeight?: boolean
|
|
14
|
+
fullWidth?: boolean
|
|
15
|
+
}
|
|
16
16
|
|
|
17
|
-
const { fullHeight = false, fullWidth = false } = defineProps<Props>()
|
|
17
|
+
const { fullHeight = false, fullWidth = false } = defineProps<Props>()
|
|
18
18
|
</script>
|
|
19
19
|
|
|
20
20
|
<template>
|
|
@@ -24,13 +24,13 @@ const { fullHeight = false, fullWidth = false } = defineProps<Props>()
|
|
|
24
24
|
</template>
|
|
25
25
|
|
|
26
26
|
<style scoped>
|
|
27
|
-
.section-bleed {
|
|
28
|
-
|
|
29
|
-
|
|
27
|
+
.section-bleed {
|
|
28
|
+
--bleed: var(--grid-padding, clamp(1rem, 2.5vw, 2rem));
|
|
29
|
+
--gap: var(--grid-gap, clamp(0.75rem, 1.5vw, 1.5rem));
|
|
30
30
|
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
}
|
|
31
|
+
margin-inline: calc(-1 * var(--bleed));
|
|
32
|
+
margin-block: calc(-0.5 * var(--gap));
|
|
33
|
+
width: calc(100% + 2 * var(--bleed));
|
|
34
|
+
max-width: none;
|
|
35
|
+
}
|
|
36
36
|
</style>
|