From 5942be613f2223a9ec35d9b10851c949d1ad65fb Mon Sep 17 00:00:00 2001 From: nerix Date: Fri, 4 Aug 2023 17:55:35 +0200 Subject: [PATCH] fix: remove themes (#339) They're now on the website. --- themes/README.md | 23 ------------ themes/blurred-bg-slide.css | 73 ------------------------------------- themes/blurred-bg.css | 30 --------------- themes/transparent.css | 13 ------- 4 files changed, 139 deletions(-) delete mode 100644 themes/README.md delete mode 100644 themes/blurred-bg-slide.css delete mode 100644 themes/blurred-bg.css delete mode 100644 themes/transparent.css diff --git a/themes/README.md b/themes/README.md deleted file mode 100644 index d3334fe..0000000 --- a/themes/README.md +++ /dev/null @@ -1,23 +0,0 @@ -# Themes - -## Installation - -- Download the CSS file -- **Either:** save the file as `theme.css` in the current-song directory **or** set the `custom_theme_path` config - setting to your theme. - -## Overview - -### [`blurred-bg.css`](blurred-bg.css) - -![Example of `blurred-bg-css`](https://user-images.githubusercontent.com/19953266/229280357-7bc3ff2e-0be4-4ecf-9ce0-f696677c5edb.png) - -### [`blurred-bg-slide.css`](blurred-bg-slide.css) - -Essentially the same as [`blurred-bg.css`](blurred-bg.css), except that the background image is animated. - -![Example of `blurred-bg-slide.css`](https://user-images.githubusercontent.com/19953266/229280343-b2169dd0-4632-48a7-916f-3f6209da49a7.png) - -### [`transparent.css`](transparent.css) - -![Example of `transparent.css`](https://user-images.githubusercontent.com/19953266/229280305-f45d9f1d-85a1-4b9d-9e4f-8b2e22a1aaf4.png) diff --git a/themes/blurred-bg-slide.css b/themes/blurred-bg-slide.css deleted file mode 100644 index a981f93..0000000 --- a/themes/blurred-bg-slide.css +++ /dev/null @@ -1,73 +0,0 @@ -:root { - --theme-color: white; - --image-overlay-opacity: 75%; - --slide-duration: 200s; -} - -#song-container.with-image::before { - content: ''; - width: 100%; - height: 100%; - position: absolute; - z-index: 0; - background: var(--image-url); - opacity: var(--image-overlay-opacity, 100%); - filter: blur(10px); - - animation: bg-slide linear var(--slide-duration, 200s) infinite; -} - -#song-container.with-image * { - z-index: 1; -} - -#song-info :is(h1, h2) { - text-shadow: 0px 1px 5px #fff5; -} - -@keyframes bg-slide { - 0% { - transform: scale(200%); - background-position: 50% 50%; - } - 10% { - transform: scale(300%); - background-position: 50% 25%; - } - 20% { - transform: scale(300%); - background-position: 50% 75%; - } - 30% { - transform: scale(300%); - background-position: 30% 70%; - } - 40% { - transform: scale(300%); - background-position: 25% 50%; - } - 50% { - transform: scale(200%); - background-position: 50% 50%; - } - 60% { - transform: scale(300%); - background-position: 25% 50%; - } - 70% { - transform: scale(300%); - background-position: 75% 50%; - } - 80% { - transform: scale(300%); - background-position: 70% 30%; - } - 90% { - transform: scale(300%); - background-position: 50% 25%; - } - 100% { - transform: scale(200%); - background-position: 50% 50%; - } -} diff --git a/themes/blurred-bg.css b/themes/blurred-bg.css deleted file mode 100644 index 0461411..0000000 --- a/themes/blurred-bg.css +++ /dev/null @@ -1,30 +0,0 @@ -:root { - --theme-color: white; - --image-overlay-opacity: 75%; -} - -#song-container.with-image::before { - content: ''; - width: 100%; - height: 100%; - position: absolute; - z-index: 0; - background: var(--image-url); - background-position: center; - opacity: var(--image-overlay-opacity, 100%); - filter: blur(10px); - - /** - Use this if you want the edges to be the theme color: - background-size: 120%; - */ - transform: scale(200%); -} - -#song-container.with-image * { - z-index: 1; -} - -#song-info :is(h1, h2) { - text-shadow: 0px 1px 5px #fff5; -} diff --git a/themes/transparent.css b/themes/transparent.css deleted file mode 100644 index b85b32d..0000000 --- a/themes/transparent.css +++ /dev/null @@ -1,13 +0,0 @@ -:root { - --text-shadow-color: #0007; -} - -#song-container { - background: transparent; - transition: none; - overflow: visible; -} - -#song-info :is(h1, h2) { - text-shadow: 1px 4px 15px var(--text-shadow-color, #0007); -}