diff --git a/elections/migrations/0018_alter_electionshomepage_content.py b/elections/migrations/0018_alter_electionshomepage_content.py index d81c7b2288a2e6b0049d7ea33554b874badb5d2e..3e3a1f94fec5992f682d958faa19b8bd98590132 100644 --- a/elections/migrations/0018_alter_electionshomepage_content.py +++ b/elections/migrations/0018_alter_electionshomepage_content.py @@ -1,9 +1,9 @@ # Generated by Django 4.1.10 on 2024-01-19 16:39 -from django.db import migrations import wagtail.blocks import wagtail.fields import wagtail.images.blocks +from django.db import migrations class Migration(migrations.Migration): diff --git a/shared/static/styleguide2/images/background-images/bg-bartos.jpg b/shared/static/styleguide2/images/background-images/bg-bartos.jpg new file mode 100644 index 0000000000000000000000000000000000000000..be147b1d6a07cbc6eb03b952e870d65c233eb2e3 Binary files /dev/null and b/shared/static/styleguide2/images/background-images/bg-bartos.jpg differ diff --git a/shared/static/styleguide2/images/background-images/bg-europarl-candidates.webp b/shared/static/styleguide2/images/background-images/bg-europarl-candidates.webp new file mode 100644 index 0000000000000000000000000000000000000000..4c476af74a6b4a329b7069fa2a8fe83108668a3a Binary files /dev/null and b/shared/static/styleguide2/images/background-images/bg-europarl-candidates.webp differ diff --git a/shared/static/styleguide2/images/background-images/bg-flag-mobile-preview.jpg b/shared/static/styleguide2/images/background-images/bg-flag-mobile-preview.jpg new file mode 100644 index 0000000000000000000000000000000000000000..1bb8dca41097ad71b7861cefba0e5592fade6d64 Binary files /dev/null and b/shared/static/styleguide2/images/background-images/bg-flag-mobile-preview.jpg differ diff --git a/shared/static/styleguide2/images/background-images/bg-flag-mobile.mp4 b/shared/static/styleguide2/images/background-images/bg-flag-mobile.mp4 new file mode 100644 index 0000000000000000000000000000000000000000..7ec1fa7554e4dc00c3125c62db56f7715b4aa600 Binary files /dev/null and b/shared/static/styleguide2/images/background-images/bg-flag-mobile.mp4 differ diff --git a/shared/static/styleguide2/images/background-images/bg-flag-preview.jpg b/shared/static/styleguide2/images/background-images/bg-flag-preview.jpg new file mode 100644 index 0000000000000000000000000000000000000000..fe78f4f8684b4ea2f42e125421ee5f6ee6792f5e Binary files /dev/null and b/shared/static/styleguide2/images/background-images/bg-flag-preview.jpg differ diff --git a/shared/static/styleguide2/images/background-images/bg-flag.mp4 b/shared/static/styleguide2/images/background-images/bg-flag.mp4 new file mode 100644 index 0000000000000000000000000000000000000000..92fffb566d751bbe38695068374ce10557f3914c Binary files /dev/null and b/shared/static/styleguide2/images/background-images/bg-flag.mp4 differ diff --git a/shared/static/styleguide2/images/background-images/bg-migrace.png b/shared/static/styleguide2/images/background-images/bg-migrace.png new file mode 100644 index 0000000000000000000000000000000000000000..b88fdbc3b4bb481be78f299a5cab8b32a9e86aeb Binary files /dev/null and b/shared/static/styleguide2/images/background-images/bg-migrace.png differ diff --git a/shared/templates/styleguide2/includes/molecules/menus/carousel.html b/shared/templates/styleguide2/includes/molecules/menus/carousel.html index 1298ed528b0fcef56d4e79ad96eb6438d8693f2e..3c3d17dfdbaa4442cb2813f4539027149e732c50 100644 --- a/shared/templates/styleguide2/includes/molecules/menus/carousel.html +++ b/shared/templates/styleguide2/includes/molecules/menus/carousel.html @@ -14,37 +14,51 @@ href="{{ self.button_url }}" {% endif %} > - <img + <video class=" header-carousel--image lg:hidden " + autoplay + muted + loop + playsinline + preload="metadata" {% if not self.mobile_image %} - src="{% static 'styleguide2/images/background-images/bg-flag-mobile.gif' %}" + poster="{% static 'styleguide2/images/background-images/bg-flag-mobile-preview.jpg' %}" {% else %} {% image self.mobile_image original as mobile_background_image %} - src="{{ mobile_background_image.url }}" + poster="{{ mobile_background_image.url }}" {% endif %} - - draggable="false" > + {% if not self.mobile_image %} + <source src="{% static 'styleguide2/images/background-images/bg-flag-mobile.mp4' %}"> + {% endif %} + </video> - <img + <video class=" header-carousel--image hidden lg:block " + autoplay + muted + loop + playsinline + preload="metadata" {% if not self.desktop_image %} - src="{% static 'styleguide2/images/background-images/bg-flag.webp' %}" + poster="{% static 'styleguide2/images/background-images/bg-flag-preview.jpg' %}" {% else %} {% image self.desktop_image original as desktop_background_image %} - src="{{ desktop_background_image.url }}" + poster="{{ desktop_background_image.url }}" {% endif %} - - draggable="false" > + {% if not self.desktop_image %} + <source src="{% static 'styleguide2/images/background-images/bg-flag.mp4' %}"> + {% endif %} + </video> <div class="header-carousel--text-wrapper" style="box-sizing: border-box"> <div class="container--wide px-0 h-full flex flex-col justify-end items-start" style="box-sizing: border-box">