feat(landing): add new dist file and enhance AppLogo and HeroDemoVideo components
- Introduced a new symbolic link for the dist directory. - Updated AppLogo.vue to improve text styling with a new gradient for light theme. - Modified HeroDemoVideo.vue to use a dynamic video source and added aspect ratio styling for better layout.
This commit is contained in:
parent
e893a772a7
commit
32e310a5ff
3 changed files with 14 additions and 5 deletions
|
|
@ -41,10 +41,16 @@
|
|||
font-weight: 700;
|
||||
font-size: 14px;
|
||||
letter-spacing: 0.05em;
|
||||
}
|
||||
|
||||
.v-theme--dark .app-logo__text {
|
||||
background: linear-gradient(135deg, #e0e6ff, #00f0ff);
|
||||
background: linear-gradient(135deg, #ffffff, #00f0ff);
|
||||
-webkit-background-clip: text;
|
||||
background-clip: text;
|
||||
-webkit-text-fill-color: transparent;
|
||||
}
|
||||
</style>
|
||||
|
||||
<style>
|
||||
.v-theme--light .app-logo__text {
|
||||
background: linear-gradient(135deg, #1e293b, #0891b2);
|
||||
-webkit-background-clip: text;
|
||||
background-clip: text;
|
||||
-webkit-text-fill-color: transparent;
|
||||
|
|
|
|||
|
|
@ -3,6 +3,7 @@ import { ref, onMounted, onUnmounted } from 'vue';
|
|||
import { mdiPlay, mdiPause, mdiVolumeHigh, mdiVolumeOff, mdiFullscreen } from '@mdi/js';
|
||||
|
||||
const { t } = useI18n();
|
||||
const videoSrc = 'https://github.com/user-attachments/assets/9cae73cd-7f42-46e5-a8fb-ad6d41737ff8';
|
||||
const videoRef = ref<HTMLVideoElement | null>(null);
|
||||
const containerRef = ref<HTMLElement | null>(null);
|
||||
const isPlaying = ref(false);
|
||||
|
|
@ -146,7 +147,7 @@ onUnmounted(() => {
|
|||
@timeupdate="onTimeUpdate"
|
||||
@click="togglePlay"
|
||||
>
|
||||
<source src="/video/demo.mp4" type="video/mp4" />
|
||||
<source :src="videoSrc" type="video/mp4" />
|
||||
</video>
|
||||
|
||||
<!-- Play overlay (when paused) -->
|
||||
|
|
@ -203,6 +204,7 @@ onUnmounted(() => {
|
|||
.hero-video {
|
||||
position: relative;
|
||||
z-index: 1;
|
||||
aspect-ratio: 16 / 9;
|
||||
border-radius: 16px;
|
||||
background: rgba(10, 10, 15, 0.95);
|
||||
backdrop-filter: blur(20px);
|
||||
|
|
|
|||
1
landing/dist
Symbolic link
1
landing/dist
Symbolic link
|
|
@ -0,0 +1 @@
|
|||
/Users/belief/dev/projects/claude/claude_team/landing/.output/public
|
||||
Loading…
Reference in a new issue