From 4e8173360ed0fbd8576ceeefdea3ddd90895afe4 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Kov=C3=A1cs=20M=C3=A1rk=20M=C3=A1ri=C3=B3?=
 <hu.mariopilis@gmail.com>
Date: Wed, 8 Jan 2025 12:06:48 +0100
Subject: [PATCH] chore: Create youtube-music-hu.svg (#2844)
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

HU: Az eredeti youtube-music.svg magyar változata.

EN: The Hungarian version of the original youtube-music.svg
---
 web/youtube-music-hu.svg | 381 +++++++++++++++++++++++++++++++++++++++
 1 file changed, 381 insertions(+)
 create mode 100644 web/youtube-music-hu.svg

diff --git a/web/youtube-music-hu.svg b/web/youtube-music-hu.svg
new file mode 100644
index 00000000..da3401c8
--- /dev/null
+++ b/web/youtube-music-hu.svg
@@ -0,0 +1,381 @@
+<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 800 300" width="800" height="300"><script xmlns="" id="eppiocemhmnlbhjplcgkofciiegomcon"/><script xmlns=""/><script xmlns=""/>
+  <foreignObject width="100%" height="100%">
+    <div xmlns="http://www.w3.org/1999/xhtml" bis_skin_checked="1">
+      <style>
+        .container {
+        width: 100%;
+        position: relative;
+        overflow: hidden;
+        }
+        a {
+        text-decoration: none;
+        }
+        h1.main, p.demos {
+        -webkit-animation-delay: 18s;
+        -moz-animation-delay: 18s;
+        -ms-animation-delay: 18s;
+        animation-delay: 18s;
+        }
+        .container {
+        position: fixed;
+        top: 0px;
+        left: 0px;
+        width: 100%;
+        height: 100%;
+        z-index: 0;
+        }
+        .content {
+        position: absolute;
+        width: 100%;
+        height: 100%;
+        left: 0px;
+        top: 0px;
+        z-index: 1000;
+        }
+        .container h2 {
+        position: absolute;
+        top: 50%;
+        line-height: 100px;
+        height: 90px;
+        margin-top: -90px;
+        font-size: 90px;
+        font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple
+        Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
+        width: 100%;
+        text-align: center;
+        color: transparent;
+        -webkit-animation: blurFadeInOut 3s ease-in backwards;
+        -moz-animation: blurFadeInOut 3s ease-in backwards;
+        -ms-animation: blurFadeInOut 3s ease-in backwards;
+        animation: blurFadeInOut 3s ease-in backwards;
+        }
+        .container h2.frame-1 {
+        -webkit-animation-delay: 0s;
+        -moz-animation-delay: 0s;
+        -ms-animation-delay: 0s;
+        animation-delay: 0s;
+        }
+        .container h2.frame-2 {
+        -webkit-animation-delay: 3s;
+        -moz-animation-delay: 3s;
+        -ms-animation-delay: 3s;
+        animation-delay: 3s;
+        }
+        .container h2.frame-3 {
+        -webkit-animation-delay: 6s;
+        -moz-animation-delay: 6s;
+        -ms-animation-delay: 6s;
+        animation-delay: 6s;
+        }
+        .container h2.frame-4 {
+        -webkit-animation-delay: 9s;
+        -moz-animation-delay: 9s;
+        -ms-animation-delay: 9s;
+        animation-delay: 9s;
+        }
+        .container h2.frame-5 {
+        -webkit-animation: none;
+        -moz-animation: none;
+        -ms-animation: none;
+        animation: none;
+        color: transparent;
+        text-shadow: 0px 0px 1px #fff;
+        }
+        .container h2.frame-5 span {
+        -webkit-animation: blurFadeIn 3s ease-in 12s backwards;
+        -moz-animation: blurFadeIn 1s ease-in 12s backwards;
+        -ms-animation: blurFadeIn 3s ease-in 12s backwards;
+        animation: blurFadeIn 3s ease-in 12s backwards;
+        color: transparent;
+        text-shadow: 0px 0px 1px #fff;
+        }
+        .container h2.frame-5 span:nth-child(2) {
+        -webkit-animation-delay: 13s;
+        -moz-animation-delay: 13s;
+        -ms-animation-delay: 13s;
+        animation-delay: 13s;
+        }
+        .container h2.frame-5 span:nth-child(3) {
+        -webkit-animation-delay: 14s;
+        -moz-animation-delay: 14s;
+        -ms-animation-delay: 14s;
+        animation-delay: 14s;
+        }
+        .circle-link {
+        position: absolute;
+        left: 50%;
+        font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple
+        Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
+        bottom: 50px;
+        margin-left: -100px;
+        text-align: center;
+        line-height: 200px;
+        width: 200px;
+        height: 200px;
+        background: #cc0000;
+        color: #fff;
+        font-size: 25px;
+        -webkit-border-radius: 50%;
+        -moz-border-radius: 50%;
+        border-radius: 50%;
+        box-shadow: 0px 8px 15px rgba(0, 0, 0, 0.1);
+        -webkit-animation: fadeInRotate 0.8s ease 16s backwards;
+        -moz-animation: fadeInRotate 0.8s ease 16s backwards;
+        -ms-animation: fadeInRotate 0.8s ease 16s backwards;
+        animation: fadeInRotate 0.8s ease 16s backwards;
+        -webkit-transform: scale(1) rotate(0deg);
+        -moz-transform: scale(1) rotate(0deg);
+        -o-transform: scale(1) rotate(0deg);
+        -ms-transform: scale(1) rotate(0deg);
+        transform: scale(1) rotate(0deg);
+
+        background-repeat: no-repeat;
+        background-position: -250px -250px, 0 0;
+
+        background-image: -webkit-linear-gradient(
+        top left,
+        rgba(255, 255, 255, 0.2) 0%,
+        rgba(255, 255, 255, 0.2) 37%,
+        rgba(255, 255, 255, 0.8) 45%,
+        rgba(255, 255, 255, 0.0) 50%
+        );
+        background-image: -moz-linear-gradient(
+        0 0,
+        rgba(255, 255, 255, 0.2) 0%,
+        rgba(255, 255, 255, 0.2) 37%,
+        rgba(255, 255, 255, 0.8) 45%,
+        rgba(255, 255, 255, 0.0) 50%
+        );
+        background-image: -o-linear-gradient(
+        0 0,
+        rgba(255, 255, 255, 0.2) 0%,
+        rgba(255, 255, 255, 0.2) 37%,
+        rgba(255, 255, 255, 0.8) 45%,
+        rgba(255, 255, 255, 0.0) 50%
+        );
+        background-image: linear-gradient(
+        0 0,
+        rgba(255, 255, 255, 0.2) 0%,
+        rgba(255, 255, 255, 0.2) 37%,
+        rgba(255, 255, 255, 0.8) 45%,
+        rgba(255, 255, 255, 0.0) 50%
+        );
+
+        -moz-background-size: 250% 250%, 100% 100%;
+        background-size: 250% 250%, 100% 100%;
+
+        -webkit-transition: background-position 0s ease;
+        -moz-transition: background-position 0s ease;
+        -o-transition: background-position 0s ease;
+        transition: background-position 0s ease;
+        }
+        .circle-link:hover {
+        background-position: 0 0, 0 0;
+
+        -webkit-transition-duration: 0.5s;
+        -moz-transition-duration: 0.5s;
+        transition-duration: 0.5s;
+        }
+
+        @-webkit-keyframes blurFadeInOut {
+        0% {
+        opacity: 0;
+        color: #cc0000;
+        text-shadow: 0px 0px 40px #fff;
+        -webkit-transform: scale(1.3);
+        }
+        20%, 75% {
+        opacity: 1;
+        color: #cc0000;
+        text-shadow: 0px 0px 1px #fff;
+        -webkit-transform: scale(1);
+        }
+        100% {
+        opacity: 0;
+        text-shadow: 0px 0px 50px #fff;
+        -webkit-transform: scale(0);
+        }
+        }
+        @-webkit-keyframes blurFadeIn {
+        0% {
+        opacity: 0;
+        color: #cc0000;
+        text-shadow: 0px 0px 40px #fff;
+        -webkit-transform: scale(1.3);
+        }
+        50% {
+        opacity: 0.5;
+        color: #cc0000;
+        text-shadow: 0px 0px 10px #fff;
+        -webkit-transform: scale(1.1);
+        }
+        100% {
+        opacity: 1;
+        text-shadow: 0px 0px 1px #fff;
+        -webkit-transform: scale(1);
+        }
+        }
+        @-webkit-keyframes fadeInBack {
+        0% {
+        opacity: 0;
+        -webkit-transform: scale(0);
+        }
+        50% {
+        opacity: 0.4;
+        -webkit-transform: scale(2);
+        }
+        100% {
+        opacity: 0.2;
+        -webkit-transform: scale(5);
+        }
+        }
+        @-webkit-keyframes fadeInRotate {
+        0% {
+        opacity: 0;
+        -webkit-transform: scale(0) rotate(360deg);
+        }
+        100% {
+        opacity: 1;
+        -webkit-transform: scale(1) rotate(0deg);
+        }
+        }
+
+        @-moz-keyframes blurFadeInOut {
+        0% {
+        opacity: 0;
+        color: #cc0000;
+        text-shadow: 0px 0px 40px #fff;
+        -moz-transform: scale(1.3);
+        }
+        20%, 75% {
+        opacity: 1;
+        color: #cc0000;
+        text-shadow: 0px 0px 1px #fff;
+        -moz-transform: scale(1);
+        }
+        100% {
+        opacity: 0;
+        text-shadow: 0px 0px 50px #fff;
+        -moz-transform: scale(0);
+        }
+        }
+        @-moz-keyframes blurFadeIn {
+        0% {
+        opacity: 0;
+        color: #cc0000;
+        text-shadow: 0px 0px 40px #fff;
+        -moz-transform: scale(1.3);
+        }
+        100% {
+        opacity: 1;
+        text-shadow: 0px 0px 1px #fff;
+        -moz-transform: scale(1);
+        }
+        }
+        @-moz-keyframes fadeInBack {
+        0% {
+        opacity: 0;
+        -moz-transform: scale(0);
+        }
+        50% {
+        opacity: 0.4;
+        -moz-transform: scale(2);
+        }
+        100% {
+        opacity: 0.2;
+        -moz-transform: scale(5);
+        }
+        }
+        @-moz-keyframes fadeInRotate {
+        0% {
+        opacity: 0;
+        -moz-transform: scale(0) rotate(360deg);
+        }
+        100% {
+        opacity: 1;
+        -moz-transform: scale(1) rotate(0deg);
+        }
+        }
+
+        @keyframes blurFadeInOut {
+        0% {
+        opacity: 0;
+        color: #cc0000;
+        text-shadow: 0px 0px 40px #fff;
+        transform: scale(1.3);
+        }
+        20%, 75% {
+        opacity: 1;
+
+        color: #cc0000;
+        text-shadow: 0px 0px 1px #fff;
+        transform: scale(1);
+        }
+        100% {
+        opacity: 0;
+        text-shadow: 0px 0px 50px #fff;
+        transform: scale(0);
+        }
+        }
+        @keyframes blurFadeIn {
+        0% {
+        opacity: 0;
+        color: #cc0000;
+        text-shadow: 0px 0px 40px #fff;
+        transform: scale(1.3);
+        }
+        50% {
+        opacity: 0.5;
+        color: #cc0000;
+        text-shadow: 0px 0px 10px #fff;
+        transform: scale(1.1);
+        }
+        100% {
+        opacity: 1;
+        text-shadow: 0px 0px 1px #fff;
+        transform: scale(1);
+        }
+        }
+        @keyframes fadeInBack {
+        0% {
+        opacity: 0;
+        transform: scale(0);
+        }
+        50% {
+        opacity: 0.4;
+        transform: scale(2);
+        }
+        100% {
+        opacity: 0.2;
+        transform: scale(5);
+        }
+        }
+        @keyframes fadeInRotate {
+        0% {
+        opacity: 0;
+        transform: scale(0) rotate(360deg);
+        }
+        100% {
+        opacity: 1;
+        transform: scale(1) rotate(0deg);
+        }
+        }
+      </style>
+      <div class="container" bis_skin_checked="1">
+        <div class="content" bis_skin_checked="1">
+          <h2 class="frame-1">YouTube Music Asztali Alkalmazás</h2>
+          <h2 class="frame-2">Beépített reklámblokkolóval</h2>
+          <h2 class="frame-3">És beépített letöltővel</h2>
+          <h2 class="frame-4">Többplatformos</h2>
+          <h2 class="frame-5">
+            <span>Ingyenes,</span>
+            <span>Nyílt forráskódú</span>
+          </h2>
+          <a class="circle-link" href="https://github.com/th-ch/youtube-music/releases/latest">
+            Letöltés
+          </a>
+        </div>
+      </div>
+    </div>
+  </foreignObject>
+</svg>