zenn/sori.studio
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Nuxt 초기 세팅 추가

Browse Source
This commit is contained in:
zenn
2026-04-29 14:54:44 +09:00
parent efc7955415
commit 37f6c38caa
60 changed files with 12698 additions and 34 deletions
Download Patch File Download Diff File Expand all files Collapse all files

5
components/content/ContentRenderer.vue Normal file
View File

@@ -0,0 +1,5 @@
<template>
<article class="content-renderer post-prose">
<slot />
</article>
</template>

5
components/content/ProseAudio.vue Normal file
View File

@@ -0,0 +1,5 @@
<template>
<div class="prose-audio my-8 border border-line bg-surface p-5">
<slot />
</div>
</template>

5
components/content/ProseBlockquote.vue Normal file
View File

@@ -0,0 +1,5 @@
<template>
<blockquote class="prose-blockquote my-8 border-l-4 border-ink bg-surface px-5 py-4 text-xl font-medium leading-8">
<slot />
</blockquote>
</template>

20
components/content/ProseButton.vue Normal file
View File

@@ -0,0 +1,20 @@
<script setup>
defineProps({
href: {
type: String,
default: '#'
},
align: {
type: String,
default: 'left'
}
})
</script>
<template>
<p class="prose-button my-8" :class="{ 'text-center': align === 'center' }">
<NuxtLink class="prose-button__link inline-flex rounded bg-ink px-5 py-3 text-sm font-semibold text-white hover:bg-muted" :to="href">
<slot />
</NuxtLink>
</p>
</template>

5
components/content/ProseCallout.vue Normal file
View File

@@ -0,0 +1,5 @@
<template>
<aside class="prose-callout my-8 border border-line bg-surface p-5">
<slot />
</aside>
</template>

5
components/content/ProseEmbed.vue Normal file
View File

@@ -0,0 +1,5 @@
<template>
<div class="prose-embed my-8 border border-line bg-paper p-5">
<slot />
</div>
</template>

5
components/content/ProseFile.vue Normal file
View File

@@ -0,0 +1,5 @@
<template>
<div class="prose-file my-8 border border-line bg-paper p-5">
<slot />
</div>
</template>

14
components/content/ProseHeaderCard.vue Normal file
View File

@@ -0,0 +1,14 @@
<script setup>
defineProps({
variant: {
type: String,
default: 'simple'
}
})
</script>
<template>
<header class="prose-header-card my-8 bg-ink p-8 text-white" :class="`prose-header-card--${variant}`">
<slot />
</header>
</template>

27
components/content/ProseHeading.vue Normal file
View File

@@ -0,0 +1,27 @@
<script setup>
const props = defineProps({
level: {
type: Number,
default: 2
}
})
const tagName = computed(() => `h${Math.min(Math.max(props.level, 1), 6)}`)
</script>
<template>
<component
:is="tagName"
class="prose-heading mt-10 font-semibold leading-tight tracking-normal first:mt-0"
:class="{
'text-5xl': level === 1,
'text-4xl': level === 2,
'text-3xl': level === 3,
'text-2xl': level === 4,
'text-xl': level === 5,
'text-lg': level === 6
}"
>
<slot />
</component>
</template>

31
components/content/ProseImage.vue Normal file
View File

@@ -0,0 +1,31 @@
<script setup>
defineProps({
src: {
type: String,
required: true
},
alt: {
type: String,
default: ''
},
variant: {
type: String,
default: 'regular'
}
})
</script>
<template>
<figure
class="prose-image my-8"
:class="{
'prose-image--wide lg:-mx-10': variant === 'wide',
'prose-image--full lg:-mx-20': variant === 'full'
}"
>
<img class="prose-image__media w-full bg-surface object-cover" :src="src" :alt="alt">
<figcaption v-if="$slots.default" class="prose-image__caption mt-3 text-center text-sm text-muted">
<slot />
</figcaption>
</figure>
</template>

18
components/content/ProseList.vue Normal file
View File

@@ -0,0 +1,18 @@
<script setup>
defineProps({
ordered: {
type: Boolean,
default: false
}
})
</script>
<template>
<component
:is="ordered ? 'ol' : 'ul'"
class="prose-list my-6 space-y-2 pl-6"
:class="ordered ? 'list-decimal' : 'list-disc'"
>
<slot />
</component>
</template>

5
components/content/ProseProduct.vue Normal file
View File

@@ -0,0 +1,5 @@
<template>
<div class="prose-product my-8 border border-line bg-surface p-5">
<slot />
</div>
</template>

19
components/content/ProseToggle.vue Normal file
View File

