Linus-Enjoyer/Freedom-Loader
1
0
Fork 0
mirror of https://github.com/MasterAcnolo/Freedom-Loader.git synced 2026-07-30 02:35:46 +02:00
Code Issues Packages Projects Releases Wiki Activity

Refactor: Update CSS variables

Browse Source 
Fix Progress bar
This commit is contained in:
MasterAcnolo
2026-04-11 15:17:05 +02:00
parent 24460cf0b5
commit 00c542925c
20 changed files with 165 additions and 120 deletions
Download Patch File Download Diff File Expand all files Collapse all files

17
public/styles/theme/chirac-theme.css
View File

@@ -9,7 +9,7 @@ body.chirac {
--background-color: rgba(255, 255, 255, 0.85);
--default-text-color: #002395;
--subtitle-color: #EF4135;
--mp3-text-color: #002395;
--audio-only-label-color: #002395;
/* Formulaire */
--form-bg-color: rgba(255, 255, 255, 0.9);
@@ -21,18 +21,23 @@ body.chirac {
--form-button-bg-color: #002395;
--form-button-text-color: #ffffff;
--form-button-bg-hover-color: #EF4135;
--paste-button-icon-color: #ffffff;
/* Checkbox */
--checkbox-bg-default: #cccccc;
--checkbox-bg-checked: #002395;
--checkbox-unchecked-bg-color: #cccccc;
--checkbox-checked-bg-color: #002395;
--checkbox-checkmark-border-color: #ffffff;
--checkbox-pulse-color: rgba(0, 35, 149, 0.5);
/* Download status */
--download-status-color: #002395;
/* Progress bar */
--progress-bar-bg-color: #d0d0d0;
--progress-bar-fill-color: #EF4135;
/* Video Info Box */
--infos-box-color: rgba(255, 255, 255, 0.9);
--video-info-bg-color: rgba(255, 255, 255, 0.9);
--video-info-text-color: #000000;
--video-info-heading-color: #EF4135;
--video-info-list-color: #444444;
@@ -47,8 +52,8 @@ body.chirac {
--settings-button-bg-color: #00196a;
--settings-button-text-color: #dcdcdc;
--settings-bg-primary-color: #0b0528;
--settings-bg-secondary-color: #1c1055;
--settings-modal-bg-color: #0b0528;
--settings-section-bg-color: #1c1055;
--settings-text-color: #cecece;
--settings-subtitle-color: #adadad;

17
public/styles/theme/dark-theme.css
View File

@@ -3,7 +3,7 @@ body.dark {
--background-color: #121212; /* noir/gris très foncé */
--default-text-color: #e0e0e0; /* texte clair */
--subtitle-color: #2196f3; /* bleu accent */
--mp3-text-color: #f5f5f5; /* texte checkbox */
--audio-only-label-color: #f5f5f5; /* texte checkbox */
/* Formulaire */
--form-bg-color: #1e1e1e; /* fond formulaire */
@@ -15,18 +15,23 @@ body.dark {
--form-button-bg-color: #2196f3; /* bouton bleu */
--form-button-text-color: #ffffff; /* texte bouton */
--form-button-bg-hover-color: #1976d2; /* hover bleu plus foncé */
--paste-button-icon-color: #ffffff;
/* Checkbox */
--checkbox-bg-default: #555555; /* gris moyen */
--checkbox-bg-checked: #2196f3; /* bleu accent */
--checkbox-unchecked-bg-color: #555555; /* gris moyen */
--checkbox-checked-bg-color: #2196f3; /* bleu accent */
--checkbox-checkmark-border-color: #ffffff; /* blanc */
--checkbox-pulse-color: rgba(33, 150, 243, 0.5);
/* Download status */
--download-status-color: #2196f3;
/* Progress bar */
--progress-bar-bg-color: #444444;
--progress-bar-fill-color: #2196f3;
/* Video Info Box */
--infos-box-color: #1a1a1a;
--video-info-bg-color: #1a1a1a;
--video-info-text-color: #e0e0e0;
--video-info-heading-color: #2196f3;
--video-info-list-color: #cccccc;
@@ -41,8 +46,8 @@ body.dark {
--settings-button-bg-color: #1e1e1e;
--settings-button-text-color: var(--default-text-color);
--settings-bg-primary-color: #1e1e1e;
--settings-bg-secondary-color: #2a2a2a;
--settings-modal-bg-color: #1e1e1e;
--settings-section-bg-color: #2a2a2a;
--settings-text-color: var(--default-text-color);
--settings-subtitle-color: #aaa;

17
public/styles/theme/drift-theme.css
View File

@@ -9,7 +9,7 @@ body.drift {
--background-color: #0f1218;
--default-text-color: #3d4b61;
--subtitle-color: #1a1a1a;
--mp3-text-color: #c0d4ff;
--audio-only-label-color: #c0d4ff;
/* Formulaire */
--form-bg-color: #1e222a;
@@ -21,18 +21,23 @@ body.drift {
--form-button-bg-color: #2a2979;
--form-button-text-color: #ffffff;
--form-button-bg-hover-color: #353393;
--paste-button-icon-color: #ffffff;
/* Checkbox */
--checkbox-bg-default: #2a2e38;
--checkbox-bg-checked: #2a2979;
--checkbox-unchecked-bg-color: #2a2e38;
--checkbox-checked-bg-color: #2a2979;
--checkbox-checkmark-border-color: #ffffff;
--checkbox-pulse-color: rgba(76,108,255,0.3);
/* Download status */
--download-status-color: #ff8e8e;
/* Progress bar */
--progress-bar-bg-color: #3b4b6d;
--progress-bar-fill-color: #ff8e8e;
/* Video Info Box */
--infos-box-color: #1e222ad0;
--video-info-bg-color: #1e222ad0;
--video-info-text-color: #e8e8f0;
--video-info-heading-color: #9ab6ff;
--video-info-list-color: #c0d4ff;
@@ -47,8 +52,8 @@ body.drift {
--settings-button-bg-color: #1e222ace;
--settings-button-text-color: #b3b3b4;
--settings-bg-primary-color: #1e222a;
--settings-bg-secondary-color: #272d38;
--settings-modal-bg-color: #1e222a;
--settings-section-bg-color: #272d38;
--settings-text-color: #bababa;
--settings-subtitle-color: #cacaca;

17
public/styles/theme/fanatic-theme.css
View File

@@ -3,7 +3,7 @@ body.fanatic{
--background-color: #121212;
--default-text-color: #eee;
--subtitle-color: #FF5900;
--mp3-text-color: #ffffff;
--audio-only-label-color: #ffffff;
/* Formulaire */
--form-bg-color: #1e1e1e;
@@ -15,18 +15,23 @@ body.fanatic{
--form-button-bg-color: #FF5900;
--form-button-text-color: #121212;
--form-button-bg-hover-color: #e65500;
--paste-button-icon-color: #f1f1f1;
/* Checkbox */
--checkbox-bg-default: #555555;
--checkbox-bg-checked: #ff6600;
--checkbox-unchecked-bg-color: #555555;
--checkbox-checked-bg-color: #ff6600;
--checkbox-checkmark-border-color: #eee;
--checkbox-pulse-color: rgba(255, 102, 0, 0.5);
/* Download status */
--download-status-color: #FF5900;
/* Progress bar */
--progress-bar-bg-color: #444444;
--progress-bar-fill-color: #FF5900;
/* Video Info Box */
--infos-box-color: #222222;
--video-info-bg-color: #222222;
--video-info-text-color: #eee;
--video-info-heading-color: #FF5900;
--video-info-list-color: #ccc;
@@ -41,8 +46,8 @@ body.fanatic{
--settings-button-bg-color: #1e1e1e;
--settings-button-text-color: #dcdcdc;
--settings-bg-primary-color: #1e1e1e;
--settings-bg-secondary-color: #2d2d2d;
--settings-modal-bg-color: #1e1e1e;
--settings-section-bg-color: #2d2d2d;
--settings-text-color: #cecece;
--settings-subtitle-color: #adadad;

17
public/styles/theme/light-theme.css
View File

@@ -3,7 +3,7 @@ body.light {
--background-color: #dadada;
--default-text-color: #222222;
--subtitle-color: #007bff;
--mp3-text-color: #000000;
--audio-only-label-color: #000000;
/* Formulaire */
--form-bg-color: #ffffff;
@@ -15,18 +15,23 @@ body.light {
--form-button-bg-color: #007bff;
--form-button-text-color: #ffffff;
--form-button-bg-hover-color: #0056b3;
--paste-button-icon-color: #ffffff;
/* Checkbox */
--checkbox-bg-default: #cccccc;
--checkbox-bg-checked: #007bff;
--checkbox-unchecked-bg-color: #cccccc;
--checkbox-checked-bg-color: #007bff;
--checkbox-checkmark-border-color: #ffffff;
--checkbox-pulse-color: rgba(0, 123, 255, 0.4);
/* Download status */
--download-status-color: #007bff;
/* Progress bar */
--progress-bar-bg-color: #e0e0e0;
--progress-bar-fill-color: #007bff;
/* Video Info Box */
--infos-box-color: #ffffff;
--video-info-bg-color: #ffffff;
--video-info-text-color: #222222;
--video-info-heading-color: #007bff;
--video-info-list-color: #444444;
@@ -41,8 +46,8 @@ body.light {
--settings-button-bg-color: #e4e4e4;
--settings-button-text-color: var(--default-text-color);
--settings-bg-primary-color: #cbcbcb;
--settings-bg-secondary-color: #b8b8b8;
--settings-modal-bg-color: #cbcbcb;
--settings-section-bg-color: #b8b8b8;
--settings-text-color: var(--default-text-color);
--settings-subtitle-color: #656565;
}

17
public/styles/theme/neon-theme.css
View File

@@ -10,7 +10,7 @@ body.neon {
--background-color: #1b1b2f;
--default-text-color: #e0e0ff;
--subtitle-color: #a3a3ff;
--mp3-text-color: #c0c0ff;
--audio-only-label-color: #c0c0ff;
/* Formulaire */
--form-bg-color: #2c2c4a;
@@ -22,18 +22,23 @@ body.neon {
--form-button-bg-color: #5858f0;
--form-button-text-color: #ffffff;
--form-button-bg-hover-color: #7a7aff;
--paste-button-icon-color: #ffffff;
/* Checkbox */
--checkbox-bg-default: #302b63;
--checkbox-bg-checked: #5858f0;
--checkbox-unchecked-bg-color: #302b63;
--checkbox-checked-bg-color: #5858f0;
--checkbox-checkmark-border-color: #ffffff;
--checkbox-pulse-color: rgba(88,88,240,0.3);
/* Download status */
--download-status-color: #a3a3ff;
/* Progress bar */
--progress-bar-bg-color: #302b63;
--progress-bar-fill-color: #a3a3ff;
/* Video Info Box */
--infos-box-color: #2c2c4a;
--video-info-bg-color: #2c2c4a;
--video-info-text-color: #e0e0ff;
--video-info-heading-color: #a3a3ff;
--video-info-list-color: #c0c0ff;
@@ -48,8 +53,8 @@ body.neon {
--settings-button-bg-color: #202038;
--settings-button-text-color: var(--default-text-color);
--settings-bg-primary-color: #242454;
--settings-bg-secondary-color: #2f2f6f;
--settings-modal-bg-color: #242454;
--settings-section-bg-color: #2f2f6f;
--settings-text-color: var(--default-text-color);
--settings-subtitle-color: #d2d2d2;
}

17
public/styles/theme/nf-theme.css
View File

@@ -9,7 +9,7 @@ body.nf {
--background-color: #1a1a1a;
--default-text-color: #e6dfd5;
--subtitle-color: #f5f0e6;
--mp3-text-color: #d8cfc2;
--audio-only-label-color: #d8cfc2;
/* Formulaire */
--form-bg-color: #2a2a2a;
@@ -21,18 +21,23 @@ body.nf {
--form-button-bg-color: #cbb89d;
--form-button-text-color: #1a1a1a;
--form-button-bg-hover-color: #b7a588;
--paste-button-icon-color: #1a1a1a;
/* Checkbox */
--checkbox-bg-default: #4a4036;
--checkbox-bg-checked: #cbb89d;
--checkbox-unchecked-bg-color: #4a4036;
--checkbox-checked-bg-color: #cbb89d;
--checkbox-checkmark-border-color: #1a1a1a;
--checkbox-pulse-color: rgba(203,184,157,0.3);
/* Download status */
--download-status-color: #cbb89d;
/* Progress bar */
--progress-bar-bg-color: #4a4036;
--progress-bar-fill-color: #cbb89d;
/* Video Info Box */
--infos-box-color: #2a2a2a;
--video-info-bg-color: #2a2a2a;
--video-info-text-color: #e6dfd5;
--video-info-heading-color: #f5f0e6;
--video-info-list-color: #d8cfc2;
@@ -47,8 +52,8 @@ body.nf {
--settings-button-bg-color: #2a2a2a;
--settings-button-text-color: var(--default-text-color);
--settings-bg-primary-color: #2a2a2a;
--settings-bg-secondary-color: #313131;
--settings-modal-bg-color: #2a2a2a;
--settings-section-bg-color: #313131;
--settings-text-color: var(--default-text-color);
--settings-subtitle-color: #7a7979;
}

17
public/styles/theme/songbird-theme.css
View File

@@ -9,7 +9,7 @@ body.songbird {
--background-color: #0a0a0a; /* noir profond */
--default-text-color: #ff2a2a; /* rouge néon */
--subtitle-color: #f2f2f2; /* rouge sombre */
--mp3-text-color: #ff4d4d; /* rouge un peu plus clair */
--audio-only-label-color: #ff4d4d; /* rouge un peu plus clair */
/* Formulaire */
--form-bg-color: rgba(20,0,0,0.85); /* noir semi-transparent avec rouge */
@@ -21,18 +21,23 @@ body.songbird {
--form-button-bg-color: #b30000;
--form-button-text-color: #ffffff;
--form-button-bg-hover-color: #ff2a2a;
--paste-button-icon-color: #ffffff;
/* Checkbox */
--checkbox-bg-default: #630000;
--checkbox-bg-checked: #ff2a2a;
--checkbox-unchecked-bg-color: #630000;
--checkbox-checked-bg-color: #ff2a2a;
--checkbox-checkmark-border-color: #ffffff;
--checkbox-pulse-color: rgba(255,42,42,0.3);
/* Download status */
--download-status-color: #ff2a2a;
/* Progress bar */
--progress-bar-bg-color: #630000;
--progress-bar-fill-color: #ff2a2a;
/* Video Info Box */
--infos-box-color: rgba(30,0,0,0.9);
--video-info-bg-color: rgba(30,0,0,0.9);
--video-info-text-color: #ff4d4d;
--video-info-heading-color: #ff2a2a;
--video-info-list-color: #b30000;
@@ -47,8 +52,8 @@ body.songbird {
--settings-button-bg-color: rgba(29, 0, 0, 0.784);
--settings-button-text-color: var(--default-text-color);
--settings-bg-primary-color: #121212;
--settings-bg-secondary-color: #1a1a1a;
--settings-modal-bg-color: #121212;
--settings-section-bg-color: #1a1a1a;
--settings-text-color: var(--default-text-color);
--settings-subtitle-color: #7a7979;
}

17
public/styles/theme/spicy-theme.css
View File

@@ -3,7 +3,7 @@ body.spicy {
--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 */
--audio-only-label-color: #ffffff; /* texte checkbox inline */
/* Formulaire */
--form-bg-color: #1a1a1a; /* fond formulaire gris très foncé */
@@ -15,18 +15,23 @@ body.spicy {
--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é */
--paste-button-icon-color: #ffffff;
/* Checkbox */
--checkbox-bg-default: #555555; /* gris moyen */
--checkbox-bg-checked: #ff1a1a; /* rouge piment */
--checkbox-unchecked-bg-color: #555555; /* gris moyen */
--checkbox-checked-bg-color: #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 */
/* Progress bar */
--progress-bar-bg-color: #444444;
--progress-bar-fill-color: #ff1a1a;
/* Video Info Box */
--infos-box-color: #1a1a1a; /* fond infos gris foncé */
--video-info-bg-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 */
@@ -41,8 +46,8 @@ body.spicy {
--settings-button-bg-color: #1a1a1a;
--settings-button-text-color: #dcdcdc;
--settings-bg-primary-color: #1a1a1a;
--settings-bg-secondary-color: #292929;
--settings-modal-bg-color: #1a1a1a;
--settings-section-bg-color: #292929;
--settings-text-color: #cecece;
--settings-subtitle-color: #adadad;