85 lines
3.3 KiB
Vue
85 lines
3.3 KiB
Vue
<script setup>
|
||
const { data: siteSettings } = await useFetch('/api/site-settings', {
|
||
default: () => ({
|
||
title: 'sori.studio',
|
||
description: 'sori.studio 개인 블로그',
|
||
logoText: '井',
|
||
copyrightText: '©2026 sori.studio'
|
||
})
|
||
})
|
||
</script>
|
||
|
||
<template>
|
||
<aside class="right-sidebar site-sidebar hidden w-[287px] lg:flex lg:flex-col">
|
||
<div class="right-sidebar__scroll min-h-0 flex-1 overflow-y-auto">
|
||
<div class="right-sidebar__block site-sidebar-section py-5 pl-5 pr-0">
|
||
<div class="right-sidebar__profile flex items-center gap-3">
|
||
<div class="right-sidebar__logo grid h-12 w-12 place-items-center rounded-2xl bg-[var(--site-invert)] text-2xl font-bold text-[var(--site-invert-text)]">
|
||
{{ siteSettings.logoText }}
|
||
</div>
|
||
<div>
|
||
<p class="right-sidebar__title font-semibold">
|
||
{{ siteSettings.title }}
|
||
</p>
|
||
<p class="right-sidebar__description text-sm site-muted">
|
||
{{ siteSettings.description }}
|
||
</p>
|
||
</div>
|
||
</div>
|
||
<form class="right-sidebar__subscribe mt-4 flex gap-2">
|
||
<input class="right-sidebar__input min-w-0 flex-1 rounded-lg px-3 py-2 text-sm site-input" placeholder="Your email">
|
||
<button class="right-sidebar__button rounded-lg px-4 py-2 text-sm font-semibold site-button" type="button">
|
||
Subscribe
|
||
</button>
|
||
</form>
|
||
</div>
|
||
|
||
<div class="right-sidebar__block site-sidebar-section py-5 pl-5 pr-0">
|
||
<div class="right-sidebar__row flex items-center justify-between">
|
||
<p class="right-sidebar__eyebrow text-xs font-semibold uppercase site-muted">
|
||
Follow
|
||
</p>
|
||
<div class="right-sidebar__social flex gap-3 text-sm">
|
||
<span>f</span>
|
||
<span>𝕏</span>
|
||
<span>rss</span>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="right-sidebar__block site-sidebar-section py-5 pl-5 pr-0">
|
||
<div class="right-sidebar__row flex items-center justify-between">
|
||
<p class="right-sidebar__eyebrow text-xs font-semibold uppercase site-muted">
|
||
Recommended
|
||
</p>
|
||
<span>↗</span>
|
||
</div>
|
||
<div class="right-sidebar__links mt-4 grid gap-3 text-sm">
|
||
<NuxtLink class="right-sidebar__link font-semibold" to="/post/hello-sori-studio">
|
||
sori.studio 첫 글과 방향
|
||
</NuxtLink>
|
||
<NuxtLink class="right-sidebar__link font-semibold" to="/pages/projects">
|
||
Projects and services
|
||
</NuxtLink>
|
||
<NuxtLink class="right-sidebar__link font-semibold" to="/pages/links">
|
||
Links and portal
|
||
</NuxtLink>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="right-sidebar__block site-sidebar-section py-5 pl-5 pr-0">
|
||
<p class="right-sidebar__about text-sm leading-6 site-muted">
|
||
{{ siteSettings.description }}
|
||
</p>
|
||
<NuxtLink class="right-sidebar__about-button mt-4 inline-flex rounded-lg px-4 py-2 text-sm font-semibold site-accent-button" to="/pages/about">
|
||
About {{ siteSettings.title }}
|
||
</NuxtLink>
|
||
</div>
|
||
</div>
|
||
|
||
<footer class="right-sidebar__footer py-4 pl-5 pr-0 text-xs site-muted">
|
||
{{ siteSettings.copyrightText }}
|
||
</footer>
|
||
</aside>
|
||
</template>
|