@@ -0,0 +1,19 @@
<script setup>
defineProps({
title: {
type: String,
required: true
}
})
</script>
<template>
<details class="prose-toggle my-6 border border-line bg-paper p-5">
<summary class="prose-toggle__summary cursor-pointer font-semibold">
{{ title }}
</summary>
<div class="prose-toggle__body mt-4 text-muted">
<slot />
</div>
</details>
</template>

5
components/content/ProseVideo.vue Normal file
View File

@@ -0,0 +1,5 @@
<template>
<div class="prose-video my-8 aspect-video bg-ink text-white">
<slot />
</div>
</template>

23
components/site/LeftSidebar.vue Normal file
View File

@@ -0,0 +1,23 @@
<template>
<aside class="left-sidebar hidden w-[287px] lg:block">
<div class="left-sidebar__block py-3 pl-0 pr-3">
<p class="left-sidebar__eyebrow text-xs font-semibold uppercase text-muted">
Categories
</p>
<nav class="left-sidebar__nav mt-4 grid gap-2 text-sm">
<NuxtLink class="left-sidebar__nav-link hover:text-muted" to="/tags/dev">
DEV
</NuxtLink>
<NuxtLink class="left-sidebar__nav-link hover:text-muted" to="/tags/note">
NOTE
</NuxtLink>
<NuxtLink class="left-sidebar__nav-link hover:text-muted" to="/tags/review">
REVIEW
</NuxtLink>
<NuxtLink class="left-sidebar__nav-link hover:text-muted" to="/tags/play">
PLAY
</NuxtLink>
</nav>
</div>
</aside>
</template>

5
components/site/MainColumn.vue Normal file
View File

@@ -0,0 +1,5 @@
<template>
<div class="main-column w-full lg:w-[720px]">
<slot />
</div>
</template>

26
components/site/PostCard.vue Normal file
View File

@@ -0,0 +1,26 @@
<script setup>
defineProps({
post: {
type: Object,
required: true
}
})
</script>
<template>
<article class="post-card site-section">
<div class="post-card__body site-section-body">
<p class="post-card__meta text-xs font-semibold uppercase text-muted">
{{ post.tag }} · {{ post.publishedAt }}
</p>
<h2 class="post-card__title mt-3 text-2xl font-semibold leading-tight">
<NuxtLink class="post-card__title-link hover:text-muted" :to="post.to">
{{ post.title }}
</NuxtLink>
</h2>
<p class="post-card__excerpt mt-3 text-sm leading-6 text-muted">
{{ post.excerpt }}
</p>
</div>
</article>
</template>

17
components/site/RightSidebar.vue Normal file
View File

@@ -0,0 +1,17 @@
<template>
<aside class="right-sidebar hidden w-[287px] lg:block">
<div class="right-sidebar__block py-5 pl-5 pr-0">
<p class="right-sidebar__eyebrow text-xs font-semibold uppercase text-muted">
Portal
</p>
<div class="right-sidebar__links mt-4 grid gap-3 text-sm">
<NuxtLink class="right-sidebar__link hover:text-muted" to="/pages/projects">
Projects
</NuxtLink>
<NuxtLink class="right-sidebar__link hover:text-muted" to="/pages/contact">
Contact
</NuxtLink>
</div>
</div>
</aside>
</template>

20
components/site/SiteHeader.vue Normal file
View File

@@ -0,0 +1,20 @@
<template>
<header class="site-header sticky top-0 z-20 h-[57px] border-b border-line bg-paper/95 backdrop-blur">
<div class="site-header__inner mx-auto flex h-full max-w-[1294px] items-center justify-between px-4 lg:px-0">
<NuxtLink class="site-header__brand text-[19px] font-semibold tracking-normal" to="/">
sori.studio
</NuxtLink>
<nav class="site-header__nav flex items-center gap-5 text-sm text-muted">
<NuxtLink class="site-header__nav-link hover:text-ink" to="/pages/about">
About
</NuxtLink>
<NuxtLink class="site-header__nav-link hover:text-ink" to="/pages/links">
Links
</NuxtLink>
<NuxtLink class="site-header__nav-link hover:text-ink" to="/admin">
Admin
</NuxtLink>
</nav>
</div>
</header>
</template>

28
components/site/TagHeader.vue Normal file
View File

@@ -0,0 +1,28 @@
<script setup>
defineProps({
title: {
type: String,
required: true
},
description: {
type: String,
default: ''
}
})
</script>
<template>
<section class="tag-header site-section">
<div class="tag-header__inner site-section-header">
<p class="tag-header__eyebrow text-xs font-semibold uppercase text-muted">
Tag
</p>
<h1 class="tag-header__title mt-3 text-4xl font-semibold leading-tight">
{{ title }}
</h1>
<p v-if="description" class="tag-header__description mt-3 text-sm leading-6 text-muted">
{{ description }}
</p>
</div>
</section>
</template>