h4ckx0r/webSostenible
1
1
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

añadido video de fondo en la parte principal

Browse Source
This commit is contained in:
Lucas Curiel
2024-10-15 23:52:10 +02:00
parent 8dff636d94
commit 115aad9495
3 changed files with 24 additions and 2 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
package-lock.json generated
View File

@@ -1,12 +1,12 @@
{ {
"name": "websostenible", "name": "websostenible",
"version": "0.0.6", "version": "0.1.1",
"lockfileVersion": 3, "lockfileVersion": 3,
"requires": true, "requires": true,
"packages": { "packages": {
"": { "": {
"name": "websostenible", "name": "websostenible",
"version": "0.0.6", "version": "0.1.1",
"dependencies": { "dependencies": {
"@astrojs/mdx": "^3.1.8", "@astrojs/mdx": "^3.1.8",
"astro": "^4.16.3" "astro": "^4.16.3"

BIN
public/imgs/bosqueverde.webm Normal file
View File

Binary file not shown.

22
src/pages/index.astro
View File

@@ -51,6 +51,12 @@ const animateOnScroll = `
<body> <body>
<Navbar /> <Navbar />
<header class="header-bg text-white"> <header class="header-bg text-white">
<video autoplay muted loop class="video-bg">
<source src="/imgs/bosqueverde.webm" type="video/webm">
Tu navegador no soporta la reproducción de videos.
</video>
<div class="container text-center"> <div class="container text-center">
<h1 <h1
class="display-1 mb-4 animate__animated animate__fadeInDown londrina-sketch-regular" class="display-1 mb-4 animate__animated animate__fadeInDown londrina-sketch-regular"
@@ -319,4 +325,20 @@ const animateOnScroll = `
object-fit: cover; object-fit: cover;
border-radius: 8px; border-radius: 8px;
} }
header {
position: relative;
overflow: hidden;
}
.video-bg {
position: absolute;
}
.container {
position: relative;
z-index: 1;
}
</style> </style>