💄 actualizar scss + video ventanita atrás de tarjetas de proyectos

package.json

@@ -19,26 +19,26 @@
     "server:restart": "pm2 restart ecosystem.config.js"
   },
   "dependencies": {
-    "@astrojs/check": "^0.9.3",
-    "@astrojs/sitemap": "^3.1.6",
+    "@astrojs/check": "0.9.4",
+    "@astrojs/sitemap": "3.2.1",
     "@enflujo/alquimia": "^2.0.0",
-    "@rollup/plugin-graphql": "^2.0.4",
+    "@rollup/plugin-graphql": "^2.0.5",
     "@speed-highlight/core": "^1.2.6",
-    "astro": "^4.15.8",
+    "astro": "4.16.10",
     "astro-robots-txt": "^1.0.0",
-    "astro-seo-schema": "^4.0.2",
+    "astro-seo-schema": "^4.0.3",
     "autoprefixer": "^10.4.20",
-    "marked": "^14.1.2",
-    "marked-highlight": "^2.1.4",
+    "marked": "^15.0.0",
+    "marked-highlight": "^2.2.1",
     "schema-dts": "^1.1.2",
-    "typescript": "^5.5.3"
+    "typescript": "^5.6.3"
   },
   "devDependencies": {
     "@types/marked": "^6.0.0",
     "graphql": "^16.9.0",
-    "postcss": "^8.4.47",
+    "postcss": "^8.4.49",
     "prettier": "^3.3.3",
     "prettier-plugin-astro": "^0.14.1",
-    "sass": "^1.79.3"
+    "sass": "^1.80.6"
   }
 }

src/componentes/Menus.astro

@@ -96,7 +96,7 @@ const rutaActual = Astro.url.pathname.slice(1).split('/');
 
 <style lang="scss" is:global>
   @use 'sass:color';
-  @import '@/scss/_constantes.scss';
+  @use '@/scss/constantes' as *;
 
   $menuRayaAncho: 30px;
   $menuRayaAnchoCelular: 25px;

src/componentes/Perfil.astro

