You've already forked zblade.dev
fix(website): adjust hero video aspect ratio and positioning
Add aspect-ratio, object-fit, and object-position inline styles to the hero video on the landing page to ensure proper display and cropping.
This commit is contained in:
@@ -45,7 +45,7 @@ const version = pkg.version ?? "";
|
|||||||
<!-- Screenshot Reveal -->
|
<!-- Screenshot Reveal -->
|
||||||
<div class="container" style="margin-top: var(--space-2xl); position: relative; z-index: 2;">
|
<div class="container" style="margin-top: var(--space-2xl); position: relative; z-index: 2;">
|
||||||
<div style="border: 1px solid var(--color-border); border-radius: var(--border-radius); overflow: hidden; box-shadow: 0 20px 50px rgba(0,0,0,0.5), 0 0 30px rgba(0,221,119,0.1); background: var(--color-bg-elevated); padding: 2px;">
|
<div style="border: 1px solid var(--color-border); border-radius: var(--border-radius); overflow: hidden; box-shadow: 0 20px 50px rgba(0,0,0,0.5), 0 0 30px rgba(0,221,119,0.1); background: var(--color-bg-elevated); padding: 2px;">
|
||||||
<video autoplay loop muted playsinline style="width: 100%; height: auto; display: block;">
|
<video autoplay loop muted playsinline style="width: 100%; height: auto; aspect-ratio: 16 / 10; object-fit: cover; object-position: bottom; display: block;">
|
||||||
<source src="/zblade.mp4" type="video/mp4" />
|
<source src="/zblade.mp4" type="video/mp4" />
|
||||||
Your browser does not support the video tag.
|
Your browser does not support the video tag.
|
||||||
</video>
|
</video>
|
||||||
|
|||||||
Reference in New Issue
Block a user