diff --git a/public/assets/images/Spicy.png b/public/assets/images/Spicy.png new file mode 100644 index 0000000..c190be6 Binary files /dev/null and b/public/assets/images/Spicy.png differ diff --git a/public/script/customthemes.js b/public/script/customthemes.js index abb3253..34b5ec0 100644 --- a/public/script/customthemes.js +++ b/public/script/customthemes.js @@ -8,6 +8,7 @@ const themes = { drift: { label: "Drift", subtitle: "Si la route t'appelle, contre appel" }, fanatic: { label: "Fanatic", subtitle: "Always Fnatic !" }, chirac: { label: "Chirac", subtitle: "J'aime les pommes" }, + spicy: { label: "Spicy", subtitle: "The Spiciest One" }, }; const themeSelect = document.getElementById("themeSelect"); diff --git a/public/styles/theme/spicy-theme.css b/public/styles/theme/spicy-theme.css new file mode 100644 index 0000000..35f845b --- /dev/null +++ b/public/styles/theme/spicy-theme.css @@ -0,0 +1,48 @@ +body.spicy { + /* Couleurs générales */ + --background-color: #121212; /* fond noir profond */ + --default-text-color: #ffffff; /* texte clair */ + --subtitle-color: #f87918; /* accent rouge piment */ + --mp3-text-color: #ffffff; /* texte checkbox inline */ + + /* Formulaire */ + --form-bg-color: #1a1a1a; /* fond formulaire gris très foncé */ + --form-input-bg-color: #2b2b2b; /* fond inputs gris foncé */ + --form-input-border-color: #444444; /* bordure gris */ + --form-input-border-focus-color: #ff1a1a; /* focus rouge piment */ + --form-input-text-color: #eeeeee; /* texte inputs */ + --form-input-placeholder-color: #888888; /* placeholder gris moyen */ + --form-button-bg-color: #ff1a1a; /* bouton rouge vif */ + --form-button-text-color: #ffffff; /* texte bouton blanc */ + --form-button-bg-hover-color: #cc0000; /* hover rouge foncé */ + + /* Checkbox */ + --checkbox-bg-default: #555555; /* gris moyen */ + --checkbox-bg-checked: #ff1a1a; /* rouge piment */ + --checkbox-checkmark-border-color: #f5f5f5; /* blanc cassé */ + --checkbox-pulse-color: rgba(255, 26, 26, 0.5); /* pulse rouge translucide */ + + /* Download status */ + --download-status-color: #ffffff; /* rouge vif */ + + /* Video Info Box */ + --infos-box-color: #1a1a1a; /* fond infos gris foncé */ + --video-info-text-color: #f5f5f5; /* texte clair */ + --video-info-heading-color: #ff1a1a; /* titres rouges */ + --video-info-list-color: #cccccc; /* texte liste gris clair */ + --video-info-list-strong-color: #ffffff; /* texte important blanc */ + --video-info-link-color: #ff1a1a; /* liens rouges */ + --video-info-link-hover-color: #cc0000; /* liens hover rouge foncé */ + + /* Playlist Color */ + --playlist-background-color: #353232; +} + +/* Optionnel: background piments */ +body.spicy { + background-image: url('../../assets/images/spicy.png'); + background-size:cover; + background-position: center; + background-attachment: fixed; + background-repeat: no-repeat; +} \ No newline at end of file diff --git a/public/styles/theme/themeimport.css b/public/styles/theme/themeimport.css index 3adb993..eb320a6 100644 --- a/public/styles/theme/themeimport.css +++ b/public/styles/theme/themeimport.css @@ -6,4 +6,5 @@ @import url("nf-theme.css"); @import url("drift-theme.css"); @import url("neon-theme.css"); -@import url("songbird-theme.css"); \ No newline at end of file +@import url("songbird-theme.css"); +@import url("spicy-theme.css") \ No newline at end of file