Décorations d'Halloween :fantôme:

Composant de thème
, ,
1
:discourse2: Summary Halloween Decorations will add some spooky flair to your forum this festive season!
:eyeglasses: Preview Preview on Discourse Theme Creator
:hammer_and_wrench: Repository Link https://github.com/discourse/discourse-halloween-decorations
:open_book: New to Discourse Themes? Beginner’s guide to using Discourse Themes

Install this theme component

Features

:information_source: This theme component only shows for desktop view. :desktop_computer:

This component has three flairs:

  • Bats animation
  • Spider web on both sides
  • Pumpkin loading animation

Happy Halloween! :ghost: :spider_web:

:discourse2: Hosted by us? Theme components are available to use on our Standard, Business, and Enterprise plans.

Last edited by @JammyDodger 2024-10-23T15:06:22Z

Last checked by @Lilly 2024-10-14T21:44:14Z

Check documentPerform check on document:
37 « J'aime »
Customizing your site with existing theme components
2

C’est super. Merci !

2 « J'aime »
3

3 messages ont été déplacées vers un nouveau sujet : Où est la citrouille ?

4

Est-ce toujours uniquement pour ordinateur de bureau ?

1 « J'aime »
5

oui c’est le cas.

je le noterai dans le premier message. merci.

2 « J'aime »
6

Ceci est une image d'un chat stylisé et illustré avec un fond bleu uni. (Légendé par l'IA)
Ceci est une image d'un chat stylisé et illustré avec un fond bleu uni. (Légendé par l'IA)1263×886 80.4 KB

Je pense qu’il est possible d’avoir une animation d’écran ouvert lors du clic sur le forum qui masque également le contenu dans le rafraîchisseur

<!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; /*添加过渡效果*/
      visibility: visible;
      opacity: 1;
    }

    #custom-video {
      width: auto; /* 设置宽度为100% */
      height: auto; /* 高度自动适应 */
    }
  </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); // 视频结束后3秒钟隐藏
      });
    });
  </script>
</body>
</html>
1 « J'aime »
7

Mes membres adorent ça - tellement bien fait. Pas envahissant, juste la bonne quantité. L’animation de la citrouille est si rapide que vous avez l’impression de voir des choses - lol. Mes utilisateurs mobiles sont tellement déçus - lol, ils en veulent aussi ! Et mon chat a trouvé les chauves-souris ! J’espère que nous pourrons nous attendre à quelque chose pour toutes les fêtes, vous savez, le Jour des anciens combattants, Thanksgiving, Noël, le Nouvel An, la Saint-Valentin, la Saint-Patrick, Pâques, le Memorial Day, le 4 juillet, la Fête du Travail, etc. et des choses amusantes pour les périodes intermédiaires - neige qui tombe, fleurs, la plage, feuilles d’automne, etc.

Un chat regarde attentivement un écran d'ordinateur avec un navigateur Web ouvert, présentant une liste colorée de sujets de favoris et une icône d'araignée noire. (Légendé par l'IA)
Un chat regarde attentivement un écran d'ordinateur avec un navigateur Web ouvert, présentant une liste colorée de sujets de favoris et une icône d'araignée noire. (Légendé par l'IA)261×634 57.1 KB

3 « J'aime »
8

Salut @famousamos.1 :wave: bienvenue sur Discourse Meta :slight_smile:

nous avons aussi

6 « J'aime »
9

Youpi ! Mes membres seront tellement excités - vous savez tous qu’ils s’attendront à des décorations amusantes tout le temps, n’est-ce pas ?? lol

1 « J'aime »
10

Sauf s’ils utilisent des mobiles… eh bien, quelqu’un peut être excité en voyant quelques chauves-souris et rien d’autre.

Ceci devrait être étiqueté desktop car sur mobile, c’est cassé.

2 « J'aime »
11

C’est vrai - mes membres mobiles ne peuvent pas encore voir ces choses.

2 « J'aime »
12

Est-il possible de définir une période spécifique pour l’activer ? Par exemple, que cette décoration ne soit visible qu’à Halloween chaque année.