diff --git a/admin/include/add_core_tabs.inc.php b/admin/include/add_core_tabs.inc.php
index 7228657c3..11a2788cc 100644
--- a/admin/include/add_core_tabs.inc.php
+++ b/admin/include/add_core_tabs.inc.php
@@ -162,6 +162,7 @@ function add_core_tabs($sheets, $tab_id)
$sheets['update'] = array('caption' => ''.l10n('Check for updates'), 'url' => $my_base_url.'&tab=update');
$sheets['new'] = array('caption' => ''.l10n('Add New Theme'), 'url' => $my_base_url.'&tab=new');
}
+ $sheets['standard_pages'] = array('caption' => ''.l10n('Standard pages'), 'url' => $my_base_url.'&tab=standard_pages');
break;
case 'updates':
diff --git a/admin/include/themes.class.php b/admin/include/themes.class.php
index fa53e7e15..1bc77351b 100644
--- a/admin/include/themes.class.php
+++ b/admin/include/themes.class.php
@@ -373,7 +373,6 @@ SELECT
'mobile' => false,
);
$theme_data = implode('', file($path.'/themeconf.inc.php'));
-
if (preg_match("|Theme Name:\\s*(.+)|", $theme_data, $val))
{
$theme['name'] = trim( $val[1] );
@@ -419,6 +418,10 @@ SELECT
{
$theme['mobile'] = get_boolean($val[1]);
}
+ if (preg_match('/["\']use_standard_pages["\'].*?(true|false)/i', $theme_data, $val))
+ {
+ $theme['use_standard_pages'] = get_boolean($val[1]);
+ }
// screenshot
$screenshot_path = $path.'/screenshot.png';
diff --git a/admin/themes/default/template/configuration_main.tpl b/admin/themes/default/template/configuration_main.tpl
index 19910ecb9..c623f0e52 100644
--- a/admin/themes/default/template/configuration_main.tpl
+++ b/admin/themes/default/template/configuration_main.tpl
@@ -252,18 +252,6 @@ jQuery("input[name='email_admin_on_new_user_filter']").change(function() {
-
-
-
-
-
-
-
-
diff --git a/admin/themes/default/template/themes_standard_pages.tpl b/admin/themes/default/template/themes_standard_pages.tpl
new file mode 100644
index 000000000..e3330c16a
--- /dev/null
+++ b/admin/themes/default/template/themes_standard_pages.tpl
@@ -0,0 +1,195 @@
+{combine_script id='common' load='footer' path='admin/themes/default/js/common.js'}
+
+
+
+{footer_script}
+
+
+// Update preview when user clicks on mini previews
+jQuery(".std_pgs_mini_previews img").click(function () {
+
+ //Make selected skin outlined
+ jQuery(".std_pgs_mini_previews img").removeClass('selected');
+ jQuery(this).addClass('selected');
+
+ //Update preview when useer clicks on mini
+ jQuery('input[name=std_pgs_selected_skin]').val(jQuery(this).attr('id'));
+
+ let preview_light_path = "themes/standard_pages/skins/light-"+$(this).attr('id')+".jpg";
+ let preview_dark_path = "themes/standard_pages/skins/dark-"+$(this).attr('id')+".jpg";
+
+ jQuery('.std_pgs_selected_preview img#preview-light').attr("src", preview_light_path);
+ jQuery('.std_pgs_selected_preview img#preview-dark').attr("src", preview_dark_path);
+});
+
+jQuery("input[name=std_pgs_display_logo]").click(function () {
+ if('custom_logo' == jQuery(this).val())
+ {
+ // jQuery('#std_pgs_logo').addClass('show').removeClass('hide');
+ jQuery('.custom_logo_preview').addClass('show').removeClass('hide');
+ }
+ else
+ {
+ // jQuery('#std_pgs_logo').addClass('hide').removeClass('show');
+ jQuery('.custom_logo_preview').addClass('hide').removeClass('show');
+ }
+});
+
+// Scroll mini to show the selected one
+jQuery(document).ready(function () {
+ const std_pgs_mini_previews = jQuery('.std_pgs_mini_previews');
+ const selected_mini = std_pgs_mini_previews.find('.selected');
+
+ if (selected_mini.length) {
+ std_pgs_mini_previews.scrollTop(
+ selected_mini.position().top + std_pgs_mini_previews.scrollTop()
+ );
+ }
+});
+
+//Switch between change logo and use existing logo
+
+ jQuery('#change_logo').click(function () {
+ jQuery('.use_existing_logo_container').show();
+ jQuery('.change_logo_container').hide();
+ });
+ jQuery('#use_existing_logo').click(function () {
+ jQuery('.change_logo_container').show();
+ jQuery('.use_existing_logo_container').hide();
+ jQuery('#std_pgs_logo').val('');
+ });
+
+
+
+{/footer_script}
\ No newline at end of file
diff --git a/admin/themes/default/theme.css b/admin/themes/default/theme.css
index d7a5b7f80..d3366a700 100644
--- a/admin/themes/default/theme.css
+++ b/admin/themes/default/theme.css
@@ -8498,4 +8498,107 @@ color:#FF7B00;
.mcs-icon-options::before{
margin-right: 5px;
+}
+
+/* Standard pages configuration */
+
+.std_pgs{
+ padding-bottom:60px;
+}
+
+.std_pgs_previews{
+ display:flex;
+ flex-direction:row;
+ margin-top:15px;
+}
+
+.std_pgs_mini_previews{
+ display:flex;
+ flex-direction: column;
+ overflow:auto;
+ width:15%;
+ max-height:500px;
+}
+
+.std_pgs_personnalisation_settings .std_pgs_mini_previews img{
+ max-height:100px;
+ object-fit:contain;
+}
+
+.std_pgs_selected_preview{
+ text-align:center;
+ display:flex;
+ width:85%;
+ margin-left:15px;
+ align-items:center;
+}
+
+.std_pgs_selected_preview img{
+ max-height: 500px;
+ width: 100%;
+ height: auto;
+ object-fit: contain;
+}
+
+.std_pgs_mini_previews img{
+ border:4px solid transparent;
+ cursor:pointer
+}
+
+.std_pgs_mini_previews img:hover,
+.std_pgs_mini_previews img.selected{
+ border: 4px solid #FFA646;
+}
+
+.use_existing_logo_container.hide,
+.custom_logo_preview.hide{
+ display:none;
+}
+
+#change_logo,
+#use_existing_logo,
+.use_existing_logo_container,
+.change_logo_container{
+ margin-left:30px;
+ margin-bottom:5px;
+}
+
+.custom_logo_preview.show{
+ display:flex;
+ align-items:center;
+}
+
+.std_pgs_theme_info.warnings{
+ display:block;
+}
+
+.std_pgs_theme_info.warnings p{
+ text-align:left;
+}
+
+.std_pgs_theme_info.warnings li{
+ list-style:inside;
+}
+
+.custom_logo_preview{
+ display:flex;
+ align-items:center;
+ color:#777;
+}
+
+.custom_logo_preview img{
+ max-height:30px
+}
+
+.custom_logo_preview p{
+ margin:0;
+}
+
+.std_pgs_header_options{
+ display:flex;
+ flex-direction:column;
+}
+
+.skin_choice{
+ padding-top:30px;
}
\ No newline at end of file
diff --git a/admin/themes_standard_pages.php b/admin/themes_standard_pages.php
new file mode 100644
index 000000000..7d38af7f5
--- /dev/null
+++ b/admin/themes_standard_pages.php
@@ -0,0 +1,177 @@
+assign(array(
+ 'save_error' => l10n('Invalid image file.')
+ ));
+ return;
+ }
+
+ list($width, $height, $type) = $image_info;
+ }
+
+ $upload_dir = PHPWG_ROOT_PATH . PWG_LOCAL_DIR . 'logo';
+ if (mkgetdir($upload_dir, MKGETDIR_DEFAULT & ~MKGETDIR_DIE_ON_ERROR))
+ {
+ $pathinfo = pathinfo($_FILES['std_pgs_logo']['name']);
+
+ $filename = str2url($pathinfo['filename']);
+ $extension = strtolower($pathinfo['extension']);
+
+ $new_name = $filename . '.' . $extension;
+ $file_path = $upload_dir . '/' . $new_name;
+
+ //Save logo path to conf
+ conf_update_param('standard_pages_selected_logo_path', $file_path, true);
+
+ if (move_uploaded_file($_FILES['std_pgs_logo']['tmp_name'], $file_path))
+ {
+ $logo['file'] = substr($file_path, strlen(PHPWG_ROOT_PATH));
+ }
+ else
+ {
+ $template->assign(array(
+ 'save_error' => "$file_path " . l10n('no write access'),
+ ));
+ }
+ // }
+ }
+ else
+ {
+ $template->assign(array(
+ 'save_error' => sprintf(
+ l10n('Add write access to the "%s" directory'),
+ $upload_dir
+ ),
+ ));
+ }
+}
+
+//We want to now if any themes use standard pages and which ones
+include_once(PHPWG_ROOT_PATH.'admin/include/themes.class.php');
+$themes = new themes();
+$themes->get_fs_themes();
+
+$is_standard_pages_used = false;
+$standard_pages_used_by = array();
+
+foreach ($themes->fs_themes as $theme)
+{
+ if (isset($theme['use_standard_pages']) and $theme['use_standard_pages'])
+ {
+ $is_standard_pages_used = true;
+ array_push($standard_pages_used_by, $theme['name']);
+ }
+}
+
+// +-----------------------------------------------------------------------+
+// | template output |
+// +-----------------------------------------------------------------------+
+
+//Send all info to template
+$template->assign(
+ array(
+ 'use_standard_pages' => conf_get_param('use_standard_pages', true),
+ 'std_pgs_selected_logo' => conf_get_param('standard_pages_selected_logo', 'piwigo_logo'),
+ 'std_pgs_logo_options' => $std_pgs_logo_options,
+ 'std_pgs_selected_skin' => conf_get_param('standard_pages_selected_skin', 'default'),
+ 'std_pgs_skin_options' => $std_pgs_skin_options,
+ 'is_standard_pages_used' => $is_standard_pages_used,
+ 'standard_pages_used_by' => $standard_pages_used_by,
+ 'std_pgs_selected_logo_path' => conf_get_param('standard_pages_selected_logo_path', null),
+ 'PWG_TOKEN' => get_pwg_token(),
+ )
+);
+
+$template->assign('isWebmaster', (is_webmaster()) ? 1 : 0);
+
+$template->set_filenames(array('themes' => 'themes_standard_pages.tpl'));
+
+$template->assign('ADMIN_PAGE_TITLE', l10n('Themes'));
+
+$template->assign_var_from_handle('ADMIN_CONTENT', 'themes');
+
+?>
\ No newline at end of file
diff --git a/include/template.class.php b/include/template.class.php
index fbd759714..187d07bee 100644
--- a/include/template.class.php
+++ b/include/template.class.php
@@ -197,6 +197,7 @@ class Template
*/
function set_theme($root, $theme, $path, $load_css=true, $load_local_head=true, $colorscheme='dark')
{
+ //we need themeconf before std_pgs to see what themes use_standard_pages
$themeconf = $this->load_themeconf($root.'/'.$theme);
// We loop over the theme and the parent theme, so if we exclude default,
@@ -208,6 +209,7 @@ class Template
)
{
$theme = 'standard_pages';
+ $themeconf = $this->load_themeconf($root.'/'.$theme);
}
$this->set_template_dir($root.'/'.$theme.'/'.$path);
@@ -237,7 +239,7 @@ class Template
{
$themeconf['colorscheme'] = $colorscheme;
}
-
+
$this->smarty->append('themes', $tpl_var);
$this->smarty->append('themeconf', $themeconf, true);
}
diff --git a/language/en_UK/admin.lang.php b/language/en_UK/admin.lang.php
index b68ac8d89..f2b4e855d 100644
--- a/language/en_UK/admin.lang.php
+++ b/language/en_UK/admin.lang.php
@@ -1421,5 +1421,17 @@ $lang['Empty lounge'] = 'Empty lounge';
$lang['There is currently %d photos in the lounge (upload buffer)'] = 'There is currently %d photos in the lounge (upload buffer)';
$lang['%d photos were moved from the upload lounge to their albums'] = '%d photos were moved from the upload lounge to their albums';
$lang['Admins only'] = 'Admins only';
+$lang['Standard pages'] = 'Standard pages';
+$lang['Standard pages aren\'t activated, however you have %d active themes that will still use them. These themes are:'] ='Standard pages aren\'t activated, however you have %d active themes that will still use them. These themes are:' ;
+$lang['Standard pages header'] = 'Standard pages header';
+$lang['Use Piwigo logo'] = 'Use Piwigo logo';
+$lang['Use custom logo (png, jpeg or svg)'] = 'Use custom logo (png, jpeg or svg)';
+$lang['Display Gallery title'] = 'Display Gallery title';
+$lang['Select a color theme for standard pages'] = 'Select a color theme for standard pages';
+$lang['Light mode'] = 'Light mode';
+$lang['Dark mode'] = 'Dark mode';
+$lang['Personalization settings'] ='Personalization settings';
+$lang['Change logo'] = 'Change logo';
+
// Leave this line empty
\ No newline at end of file
diff --git a/language/fr_FR/admin.lang.php b/language/fr_FR/admin.lang.php
index 7c8f10a79..ccfbe3cf2 100644
--- a/language/fr_FR/admin.lang.php
+++ b/language/fr_FR/admin.lang.php
@@ -1410,8 +1410,8 @@ $lang['To set your password, visit the following address:'] = 'Pour définir vot
$lang['A photo library administrator has created the following account for you:'] = 'Un administrateur de la photothèque vous a créé le compte suivant :';
$lang['Welcome to %s'] = 'Bienvenue sur %s';
$lang['Save all photos'] = 'Enregistrer toutes les photos';
-$lang['Use standard Piwigo template for common pages.'] = 'Utiliser le modèle standard de Piwigo pour les pages courantes.';
-$lang['When enabled, a common template is used for the login, registration and forgotten password pages, regardless of the theme. Some themes might use these templates even if you uncheck this option'] = 'Lorsque cette option est activée, un modèle commun est utilisé pour les pages de connexion, d\'inscription et de mot de passe oublié, quel que soit le thème. Certains thèmes peuvent utiliser ces modèles même si cette option est décochée.';
+$lang['Use standard Piwigo template for common pages.'] = 'Utiliser les pages standard de Piwigo pour les pages courantes.';
+$lang['When enabled, a common template is used for the login, registration and forgotten password pages, regardless of the theme. Some themes might use these templates even if you uncheck this option'] = 'Lorsque cette option est activée, un thème commun est utilisé pour les pages de connexion, d\'inscription et de mot de passe oublié, quel que soit le thème. Certains thèmes peuvent utiliser ce design même si cette option est décochée.';
$lang['We have found %d duplicate paths. Details provided by plugin Check Uploads'] = 'Nous avons trouvé %d chemins anormalement dupliqués. À contrôler avec le plugin Check Uploads.';
$lang['Are you sure you want to delete comment #%s?'] = 'Êtes-vous sûr de vouloir supprimer le commentaire #%s ?';
$lang['No comments selected, no actions possible.'] = 'Aucun commentaire sélectionné, aucune action possible.';
@@ -1423,4 +1423,17 @@ $lang['Empty lounge'] = 'Vider le lounge';
$lang['There is currently %d photos in the lounge (upload buffer)'] = 'Il y a actuellement %d photos dans le lounge (salle d\'attente des transferts)';
$lang['%d photos were moved from the upload lounge to their albums'] = '%d photos ont été déplacées du lounge vers leurs albums respectifs';
$lang['Admins only'] = 'Admins uniquement';
+$lang['Standard pages'] = 'Pages standard';
+$lang['Standard pages aren\'t activated, however you have %d active themes that will still use them. These themes are:'] ='Les pages standard ne sont pas activées, mais vous avez %d thèmes actifs qui les utiliseront. Ces thèmes sont :' ;
+$lang['Standard pages header'] = 'En-tête des pages standards';
+$lang['Use Piwigo logo'] = 'Utiliser le logo Piwigo';
+$lang['Use custom logo (png, jpeg or svg)'] = 'Utiliser un logo personnalisé (png, jpeg ou svg)';
+$lang['Display Gallery title'] = 'Afficher le titre de la galerie';
+$lang['Select a color theme for standard pages'] = 'Choisissez un jeu de couleurs pour les pages standard';
+$lang['Light mode'] = 'Mode claire';
+$lang['Dark mode'] = 'Mode sombre';
+$lang['Personalization settings'] ='Paramètres de personnalisation';
+$lang['Change logo'] = 'Changer le logo';
+
+
// Leave this line empty
diff --git a/themes/standard_pages/css/standard_pages.css b/themes/standard_pages/css/standard_pages.css
deleted file mode 100644
index e69de29bb..000000000
diff --git a/themes/standard_pages/skins/cadmium.css b/themes/standard_pages/skins/cadmium.css
new file mode 100644
index 000000000..9e11190ec
--- /dev/null
+++ b/themes/standard_pages/skins/cadmium.css
@@ -0,0 +1,341 @@
+input[type='radio'] {
+ accent-color: #FDDA0D;
+}
+
+.input-container:focus-within,
+.input-modal:focus-within{
+ border:1px solid #FDDA0D!important;
+}
+
+.gallery-icon-checkmark {
+ border: 1px solid #777;
+}
+
+.btn-main{
+ background-color:#FDDA0D!important;
+ color:black!important;
+}
+
+.btn-secondary {
+ background-color: #ECECEC!important;
+ color: #3C3C3C!important;
+}
+
+.btn-main:disabled {
+ background-color:#aaaaaa!important;
+ color: #3C3C3C !important;
+}
+
+#separator{
+ border-bottom:1px solid #D8D8D8;
+}
+
+#lang-select #other-languages span:hover{
+ color:#FDDA0D;
+}
+
+.profile-section .api-icon-action i:hover,
+.close-modal:hover,
+.profile-section .icon-clone:hover {
+ color: #FDDA0D;
+}
+
+.profile-section div.api-tab-line:nth-child(even) {
+ background-color: #303030;
+}
+
+.profile-section #api_key_list .edit {
+ border: 1px solid #FDDA0D !important;
+}
+
+.profile-section .new-apikey .btn-link{
+ color: #9A9A9A !important;
+}
+
+.bg-modal {
+ background-color: rgba(0,0,0,0.7);
+}
+
+.slider {
+ background-color: #ccc;
+}
+
+.slider:before {
+ background-color: white;
+}
+
+/* Light */
+#theIdentificationPage .light,
+#theRegisterPage .light,
+#thePasswordPage .light,
+#theProfilePage .light{
+ background: linear-gradient(75.69deg, #FEF4B8 7.64%, #FFFBE6 77.87%);
+}
+
+.light #login-form,
+.light #register-form,
+.light #password-form,
+.light #lang-select #other-languages,
+.light .profile-section,
+.light .slider:before,
+.light .body-modal,
+.light [data-tooltip]:hover::after {
+ background-color:#ffffff;
+}
+
+#theIdentificationPage .light a,
+#theRegisterPage .light a,
+#thePasswordPage .light a,
+#theProfilePage .light a:not(.close-modal),
+.light h1,
+.light .input-container input,
+.light .input-modal input,
+.light .input-container select,
+.light .input-container textarea,
+.light .secondary-links,
+.light .properties label,
+.light .profile-section label,
+.light .properties i,
+.light .profile-section i,
+.light #password-form p,
+.light .profile-section p,
+.light #lang-select #other-languages span,
+.light .btn-cancel,
+.light .btn-link {
+ color:#3C3C3C;
+}
+
+#theIdentificationPage .light a:hover,
+#theRegisterPage .light a:hover,
+#thePasswordPage .light a:hover,
+#theProfilePage .light a:hover{
+ color:#FDDA0D;
+}
+
+.light #header-options a,
+.light #header-options .toggle-mode,
+.light #selected-language-container{
+ color:#CFB002;
+}
+
+.light .input-container,
+.light .input-modal,
+.light .api-list-head {
+ background-color:#F0F0F0;
+ border:1px solid #F0F0F0;
+}
+
+.light .input-container input:is(:-webkit-autofill, :autofill)
+{
+ box-shadow: 0 0 0 100px #F0F0F0 inset;
+ -webkit-box-shadow: 0 0 0px 1000px #F0F0F0 inset !important;
+ -webkit-text-fill-color: #3C3C3C;
+ color:#3C3C3C;
+}
+
+.light #separator{
+ border-bottom:1px solid #D8D8D8;
+}
+
+.light .gallery-icon-eye{
+ color:#898989;
+}
+
+.light .success-message{
+ background-color: #DBF6D7;
+ color: #6DCE5E !important;
+ border-left: 4px solid #6DCE5E;
+}
+
+.light .success-message i{
+ color:#6DCE5E;
+}
+
+.light .infos-message{
+ background-color: #bde5f8;
+ color: #00529b !important;
+ border-left: 4px solid #00529b;
+}
+
+.light input:checked + .slider {
+ background-color: #FFA646;
+}
+
+.light input:focus + .slider {
+ box-shadow: 0 0 1px #FFA646;
+}
+
+.light .slider {
+ background-color: #CCCCCC;
+}
+
+.light .api-list-body > div:nth-child(4n+1),
+.light .api-list-body > div:nth-child(4n+2) {
+ background-color: #F8F8F8;
+}
+
+.light .api-tab-line p,
+.light .api-icon-action i,
+.light .keys p:not(.api-copy),
+.light .keys i,
+.light #api_key_list_expired .api-skull {
+ color: #656565;
+}
+
+.light .close-modal {
+ color: #ffffff;
+}
+
+.light input[type="date"] {
+ color-scheme: light;
+}
+
+.light input[type="date"]::-webkit-calendar-picker-indicator {
+ filter: invert(0);
+}
+
+.light .btn-revoked {
+ background-color: #EB3223 !important;
+}
+
+/* Dark */
+#theIdentificationPage .dark,
+#theRegisterPage .dark,
+#thePasswordPage .dark,
+#theProfilePage .dark{
+ background: linear-gradient(75.69deg, #1B1B1D 7.64%, #2F2F2F 77.87%);
+}
+
+.dark #login-form,
+.dark #register-form,
+.dark #password-form,
+.dark .profile-section,
+.dark .body-modal {
+ background-color:#3C3C3C;
+}
+
+#theIdentificationPage .dark a,
+#theRegisterPage .dark a,
+#thePasswordPage .dark a,
+#theProfilePage .dark a:not(.close-modal){
+ color:#FEF4B8;
+}
+
+.dark h1,
+.dark .input-container input,
+.dark .input-modal input,
+.dark .input-container select,
+.dark .input-container textarea,
+.dark .secondary-links,
+.dark .properties label,
+.dark .profile-section label,
+.dark .properties i,
+.dark .profile-section i,
+.dark #password-form p,
+.dark .profile-section p,
+.dark #lang-select #other-languages span,
+.dark .btn-cancel,
+.dark .btn-link {
+ color:#D6D6D6;
+}
+
+#theIdentificationPage .dark a:hover,
+#theRegisterPage .dark a:hover,
+#thePasswordPage .dark a:hover,
+#theProfilePage .dark a:hover,
+.dark #lang-select #other-languages span{
+ color:#FFFBE6;
+}
+
+.dark #header-options a,
+.dark #header-options .toggle-mode,
+.dark #selected-language-container{
+ color:#FEF4B8;
+}
+
+.dark .input-container,
+.dark .input-modal {
+ background-color:#303030;
+ border:1px solid #303030;
+}
+
+.dark .input-container input:is(:-webkit-autofill, :autofill)
+{
+ box-shadow: 0 0 0 100px #303030 inset;
+ -webkit-box-shadow: 0 0 0px 1000px #303030 inset !important;
+ -webkit-text-fill-color: #D6D6D6;
+ color:#D6D6D6;
+}
+
+.dark #separator{
+ border-bottom:1px solid #303030;
+}
+
+.dark .gallery-icon-eye{
+ color:#898989;
+}
+
+.dark #lang-select #other-languages,
+.dark .slider,
+.dark input:checked + .slider:before {
+ background-color: #3C3C3C;
+}
+
+.dark .success-message{
+ background-color: #4EA590;
+ color: #AAF6E4 !important;
+ border-left: 4px solid #AAF6E4;
+}
+
+.dark .success-message i{
+ color: #AAF6E4;
+}
+
+.dark .infos-message{
+ background-color: #4f71a4;
+ color: #bad6ff !important;
+ border-left: 4px solid #bad6ff;
+}
+
+.dark .btn-secondary {
+ background-color: #202020!important;
+ color: white!important;
+}
+
+.dark input:checked + .slider {
+ background-color: #FFA646;
+}
+
+.dark .slider:before {
+ background-color: #777777;
+}
+
+.dark .api-list-head,
+.dark [data-tooltip]:hover::after{
+ background-color: #2A2A2A;
+}
+
+.dark .api-list-body > div:nth-child(4n+1),
+.dark .api-list-body > div:nth-child(4n+2) {
+ background-color: #333333;
+}
+
+.dark .icon-collapse {
+ color: white !important;
+}
+
+.dark .close-modal {
+ color: #3C3C3C;
+}
+
+.dark input[type="date"] {
+ color-scheme: dark;
+}
+
+.dark input[type="date"]::-webkit-calendar-picker-indicator {
+ filter: invert(0);
+}
+
+.dark .btn-revoked {
+ background-color: #BE4949 !important;
+}
\ No newline at end of file
diff --git a/themes/standard_pages/skins/cobalt.css b/themes/standard_pages/skins/cobalt.css
new file mode 100644
index 000000000..8f4527d10
--- /dev/null
+++ b/themes/standard_pages/skins/cobalt.css
@@ -0,0 +1,341 @@
+input[type='radio'] {
+ accent-color: #3b5897;
+}
+
+.input-container:focus-within,
+.input-modal:focus-within{
+ border:1px solid #3b5897!important;
+}
+
+.gallery-icon-checkmark {
+ border: 1px solid #777;
+}
+
+.btn-main{
+ background-color:#3b5897!important;
+ color:white!important;
+}
+
+.btn-secondary {
+ background-color: #ECECEC!important;
+ color: #3C3C3C!important;
+}
+
+.btn-main:disabled {
+ background-color:#aaaaaa!important;
+ color: #3C3C3C !important;
+}
+
+#separator{
+ border-bottom:1px solid #D8D8D8;
+}
+
+#lang-select #other-languages span:hover{
+ color:#3b5897;
+}
+
+.profile-section .api-icon-action i:hover,
+.close-modal:hover,
+.profile-section .icon-clone:hover {
+ color: #3b5897;
+}
+
+.profile-section div.api-tab-line:nth-child(even) {
+ background-color: #303030;
+}
+
+.profile-section #api_key_list .edit {
+ border: 1px solid #3b5897 !important;
+}
+
+.profile-section .new-apikey .btn-link{
+ color: #9A9A9A !important;
+}
+
+.bg-modal {
+ background-color: rgba(0,0,0,0.7);
+}
+
+.slider {
+ background-color: #ccc;
+}
+
+.slider:before {
+ background-color: white;
+}
+
+/* Light */
+#theIdentificationPage .light,
+#theRegisterPage .light,
+#thePasswordPage .light,
+#theProfilePage .light{
+ background: linear-gradient(75.69deg, #8eb7e6 7.64%, #a3c4f0 77.87%);
+}
+
+.light #login-form,
+.light #register-form,
+.light #password-form,
+.light #lang-select #other-languages,
+.light .profile-section,
+.light .slider:before,
+.light .body-modal,
+.light [data-tooltip]:hover::after {
+ background-color:#ffffff;
+}
+
+#theIdentificationPage .light a,
+#theRegisterPage .light a,
+#thePasswordPage .light a,
+#theProfilePage .light a:not(.close-modal),
+.light h1,
+.light .input-container input,
+.light .input-modal input,
+.light .input-container select,
+.light .input-container textarea,
+.light .secondary-links,
+.light .properties label,
+.light .profile-section label,
+.light .properties i,
+.light .profile-section i,
+.light #password-form p,
+.light .profile-section p,
+.light #lang-select #other-languages span,
+.light .btn-cancel,
+.light .btn-link {
+ color:#3C3C3C;
+}
+
+#theIdentificationPage .light a:hover,
+#theRegisterPage .light a:hover,
+#thePasswordPage .light a:hover,
+#theProfilePage .light a:hover{
+ color:#3b5897;
+}
+
+.light #header-options a,
+.light #header-options .toggle-mode,
+.light #selected-language-container{
+ color:#3b5897;
+}
+
+.light .input-container,
+.light .input-modal,
+.light .api-list-head {
+ background-color:#F0F0F0;
+ border:1px solid #F0F0F0;
+}
+
+.light .input-container input:is(:-webkit-autofill, :autofill)
+{
+ box-shadow: 0 0 0 100px #F0F0F0 inset;
+ -webkit-box-shadow: 0 0 0px 1000px #F0F0F0 inset !important;
+ -webkit-text-fill-color: #3C3C3C;
+ color:#3C3C3C;
+}
+
+.light #separator{
+ border-bottom:1px solid #D8D8D8;
+}
+
+.light .gallery-icon-eye{
+ color:#898989;
+}
+
+.light .success-message{
+ background-color: #DBF6D7;
+ color: #6DCE5E !important;
+ border-left: 4px solid #6DCE5E;
+}
+
+.light .success-message i{
+ color:#6DCE5E;
+}
+
+.light .infos-message{
+ background-color: #bde5f8;
+ color: #00529b !important;
+ border-left: 4px solid #00529b;
+}
+
+.light input:checked + .slider {
+ background-color: #FFA646;
+}
+
+.light input:focus + .slider {
+ box-shadow: 0 0 1px #FFA646;
+}
+
+.light .slider {
+ background-color: #CCCCCC;
+}
+
+.light .api-list-body > div:nth-child(4n+1),
+.light .api-list-body > div:nth-child(4n+2) {
+ background-color: #F8F8F8;
+}
+
+.light .api-tab-line p,
+.light .api-icon-action i,
+.light .keys p:not(.api-copy),
+.light .keys i,
+.light #api_key_list_expired .api-skull {
+ color: #656565;
+}
+
+.light .close-modal {
+ color: #ffffff;
+}
+
+.light input[type="date"] {
+ color-scheme: light;
+}
+
+.light input[type="date"]::-webkit-calendar-picker-indicator {
+ filter: invert(0);
+}
+
+.light .btn-revoked {
+ background-color: #EB3223 !important;
+}
+
+/* Dark */
+#theIdentificationPage .dark,
+#theRegisterPage .dark,
+#thePasswordPage .dark,
+#theProfilePage .dark{
+ background: linear-gradient(75.69deg, #1B1B1D 7.64%, #2F2F2F 77.87%);
+}
+
+.dark #login-form,
+.dark #register-form,
+.dark #password-form,
+.dark .profile-section,
+.dark .body-modal {
+ background-color:#3C3C3C;
+}
+
+#theIdentificationPage .dark a,
+#theRegisterPage .dark a,
+#thePasswordPage .dark a,
+#theProfilePage .dark a:not(.close-modal){
+ color:#8eb7e6;
+}
+
+.dark h1,
+.dark .input-container input,
+.dark .input-modal input,
+.dark .input-container select,
+.dark .input-container textarea,
+.dark .secondary-links,
+.dark .properties label,
+.dark .profile-section label,
+.dark .properties i,
+.dark .profile-section i,
+.dark #password-form p,
+.dark .profile-section p,
+.dark #lang-select #other-languages span,
+.dark .btn-cancel,
+.dark .btn-link {
+ color:#D6D6D6;
+}
+
+#theIdentificationPage .dark a:hover,
+#theRegisterPage .dark a:hover,
+#thePasswordPage .dark a:hover,
+#theProfilePage .dark a:hover,
+.dark #lang-select #other-languages span{
+ color:#a3c4f0;
+}
+
+.dark #header-options a,
+.dark #header-options .toggle-mode,
+.dark #selected-language-container{
+ color:#a3c4f0;
+}
+
+.dark .input-container,
+.dark .input-modal {
+ background-color:#303030;
+ border:1px solid #303030;
+}
+
+.dark .input-container input:is(:-webkit-autofill, :autofill)
+{
+ box-shadow: 0 0 0 100px #303030 inset;
+ -webkit-box-shadow: 0 0 0px 1000px #303030 inset !important;
+ -webkit-text-fill-color: #D6D6D6;
+ color:#D6D6D6;
+}
+
+.dark #separator{
+ border-bottom:1px solid #303030;
+}
+
+.dark .gallery-icon-eye{
+ color:#898989;
+}
+
+.dark #lang-select #other-languages,
+.dark .slider,
+.dark input:checked + .slider:before {
+ background-color: #3C3C3C;
+}
+
+.dark .success-message{
+ background-color: #4EA590;
+ color: #AAF6E4 !important;
+ border-left: 4px solid #AAF6E4;
+}
+
+.dark .success-message i{
+ color: #AAF6E4;
+}
+
+.dark .infos-message{
+ background-color: #4f71a4;
+ color: #bad6ff !important;
+ border-left: 4px solid #bad6ff;
+}
+
+.dark .btn-secondary {
+ background-color: #202020!important;
+ color: white!important;
+}
+
+.dark input:checked + .slider {
+ background-color: #FFA646;
+}
+
+.dark .slider:before {
+ background-color: #777777;
+}
+
+.dark .api-list-head,
+.dark [data-tooltip]:hover::after{
+ background-color: #2A2A2A;
+}
+
+.dark .api-list-body > div:nth-child(4n+1),
+.dark .api-list-body > div:nth-child(4n+2) {
+ background-color: #333333;
+}
+
+.dark .icon-collapse {
+ color: white !important;
+}
+
+.dark .close-modal {
+ color: #3C3C3C;
+}
+
+.dark input[type="date"] {
+ color-scheme: dark;
+}
+
+.dark input[type="date"]::-webkit-calendar-picker-indicator {
+ filter: invert(0);
+}
+
+.dark .btn-revoked {
+ background-color: #BE4949 !important;
+}
\ No newline at end of file
diff --git a/themes/standard_pages/skins/dark-cadmium.jpg b/themes/standard_pages/skins/dark-cadmium.jpg
new file mode 100644
index 000000000..bc5d19df4
Binary files /dev/null and b/themes/standard_pages/skins/dark-cadmium.jpg differ
diff --git a/themes/standard_pages/skins/dark-cobalt.jpg b/themes/standard_pages/skins/dark-cobalt.jpg
new file mode 100644
index 000000000..4532c88a1
Binary files /dev/null and b/themes/standard_pages/skins/dark-cobalt.jpg differ
diff --git a/themes/standard_pages/skins/dark-default.jpg b/themes/standard_pages/skins/dark-default.jpg
new file mode 100644
index 000000000..8b0a414b1
Binary files /dev/null and b/themes/standard_pages/skins/dark-default.jpg differ
diff --git a/themes/standard_pages/skins/dark-fuchsia.jpg b/themes/standard_pages/skins/dark-fuchsia.jpg
new file mode 100644
index 000000000..34bc8a893
Binary files /dev/null and b/themes/standard_pages/skins/dark-fuchsia.jpg differ
diff --git a/themes/standard_pages/skins/dark-green.jpg b/themes/standard_pages/skins/dark-green.jpg
new file mode 100644
index 000000000..b0b3857b1
Binary files /dev/null and b/themes/standard_pages/skins/dark-green.jpg differ
diff --git a/themes/standard_pages/skins/dark-lime.jpg b/themes/standard_pages/skins/dark-lime.jpg
new file mode 100644
index 000000000..801eb7756
Binary files /dev/null and b/themes/standard_pages/skins/dark-lime.jpg differ
diff --git a/themes/standard_pages/skins/dark-purple.jpg b/themes/standard_pages/skins/dark-purple.jpg
new file mode 100644
index 000000000..c7bca2b52
Binary files /dev/null and b/themes/standard_pages/skins/dark-purple.jpg differ
diff --git a/themes/standard_pages/skins/dark-red.jpg b/themes/standard_pages/skins/dark-red.jpg
new file mode 100644
index 000000000..24c19a062
Binary files /dev/null and b/themes/standard_pages/skins/dark-red.jpg differ
diff --git a/themes/standard_pages/skins/dark-sienna.jpg b/themes/standard_pages/skins/dark-sienna.jpg
new file mode 100644
index 000000000..3d3471c0c
Binary files /dev/null and b/themes/standard_pages/skins/dark-sienna.jpg differ
diff --git a/themes/standard_pages/skins/dark-silver.jpg b/themes/standard_pages/skins/dark-silver.jpg
new file mode 100644
index 000000000..88ff24850
Binary files /dev/null and b/themes/standard_pages/skins/dark-silver.jpg differ
diff --git a/themes/standard_pages/skins/dark-teal.jpg b/themes/standard_pages/skins/dark-teal.jpg
new file mode 100644
index 000000000..42b3b1fe1
Binary files /dev/null and b/themes/standard_pages/skins/dark-teal.jpg differ
diff --git a/themes/standard_pages/skins/default.css b/themes/standard_pages/skins/default.css
new file mode 100644
index 000000000..ed48974f5
--- /dev/null
+++ b/themes/standard_pages/skins/default.css
@@ -0,0 +1,337 @@
+input[type='radio'] {
+ accent-color: #ff7700;
+}
+
+.input-container:focus-within,
+.input-modal:focus-within{
+ border:1px solid #ff7700!important;
+}
+
+.gallery-icon-checkmark {
+ border: 1px solid #777;
+}
+
+.btn-main{
+ background-color:#ff7700!important;
+ color:white!important;
+}
+
+.btn-secondary {
+ background-color: #ECECEC!important;
+ color: #3C3C3C!important;
+}
+
+.btn-main:disabled {
+ background-color:#aaaaaa!important;
+ color: #3C3C3C !important;
+}
+
+#separator{
+ border-bottom:1px solid #D8D8D8;
+}
+
+#lang-select #other-languages span:hover{
+ color:#ff7700;
+}
+
+.profile-section .api-icon-action i:hover,
+.close-modal:hover,
+.profile-section .icon-clone:hover {
+ color: #ff7700;
+}
+
+.profile-section div.api-tab-line:nth-child(even) {
+ background-color: #303030;
+}
+
+.profile-section #api_key_list .edit {
+ border: 1px solid #ff7700 !important;
+}
+
+.profile-section .new-apikey .btn-link{
+ color: #9A9A9A !important;
+}
+
+.bg-modal {
+ background-color: rgba(0,0,0,0.7);
+}
+
+.slider {
+ background-color: #ccc;
+}
+
+.slider:before {
+ background-color: white;
+}
+
+/* Light */
+#theIdentificationPage .light,
+#theRegisterPage .light,
+#thePasswordPage .light,
+#theProfilePage .light{
+ background: linear-gradient(75.69deg, #FFEACF 7.64%, #FFFAF3 77.87%);
+}
+
+.light #login-form,
+.light #register-form,
+.light #password-form,
+.light #lang-select #other-languages,
+.light .profile-section,
+.light .slider:before,
+.light .body-modal,
+.light [data-tooltip]:hover::after {
+ background-color:#ffffff;
+}
+
+#theIdentificationPage .light a,
+#theRegisterPage .light a,
+#thePasswordPage .light a,
+#theProfilePage .light a:not(.close-modal),
+.light h1,
+.light .input-container input,
+.light .input-modal input,
+.light .input-container select,
+.light .input-container textarea,
+.light .secondary-links,
+.light .properties label,
+.light .profile-section label,
+.light .properties i,
+.light .profile-section i,
+.light #password-form p,
+.light .profile-section p,
+.light #lang-select #other-languages span,
+.light .btn-cancel,
+.light .btn-link {
+ color:#3C3C3C;
+}
+
+#theIdentificationPage .light a:hover,
+#theRegisterPage .light a:hover,
+#thePasswordPage .light a:hover,
+#theProfilePage .light a:hover{
+ color:#ff7700;
+}
+
+.light #header-options a,
+.light #header-options .toggle-mode,
+.light #selected-language-container{
+ color:#ff7700;
+}
+
+.light .input-container,
+.light .input-modal,
+.light .api-list-head {
+ background-color:#F0F0F0;
+ border:1px solid #F0F0F0;
+}
+
+.light .input-container input:is(:-webkit-autofill, :autofill)
+{
+ box-shadow: 0 0 0 100px #F0F0F0 inset;
+ -webkit-box-shadow: 0 0 0px 1000px #F0F0F0 inset !important;
+ -webkit-text-fill-color: #3C3C3C;
+ color:#3C3C3C;
+}
+
+.light #separator{
+ border-bottom:1px solid #D8D8D8;
+}
+
+.light .gallery-icon-eye{
+ color:#898989;
+}
+
+.light .success-message{
+ background-color: #DBF6D7;
+ color: #6DCE5E !important;
+ border-left: 4px solid #6DCE5E;
+}
+
+.light .success-message i{
+ color:#6DCE5E;
+}
+
+.light .infos-message{
+ background-color: #bde5f8;
+ color: #00529b !important;
+ border-left: 4px solid #00529b;
+}
+
+.light input:checked + .slider {
+ background-color: #FFA646;
+}
+
+.light input:focus + .slider {
+ box-shadow: 0 0 1px #FFA646;
+}
+
+.light .slider {
+ background-color: #CCCCCC;
+}
+
+.light .api-list-body > div:nth-child(4n+1),
+.light .api-list-body > div:nth-child(4n+2) {
+ background-color: #F8F8F8;
+}
+
+.light .api-tab-line p,
+.light .api-icon-action i,
+.light .keys p:not(.api-copy),
+.light .keys i,
+.light #api_key_list_expired .api-skull {
+ color: #656565;
+}
+
+.light .close-modal {
+ color: #ffffff;
+}
+
+.light input[type="date"] {
+ color-scheme: light;
+}
+
+.light input[type="date"]::-webkit-calendar-picker-indicator {
+ filter: invert(0);
+}
+
+.light .btn-revoked {
+ background-color: #EB3223 !important;
+}
+
+/* Dark */
+#theIdentificationPage .dark,
+#theRegisterPage .dark,
+#thePasswordPage .dark,
+#theProfilePage .dark{
+ background: linear-gradient(75.69deg, #1B1B1D 7.64%, #2F2F2F 77.87%);
+}
+
+.dark #login-form,
+.dark #register-form,
+.dark #password-form,
+.dark .profile-section,
+.dark .body-modal {
+ background-color:#3C3C3C;
+}
+
+#theIdentificationPage .dark a,
+#theRegisterPage .dark a,
+#thePasswordPage .dark a,
+#theProfilePage .dark a:not(.close-modal).dark #header-options a,
+.dark #header-options .toggle-mode,
+.dark #selected-language-container{
+ color:#FFEBD0;
+}
+
+.dark h1,
+.dark .input-container input,
+.dark .input-modal input,
+.dark .input-container select,
+.dark .input-container textarea,
+.dark .secondary-links,
+.dark .properties label,
+.dark .profile-section label,
+.dark .properties i,
+.dark .profile-section i,
+.dark #password-form p,
+.dark .profile-section p,
+.dark #lang-select #other-languages span,
+.dark .btn-cancel,
+.dark .btn-link {
+ color:#D6D6D6;
+}
+
+#theIdentificationPage .dark a:hover,
+#theRegisterPage .dark a:hover,
+#thePasswordPage .dark a:hover,
+#theProfilePage .dark a:hover,
+.dark #lang-select #other-languages span{
+ color:#ff7700;
+}
+
+.dark .input-container,
+.dark .input-modal {
+ background-color:#303030;
+ border:1px solid #303030;
+}
+
+.dark .input-container input:is(:-webkit-autofill, :autofill)
+{
+ box-shadow: 0 0 0 100px #303030 inset;
+ -webkit-box-shadow: 0 0 0px 1000px #303030 inset !important;
+ -webkit-text-fill-color: #D6D6D6;
+ color:#D6D6D6;
+}
+
+.dark #separator{
+ border-bottom:1px solid #303030;
+}
+
+.dark .gallery-icon-eye{
+ color:#898989;
+}
+
+.dark #lang-select #other-languages,
+.dark .slider,
+.dark input:checked + .slider:before {
+ background-color: #3C3C3C;
+}
+
+.dark .success-message{
+ background-color: #4EA590;
+ color: #AAF6E4 !important;
+ border-left: 4px solid #AAF6E4;
+}
+
+.dark .success-message i{
+ color: #AAF6E4;
+}
+
+.dark .infos-message{
+ background-color: #4f71a4;
+ color: #bad6ff !important;
+ border-left: 4px solid #bad6ff;
+}
+
+.dark .btn-secondary {
+ background-color: #202020!important;
+ color: white!important;
+}
+
+.dark input:checked + .slider {
+ background-color: #FFA646;
+}
+
+.dark .slider:before {
+ background-color: #777777;
+}
+
+.dark .api-list-head,
+.dark [data-tooltip]:hover::after{
+ background-color: #2A2A2A;
+}
+
+.dark .api-list-body > div:nth-child(4n+1),
+.dark .api-list-body > div:nth-child(4n+2) {
+ background-color: #333333;
+}
+
+.dark .icon-collapse {
+ color: white !important;
+}
+
+.dark .close-modal {
+ color: #3C3C3C;
+}
+
+.dark input[type="date"] {
+ color-scheme: dark;
+}
+
+.dark input[type="date"]::-webkit-calendar-picker-indicator {
+ filter: invert(0);
+}
+
+.dark .btn-revoked {
+ background-color: #BE4949 !important;
+}
\ No newline at end of file
diff --git a/themes/standard_pages/skins/fuchsia.css b/themes/standard_pages/skins/fuchsia.css
new file mode 100644
index 000000000..fea32ef38
--- /dev/null
+++ b/themes/standard_pages/skins/fuchsia.css
@@ -0,0 +1,341 @@
+input[type='radio'] {
+ accent-color: #ff3363;
+}
+
+.input-container:focus-within,
+.input-modal:focus-within{
+ border:1px solid #ff3363!important;
+}
+
+.gallery-icon-checkmark {
+ border: 1px solid #777;
+}
+
+.btn-main{
+ background-color:#ff3363!important;
+ color:white!important;
+}
+
+.btn-secondary {
+ background-color: #ECECEC!important;
+ color: #3C3C3C!important;
+}
+
+.btn-main:disabled {
+ background-color:#aaaaaa!important;
+ color: #3C3C3C !important;
+}
+
+#separator{
+ border-bottom:1px solid #D8D8D8;
+}
+
+#lang-select #other-languages span:hover{
+ color:#ff3363;
+}
+
+.profile-section .api-icon-action i:hover,
+.close-modal:hover,
+.profile-section .icon-clone:hover {
+ color: #ff3363;
+}
+
+.profile-section div.api-tab-line:nth-child(even) {
+ background-color: #303030;
+}
+
+.profile-section #api_key_list .edit {
+ border: 1px solid #ff3363 !important;
+}
+
+.profile-section .new-apikey .btn-link{
+ color: #9A9A9A !important;
+}
+
+.bg-modal {
+ background-color: rgba(0,0,0,0.7);
+}
+
+.slider {
+ background-color: #ccc;
+}
+
+.slider:before {
+ background-color: white;
+}
+
+/* Light */
+#theIdentificationPage .light,
+#theRegisterPage .light,
+#thePasswordPage .light,
+#theProfilePage .light{
+ background: linear-gradient(75.69deg, #ffd6d8 7.64%, #fff0f3 77.87%);
+}
+
+.light #login-form,
+.light #register-form,
+.light #password-form,
+.light #lang-select #other-languages,
+.light .profile-section,
+.light .slider:before,
+.light .body-modal,
+.light [data-tooltip]:hover::after {
+ background-color:#ffffff;
+}
+
+#theIdentificationPage .light a,
+#theRegisterPage .light a,
+#thePasswordPage .light a,
+#theProfilePage .light a:not(.close-modal),
+.light h1,
+.light .input-container input,
+.light .input-modal input,
+.light .input-container select,
+.light .input-container textarea,
+.light .secondary-links,
+.light .properties label,
+.light .profile-section label,
+.light .properties i,
+.light .profile-section i,
+.light #password-form p,
+.light .profile-section p,
+.light #lang-select #other-languages span,
+.light .btn-cancel,
+.light .btn-link {
+ color:#3C3C3C;
+}
+
+#theIdentificationPage .light a:hover,
+#theRegisterPage .light a:hover,
+#thePasswordPage .light a:hover,
+#theProfilePage .light a:hover{
+ color:#ff3363;
+}
+
+.light #header-options a,
+.light #header-options .toggle-mode,
+.light #selected-language-container{
+ color:#ff3363;
+}
+
+.light .input-container,
+.light .input-modal,
+.light .api-list-head {
+ background-color:#F0F0F0;
+ border:1px solid #F0F0F0;
+}
+
+.light .input-container input:is(:-webkit-autofill, :autofill)
+{
+ box-shadow: 0 0 0 100px #F0F0F0 inset;
+ -webkit-box-shadow: 0 0 0px 1000px #F0F0F0 inset !important;
+ -webkit-text-fill-color: #3C3C3C;
+ color:#3C3C3C;
+}
+
+.light #separator{
+ border-bottom:1px solid #D8D8D8;
+}
+
+.light .gallery-icon-eye{
+ color:#898989;
+}
+
+.light .success-message{
+ background-color: #DBF6D7;
+ color: #6DCE5E !important;
+ border-left: 4px solid #6DCE5E;
+}
+
+.light .success-message i{
+ color:#6DCE5E;
+}
+
+.light .infos-message{
+ background-color: #bde5f8;
+ color: #00529b !important;
+ border-left: 4px solid #00529b;
+}
+
+.light input:checked + .slider {
+ background-color: #FFA646;
+}
+
+.light input:focus + .slider {
+ box-shadow: 0 0 1px #FFA646;
+}
+
+.light .slider {
+ background-color: #CCCCCC;
+}
+
+.light .api-list-body > div:nth-child(4n+1),
+.light .api-list-body > div:nth-child(4n+2) {
+ background-color: #F8F8F8;
+}
+
+.light .api-tab-line p,
+.light .api-icon-action i,
+.light .keys p:not(.api-copy),
+.light .keys i,
+.light #api_key_list_expired .api-skull {
+ color: #656565;
+}
+
+.light .close-modal {
+ color: #ffffff;
+}
+
+.light input[type="date"] {
+ color-scheme: light;
+}
+
+.light input[type="date"]::-webkit-calendar-picker-indicator {
+ filter: invert(0);
+}
+
+.light .btn-revoked {
+ background-color: #EB3223 !important;
+}
+
+/* Dark */
+#theIdentificationPage .dark,
+#theRegisterPage .dark,
+#thePasswordPage .dark,
+#theProfilePage .dark{
+ background: linear-gradient(75.69deg, #1B1B1D 7.64%, #2F2F2F 77.87%);
+}
+
+.dark #login-form,
+.dark #register-form,
+.dark #password-form,
+.dark .profile-section,
+.dark .body-modal {
+ background-color:#3C3C3C;
+}
+
+#theIdentificationPage .dark a,
+#theRegisterPage .dark a,
+#thePasswordPage .dark a,
+#theProfilePage .dark a:not(.close-modal){
+ color:#fff0f3;
+}
+
+.dark h1,
+.dark .input-container input,
+.dark .input-modal input,
+.dark .input-container select,
+.dark .input-container textarea,
+.dark .secondary-links,
+.dark .properties label,
+.dark .profile-section label,
+.dark .properties i,
+.dark .profile-section i,
+.dark #password-form p,
+.dark .profile-section p,
+.dark #lang-select #other-languages span,
+.dark .btn-cancel,
+.dark .btn-link {
+ color:#D6D6D6;
+}
+
+#theIdentificationPage .dark a:hover,
+#theRegisterPage .dark a:hover,
+#thePasswordPage .dark a:hover,
+#theProfilePage .dark a:hover,
+.dark #lang-select #other-languages span{
+ color:#ffd6d8;
+}
+
+.dark #header-options a,
+.dark #header-options .toggle-mode,
+.dark #selected-language-container{
+ color:#ffd6d8;
+}
+
+.dark .input-container,
+.dark .input-modal {
+ background-color:#303030;
+ border:1px solid #303030;
+}
+
+.dark .input-container input:is(:-webkit-autofill, :autofill)
+{
+ box-shadow: 0 0 0 100px #303030 inset;
+ -webkit-box-shadow: 0 0 0px 1000px #303030 inset !important;
+ -webkit-text-fill-color: #D6D6D6;
+ color:#D6D6D6;
+}
+
+.dark #separator{
+ border-bottom:1px solid #303030;
+}
+
+.dark .gallery-icon-eye{
+ color:#898989;
+}
+
+.dark #lang-select #other-languages,
+.dark .slider,
+.dark input:checked + .slider:before {
+ background-color: #3C3C3C;
+}
+
+.dark .success-message{
+ background-color: #4EA590;
+ color: #AAF6E4 !important;
+ border-left: 4px solid #AAF6E4;
+}
+
+.dark .success-message i{
+ color: #AAF6E4;
+}
+
+.dark .infos-message{
+ background-color: #4f71a4;
+ color: #bad6ff !important;
+ border-left: 4px solid #bad6ff;
+}
+
+.dark .btn-secondary {
+ background-color: #202020!important;
+ color: white!important;
+}
+
+.dark input:checked + .slider {
+ background-color: #FFA646;
+}
+
+.dark .slider:before {
+ background-color: #777777;
+}
+
+.dark .api-list-head,
+.dark [data-tooltip]:hover::after{
+ background-color: #2A2A2A;
+}
+
+.dark .api-list-body > div:nth-child(4n+1),
+.dark .api-list-body > div:nth-child(4n+2) {
+ background-color: #333333;
+}
+
+.dark .icon-collapse {
+ color: white !important;
+}
+
+.dark .close-modal {
+ color: #3C3C3C;
+}
+
+.dark input[type="date"] {
+ color-scheme: dark;
+}
+
+.dark input[type="date"]::-webkit-calendar-picker-indicator {
+ filter: invert(0);
+}
+
+.dark .btn-revoked {
+ background-color: #BE4949 !important;
+}
\ No newline at end of file
diff --git a/themes/standard_pages/skins/green.css b/themes/standard_pages/skins/green.css
new file mode 100644
index 000000000..9000e784e
--- /dev/null
+++ b/themes/standard_pages/skins/green.css
@@ -0,0 +1,343 @@
+input[type='radio'] {
+ accent-color: #4cae4f;
+}
+
+.input-container:focus-within,
+.input-modal:focus-within{
+ border:1px solid #4cae4f!important;
+}
+
+.gallery-icon-checkmark {
+ border: 1px solid #777;
+}
+
+.btn-main{
+ background-color:#4cae4f!important;
+ color:white!important;
+}
+
+.btn-secondary {
+ background-color: #ECECEC!important;
+ color: #3C3C3C!important;
+}
+
+.btn-main:disabled {
+ background-color:#aaaaaa!important;
+ color: #3C3C3C !important;
+}
+
+#separator{
+ border-bottom:1px solid #D8D8D8;
+}
+
+#lang-select #other-languages span:hover{
+ color:#4cae4f;
+}
+
+.profile-section .api-icon-action i:hover,
+.close-modal:hover,
+.profile-section .icon-clone:hover {
+ color: #4cae4f;
+}
+
+.profile-section div.api-tab-line:nth-child(even) {
+ background-color: #303030;
+}
+
+.profile-section #api_key_list .edit {
+ border: 1px solid #4cae4f !important;
+}
+
+.profile-section .new-apikey .btn-link{
+ color: #9A9A9A !important;
+}
+
+.bg-modal {
+ background-color: rgba(0,0,0,0.7);
+}
+
+.slider {
+ background-color: #ccc;
+}
+
+.slider:before {
+ background-color: white;
+}
+
+
+
+/* Light */
+#theIdentificationPage .light,
+#theRegisterPage .light,
+#thePasswordPage .light,
+#theProfilePage .light{
+ background: linear-gradient(75.69deg, #a7d69f 7.64%, #e2f8e6 77.87%);
+}
+
+.light #login-form,
+.light #register-form,
+.light #password-form,
+.light #lang-select #other-languages,
+.light .profile-section,
+.light .slider:before,
+.light .body-modal,
+.light [data-tooltip]:hover::after {
+ background-color:#ffffff;
+}
+
+#theIdentificationPage .light a,
+#theRegisterPage .light a,
+#thePasswordPage .light a,
+#theProfilePage .light a:not(.close-modal),
+.light h1,
+.light .input-container input,
+.light .input-modal input,
+.light .input-container select,
+.light .input-container textarea,
+.light .secondary-links,
+.light .properties label,
+.light .profile-section label,
+.light .properties i,
+.light .profile-section i,
+.light #password-form p,
+.light .profile-section p,
+.light #lang-select #other-languages span,
+.light .btn-cancel,
+.light .btn-link {
+ color:#3C3C3C;
+}
+
+#theIdentificationPage .light a:hover,
+#theRegisterPage .light a:hover,
+#thePasswordPage .light a:hover,
+#theProfilePage .light a:hover{
+ color:#4cae4f;
+}
+
+.light #header-options a,
+.light #header-options .toggle-mode,
+.light #selected-language-container{
+ color:#4cae4f;
+}
+
+.light .input-container,
+.light .input-modal,
+.light .api-list-head {
+ background-color:#F0F0F0;
+ border:1px solid #F0F0F0;
+}
+
+.light .input-container input:is(:-webkit-autofill, :autofill)
+{
+ box-shadow: 0 0 0 100px #F0F0F0 inset;
+ -webkit-box-shadow: 0 0 0px 1000px #F0F0F0 inset !important;
+ -webkit-text-fill-color: #3C3C3C;
+ color:#3C3C3C;
+}
+
+.light #separator{
+ border-bottom:1px solid #D8D8D8;
+}
+
+.light .gallery-icon-eye{
+ color:#898989;
+}
+
+.light .success-message{
+ background-color: #DBF6D7;
+ color: #6DCE5E !important;
+ border-left: 4px solid #6DCE5E;
+}
+
+.light .success-message i{
+ color:#6DCE5E;
+}
+
+.light .infos-message{
+ background-color: #bde5f8;
+ color: #00529b !important;
+ border-left: 4px solid #00529b;
+}
+
+.light input:checked + .slider {
+ background-color: #FFA646;
+}
+
+.light input:focus + .slider {
+ box-shadow: 0 0 1px #FFA646;
+}
+
+.light .slider {
+ background-color: #CCCCCC;
+}
+
+.light .api-list-body > div:nth-child(4n+1),
+.light .api-list-body > div:nth-child(4n+2) {
+ background-color: #F8F8F8;
+}
+
+.light .api-tab-line p,
+.light .api-icon-action i,
+.light .keys p:not(.api-copy),
+.light .keys i,
+.light #api_key_list_expired .api-skull {
+ color: #656565;
+}
+
+.light .close-modal {
+ color: #ffffff;
+}
+
+.light input[type="date"] {
+ color-scheme: light;
+}
+
+.light input[type="date"]::-webkit-calendar-picker-indicator {
+ filter: invert(0);
+}
+
+.light .btn-revoked {
+ background-color: #EB3223 !important;
+}
+
+/* Dark */
+#theIdentificationPage .dark,
+#theRegisterPage .dark,
+#thePasswordPage .dark,
+#theProfilePage .dark{
+ background: linear-gradient(75.69deg, #1B1B1D 7.64%, #2F2F2F 77.87%);
+}
+
+.dark #login-form,
+.dark #register-form,
+.dark #password-form,
+.dark .profile-section,
+.dark .body-modal {
+ background-color:#3C3C3C;
+}
+
+#theIdentificationPage .dark a,
+#theRegisterPage .dark a,
+#thePasswordPage .dark a,
+#theProfilePage .dark a:not(.close-modal){
+ color:#a7d69f;
+}
+
+.dark h1,
+.dark .input-container input,
+.dark .input-modal input,
+.dark .input-container select,
+.dark .input-container textarea,
+.dark .secondary-links,
+.dark .properties label,
+.dark .profile-section label,
+.dark .properties i,
+.dark .profile-section i,
+.dark #password-form p,
+.dark .profile-section p,
+.dark #lang-select #other-languages span,
+.dark .btn-cancel,
+.dark .btn-link {
+ color:#D6D6D6;
+}
+
+#theIdentificationPage .dark a:hover,
+#theRegisterPage .dark a:hover,
+#thePasswordPage .dark a:hover,
+#theProfilePage .dark a:hover,
+.dark #lang-select #other-languages span{
+ color:#4cae4f;
+}
+
+.dark #header-options a,
+.dark #header-options .toggle-mode,
+.dark #selected-language-container{
+ color:#e2f8e6;
+}
+
+.dark .input-container,
+.dark .input-modal {
+ background-color:#303030;
+ border:1px solid #303030;
+}
+
+.dark .input-container input:is(:-webkit-autofill, :autofill)
+{
+ box-shadow: 0 0 0 100px #303030 inset;
+ -webkit-box-shadow: 0 0 0px 1000px #303030 inset !important;
+ -webkit-text-fill-color: #D6D6D6;
+ color:#D6D6D6;
+}
+
+.dark #separator{
+ border-bottom:1px solid #303030;
+}
+
+.dark .gallery-icon-eye{
+ color:#898989;
+}
+
+.dark #lang-select #other-languages,
+.dark .slider,
+.dark input:checked + .slider:before {
+ background-color: #3C3C3C;
+}
+
+.dark .success-message{
+ background-color: #4EA590;
+ color: #AAF6E4 !important;
+ border-left: 4px solid #AAF6E4;
+}
+
+.dark .success-message i{
+ color: #AAF6E4;
+}
+
+.dark .infos-message{
+ background-color: #4f71a4;
+ color: #bad6ff !important;
+ border-left: 4px solid #bad6ff;
+}
+
+.dark .btn-secondary {
+ background-color: #202020!important;
+ color: white!important;
+}
+
+.dark input:checked + .slider {
+ background-color: #FFA646;
+}
+
+.dark .slider:before {
+ background-color: #777777;
+}
+
+.dark .api-list-head,
+.dark [data-tooltip]:hover::after{
+ background-color: #2A2A2A;
+}
+
+.dark .api-list-body > div:nth-child(4n+1),
+.dark .api-list-body > div:nth-child(4n+2) {
+ background-color: #333333;
+}
+
+.dark .icon-collapse {
+ color: white !important;
+}
+
+.dark .close-modal {
+ color: #3C3C3C;
+}
+
+.dark input[type="date"] {
+ color-scheme: dark;
+}
+
+.dark input[type="date"]::-webkit-calendar-picker-indicator {
+ filter: invert(0);
+}
+
+.dark .btn-revoked {
+ background-color: #BE4949 !important;
+}
\ No newline at end of file
diff --git a/themes/standard_pages/skins/light-cadmium.jpg b/themes/standard_pages/skins/light-cadmium.jpg
new file mode 100644
index 000000000..b5e0a4334
Binary files /dev/null and b/themes/standard_pages/skins/light-cadmium.jpg differ
diff --git a/themes/standard_pages/skins/light-cobalt.jpg b/themes/standard_pages/skins/light-cobalt.jpg
new file mode 100644
index 000000000..859035d1e
Binary files /dev/null and b/themes/standard_pages/skins/light-cobalt.jpg differ
diff --git a/themes/standard_pages/skins/light-default.jpg b/themes/standard_pages/skins/light-default.jpg
new file mode 100644
index 000000000..672a660ca
Binary files /dev/null and b/themes/standard_pages/skins/light-default.jpg differ
diff --git a/themes/standard_pages/skins/light-fuchsia.jpg b/themes/standard_pages/skins/light-fuchsia.jpg
new file mode 100644
index 000000000..afcaded8f
Binary files /dev/null and b/themes/standard_pages/skins/light-fuchsia.jpg differ
diff --git a/themes/standard_pages/skins/light-green.jpg b/themes/standard_pages/skins/light-green.jpg
new file mode 100644
index 000000000..0664a73f0
Binary files /dev/null and b/themes/standard_pages/skins/light-green.jpg differ
diff --git a/themes/standard_pages/skins/light-lime.jpg b/themes/standard_pages/skins/light-lime.jpg
new file mode 100644
index 000000000..657fba080
Binary files /dev/null and b/themes/standard_pages/skins/light-lime.jpg differ
diff --git a/themes/standard_pages/skins/light-purple.jpg b/themes/standard_pages/skins/light-purple.jpg
new file mode 100644
index 000000000..17282e441
Binary files /dev/null and b/themes/standard_pages/skins/light-purple.jpg differ
diff --git a/themes/standard_pages/skins/light-red.jpg b/themes/standard_pages/skins/light-red.jpg
new file mode 100644
index 000000000..8a7db68f1
Binary files /dev/null and b/themes/standard_pages/skins/light-red.jpg differ
diff --git a/themes/standard_pages/skins/light-sienna.jpg b/themes/standard_pages/skins/light-sienna.jpg
new file mode 100644
index 000000000..bc0acba5f
Binary files /dev/null and b/themes/standard_pages/skins/light-sienna.jpg differ
diff --git a/themes/standard_pages/skins/light-silver.jpg b/themes/standard_pages/skins/light-silver.jpg
new file mode 100644
index 000000000..33ef6b7a4
Binary files /dev/null and b/themes/standard_pages/skins/light-silver.jpg differ
diff --git a/themes/standard_pages/skins/light-teal.jpg b/themes/standard_pages/skins/light-teal.jpg
new file mode 100644
index 000000000..5db43e51a
Binary files /dev/null and b/themes/standard_pages/skins/light-teal.jpg differ
diff --git a/themes/standard_pages/skins/lime.css b/themes/standard_pages/skins/lime.css
new file mode 100644
index 000000000..827b43c7f
--- /dev/null
+++ b/themes/standard_pages/skins/lime.css
@@ -0,0 +1,341 @@
+input[type='radio'] {
+ accent-color: #a8d600;
+}
+
+.input-container:focus-within,
+.input-modal:focus-within{
+ border:1px solid #a8d600!important;
+}
+
+.gallery-icon-checkmark {
+ border: 1px solid #777;
+}
+
+.btn-main{
+ background-color:#a8d600!important;
+ color:black!important;
+}
+
+.btn-secondary {
+ background-color: #ECECEC!important;
+ color: #3C3C3C!important;
+}
+
+.btn-main:disabled {
+ background-color:#aaaaaa!important;
+ color: #3C3C3C !important;
+}
+
+#separator{
+ border-bottom:1px solid #D8D8D8;
+}
+
+#lang-select #other-languages span:hover{
+ color:#a8d600;
+}
+
+.profile-section .api-icon-action i:hover,
+.close-modal:hover,
+.profile-section .icon-clone:hover {
+ color: #a8d600;
+}
+
+.profile-section div.api-tab-line:nth-child(even) {
+ background-color: #303030;
+}
+
+.profile-section #api_key_list .edit {
+ border: 1px solid #a8d600 !important;
+}
+
+.profile-section .new-apikey .btn-link{
+ color: #9A9A9A !important;
+}
+
+.bg-modal {
+ background-color: rgba(0,0,0,0.7);
+}
+
+.slider {
+ background-color: #ccc;
+}
+
+.slider:before {
+ background-color: white;
+}
+
+/* Light */
+#theIdentificationPage .light,
+#theRegisterPage .light,
+#thePasswordPage .light,
+#theProfilePage .light{
+ background: linear-gradient(75.69deg, #F0FFB8 7.64%, #F9FFE6 77.87%);
+}
+
+.light #login-form,
+.light #register-form,
+.light #password-form,
+.light #lang-select #other-languages,
+.light .profile-section,
+.light .slider:before,
+.light .body-modal,
+.light [data-tooltip]:hover::after {
+ background-color:#ffffff;
+}
+
+#theIdentificationPage .light a,
+#theRegisterPage .light a,
+#thePasswordPage .light a,
+#theProfilePage .light a:not(.close-modal),
+.light h1,
+.light .input-container input,
+.light .input-modal input,
+.light .input-container select,
+.light .input-container textarea,
+.light .secondary-links,
+.light .properties label,
+.light .profile-section label,
+.light .properties i,
+.light .profile-section i,
+.light #password-form p,
+.light .profile-section p,
+.light #lang-select #other-languages span,
+.light .btn-cancel,
+.light .btn-link {
+ color:#3C3C3C;
+}
+
+#theIdentificationPage .light a:hover,
+#theRegisterPage .light a:hover,
+#thePasswordPage .light a:hover,
+#theProfilePage .light a:hover{
+ color:#a8d600;
+}
+
+.light #header-options a,
+.light #header-options .toggle-mode,
+.light #selected-language-container{
+ color:#a8d600;
+}
+
+.light .input-container,
+.light .input-modal,
+.light .api-list-head {
+ background-color:#F0F0F0;
+ border:1px solid #F0F0F0;
+}
+
+.light .input-container input:is(:-webkit-autofill, :autofill)
+{
+ box-shadow: 0 0 0 100px #F0F0F0 inset;
+ -webkit-box-shadow: 0 0 0px 1000px #F0F0F0 inset !important;
+ -webkit-text-fill-color: #3C3C3C;
+ color:#3C3C3C;
+}
+
+.light #separator{
+ border-bottom:1px solid #D8D8D8;
+}
+
+.light .gallery-icon-eye{
+ color:#898989;
+}
+
+.light .success-message{
+ background-color: #DBF6D7;
+ color: #6DCE5E !important;
+ border-left: 4px solid #6DCE5E;
+}
+
+.light .success-message i{
+ color:#6DCE5E;
+}
+
+.light .infos-message{
+ background-color: #bde5f8;
+ color: #00529b !important;
+ border-left: 4px solid #00529b;
+}
+
+.light input:checked + .slider {
+ background-color: #FFA646;
+}
+
+.light input:focus + .slider {
+ box-shadow: 0 0 1px #FFA646;
+}
+
+.light .slider {
+ background-color: #CCCCCC;
+}
+
+.light .api-list-body > div:nth-child(4n+1),
+.light .api-list-body > div:nth-child(4n+2) {
+ background-color: #F8F8F8;
+}
+
+.light .api-tab-line p,
+.light .api-icon-action i,
+.light .keys p:not(.api-copy),
+.light .keys i,
+.light #api_key_list_expired .api-skull {
+ color: #656565;
+}
+
+.light .close-modal {
+ color: #ffffff;
+}
+
+.light input[type="date"] {
+ color-scheme: light;
+}
+
+.light input[type="date"]::-webkit-calendar-picker-indicator {
+ filter: invert(0);
+}
+
+.light .btn-revoked {
+ background-color: #EB3223 !important;
+}
+
+/* Dark */
+#theIdentificationPage .dark,
+#theRegisterPage .dark,
+#thePasswordPage .dark,
+#theProfilePage .dark{
+ background: linear-gradient(75.69deg, #1B1B1D 7.64%, #2F2F2F 77.87%);
+}
+
+.dark #login-form,
+.dark #register-form,
+.dark #password-form,
+.dark .profile-section,
+.dark .body-modal {
+ background-color:#3C3C3C;
+}
+
+#theIdentificationPage .dark a,
+#theRegisterPage .dark a,
+#thePasswordPage .dark a,
+#theProfilePage .dark a:not(.close-modal){
+ color:#F0FFB8;
+}
+
+.dark h1,
+.dark .input-container input,
+.dark .input-modal input,
+.dark .input-container select,
+.dark .input-container textarea,
+.dark .secondary-links,
+.dark .properties label,
+.dark .profile-section label,
+.dark .properties i,
+.dark .profile-section i,
+.dark #password-form p,
+.dark .profile-section p,
+.dark #lang-select #other-languages span,
+.dark .btn-cancel,
+.dark .btn-link {
+ color:#D6D6D6;
+}
+
+#theIdentificationPage .dark a:hover,
+#theRegisterPage .dark a:hover,
+#thePasswordPage .dark a:hover,
+#theProfilePage .dark a:hover,
+.dark #lang-select #other-languages span{
+ color:#F0FFB8;
+}
+
+.dark #header-options a,
+.dark #header-options .toggle-mode,
+.dark #selected-language-container{
+ color:#F0FFB8;
+}
+
+.dark .input-container,
+.dark .input-modal {
+ background-color:#303030;
+ border:1px solid #303030;
+}
+
+.dark .input-container input:is(:-webkit-autofill, :autofill)
+{
+ box-shadow: 0 0 0 100px #303030 inset;
+ -webkit-box-shadow: 0 0 0px 1000px #303030 inset !important;
+ -webkit-text-fill-color: #D6D6D6;
+ color:#D6D6D6;
+}
+
+.dark #separator{
+ border-bottom:1px solid #303030;
+}
+
+.dark .gallery-icon-eye{
+ color:#898989;
+}
+
+.dark #lang-select #other-languages,
+.dark .slider,
+.dark input:checked + .slider:before {
+ background-color: #3C3C3C;
+}
+
+.dark .success-message{
+ background-color: #4EA590;
+ color: #AAF6E4 !important;
+ border-left: 4px solid #AAF6E4;
+}
+
+.dark .success-message i{
+ color: #AAF6E4;
+}
+
+.dark .infos-message{
+ background-color: #4f71a4;
+ color: #bad6ff !important;
+ border-left: 4px solid #bad6ff;
+}
+
+.dark .btn-secondary {
+ background-color: #202020!important;
+ color: white!important;
+}
+
+.dark input:checked + .slider {
+ background-color: #FFA646;
+}
+
+.dark .slider:before {
+ background-color: #777777;
+}
+
+.dark .api-list-head,
+.dark [data-tooltip]:hover::after{
+ background-color: #2A2A2A;
+}
+
+.dark .api-list-body > div:nth-child(4n+1),
+.dark .api-list-body > div:nth-child(4n+2) {
+ background-color: #333333;
+}
+
+.dark .icon-collapse {
+ color: white !important;
+}
+
+.dark .close-modal {
+ color: #3C3C3C;
+}
+
+.dark input[type="date"] {
+ color-scheme: dark;
+}
+
+.dark input[type="date"]::-webkit-calendar-picker-indicator {
+ filter: invert(0);
+}
+
+.dark .btn-revoked {
+ background-color: #BE4949 !important;
+}
\ No newline at end of file
diff --git a/themes/standard_pages/skins/purple.css b/themes/standard_pages/skins/purple.css
new file mode 100644
index 000000000..01f479510
--- /dev/null
+++ b/themes/standard_pages/skins/purple.css
@@ -0,0 +1,343 @@
+input[type='radio'] {
+ accent-color: #800080;
+}
+
+.input-container:focus-within,
+.input-modal:focus-within{
+ border:1px solid #800080!important;
+}
+
+.gallery-icon-checkmark {
+ border: 1px solid #777;
+}
+
+.btn-main{
+ background-color:#800080!important;
+ color:white!important;
+}
+
+.btn-secondary {
+ background-color: #ECECEC!important;
+ color: #3C3C3C!important;
+}
+
+.btn-main:disabled {
+ background-color:#aaaaaa!important;
+ color: #3C3C3C !important;
+}
+
+#separator{
+ border-bottom:1px solid #D8D8D8;
+}
+
+#lang-select #other-languages span:hover{
+ color:#800080;
+}
+
+.profile-section .api-icon-action i:hover,
+.close-modal:hover,
+.profile-section .icon-clone:hover {
+ color: #800080;
+}
+
+.profile-section div.api-tab-line:nth-child(even) {
+ background-color: #303030;
+}
+
+.profile-section #api_key_list .edit {
+ border: 1px solid #800080 !important;
+}
+
+.profile-section .new-apikey .btn-link{
+ color: #9A9A9A !important;
+}
+
+.bg-modal {
+ background-color: rgba(0,0,0,0.7);
+}
+
+.slider {
+ background-color: #ccc;
+}
+
+.slider:before {
+ background-color: white;
+}
+
+
+
+/* Light */
+#theIdentificationPage .light,
+#theRegisterPage .light,
+#thePasswordPage .light,
+#theProfilePage .light{
+ background: linear-gradient(75.69deg, #c7b2e6 7.64%, #e1d4f2 77.87%);
+}
+
+.light #login-form,
+.light #register-form,
+.light #password-form,
+.light #lang-select #other-languages,
+.light .profile-section,
+.light .slider:before,
+.light .body-modal,
+.light [data-tooltip]:hover::after {
+ background-color:#ffffff;
+}
+
+#theIdentificationPage .light a,
+#theRegisterPage .light a,
+#thePasswordPage .light a,
+#theProfilePage .light a:not(.close-modal),
+.light h1,
+.light .input-container input,
+.light .input-modal input,
+.light .input-container select,
+.light .input-container textarea,
+.light .secondary-links,
+.light .properties label,
+.light .profile-section label,
+.light .properties i,
+.light .profile-section i,
+.light #password-form p,
+.light .profile-section p,
+.light #lang-select #other-languages span,
+.light .btn-cancel,
+.light .btn-link {
+ color:#3C3C3C;
+}
+
+#theIdentificationPage .light a:hover,
+#theRegisterPage .light a:hover,
+#thePasswordPage .light a:hover,
+#theProfilePage .light a:hover{
+ color:#800080;
+}
+
+.light #header-options a,
+.light #header-options .toggle-mode,
+.light #selected-language-container{
+ color:#800080;
+}
+
+.light .input-container,
+.light .input-modal,
+.light .api-list-head {
+ background-color:#F0F0F0;
+ border:1px solid #F0F0F0;
+}
+
+.light .input-container input:is(:-webkit-autofill, :autofill)
+{
+ box-shadow: 0 0 0 100px #F0F0F0 inset;
+ -webkit-box-shadow: 0 0 0px 1000px #F0F0F0 inset !important;
+ -webkit-text-fill-color: #3C3C3C;
+ color:#3C3C3C;
+}
+
+.light #separator{
+ border-bottom:1px solid #D8D8D8;
+}
+
+.light .gallery-icon-eye{
+ color:#898989;
+}
+
+.light .success-message{
+ background-color: #DBF6D7;
+ color: #6DCE5E !important;
+ border-left: 4px solid #6DCE5E;
+}
+
+.light .success-message i{
+ color:#6DCE5E;
+}
+
+.light .infos-message{
+ background-color: #bde5f8;
+ color: #00529b !important;
+ border-left: 4px solid #00529b;
+}
+
+.light input:checked + .slider {
+ background-color: #FFA646;
+}
+
+.light input:focus + .slider {
+ box-shadow: 0 0 1px #FFA646;
+}
+
+.light .slider {
+ background-color: #CCCCCC;
+}
+
+.light .api-list-body > div:nth-child(4n+1),
+.light .api-list-body > div:nth-child(4n+2) {
+ background-color: #F8F8F8;
+}
+
+.light .api-tab-line p,
+.light .api-icon-action i,
+.light .keys p:not(.api-copy),
+.light .keys i,
+.light #api_key_list_expired .api-skull {
+ color: #656565;
+}
+
+.light .close-modal {
+ color: #ffffff;
+}
+
+.light input[type="date"] {
+ color-scheme: light;
+}
+
+.light input[type="date"]::-webkit-calendar-picker-indicator {
+ filter: invert(0);
+}
+
+.light .btn-revoked {
+ background-color: #EB3223 !important;
+}
+
+/* Dark */
+#theIdentificationPage .dark,
+#theRegisterPage .dark,
+#thePasswordPage .dark,
+#theProfilePage .dark{
+ background: linear-gradient(75.69deg, #1B1B1D 7.64%, #2F2F2F 77.87%);
+}
+
+.dark #login-form,
+.dark #register-form,
+.dark #password-form,
+.dark .profile-section,
+.dark .body-modal {
+ background-color:#3C3C3C;
+}
+
+#theIdentificationPage .dark a,
+#theRegisterPage .dark a,
+#thePasswordPage .dark a,
+#theProfilePage .dark a:not(.close-modal){
+ color:#e6d8f3;
+}
+
+.dark h1,
+.dark .input-container input,
+.dark .input-modal input,
+.dark .input-container select,
+.dark .input-container textarea,
+.dark .secondary-links,
+.dark .properties label,
+.dark .profile-section label,
+.dark .properties i,
+.dark .profile-section i,
+.dark #password-form p,
+.dark .profile-section p,
+.dark #lang-select #other-languages span,
+.dark .btn-cancel,
+.dark .btn-link {
+ color:#D6D6D6;
+}
+
+#theIdentificationPage .dark a:hover,
+#theRegisterPage .dark a:hover,
+#thePasswordPage .dark a:hover,
+#theProfilePage .dark a:hover,
+.dark #lang-select #other-languages span{
+ color:#c9b2e1;
+}
+
+.dark #header-options a,
+.dark #header-options .toggle-mode,
+.dark #selected-language-container{
+ color:#e6d8f3;
+}
+
+.dark .input-container,
+.dark .input-modal {
+ background-color:#303030;
+ border:1px solid #303030;
+}
+
+.dark .input-container input:is(:-webkit-autofill, :autofill)
+{
+ box-shadow: 0 0 0 100px #303030 inset;
+ -webkit-box-shadow: 0 0 0px 1000px #303030 inset !important;
+ -webkit-text-fill-color: #D6D6D6;
+ color:#D6D6D6;
+}
+
+.dark #separator{
+ border-bottom:1px solid #303030;
+}
+
+.dark .gallery-icon-eye{
+ color:#898989;
+}
+
+.dark #lang-select #other-languages,
+.dark .slider,
+.dark input:checked + .slider:before {
+ background-color: #3C3C3C;
+}
+
+.dark .success-message{
+ background-color: #4EA590;
+ color: #AAF6E4 !important;
+ border-left: 4px solid #AAF6E4;
+}
+
+.dark .success-message i{
+ color: #AAF6E4;
+}
+
+.dark .infos-message{
+ background-color: #4f71a4;
+ color: #bad6ff !important;
+ border-left: 4px solid #bad6ff;
+}
+
+.dark .btn-secondary {
+ background-color: #202020!important;
+ color: white!important;
+}
+
+.dark input:checked + .slider {
+ background-color: #FFA646;
+}
+
+.dark .slider:before {
+ background-color: #777777;
+}
+
+.dark .api-list-head,
+.dark [data-tooltip]:hover::after{
+ background-color: #2A2A2A;
+}
+
+.dark .api-list-body > div:nth-child(4n+1),
+.dark .api-list-body > div:nth-child(4n+2) {
+ background-color: #333333;
+}
+
+.dark .icon-collapse {
+ color: white !important;
+}
+
+.dark .close-modal {
+ color: #3C3C3C;
+}
+
+.dark input[type="date"] {
+ color-scheme: dark;
+}
+
+.dark input[type="date"]::-webkit-calendar-picker-indicator {
+ filter: invert(0);
+}
+
+.dark .btn-revoked {
+ background-color: #BE4949 !important;
+}
\ No newline at end of file
diff --git a/themes/standard_pages/skins/red.css b/themes/standard_pages/skins/red.css
new file mode 100644
index 000000000..2479b4b13
--- /dev/null
+++ b/themes/standard_pages/skins/red.css
@@ -0,0 +1,341 @@
+input[type='radio'] {
+ accent-color: #d33131;
+}
+
+.input-container:focus-within,
+.input-modal:focus-within{
+ border:1px solid #d33131!important;
+}
+
+.gallery-icon-checkmark {
+ border: 1px solid #777;
+}
+
+.btn-main{
+ background-color:#d33131!important;
+ color:white!important;
+}
+
+.btn-secondary {
+ background-color: #ECECEC!important;
+ color: #3C3C3C!important;
+}
+
+.btn-main:disabled {
+ background-color:#aaaaaa!important;
+ color: #3C3C3C !important;
+}
+
+#separator{
+ border-bottom:1px solid #D8D8D8;
+}
+
+#lang-select #other-languages span:hover{
+ color:#d33131;
+}
+
+.profile-section .api-icon-action i:hover,
+.close-modal:hover,
+.profile-section .icon-clone:hover {
+ color: #d33131;
+}
+
+.profile-section div.api-tab-line:nth-child(even) {
+ background-color: #303030;
+}
+
+.profile-section #api_key_list .edit {
+ border: 1px solid #d33131 !important;
+}
+
+.profile-section .new-apikey .btn-link{
+ color: #9A9A9A !important;
+}
+
+.bg-modal {
+ background-color: rgba(0,0,0,0.7);
+}
+
+.slider {
+ background-color: #ccc;
+}
+
+.slider:before {
+ background-color: white;
+}
+
+/* Light */
+#theIdentificationPage .light,
+#theRegisterPage .light,
+#thePasswordPage .light,
+#theProfilePage .light{
+ background: linear-gradient(75.69deg, #ef9a9a 7.64%, #FBEAEA 77.87%);
+}
+
+.light #login-form,
+.light #register-form,
+.light #password-form,
+.light #lang-select #other-languages,
+.light .profile-section,
+.light .slider:before,
+.light .body-modal,
+.light [data-tooltip]:hover::after {
+ background-color:#ffffff;
+}
+
+#theIdentificationPage .light a,
+#theRegisterPage .light a,
+#thePasswordPage .light a,
+#theProfilePage .light a:not(.close-modal),
+.light h1,
+.light .input-container input,
+.light .input-modal input,
+.light .input-container select,
+.light .input-container textarea,
+.light .secondary-links,
+.light .properties label,
+.light .profile-section label,
+.light .properties i,
+.light .profile-section i,
+.light #password-form p,
+.light .profile-section p,
+.light #lang-select #other-languages span,
+.light .btn-cancel,
+.light .btn-link {
+ color:#3C3C3C;
+}
+
+#theIdentificationPage .light a:hover,
+#theRegisterPage .light a:hover,
+#thePasswordPage .light a:hover,
+#theProfilePage .light a:hover{
+ color:#d33131;
+}
+
+.light #header-options a,
+.light #header-options .toggle-mode,
+.light #selected-language-container{
+ color:#d33131;
+}
+
+.light .input-container,
+.light .input-modal,
+.light .api-list-head {
+ background-color:#F0F0F0;
+ border:1px solid #F0F0F0;
+}
+
+.light .input-container input:is(:-webkit-autofill, :autofill)
+{
+ box-shadow: 0 0 0 100px #F0F0F0 inset;
+ -webkit-box-shadow: 0 0 0px 1000px #F0F0F0 inset !important;
+ -webkit-text-fill-color: #3C3C3C;
+ color:#3C3C3C;
+}
+
+.light #separator{
+ border-bottom:1px solid #D8D8D8;
+}
+
+.light .gallery-icon-eye{
+ color:#898989;
+}
+
+.light .success-message{
+ background-color: #DBF6D7;
+ color: #6DCE5E !important;
+ border-left: 4px solid #6DCE5E;
+}
+
+.light .success-message i{
+ color:#6DCE5E;
+}
+
+.light .infos-message{
+ background-color: #bde5f8;
+ color: #00529b !important;
+ border-left: 4px solid #00529b;
+}
+
+.light input:checked + .slider {
+ background-color: #FFA646;
+}
+
+.light input:focus + .slider {
+ box-shadow: 0 0 1px #FFA646;
+}
+
+.light .slider {
+ background-color: #CCCCCC;
+}
+
+.light .api-list-body > div:nth-child(4n+1),
+.light .api-list-body > div:nth-child(4n+2) {
+ background-color: #F8F8F8;
+}
+
+.light .api-tab-line p,
+.light .api-icon-action i,
+.light .keys p:not(.api-copy),
+.light .keys i,
+.light #api_key_list_expired .api-skull {
+ color: #656565;
+}
+
+.light .close-modal {
+ color: #ffffff;
+}
+
+.light input[type="date"] {
+ color-scheme: light;
+}
+
+.light input[type="date"]::-webkit-calendar-picker-indicator {
+ filter: invert(0);
+}
+
+.light .btn-revoked {
+ background-color: #EB3223 !important;
+}
+
+/* Dark */
+#theIdentificationPage .dark,
+#theRegisterPage .dark,
+#thePasswordPage .dark,
+#theProfilePage .dark{
+ background: linear-gradient(75.69deg, #1B1B1D 7.64%, #2F2F2F 77.87%);
+}
+
+.dark #login-form,
+.dark #register-form,
+.dark #password-form,
+.dark .profile-section,
+.dark .body-modal {
+ background-color:#3C3C3C;
+}
+
+#theIdentificationPage .dark a,
+#theRegisterPage .dark a,
+#thePasswordPage .dark a,
+#theProfilePage .dark a:not(.close-modal){
+ color:#ef9a9a;
+}
+
+.dark h1,
+.dark .input-container input,
+.dark .input-modal input,
+.dark .input-container select,
+.dark .input-container textarea,
+.dark .secondary-links,
+.dark .properties label,
+.dark .profile-section label,
+.dark .properties i,
+.dark .profile-section i,
+.dark #password-form p,
+.dark .profile-section p,
+.dark #lang-select #other-languages span,
+.dark .btn-cancel,
+.dark .btn-link {
+ color:#D6D6D6;
+}
+
+#theIdentificationPage .dark a:hover,
+#theRegisterPage .dark a:hover,
+#thePasswordPage .dark a:hover,
+#theProfilePage .dark a:hover,
+.dark #lang-select #other-languages span{
+ color:#FBEAEA;
+}
+
+.dark #header-options a,
+.dark #header-options .toggle-mode,
+.dark #selected-language-container{
+ color:#ef9a9a;
+}
+
+.dark .input-container,
+.dark .input-modal {
+ background-color:#303030;
+ border:1px solid #303030;
+}
+
+.dark .input-container input:is(:-webkit-autofill, :autofill)
+{
+ box-shadow: 0 0 0 100px #303030 inset;
+ -webkit-box-shadow: 0 0 0px 1000px #303030 inset !important;
+ -webkit-text-fill-color: #D6D6D6;
+ color:#D6D6D6;
+}
+
+.dark #separator{
+ border-bottom:1px solid #303030;
+}
+
+.dark .gallery-icon-eye{
+ color:#898989;
+}
+
+.dark #lang-select #other-languages,
+.dark .slider,
+.dark input:checked + .slider:before {
+ background-color: #3C3C3C;
+}
+
+.dark .success-message{
+ background-color: #4EA590;
+ color: #AAF6E4 !important;
+ border-left: 4px solid #AAF6E4;
+}
+
+.dark .success-message i{
+ color: #AAF6E4;
+}
+
+.dark .infos-message{
+ background-color: #4f71a4;
+ color: #bad6ff !important;
+ border-left: 4px solid #bad6ff;
+}
+
+.dark .btn-secondary {
+ background-color: #202020!important;
+ color: white!important;
+}
+
+.dark input:checked + .slider {
+ background-color: #FFA646;
+}
+
+.dark .slider:before {
+ background-color: #777777;
+}
+
+.dark .api-list-head,
+.dark [data-tooltip]:hover::after{
+ background-color: #2A2A2A;
+}
+
+.dark .api-list-body > div:nth-child(4n+1),
+.dark .api-list-body > div:nth-child(4n+2) {
+ background-color: #333333;
+}
+
+.dark .icon-collapse {
+ color: white !important;
+}
+
+.dark .close-modal {
+ color: #3C3C3C;
+}
+
+.dark input[type="date"] {
+ color-scheme: dark;
+}
+
+.dark input[type="date"]::-webkit-calendar-picker-indicator {
+ filter: invert(0);
+}
+
+.dark .btn-revoked {
+ background-color: #BE4949 !important;
+}
\ No newline at end of file
diff --git a/themes/standard_pages/skins/sienna.css b/themes/standard_pages/skins/sienna.css
new file mode 100644
index 000000000..d580c7380
--- /dev/null
+++ b/themes/standard_pages/skins/sienna.css
@@ -0,0 +1,341 @@
+input[type='radio'] {
+ accent-color: #A0522D;
+}
+
+.input-container:focus-within,
+.input-modal:focus-within{
+ border:1px solid #A0522D!important;
+}
+
+.gallery-icon-checkmark {
+ border: 1px solid #777;
+}
+
+.btn-main{
+ background-color:#A0522D!important;
+ color:white!important;
+}
+
+.btn-secondary {
+ background-color: #ECECEC!important;
+ color: #3C3C3C!important;
+}
+
+.btn-main:disabled {
+ background-color:#aaaaaa!important;
+ color: #3C3C3C !important;
+}
+
+#separator{
+ border-bottom:1px solid #D8D8D8;
+}
+
+#lang-select #other-languages span:hover{
+ color:#A0522D;
+}
+
+.profile-section .api-icon-action i:hover,
+.close-modal:hover,
+.profile-section .icon-clone:hover {
+ color: #A0522D;
+}
+
+.profile-section div.api-tab-line:nth-child(even) {
+ background-color: #303030;
+}
+
+.profile-section #api_key_list .edit {
+ border: 1px solid #A0522D !important;
+}
+
+.profile-section .new-apikey .btn-link{
+ color: #9A9A9A !important;
+}
+
+.bg-modal {
+ background-color: rgba(0,0,0,0.7);
+}
+
+.slider {
+ background-color: #ccc;
+}
+
+.slider:before {
+ background-color: white;
+}
+
+/* Light */
+#theIdentificationPage .light,
+#theRegisterPage .light,
+#thePasswordPage .light,
+#theProfilePage .light{
+ background: linear-gradient(75.69deg, #EFD4C7 7.64%, #F9F0EB 77.87%);
+}
+
+.light #login-form,
+.light #register-form,
+.light #password-form,
+.light #lang-select #other-languages,
+.light .profile-section,
+.light .slider:before,
+.light .body-modal,
+.light [data-tooltip]:hover::after {
+ background-color:#ffffff;
+}
+
+#theIdentificationPage .light a,
+#theRegisterPage .light a,
+#thePasswordPage .light a,
+#theProfilePage .light a:not(.close-modal),
+.light h1,
+.light .input-container input,
+.light .input-modal input,
+.light .input-container select,
+.light .input-container textarea,
+.light .secondary-links,
+.light .properties label,
+.light .profile-section label,
+.light .properties i,
+.light .profile-section i,
+.light #password-form p,
+.light .profile-section p,
+.light #lang-select #other-languages span,
+.light .btn-cancel,
+.light .btn-link {
+ color:#3C3C3C;
+}
+
+#theIdentificationPage .light a:hover,
+#theRegisterPage .light a:hover,
+#thePasswordPage .light a:hover,
+#theProfilePage .light a:hover{
+ color:#A0522D;
+}
+
+.light #header-options a,
+.light #header-options .toggle-mode,
+.light #selected-language-container{
+ color:#A0522D;
+}
+
+.light .input-container,
+.light .input-modal,
+.light .api-list-head {
+ background-color:#F0F0F0;
+ border:1px solid #F0F0F0;
+}
+
+.light .input-container input:is(:-webkit-autofill, :autofill)
+{
+ box-shadow: 0 0 0 100px #F0F0F0 inset;
+ -webkit-box-shadow: 0 0 0px 1000px #F0F0F0 inset !important;
+ -webkit-text-fill-color: #3C3C3C;
+ color:#3C3C3C;
+}
+
+.light #separator{
+ border-bottom:1px solid #D8D8D8;
+}
+
+.light .gallery-icon-eye{
+ color:#898989;
+}
+
+.light .success-message{
+ background-color: #DBF6D7;
+ color: #6DCE5E !important;
+ border-left: 4px solid #6DCE5E;
+}
+
+.light .success-message i{
+ color:#6DCE5E;
+}
+
+.light .infos-message{
+ background-color: #bde5f8;
+ color: #00529b !important;
+ border-left: 4px solid #00529b;
+}
+
+.light input:checked + .slider {
+ background-color: #FFA646;
+}
+
+.light input:focus + .slider {
+ box-shadow: 0 0 1px #FFA646;
+}
+
+.light .slider {
+ background-color: #CCCCCC;
+}
+
+.light .api-list-body > div:nth-child(4n+1),
+.light .api-list-body > div:nth-child(4n+2) {
+ background-color: #F8F8F8;
+}
+
+.light .api-tab-line p,
+.light .api-icon-action i,
+.light .keys p:not(.api-copy),
+.light .keys i,
+.light #api_key_list_expired .api-skull {
+ color: #656565;
+}
+
+.light .close-modal {
+ color: #ffffff;
+}
+
+.light input[type="date"] {
+ color-scheme: light;
+}
+
+.light input[type="date"]::-webkit-calendar-picker-indicator {
+ filter: invert(0);
+}
+
+.light .btn-revoked {
+ background-color: #EB3223 !important;
+}
+
+/* Dark */
+#theIdentificationPage .dark,
+#theRegisterPage .dark,
+#thePasswordPage .dark,
+#theProfilePage .dark{
+ background: linear-gradient(75.69deg, #1B1B1D 7.64%, #2F2F2F 77.87%);
+}
+
+.dark #login-form,
+.dark #register-form,
+.dark #password-form,
+.dark .profile-section,
+.dark .body-modal {
+ background-color:#3C3C3C;
+}
+
+#theIdentificationPage .dark a,
+#theRegisterPage .dark a,
+#thePasswordPage .dark a,
+#theProfilePage .dark a:not(.close-modal){
+ color:#EFD4C7;
+}
+
+.dark h1,
+.dark .input-container input,
+.dark .input-modal input,
+.dark .input-container select,
+.dark .input-container textarea,
+.dark .secondary-links,
+.dark .properties label,
+.dark .profile-section label,
+.dark .properties i,
+.dark .profile-section i,
+.dark #password-form p,
+.dark .profile-section p,
+.dark #lang-select #other-languages span,
+.dark .btn-cancel,
+.dark .btn-link {
+ color:#D6D6D6;
+}
+
+#theIdentificationPage .dark a:hover,
+#theRegisterPage .dark a:hover,
+#thePasswordPage .dark a:hover,
+#theProfilePage .dark a:hover,
+.dark #lang-select #other-languages span{
+ color:#F9F0EB;
+}
+
+.dark #header-options a,
+.dark #header-options .toggle-mode,
+.dark #selected-language-container{
+ color:#EFD4C7;
+}
+
+.dark .input-container,
+.dark .input-modal {
+ background-color:#303030;
+ border:1px solid #303030;
+}
+
+.dark .input-container input:is(:-webkit-autofill, :autofill)
+{
+ box-shadow: 0 0 0 100px #303030 inset;
+ -webkit-box-shadow: 0 0 0px 1000px #303030 inset !important;
+ -webkit-text-fill-color: #D6D6D6;
+ color:#D6D6D6;
+}
+
+.dark #separator{
+ border-bottom:1px solid #303030;
+}
+
+.dark .gallery-icon-eye{
+ color:#898989;
+}
+
+.dark #lang-select #other-languages,
+.dark .slider,
+.dark input:checked + .slider:before {
+ background-color: #3C3C3C;
+}
+
+.dark .success-message{
+ background-color: #4EA590;
+ color: #AAF6E4 !important;
+ border-left: 4px solid #AAF6E4;
+}
+
+.dark .success-message i{
+ color: #AAF6E4;
+}
+
+.dark .infos-message{
+ background-color: #4f71a4;
+ color: #bad6ff !important;
+ border-left: 4px solid #bad6ff;
+}
+
+.dark .btn-secondary {
+ background-color: #202020!important;
+ color: white!important;
+}
+
+.dark input:checked + .slider {
+ background-color: #FFA646;
+}
+
+.dark .slider:before {
+ background-color: #777777;
+}
+
+.dark .api-list-head,
+.dark [data-tooltip]:hover::after{
+ background-color: #2A2A2A;
+}
+
+.dark .api-list-body > div:nth-child(4n+1),
+.dark .api-list-body > div:nth-child(4n+2) {
+ background-color: #333333;
+}
+
+.dark .icon-collapse {
+ color: white !important;
+}
+
+.dark .close-modal {
+ color: #3C3C3C;
+}
+
+.dark input[type="date"] {
+ color-scheme: dark;
+}
+
+.dark input[type="date"]::-webkit-calendar-picker-indicator {
+ filter: invert(0);
+}
+
+.dark .btn-revoked {
+ background-color: #BE4949 !important;
+}
\ No newline at end of file
diff --git a/themes/standard_pages/skins/silver.css b/themes/standard_pages/skins/silver.css
new file mode 100644
index 000000000..324dec1a3
--- /dev/null
+++ b/themes/standard_pages/skins/silver.css
@@ -0,0 +1,341 @@
+input[type='radio'] {
+ accent-color: #b0b0b0;
+}
+
+.input-container:focus-within,
+.input-modal:focus-within{
+ border:1px solid #b0b0b0!important;
+}
+
+.gallery-icon-checkmark {
+ border: 1px solid #777;
+}
+
+.btn-main{
+ background-color:#b0b0b0!important;
+ color:black!important;
+}
+
+.btn-secondary {
+ background-color: #ECECEC!important;
+ color: #3C3C3C!important;
+}
+
+.btn-main:disabled {
+ background-color:#aaaaaa!important;
+ color: #3C3C3C !important;
+}
+
+#separator{
+ border-bottom:1px solid #D8D8D8;
+}
+
+#lang-select #other-languages span:hover{
+ color:#b0b0b0;
+}
+
+.profile-section .api-icon-action i:hover,
+.close-modal:hover,
+.profile-section .icon-clone:hover {
+ color: #b0b0b0;
+}
+
+.profile-section div.api-tab-line:nth-child(even) {
+ background-color: #303030;
+}
+
+.profile-section #api_key_list .edit {
+ border: 1px solid #b0b0b0 !important;
+}
+
+.profile-section .new-apikey .btn-link{
+ color: #9A9A9A !important;
+}
+
+.bg-modal {
+ background-color: rgba(0,0,0,0.7);
+}
+
+.slider {
+ background-color: #ccc;
+}
+
+.slider:before {
+ background-color: white;
+}
+
+/* Light */
+#theIdentificationPage .light,
+#theRegisterPage .light,
+#thePasswordPage .light,
+#theProfilePage .light{
+ background: linear-gradient(75.69deg, #d1d1d1 7.64%, #fdfdfd 77.87%);
+}
+
+.light #login-form,
+.light #register-form,
+.light #password-form,
+.light #lang-select #other-languages,
+.light .profile-section,
+.light .slider:before,
+.light .body-modal,
+.light [data-tooltip]:hover::after {
+ background-color:#ffffff;
+}
+
+#theIdentificationPage .light a,
+#theRegisterPage .light a,
+#thePasswordPage .light a,
+#theProfilePage .light a:not(.close-modal),
+.light h1,
+.light .input-container input,
+.light .input-modal input,
+.light .input-container select,
+.light .input-container textarea,
+.light .secondary-links,
+.light .properties label,
+.light .profile-section label,
+.light .properties i,
+.light .profile-section i,
+.light #password-form p,
+.light .profile-section p,
+.light #lang-select #other-languages span,
+.light .btn-cancel,
+.light .btn-link {
+ color:#3C3C3C;
+}
+
+#theIdentificationPage .light a:hover,
+#theRegisterPage .light a:hover,
+#thePasswordPage .light a:hover,
+#theProfilePage .light a:hover{
+ color:#b0b0b0;
+}
+
+.light #header-options a,
+.light #header-options .toggle-mode,
+.light #selected-language-container{
+ color:#7a7a7a;
+}
+
+.light .input-container,
+.light .input-modal,
+.light .api-list-head {
+ background-color:#F0F0F0;
+ border:1px solid #F0F0F0;
+}
+
+.light .input-container input:is(:-webkit-autofill, :autofill)
+{
+ box-shadow: 0 0 0 100px #F0F0F0 inset;
+ -webkit-box-shadow: 0 0 0px 1000px #F0F0F0 inset !important;
+ -webkit-text-fill-color: #3C3C3C;
+ color:#3C3C3C;
+}
+
+.light #separator{
+ border-bottom:1px solid #D8D8D8;
+}
+
+.light .gallery-icon-eye{
+ color:#898989;
+}
+
+.light .success-message{
+ background-color: #DBF6D7;
+ color: #6DCE5E !important;
+ border-left: 4px solid #6DCE5E;
+}
+
+.light .success-message i{
+ color:#6DCE5E;
+}
+
+.light .infos-message{
+ background-color: #bde5f8;
+ color: #00529b !important;
+ border-left: 4px solid #00529b;
+}
+
+.light input:checked + .slider {
+ background-color: #FFA646;
+}
+
+.light input:focus + .slider {
+ box-shadow: 0 0 1px #FFA646;
+}
+
+.light .slider {
+ background-color: #CCCCCC;
+}
+
+.light .api-list-body > div:nth-child(4n+1),
+.light .api-list-body > div:nth-child(4n+2) {
+ background-color: #F8F8F8;
+}
+
+.light .api-tab-line p,
+.light .api-icon-action i,
+.light .keys p:not(.api-copy),
+.light .keys i,
+.light #api_key_list_expired .api-skull {
+ color: #656565;
+}
+
+.light .close-modal {
+ color: #ffffff;
+}
+
+.light input[type="date"] {
+ color-scheme: light;
+}
+
+.light input[type="date"]::-webkit-calendar-picker-indicator {
+ filter: invert(0);
+}
+
+.light .btn-revoked {
+ background-color: #EB3223 !important;
+}
+
+/* Dark */
+#theIdentificationPage .dark,
+#theRegisterPage .dark,
+#thePasswordPage .dark,
+#theProfilePage .dark{
+ background: linear-gradient(75.69deg, #1B1B1D 7.64%, #2F2F2F 77.87%);
+}
+
+.dark #login-form,
+.dark #register-form,
+.dark #password-form,
+.dark .profile-section,
+.dark .body-modal {
+ background-color:#3C3C3C;
+}
+
+#theIdentificationPage .dark a,
+#theRegisterPage .dark a,
+#thePasswordPage .dark a,
+#theProfilePage .dark a:not(.close-modal){
+ color:#d1d1d1;
+}
+
+.dark h1,
+.dark .input-container input,
+.dark .input-modal input,
+.dark .input-container select,
+.dark .input-container textarea,
+.dark .secondary-links,
+.dark .properties label,
+.dark .profile-section label,
+.dark .properties i,
+.dark .profile-section i,
+.dark #password-form p,
+.dark .profile-section p,
+.dark #lang-select #other-languages span,
+.dark .btn-cancel,
+.dark .btn-link {
+ color:#D6D6D6;
+}
+
+#theIdentificationPage .dark a:hover,
+#theRegisterPage .dark a:hover,
+#thePasswordPage .dark a:hover,
+#theProfilePage .dark a:hover,
+.dark #lang-select #other-languages span{
+ color:#FFFBE6;
+}
+
+.dark #header-options a,
+.dark #header-options .toggle-mode,
+.dark #selected-language-container{
+ color:#d1d1d1;
+}
+
+.dark .input-container,
+.dark .input-modal {
+ background-color:#303030;
+ border:1px solid #303030;
+}
+
+.dark .input-container input:is(:-webkit-autofill, :autofill)
+{
+ box-shadow: 0 0 0 100px #303030 inset;
+ -webkit-box-shadow: 0 0 0px 1000px #303030 inset !important;
+ -webkit-text-fill-color: #D6D6D6;
+ color:#D6D6D6;
+}
+
+.dark #separator{
+ border-bottom:1px solid #303030;
+}
+
+.dark .gallery-icon-eye{
+ color:#898989;
+}
+
+.dark #lang-select #other-languages,
+.dark .slider,
+.dark input:checked + .slider:before {
+ background-color: #3C3C3C;
+}
+
+.dark .success-message{
+ background-color: #4EA590;
+ color: #AAF6E4 !important;
+ border-left: 4px solid #AAF6E4;
+}
+
+.dark .success-message i{
+ color: #AAF6E4;
+}
+
+.dark .infos-message{
+ background-color: #4f71a4;
+ color: #bad6ff !important;
+ border-left: 4px solid #bad6ff;
+}
+
+.dark .btn-secondary {
+ background-color: #202020!important;
+ color: white!important;
+}
+
+.dark input:checked + .slider {
+ background-color: #FFA646;
+}
+
+.dark .slider:before {
+ background-color: #777777;
+}
+
+.dark .api-list-head,
+.dark [data-tooltip]:hover::after{
+ background-color: #2A2A2A;
+}
+
+.dark .api-list-body > div:nth-child(4n+1),
+.dark .api-list-body > div:nth-child(4n+2) {
+ background-color: #333333;
+}
+
+.dark .icon-collapse {
+ color: white !important;
+}
+
+.dark .close-modal {
+ color: #3C3C3C;
+}
+
+.dark input[type="date"] {
+ color-scheme: dark;
+}
+
+.dark input[type="date"]::-webkit-calendar-picker-indicator {
+ filter: invert(0);
+}
+
+.dark .btn-revoked {
+ background-color: #BE4949 !important;
+}
\ No newline at end of file
diff --git a/themes/standard_pages/skins/teal.css b/themes/standard_pages/skins/teal.css
new file mode 100644
index 000000000..3fd32fc84
--- /dev/null
+++ b/themes/standard_pages/skins/teal.css
@@ -0,0 +1,343 @@
+input[type='radio'] {
+ accent-color: #007f80;
+}
+
+.input-container:focus-within,
+.input-modal:focus-within{
+ border:1px solid #007f80!important;
+}
+
+.gallery-icon-checkmark {
+ border: 1px solid #777;
+}
+
+.btn-main{
+ background-color:#007f80!important;
+ color:white!important;
+}
+
+.btn-secondary {
+ background-color: #ECECEC!important;
+ color: #3C3C3C!important;
+}
+
+.btn-main:disabled {
+ background-color:#aaaaaa!important;
+ color: #3C3C3C !important;
+}
+
+#separator{
+ border-bottom:1px solid #D8D8D8;
+}
+
+#lang-select #other-languages span:hover{
+ color:#007f80;
+}
+
+.profile-section .api-icon-action i:hover,
+.close-modal:hover,
+.profile-section .icon-clone:hover {
+ color: #007f80;
+}
+
+.profile-section div.api-tab-line:nth-child(even) {
+ background-color: #303030;
+}
+
+.profile-section #api_key_list .edit {
+ border: 1px solid #007f80 !important;
+}
+
+.profile-section .new-apikey .btn-link{
+ color: #9A9A9A !important;
+}
+
+.bg-modal {
+ background-color: rgba(0,0,0,0.7);
+}
+
+.slider {
+ background-color: #ccc;
+}
+
+.slider:before {
+ background-color: white;
+}
+
+
+
+/* Light */
+#theIdentificationPage .light,
+#theRegisterPage .light,
+#thePasswordPage .light,
+#theProfilePage .light{
+ background: linear-gradient(75.69deg, #B8FFFF 7.64%, #E6FFFF 77.87%);
+}
+
+.light #login-form,
+.light #register-form,
+.light #password-form,
+.light #lang-select #other-languages,
+.light .profile-section,
+.light .slider:before,
+.light .body-modal,
+.light [data-tooltip]:hover::after {
+ background-color:#ffffff;
+}
+
+#theIdentificationPage .light a,
+#theRegisterPage .light a,
+#thePasswordPage .light a,
+#theProfilePage .light a:not(.close-modal),
+.light h1,
+.light .input-container input,
+.light .input-modal input,
+.light .input-container select,
+.light .input-container textarea,
+.light .secondary-links,
+.light .properties label,
+.light .profile-section label,
+.light .properties i,
+.light .profile-section i,
+.light #password-form p,
+.light .profile-section p,
+.light #lang-select #other-languages span,
+.light .btn-cancel,
+.light .btn-link {
+ color:#3C3C3C;
+}
+
+#theIdentificationPage .light a:hover,
+#theRegisterPage .light a:hover,
+#thePasswordPage .light a:hover,
+#theProfilePage .light a:hover{
+ color:#007f80;
+}
+
+.light #header-options a,
+.light #header-options .toggle-mode,
+.light #selected-language-container{
+ color:#007f80;
+}
+
+.light .input-container,
+.light .input-modal,
+.light .api-list-head {
+ background-color:#F0F0F0;
+ border:1px solid #F0F0F0;
+}
+
+.light .input-container input:is(:-webkit-autofill, :autofill)
+{
+ box-shadow: 0 0 0 100px #F0F0F0 inset;
+ -webkit-box-shadow: 0 0 0px 1000px #F0F0F0 inset !important;
+ -webkit-text-fill-color: #3C3C3C;
+ color:#3C3C3C;
+}
+
+.light #separator{
+ border-bottom:1px solid #D8D8D8;
+}
+
+.light .gallery-icon-eye{
+ color:#898989;
+}
+
+.light .success-message{
+ background-color: #DBF6D7;
+ color: #6DCE5E !important;
+ border-left: 4px solid #6DCE5E;
+}
+
+.light .success-message i{
+ color:#6DCE5E;
+}
+
+.light .infos-message{
+ background-color: #bde5f8;
+ color: #00529b !important;
+ border-left: 4px solid #00529b;
+}
+
+.light input:checked + .slider {
+ background-color: #FFA646;
+}
+
+.light input:focus + .slider {
+ box-shadow: 0 0 1px #FFA646;
+}
+
+.light .slider {
+ background-color: #CCCCCC;
+}
+
+.light .api-list-body > div:nth-child(4n+1),
+.light .api-list-body > div:nth-child(4n+2) {
+ background-color: #F8F8F8;
+}
+
+.light .api-tab-line p,
+.light .api-icon-action i,
+.light .keys p:not(.api-copy),
+.light .keys i,
+.light #api_key_list_expired .api-skull {
+ color: #656565;
+}
+
+.light .close-modal {
+ color: #ffffff;
+}
+
+.light input[type="date"] {
+ color-scheme: light;
+}
+
+.light input[type="date"]::-webkit-calendar-picker-indicator {
+ filter: invert(0);
+}
+
+.light .btn-revoked {
+ background-color: #EB3223 !important;
+}
+
+/* Dark */
+#theIdentificationPage .dark,
+#theRegisterPage .dark,
+#thePasswordPage .dark,
+#theProfilePage .dark{
+ background: linear-gradient(75.69deg, #1B1B1D 7.64%, #2F2F2F 77.87%);
+}
+
+.dark #login-form,
+.dark #register-form,
+.dark #password-form,
+.dark .profile-section,
+.dark .body-modal {
+ background-color:#3C3C3C;
+}
+
+#theIdentificationPage .dark a,
+#theRegisterPage .dark a,
+#thePasswordPage .dark a,
+#theProfilePage .dark a:not(.close-modal){
+ color:#B8FFFF;
+}
+
+.dark h1,
+.dark .input-container input,
+.dark .input-modal input,
+.dark .input-container select,
+.dark .input-container textarea,
+.dark .secondary-links,
+.dark .properties label,
+.dark .profile-section label,
+.dark .properties i,
+.dark .profile-section i,
+.dark #password-form p,
+.dark .profile-section p,
+.dark #lang-select #other-languages span,
+.dark .btn-cancel,
+.dark .btn-link {
+ color:#D6D6D6;
+}
+
+#theIdentificationPage .dark a:hover,
+#theRegisterPage .dark a:hover,
+#thePasswordPage .dark a:hover,
+#theProfilePage .dark a:hover,
+.dark #lang-select #other-languages span{
+ color:#E6FFFF;
+}
+
+.dark #header-options a,
+.dark #header-options .toggle-mode,
+.dark #selected-language-container{
+ color:#B8FFFF;
+}
+
+.dark .input-container,
+.dark .input-modal {
+ background-color:#303030;
+ border:1px solid #303030;
+}
+
+.dark .input-container input:is(:-webkit-autofill, :autofill)
+{
+ box-shadow: 0 0 0 100px #303030 inset;
+ -webkit-box-shadow: 0 0 0px 1000px #303030 inset !important;
+ -webkit-text-fill-color: #D6D6D6;
+ color:#D6D6D6;
+}
+
+.dark #separator{
+ border-bottom:1px solid #303030;
+}
+
+.dark .gallery-icon-eye{
+ color:#898989;
+}
+
+.dark #lang-select #other-languages,
+.dark .slider,
+.dark input:checked + .slider:before {
+ background-color: #3C3C3C;
+}
+
+.dark .success-message{
+ background-color: #4EA590;
+ color: #AAF6E4 !important;
+ border-left: 4px solid #AAF6E4;
+}
+
+.dark .success-message i{
+ color: #AAF6E4;
+}
+
+.dark .infos-message{
+ background-color: #4f71a4;
+ color: #bad6ff !important;
+ border-left: 4px solid #bad6ff;
+}
+
+.dark .btn-secondary {
+ background-color: #202020!important;
+ color: white!important;
+}
+
+.dark input:checked + .slider {
+ background-color: #FFA646;
+}
+
+.dark .slider:before {
+ background-color: #777777;
+}
+
+.dark .api-list-head,
+.dark [data-tooltip]:hover::after{
+ background-color: #2A2A2A;
+}
+
+.dark .api-list-body > div:nth-child(4n+1),
+.dark .api-list-body > div:nth-child(4n+2) {
+ background-color: #333333;
+}
+
+.dark .icon-collapse {
+ color: white !important;
+}
+
+.dark .close-modal {
+ color: #3C3C3C;
+}
+
+.dark input[type="date"] {
+ color-scheme: dark;
+}
+
+.dark input[type="date"]::-webkit-calendar-picker-indicator {
+ filter: invert(0);
+}
+
+.dark .btn-revoked {
+ background-color: #BE4949 !important;
+}
\ No newline at end of file
diff --git a/themes/standard_pages/template/identification.tpl b/themes/standard_pages/template/identification.tpl
index 4c7c60c74..54c3d3c82 100644
--- a/themes/standard_pages/template/identification.tpl
+++ b/themes/standard_pages/template/identification.tpl
@@ -1,4 +1,4 @@
-{combine_css id='standard_pages_css' path="themes/standard_pages/css/standard_pages.css" order=100}
+{combine_css id='standard_pages_css' path="themes/standard_pages/skins/{$STD_PGS_SELECTED_SKIN}.css" order=100}
{combine_css path="themes/default/vendor/fontello/css/gallery-icon.css" order=-10}