Decoraciones de Halloween :fantasma:

Personalización Componente temático
, ,
1
:discourse2: Resumen Decoraciones de Halloween añadirá un toque espeluznante a tu foro en esta temporada festiva!
:eyeglasses: Vista previa Vista previa en Discourse Theme Creator
:hammer_and_wrench: Enlace al repositorio https://github.com/discourse/discourse-halloween-decorations
:open_book: ¿Nuevo en Temas de Discourse? Guía para principiantes sobre el uso de Temas de Discourse

Instalar este componente de tema

Características

:information_source: Este componente de tema solo se muestra en la vista de escritorio. :desktop_computer:

Este componente tiene tres estilos:

  • Animación de murciélagos
  • Telaraña a ambos lados
  • Animación de carga de calabaza

¡Feliz Halloween! :ghost: :spider_web:

:discourse2: ¿Alojado por nosotros? Los componentes de tema están disponibles para usar en nuestros planes Estándar, Comercial y Empresarial.

37 Me gusta
Customizing your site with existing theme components
2

Esto es genial. ¡Gracias!

2 Me gusta
3

3 publicaciones se dividieron en un nuevo tema: ¿Dónde está la calabaza?

4

¿Sigue siendo solo para escritorio?

1 me gusta
5

sí, lo es.

lo anotaré en el OP. gracias.

2 Me gusta
6

Este es un dibujo de un gato estilizado y con un fondo de color azul sólido. (Subtitulado por IA)
Este es un dibujo de un gato estilizado y con un fondo de color azul sólido. (Subtitulado por IA)1263×886 80.4 KB

Creo que es posible conseguir una animación de pantalla abierta al hacer clic en el foro que también oculte el contenido en el actualizador

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <style>
    #custom-video-container {
      position: fixed;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;
      background-color: #2cb9e4;
      z-index: 9999;
      display: flex;
      justify-content: center;
      align-items: center;
      transition: visibility 0s 1s, opacity 1s linear; /* Añadir efecto de transición */
      visibility: visible;
      opacity: 1;
    }

    #custom-video {
      width: auto; /* Establecer el ancho al 100% */
      height: auto; /* Altura adaptada automáticamente */
    }
  </style>
</head>
<body>
  <div id="custom-video-container">
    <video id="custom-video" autoplay muted>
      <source src="https://www.justnainai.com/uploads/default/original/2X/e/e4faa6e98fd8890bbd33a24ef27f63cbb30a9d16.mp4" type="video/mp4">
    </video>
  </div>

  <script>
    document.addEventListener('DOMContentLoaded', () => {
      const videoContainer = document.getElementById('custom-video-container');
      const video = document.getElementById('custom-video');

      video.addEventListener('ended', () => {
        setTimeout(() => {
          videoContainer.style.visibility = 'hidden';
          videoContainer.style.opacity = '0';
        }, 10); // Ocultar 3 segundos después de que termine el video
      });
    });
  </script>
</body>
</html>
1 me gusta
7

A mis miembros les encanta esto, ¡muy bien hecho! No es intrusivo, solo la cantidad perfecta. La animación de la calabaza es tan rápida que casi crees que estás viendo cosas, jajaja. ¡Mis usuarios móviles están muy decepcionados, jajaja, también la quieren! ¡Y mi gato encontró los murciélagos! Espero que podamos esperar algo para todas las festividades, ya sabes, Día de los Veteranos, Acción de Gracias, Navidad, Año Nuevo, San Valentín, San Patricio, Pascua, Día de los Caídos, 4 de Julio, Día del Trabajo, etc., y cosas divertidas para los momentos intermedios: nieve cayendo, flores, la playa, hojas de otoño, etc.

Un gato mira atentamente una pantalla de computadora con un navegador web abierto, que muestra una lista colorida de temas de marcadores y un ícono de araña negra. (Subtitulado por IA)
Un gato mira atentamente una pantalla de computadora con un navegador web abierto, que muestra una lista colorida de temas de marcadores y un ícono de araña negra. (Subtitulado por IA)261×634 57.1 KB

3 Me gusta
8

Hola @famousamos.1 :wave: bienvenido a Discourse Meta :slight_smile:

también tenemos

6 Me gusta
9

¡¡¡Woo Hoo!!! Mis miembros estarán muy emocionados. Saben que esperarán decoraciones divertidas todo el tiempo, ¿verdad?? jajaja

1 me gusta
10

Excepto si están usando móviles… bueno, alguien puede emocionarse al ver unos pocos murciélagos y nada más.

Esto debería etiquetarse como desktop porque en móviles está roto.

2 Me gusta
11

Esto es cierto: mis miembros móviles no pueden ver estas cosas [todavía]

2 Me gusta
12

¿Se puede configurar para que se active en un período de tiempo específico? Por ejemplo, que esta decoración solo aparezca en Halloween cada año.