mirror of
https://github.com/mmahdium/portfolio.git
synced 2026-08-16 21:14:31 +03:30
- Add "View Resume" button to Hero component with responsive design (desktop/mobile variants) - Implement gradient styling with hover animations and pulse effect on desktop button - Wrap Hero content in flex container for proper button alignment - Remove client:only directive from TopNav component in default layout - Add semantic <main> tag wrapper around slot content in default layout - Implement layoutKey computed property to force re-render on route changes - Add scrollToTop meta and onMounted scroll reset to resume page - Add "Back to Home" navigation button to resume page with print-safe styling - Improve resume page background with white/dark mode support - Add print media query to hide navigation elements during printing - Enhance user navigation flow between home and resume pages
33 lines
700 B
Vue
33 lines
700 B
Vue
<template>
|
|
<div class="layout-default" :key="layoutKey">
|
|
<TopNav />
|
|
<main>
|
|
<slot />
|
|
</main>
|
|
<FooterCopyright />
|
|
</div>
|
|
</template>
|
|
|
|
<script setup lang="ts">
|
|
import TopNav from '@/components/common/TopNav.vue'
|
|
import FooterCopyright from '@/components/common/FooterCopyright.vue'
|
|
|
|
/**
|
|
* Default Layout
|
|
*
|
|
* Main layout for the application including TopNav and Footer.
|
|
* This layout is used by default for all pages unless specified otherwise.
|
|
*/
|
|
|
|
const route = useRoute()
|
|
|
|
// Force re-render when navigating back from pages with layout: false
|
|
const layoutKey = computed(() => route.fullPath)
|
|
</script>
|
|
|
|
<style scoped>
|
|
.layout-default {
|
|
/* Layout wrapper */
|
|
}
|
|
</style>
|