@@ -27,7 +27,8 @@ if (!miembro.foto) {
 </div>
 
 <style lang="scss" scoped>
-  @import '@/scss/_constantes.scss';
+  @use '@/scss/constantes' as *;
+
   .perfil {
     padding: 0 1em 1em;
     width: calc(200px + 2em);

src/componentes/Tarjeta.astro

@@ -46,7 +46,7 @@ const dimsImg = { ancho: '630', alto: '350' };
 </div>
 
 <style lang="scss" is:global>
-  @import '@/scss/_constantes.scss';
+  @use '@/scss/constantes' as *;
 
   .tarjeta {
     display: flex;

src/componentes/svg/Logo.astro

@@ -15,7 +15,7 @@ const { clase } = Astro.props;
 </svg>
 
 <style lang="scss">
-  @import '@/scss/_constantes.scss';
+  @use '@/scss/constantes' as *;
   .enflujoLogo {
     fill: #000;
 

src/pages/equipo/[slug].astro

@@ -122,8 +122,7 @@ if (equipo && equipo.length) {
 </Plantilla>
 
 <style lang="scss">
-  @import '@/scss/_constantes.scss';
-  @import '@/scss/_mixins.scss';
+  @use '@/scss/constantes' as *;
 
   section {
     margin-bottom: 1em;

src/pages/equipo/index.astro

@@ -77,8 +77,7 @@ if (equipo && equipo.length) {
 </Plantilla>
 
 <style lang="scss">
-  @import '@/scss/_constantes.scss';
-  @import '@/scss/_mixins.scss';
+  @use '@/scss/constantes' as *;
 
   .tituloSeccion {
     font-family: $fuenteMono;

src/pages/eventos/[slug].astro

@@ -76,8 +76,7 @@ if (eventos && eventos.length) {
 </Plantilla>
 
 <style lang="scss">
-  @import '@/scss/_constantes.scss';
-  @import '@/scss/_mixins.scss';
+  @use '@/scss/constantes' as *;
 
   .titulo {
     font-size: 1.6em;

src/pages/index.astro

@@ -47,12 +47,12 @@ const { general } = await obtenerDatos<{ general: MetadatosGenerales }>(General)
 </Plantilla>
 
 <style lang="scss">
-  @import '@/scss/_constantes.scss';
+  @use '@/scss/constantes' as *;
 
   #muchachita {
     position: absolute;
     top: 40px;
-    width: calc(100% - (80px) - 4px);
+    width: calc(100% - 80px - 4px);
     height: calc(100vh - (var(--anchoMarco) * 2) - 4px);
     overflow: hidden;
     z-index: 1;
@@ -125,7 +125,7 @@ const { general } = await obtenerDatos<{ general: MetadatosGenerales }>(General)
     #muchachita {
       position: absolute;
       top: var(--anchoMarco);
-      width: 49vw;
+      width: calc(100% - $anchoMarco * 2);
       height: 77vh;
       overflow: hidden;
       z-index: 1;
@@ -173,13 +173,6 @@ const { general } = await obtenerDatos<{ general: MetadatosGenerales }>(General)
   }
   // Pantallas medianas (Tablets)
   @media (min-width: $minTablet) {
-    #muchachita {
-      img {
-        width: 100%;
-        height: auto;
-      }
-    }
-
     #contenedorTextoInicio {
       #lado1 {
         padding: calc(var(--anchoMarco) + 2em) 0 0 calc(var(--anchoMarco) + 1em);

src/pages/proyectos/[slug].astro

@@ -220,8 +220,7 @@ if (proyectos && proyectos.length) {
 </script>
 
 <style lang="scss">
-  @import '@/scss/_constantes.scss';
-  @import '@/scss/_mixins.scss';
+  @use '@/scss/constantes' as *;
 
   .seccionProyecto {
     margin-top: 1em;
@@ -311,7 +310,7 @@ if (proyectos && proyectos.length) {
 </style>
 
 <style lang="scss" is:global>
-  @import '@/scss/_constantes.scss';
+  @use '@/scss/constantes' as *;
 
   .contenidoProyecto {
     ul {

src/pages/proyectos/index.astro

@@ -78,9 +78,9 @@ if (!pagina) return Astro.redirect('/404');
 </script>
 
 <style lang="scss">
-  @import '@/scss/_constantes.scss';
+  @use '@/scss/constantes' as *;
   main {
-    z-index: 2;
+    position: relative;
   }
 
   #videoFondo {
@@ -93,6 +93,7 @@ if (!pagina) return Astro.redirect('/404');
     width: calc(100% - (var(--anchoMarco) * 2) - 4px);
     height: calc(100vh - (var(--anchoMarco) * 2) - 4px);
     overflow: hidden;
+    z-index: 1;
 
     img {
       width: 100%;

src/plantillas/Plantilla.astro

@@ -137,7 +137,7 @@ const colorPrincipal = general.color;
 
 <style lang="scss">
   @use 'sass:color';
-  @import '@/scss/_constantes.scss';
+  @use '@/scss/constantes' as *;
 
   #contenedor {
     display: flex;

src/scss/_normalizar.scss

@@ -1,9 +1,5 @@
 @use 'sass:color';
-
-::selection {
-  background-color: color.scale($colorPrincipal, $lightness: 50%);
-  color: rgb(255, 255, 255);
-}
+@use './constantes' as *;
 
 html {
   box-sizing: border-box;

src/scss/estilosGlobales.scss

@@ -1,16 +1,23 @@
-@import './constantes';
-@import './normalizar';
-@import './mixins';
+@use 'sass:color';
+@use './constantes' as *;
+@use './mixins' as *;
+@use './normalizar';
 
 :root {
   --anchoMarco: 50px;
 }
 
+::selection {
+  background-color: color.scale($colorPrincipal, $lightness: 50%);
+  color: rgb(255, 255, 255);
+}
+
 main {
   border: 2px solid;
   margin: 40px;
   min-height: calc(100vh - 100px);
   min-width: 200px;
+  z-index: 2;
 }
 
 .contenedorFluido {