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-weight: 700;
|
||||||
font-size: 14px;
|
font-size: 14px;
|
||||||
letter-spacing: 0.05em;
|
letter-spacing: 0.05em;
|
||||||
}
|
background: linear-gradient(135deg, #ffffff, #00f0ff);
|
||||||
|
-webkit-background-clip: text;
|
||||||
.v-theme--dark .app-logo__text {
|
background-clip: text;
|
||||||
background: linear-gradient(135deg, #e0e6ff, #00f0ff);
|
-webkit-text-fill-color: transparent;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
|
||||||
|
<style>
|
||||||
|
.v-theme--light .app-logo__text {
|
||||||
|
background: linear-gradient(135deg, #1e293b, #0891b2);
|
||||||
-webkit-background-clip: text;
|
-webkit-background-clip: text;
|
||||||
background-clip: text;
|
background-clip: text;
|
||||||
-webkit-text-fill-color: transparent;
|
-webkit-text-fill-color: transparent;
|
||||||
|
|
|
||||||
|
|
@ -3,6 +3,7 @@ import { ref, onMounted, onUnmounted } from 'vue';
|
||||||
import { mdiPlay, mdiPause, mdiVolumeHigh, mdiVolumeOff, mdiFullscreen } from '@mdi/js';
|
import { mdiPlay, mdiPause, mdiVolumeHigh, mdiVolumeOff, mdiFullscreen } from '@mdi/js';
|
||||||
|
|
||||||
const { t } = useI18n();
|
const { t } = useI18n();
|
||||||
|
const videoSrc = 'https://github.com/user-attachments/assets/9cae73cd-7f42-46e5-a8fb-ad6d41737ff8';
|
||||||
const videoRef = ref<HTMLVideoElement | null>(null);
|
const videoRef = ref<HTMLVideoElement | null>(null);
|
||||||
const containerRef = ref<HTMLElement | null>(null);
|
const containerRef = ref<HTMLElement | null>(null);
|
||||||
const isPlaying = ref(false);
|
const isPlaying = ref(false);
|
||||||
|
|
@ -146,7 +147,7 @@ onUnmounted(() => {
|
||||||
@timeupdate="onTimeUpdate"
|
@timeupdate="onTimeUpdate"
|
||||||
@click="togglePlay"
|
@click="togglePlay"
|
||||||
>
|
>
|
||||||
<source src="/video/demo.mp4" type="video/mp4" />
|
<source :src="videoSrc" type="video/mp4" />
|
||||||
</video>
|
</video>
|
||||||
|
|
||||||
<!-- Play overlay (when paused) -->
|
<!-- Play overlay (when paused) -->
|
||||||
|
|
@ -203,6 +204,7 @@ onUnmounted(() => {
|
||||||
.hero-video {
|
.hero-video {
|
||||||
position: relative;
|
position: relative;
|
||||||
z-index: 1;
|
z-index: 1;
|
||||||
|
aspect-ratio: 16 / 9;
|
||||||
border-radius: 16px;
|
border-radius: 16px;
|
||||||
background: rgba(10, 10, 15, 0.95);
|
background: rgba(10, 10, 15, 0.95);
|
||||||
backdrop-filter: blur(20px);
|
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