First commit
This commit is contained in:
Nathan
BIN
Binary file not shown.
@@ -0,0 +1,26 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 767.6 191">
|
||||
<defs>
|
||||
<style>
|
||||
.cls-1 {
|
||||
fill: #3c3c3c;
|
||||
}
|
||||
|
||||
.cls-2 {
|
||||
fill: #f70;
|
||||
}
|
||||
|
||||
.cls-3 {
|
||||
fill: #fff;
|
||||
}
|
||||
</style>
|
||||
</defs>
|
||||
<g id="Symbole_23_1" data-name="Symbole 23 – 1" transform="translate(-577 -446.516)">
|
||||
<path id="Tracé_3456" data-name="Tracé 3456" class="cls-1" d="M48.953-42.57c1.466-.943,4.51-.83,4.51-.83H64.8a75.758,75.758,0,0,0,28.1-5.1A46.707,46.707,0,0,0,113.6-64q7.8-10.4,7.8-25.6,0-15.4-7.3-25.8a43.832,43.832,0,0,0-19.7-15.5A72.474,72.474,0,0,0,66.6-136H26.286s-4.763-.041-7.4,1.925-2.483,5.564-2.483,5.564V-3.588a3.986,3.986,0,0,0,.77,2.735,4.788,4.788,0,0,0,2.9.853H43.957a4.221,4.221,0,0,0,2.869-.853c.911-.972.774-3.035.774-3.035V-39.627A3.519,3.519,0,0,1,48.953-42.57ZM65.6-110.8q11,0,17.1,5.6t6.1,16.4q-.2,9.4-6.5,14.9T66-68.4H50.653a3.693,3.693,0,0,1-2.331-.742,3.813,3.813,0,0,1-.722-2.364v-37.132a2.062,2.062,0,0,1,.722-1.716,5.2,5.2,0,0,1,2.5-.446Z" transform="translate(735 592.516)"/>
|
||||
<path id="Tracé_3455" data-name="Tracé 3455" class="cls-1" d="M152-110.4a16.763,16.763,0,0,0,12.3-5.1,16.533,16.533,0,0,0,5.1-12.1,16.763,16.763,0,0,0-5.1-12.3A16.763,16.763,0,0,0,152-145a16.533,16.533,0,0,0-12.1,5.1,16.763,16.763,0,0,0-5.1,12.3,16.533,16.533,0,0,0,5.1,12.1A16.533,16.533,0,0,0,152-110.4ZM166.744-1.253A5.163,5.163,0,0,0,167.8-4.6v-84.4s.2-3.8-1.622-5.8S160.525-97,160.525-97H146.1s-4.891.167-7.317,2.8-2.387,7.732-2.387,7.732V-6.591s-.182,3.621,1.4,5.269S142.746,0,142.746,0h20.475A6.231,6.231,0,0,0,166.744-1.253Zm130.162-.5c2.2-1.778,3.011-5.364,3.011-5.364L327.88-92.949s.738-1.925,0-2.938S324.926-97,324.926-97H302.113a8.712,8.712,0,0,0-3.818,1.113,5.151,5.151,0,0,0-1.792,2.841L285.676-45.3a1.478,1.478,0,0,1-1.531,1.429,1.478,1.478,0,0,1-1.531-1.429L270.8-92.243a6.42,6.42,0,0,0-1.879-3.643,7.68,7.68,0,0,0-4.2-1.113H242.978a8.845,8.845,0,0,0-4.06,1.113,5.149,5.149,0,0,0-1.784,3.05l-9.2,44.235s-.213,1.2-2.768,2.041-3.5-2.041-3.5-2.041l-9.779-43.51s-.312-4.106-2.534-5.735-6.353-.78-6.353-.78L188.87-94.519s-4.51,1.1-6.014,3.812,0,7.019,0,7.019L207.17-7.6s.641,3.954,3.141,5.855S217.169,0,217.169,0h13.64s3.62-.012,5.709-1.749,2.647-5.2,2.647-5.2L250.631-47.5a2.736,2.736,0,0,1,2.768-2.381,2.847,2.847,0,0,1,2.844,2.381L267.781-7.66s.468,4,3.092,5.911S278.279,0,278.279,0H291.1S294.7.029,296.906-1.749ZM357.2-110.4a16.762,16.762,0,0,0,12.3-5.1,16.533,16.533,0,0,0,5.1-12.1,16.763,16.763,0,0,0-5.1-12.3,16.763,16.763,0,0,0-12.3-5.1,16.533,16.533,0,0,0-12.1,5.1,16.763,16.763,0,0,0-5.1,12.3,16.533,16.533,0,0,0,5.1,12.1A16.533,16.533,0,0,0,357.2-110.4ZM371.326-1.749C373.259-3.477,373-6.91,373-6.91V-90.436s-.11-3.058-1.541-4.7A7.042,7.042,0,0,0,367.277-97H348.615s-3.556.212-5.31,1.978-1.7,5.084-1.7,5.084V-8.3s-.307,4.473,1.314,6.546S348.085,0,348.085,0h17.184S369.393-.021,371.326-1.749ZM485.84-95.233c.863,1.373.863,6.905.863,6.905L486.4,3.8a38.992,38.992,0,0,1-6.5,22.4,41.1,41.1,0,0,1-18.4,14.7Q449.6,46,434,46q-8,0-21.2-3a74.246,74.246,0,0,1-16.5-5.607,5.014,5.014,0,0,1-2.827-3.655,7.006,7.006,0,0,1,.628-4.314l4.138-9.684a6.978,6.978,0,0,1,3.656-3.64c2.566-.928,4.017-1.092,6.61-.073A64.9,64.9,0,0,0,432.2,20.8q10.2,0,16.5-4.7A14.831,14.831,0,0,0,455,3.6s.809-5.015-3.641-5.365S444.809,2.115,437.2,2.2q-22.6,0-36-13.2T387.8-48.4q0-24.2,13.6-37.9t37-13.7a38.162,38.162,0,0,1,13.8,2.7c4.667,1.8,8.45,7.575,13,7.7s-.373-7.168,5.2-7.2c3.383-.019,7.234-.007,11.084,0C483.469-96.8,484.977-96.606,485.84-95.233ZM440.6-22.8c4.4,0,8-.854,11.6-5.134S455-39.917,455-39.917v-16.46s1-8.867-2.8-13.473-7.067-4.95-12.4-4.95a16.918,16.918,0,0,0-14.2,7.2q-5.4,7.2-5.4,19,0,12,5.4,18.9T440.6-22.8Zm169-25.6q0,15.6-6.9,27A45.743,45.743,0,0,1,583.6-3.9q-12.2,6.1-27.8,6.1Q540,2.2,528-3.7a43.275,43.275,0,0,1-18.7-17.4q-6.7-11.5-6.7-27.7,0-15.6,6.9-27.2a46.151,46.151,0,0,1,19-17.8q12.1-6.2,27.7-6.2,15.8,0,27.9,6.1a44.223,44.223,0,0,1,18.8,17.7Q609.6-64.6,609.6-48.4ZM556-23.6q9.6,0,15.4-6.8t5.8-18q0-11.2-5.7-18.4A18.3,18.3,0,0,0,556.4-74q-9.8,0-15.6,6.9T535-48.8q0,11.4,5.7,18.3T556-23.6Z" transform="translate(735 591.516)"/>
|
||||
<path id="Tracé_3467" data-name="Tracé 3467" class="cls-2" d="M36.12,0h64.088a36.12,36.12,0,0,1,36.12,36.12v84.911L131.486,131.4l-10.5,4.93H36.12A36.12,36.12,0,0,1,0,100.208V36.12A36.12,36.12,0,0,1,36.12,0Z" transform="translate(577 592.285) rotate(-90)"/>
|
||||
<path id="Tracé_3469" data-name="Tracé 3469" class="cls-2" d="M24.641,0C38.167,0,49.59,10.892,49.59,24.418S38.167,48.983,24.641,48.983-36.4,9.469-35.316,9.463s-27.4-.076,9.176,0S8.9.355,24.641,0Z" transform="translate(663.719 446.516)"/>
|
||||
<circle id="Ellipse_69" data-name="Ellipse 69" class="cls-3" cx="8.557" cy="8.557" r="8.557" transform="translate(680.344 461.978)"/>
|
||||
<circle id="Ellipse_67" data-name="Ellipse 67" class="cls-3" cx="40.426" cy="40.426" r="40.426" transform="translate(604.738 483.695)"/>
|
||||
<circle id="Ellipse_68" data-name="Ellipse 68" class="cls-1" cx="28.623" cy="28.623" r="28.623" transform="translate(616.541 495.499)"/>
|
||||
</g>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 4.9 KiB |
File diff suppressed because one or more lines are too long
|
After Width: | Height: | Size: 9.8 KiB |
@@ -0,0 +1,560 @@
|
||||
let PWG_TOKEN;
|
||||
$(function() {
|
||||
PWG_TOKEN = $('#pwg_token').val();
|
||||
$('.profile-section .display-section').on('click', function() {
|
||||
const display = $(this).data('display');
|
||||
const selector = $(`#${display}`);
|
||||
const element = selector.get(0);
|
||||
const arrow = $(this).find('.display-btn');
|
||||
|
||||
if (selector.hasClass('open')) {
|
||||
// close
|
||||
element.style.maxHeight = element.scrollHeight + 'px';
|
||||
void element.offsetHeight;
|
||||
element.style.maxHeight = '1px';
|
||||
selector.removeClass('open');
|
||||
arrow.addClass('close');
|
||||
} else {
|
||||
// open
|
||||
selector.addClass('open');
|
||||
resetSection(display);
|
||||
arrow.removeClass('close');
|
||||
}
|
||||
});
|
||||
|
||||
setTimeout(() => {
|
||||
$('#account-section .display-section').trigger('click');
|
||||
}, 100);
|
||||
|
||||
$('#save_account').on('click', function() {
|
||||
const mail = $('#email').val();
|
||||
if (!mail || mail == '') {
|
||||
$('#email_error').show();
|
||||
return;
|
||||
}
|
||||
setInfos({ email: mail });
|
||||
});
|
||||
|
||||
if (canUpdatePreferences) {
|
||||
$('#save_preferences').on('click', function () {
|
||||
const values = {
|
||||
nb_image_page: $('#nb_image_page').val(),
|
||||
theme: $('select[name="theme"]').val(),
|
||||
language: $('select[name="language"]').val(),
|
||||
recent_period: $('#recent_period').val(),
|
||||
expand: $('#opt_album').is(':checked'),
|
||||
show_nb_comments: $('#opt_comment').is(':checked'),
|
||||
show_nb_hits: $('#opt_hits').is(':checked')
|
||||
}
|
||||
|
||||
if (values.nb_image_page == '') {
|
||||
$('#error_nb_image').show();
|
||||
return;
|
||||
}
|
||||
|
||||
if (values.recent_period == '') {
|
||||
$('#error_period').show();
|
||||
return;
|
||||
}
|
||||
|
||||
setInfos({ ...values });
|
||||
});
|
||||
|
||||
$('#reset_preferences').on('click', function () {
|
||||
$('input[name="nb_image_page"]').val(user.nb_image_page);
|
||||
$('select[name="theme"]').val(user.theme);
|
||||
$('select[name="language"]').val(user.language);
|
||||
$('input[name="recent_period"]').val(user.recent_period);
|
||||
$('#opt_album').prop('checked', user.opt_album);
|
||||
$('#opt_comment').prop('checked', user.opt_comment);
|
||||
$('#opt_hits').prop('checked', user.opt_hits);
|
||||
});
|
||||
|
||||
$('#default_preferences').on('click', function () {
|
||||
$('input[name="nb_image_page"]').val(preferencesDefaultValues.nb_image_page);
|
||||
$('input[name="recent_period"]').val(preferencesDefaultValues.recent_period);
|
||||
$('#opt_album').prop('checked', preferencesDefaultValues.opt_album);
|
||||
$('#opt_comment').prop('checked', preferencesDefaultValues.opt_comment);
|
||||
$('#opt_hits').prop('checked', preferencesDefaultValues.opt_hits);
|
||||
});
|
||||
}
|
||||
|
||||
if (canUpdatePassword) {
|
||||
$('#save_password').on('click', function () {
|
||||
const passwords = {
|
||||
password: $('#password').val(),
|
||||
new_password: $('#password_new').val(),
|
||||
conf_new_password: $('#password_conf').val(),
|
||||
}
|
||||
if (passwords.password == '' || passwords.new_password == '' || passwords.conf_new_password == '') {
|
||||
$('#password-section input').each((i, element) => {
|
||||
const el = $(element);
|
||||
if (el.val() == '') {
|
||||
el.parent().siblings().show();
|
||||
}
|
||||
});
|
||||
return;
|
||||
}
|
||||
setInfos({ ...passwords });
|
||||
$('#password-section input').val('');
|
||||
});
|
||||
}
|
||||
|
||||
|
||||
standardSaveSelector.forEach((selector, i) => {
|
||||
$(selector).on('click', function() {
|
||||
const values = {};
|
||||
$(`#${i}-section`).find('input, textarea, select').each((i, element) => {
|
||||
const el = $(element);
|
||||
const inputName = el.attr('name');
|
||||
const inputValue = el.val();
|
||||
values[inputName] = inputValue;
|
||||
});
|
||||
setInfos({...values});
|
||||
});
|
||||
});
|
||||
|
||||
// API KEY BELOW
|
||||
if (!can_manage_api) {
|
||||
$('.can-manage').hide();
|
||||
$('#cant_manage_api').show();
|
||||
return;
|
||||
};
|
||||
$('#new_apikey').on('click', function() {
|
||||
openApiModal();
|
||||
});
|
||||
|
||||
$('#close_api_modal, #cancel_apikey').on('click', function() {
|
||||
closeApiModal();
|
||||
});
|
||||
|
||||
$('#close_api_modal_edit').on('click', function() {
|
||||
closeApiEditModal();
|
||||
});
|
||||
|
||||
$('#close_api_modal_revoke, #cancel_api_revoke').on('click', function() {
|
||||
closeApiRevokeModal();
|
||||
});
|
||||
|
||||
$('#show_expired_list').on('click', function() {
|
||||
const api_list_expired = $('#api_key_list_expired');
|
||||
const isOpen = $(this).data('show');
|
||||
if(!isOpen) {
|
||||
api_list_expired.get(0).style.maxHeight = 'max-content';
|
||||
$(this).text(str_hide_expired);
|
||||
} else {
|
||||
api_list_expired.get(0).style.maxHeight = '0';
|
||||
$(this).text(str_show_expired);
|
||||
}
|
||||
|
||||
$(this).data('show', !isOpen);
|
||||
|
||||
resetSection('apikey-display', false, true);
|
||||
});
|
||||
|
||||
$(window).on('keydown', function(e) {
|
||||
const haveApiModal = $('#api_modal').is(':visible');
|
||||
const haveApiEditModal = $('#api_modal_edit').is(':visible');
|
||||
const haveApiRevokeModal = $('#api_modal_revoke').is(':visible');
|
||||
if (haveApiModal && e.key === 'Escape') {
|
||||
closeApiModal();
|
||||
}
|
||||
if (haveApiEditModal && e.key === 'Escape') {
|
||||
closeApiEditModal();
|
||||
}
|
||||
if (haveApiRevokeModal && e.key === 'Escape') {
|
||||
closeApiRevokeModal();
|
||||
}
|
||||
});
|
||||
|
||||
$('select[name="api_expiration"]').on('change', function() {
|
||||
const custom_date = $('#api_custom_date');
|
||||
const value = $(this).val();
|
||||
if ('custom' === value) {
|
||||
custom_date.css('display', 'flex');
|
||||
} else {
|
||||
custom_date.css('display', 'none');
|
||||
}
|
||||
$('#error_api_key_date').hide();
|
||||
});
|
||||
|
||||
$('#api_expiration_date').on('change', function() {
|
||||
$('#error_api_key_date').hide();
|
||||
});
|
||||
|
||||
getAllApiKeys();
|
||||
});
|
||||
|
||||
function setInfos(params, method='pwg.users.setMyInfo', callback=null, errCallback=null) {
|
||||
// for debug
|
||||
// console.log('setInfos', params);
|
||||
const all_params = {
|
||||
...params,
|
||||
pwg_token: PWG_TOKEN
|
||||
}
|
||||
$.ajax({
|
||||
url: `ws.php?format=json&method=${method}`,
|
||||
type: "POST",
|
||||
dataType: "json",
|
||||
data: all_params,
|
||||
success: (data) => {
|
||||
if (data.stat == 'ok') {
|
||||
user = {...user, ...params};
|
||||
if (typeof callback === 'function') {
|
||||
callback(data.result);
|
||||
return;
|
||||
};
|
||||
pwgToaster({ text: data.result, icon: 'success' });
|
||||
return;
|
||||
} else if (data.stat == 'fail') {
|
||||
pwgToaster({ text: data.message, icon: 'error' });
|
||||
} else {
|
||||
pwgToaster({ text: str_handle_error, icon: 'error' });
|
||||
}
|
||||
if (typeof errCallback === 'function') {
|
||||
errCallback(data);
|
||||
return;
|
||||
}
|
||||
},
|
||||
error: function (e) {
|
||||
pwgToaster({ text: e.responseJSON?.message ?? str_handle_error, icon: 'error' });
|
||||
if (typeof errCallback === 'function') {
|
||||
errCallback(e);
|
||||
return;
|
||||
}
|
||||
},
|
||||
});
|
||||
}
|
||||
|
||||
function getAllApiKeys(reset = false) {
|
||||
$.ajax({
|
||||
url: 'ws.php?format=json&method=pwg.users.api_key.get',
|
||||
type: "POST",
|
||||
dataType: 'json',
|
||||
data: {
|
||||
pwg_token: PWG_TOKEN
|
||||
},
|
||||
success: function(res) {
|
||||
if (res.stat == 'ok') {
|
||||
if (typeof res.result === 'string' || res.result === false) {
|
||||
// No keys
|
||||
} else {
|
||||
AddApiLine(res.result, reset);
|
||||
}
|
||||
}
|
||||
},
|
||||
error: function(e) {
|
||||
pwgToaster({ text: e.responseJSON?.message ?? str_handle_error + 'getAllApiKeys', icon: 'error' });
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
function AddApiLine(lines, reset) {
|
||||
const api_list = $('#api_key_list');
|
||||
const api_list_expired = $('#api_key_list_expired');
|
||||
|
||||
$('#api_key_list .api-tab-line:not(.template-api), #api_key_list .api-tab-collapse:not(.template-api)').remove();
|
||||
$('#api_key_list_expired .api-tab-line:not(.template-api), #api_key_list_expired .api-tab-collapse:not(.template-api)').remove();
|
||||
|
||||
lines.forEach((line, i) => {
|
||||
const api_line = $('#api_line').clone();
|
||||
const api_collapse = $('#api_collapse').clone();
|
||||
const tmp_id = line.auth_key.slice(24, 34);
|
||||
|
||||
api_line.removeClass('template-api').addClass('api-tab');
|
||||
api_line.attr('id', `api_${tmp_id}`);
|
||||
api_line.find('.icon-collapse').data('api', tmp_id);
|
||||
api_line.find('.api_name').text(line.apikey_name).attr('title', line.apikey_name);
|
||||
api_line.find('.api_creation').text(line.created_on_format);
|
||||
api_line.find('.api_last_use').text(line.last_used_on_since).attr('title', line.last_used_on_since);
|
||||
api_line.find('.api_expiration').text(line.expiration);
|
||||
api_line.find('.api-icon-action').attr('data-api', `api_${tmp_id}`);
|
||||
api_line.find('.api-icon-action').attr('data-pkid', line.auth_key);
|
||||
|
||||
api_collapse.attr('id', `api_collapse_${tmp_id}`);
|
||||
api_collapse.removeClass('template-api');
|
||||
api_collapse.find('.api_key').text(line.auth_key);
|
||||
api_collapse.find('.icon-clone').attr({
|
||||
'data-copy': line.auth_key,
|
||||
'data-success': `api_copy_success_${tmp_id}`
|
||||
});
|
||||
api_collapse.find('.api-copy').attr('id', `api_copy_success_${tmp_id}`);
|
||||
|
||||
if (!line.revoked_on && !line.is_expired) {
|
||||
api_list.append(api_line);
|
||||
api_line.after(api_collapse);
|
||||
} else {
|
||||
$('#show_expired_list').show();
|
||||
api_list_expired.append(api_line);
|
||||
api_line.after(api_collapse);
|
||||
api_line.find('.api-icon-action').remove();
|
||||
if (line.is_expired) {
|
||||
api_line.find('.api_expiration').html(`<i class="gallery-icon-skull api-skull"></i> <span data-tooltip="${line.expired_on_format}">${line.expired_on_since}</span>`);
|
||||
} else {
|
||||
api_line.find('.api_expiration').html(`<i class="gallery-icon-skull api-skull"></i> <span>${/\d/.test(line.revoked_on_since) ? line.revoked_on_since : no_time_elapsed}</span> <i data-tooltip="${line.revoked_on_message}" class="icon-info-circled-1 api-info"></i>`);
|
||||
}
|
||||
}
|
||||
|
||||
});
|
||||
|
||||
apiLineEvent();
|
||||
if (reset) {
|
||||
resetSection('apikey-display');
|
||||
}
|
||||
}
|
||||
|
||||
function apiLineEvent() {
|
||||
$('.icon-collapse').off('click').on('click', function() {
|
||||
const api_collapse = $(`#api_collapse_${$(this).data('api')}`);
|
||||
const api_line = $(`#api_${$(this).data('api')}`);
|
||||
|
||||
if (api_collapse.is(':visible')) {
|
||||
api_collapse.removeClass('open');
|
||||
api_line.removeClass('open');
|
||||
api_line.find('.icon-collapse').addClass('close');
|
||||
api_collapse.css('display', 'none');
|
||||
api_collapse.find('.api-copy').addClass('api-hide');
|
||||
} else {
|
||||
api_collapse.addClass('open');
|
||||
api_line.addClass('open');
|
||||
api_line.find('.icon-collapse').removeClass('close');
|
||||
api_collapse.css('display', 'grid');
|
||||
}
|
||||
|
||||
resetSection('apikey-display', false, true);
|
||||
});
|
||||
|
||||
$('.api-tab-collapse .icon-clone').off('click').on('click', function() {
|
||||
const data_to_copy = $(this).data('copy');
|
||||
const selector = $(this).data('success');
|
||||
copyToClipboard(data_to_copy, str_copy_key_id, `#${selector}`);
|
||||
});
|
||||
|
||||
$('.api-tab-line .edit-mode').off('click').on('click', function() {
|
||||
const selector = $(this).parent().data('api');
|
||||
openApiEditModal(`#${selector}`);
|
||||
});
|
||||
|
||||
$('.api-tab-line .delete-mode').off('click').on('click', function() {
|
||||
const selector = $(this).parent().data('api');
|
||||
openApiRevokeModal(`#${selector}`);
|
||||
});
|
||||
|
||||
}
|
||||
|
||||
function resetSection(selector, scroll = true, maxContent = false) {
|
||||
const el = $(`#${selector}`);
|
||||
const element = el.get(0);
|
||||
const scrollH = maxContent ? 'max-content' : element.scrollHeight + 'px';
|
||||
element.style.maxHeight = scrollH;
|
||||
|
||||
if ('account-display' !== selector && scroll) {
|
||||
setTimeout(() => {
|
||||
const el = $(`#${selector.split('-')[0]}-section`).get(0);
|
||||
el.scrollIntoView({
|
||||
behavior: 'smooth',
|
||||
block: 'start'
|
||||
});
|
||||
}, 200);
|
||||
}
|
||||
}
|
||||
|
||||
function openApiModal() {
|
||||
$('#api_modal').fadeIn();
|
||||
$('#api_key_name').trigger('focus');
|
||||
saveApiKeyEvent();
|
||||
}
|
||||
|
||||
function closeApiModal() {
|
||||
$('#api_modal').fadeOut(() => {
|
||||
$('#api_key_name').val('');
|
||||
$('select[name="api_expiration"]').val(selected_date).trigger('change');
|
||||
$('#api_expiration_date').val('');
|
||||
|
||||
$('#api_secret_key').val('');
|
||||
$('#retrieves_keyapi').hide();
|
||||
$('#generate_keyapi').show();
|
||||
$('#done_apikey').attr('disabled', true);
|
||||
$('#api_key_copy_success, #api_id_copy_success').addClass('api-hide');
|
||||
});
|
||||
unbindApiKeyEvents();
|
||||
}
|
||||
|
||||
function successApiModal(secret, id) {
|
||||
$('#api_secret_key').val(secret);
|
||||
$('#api_id_key').val(id);
|
||||
|
||||
$('#generate_keyapi').hide();
|
||||
$('#retrieves_keyapi').fadeIn();
|
||||
|
||||
$('#api_secret_copy').off('click').on('click', function() {
|
||||
const copy = copyToClipboard(secret, str_copy_key_secret, '#api_key_copy_success');
|
||||
|
||||
$('#done_apikey').removeAttr('disabled');
|
||||
$('#done_apikey').on('click', closeApiModal);
|
||||
});
|
||||
|
||||
$('#api_id_copy').off('click').on('click', function() {
|
||||
const copy = copyToClipboard(id, str_copy_key_id, '#api_id_copy_success');
|
||||
});
|
||||
}
|
||||
|
||||
//api edit modal
|
||||
function openApiEditModal(selector) {
|
||||
const value = $(selector).find('.api_name').text();
|
||||
const pkid = $(selector).find('.api-icon-action').data('pkid');
|
||||
$('#api_key_edit').val(value);
|
||||
$('#api_modal_edit').fadeIn();
|
||||
$('#api_key_edit').trigger('focus');
|
||||
saveApiEditEvents(pkid);
|
||||
}
|
||||
|
||||
function closeApiEditModal() {
|
||||
$('#api_modal_edit').fadeOut(() => {
|
||||
$('#api_key_edit').val('');
|
||||
unbindApiEditEvents();
|
||||
});
|
||||
}
|
||||
|
||||
function saveApiEditEvents(pkid) {
|
||||
$('#save_api_edit').on('click', function() {
|
||||
const value = $('#api_key_edit').val();
|
||||
|
||||
if ('' == value) {
|
||||
$('#error_api_key_edit').show();
|
||||
return;
|
||||
}
|
||||
setInfos(
|
||||
{
|
||||
pkid,
|
||||
key_name: value,
|
||||
},
|
||||
'pwg.users.api_key.edit',
|
||||
(res) => {
|
||||
pwgToaster({ text: str_api_edited, icon: 'success' });
|
||||
getAllApiKeys(true);
|
||||
closeApiEditModal();
|
||||
}
|
||||
);
|
||||
});
|
||||
}
|
||||
|
||||
function unbindApiEditEvents() {
|
||||
$('#save_api_edit').off('click');
|
||||
}
|
||||
|
||||
// api revoke modal
|
||||
function openApiRevokeModal(selector) {
|
||||
const apiName = $(selector).find('.api_name').text();
|
||||
const pkid = $(selector).find('.api-icon-action').data('pkid');
|
||||
const text = sprintf(str_revoke_key, apiName);
|
||||
$('#api_modal_revoke_title').text(text);
|
||||
|
||||
$('#api_modal_revoke').fadeIn();
|
||||
saveApiRevokeEvents(pkid);
|
||||
}
|
||||
|
||||
function closeApiRevokeModal() {
|
||||
$('#api_modal_revoke').fadeOut(() => {
|
||||
$('#api_modal_revoke_title').text('');
|
||||
unbindApiRevokeEvents();
|
||||
});
|
||||
}
|
||||
|
||||
function saveApiRevokeEvents(pkid) {
|
||||
$('#revoke_api_key').on('click', function() {
|
||||
setInfos(
|
||||
{
|
||||
pkid,
|
||||
},
|
||||
'pwg.users.api_key.revoke',
|
||||
(res) => {
|
||||
pwgToaster({ text: str_api_revoked, icon: 'success' });
|
||||
getAllApiKeys(true);
|
||||
closeApiRevokeModal();
|
||||
}
|
||||
);
|
||||
});
|
||||
}
|
||||
|
||||
function unbindApiRevokeEvents() {
|
||||
$('#revoke_api_key').off('click');
|
||||
}
|
||||
|
||||
function copyToClipboard(copy, message, selector = null) {
|
||||
if (window.isSecureContext && navigator.clipboard) {
|
||||
navigator.clipboard.writeText(copy);
|
||||
if (selector) {
|
||||
$(selector).removeClass('api-hide');
|
||||
// auto hide
|
||||
// setTimeout(() => {
|
||||
// $(selector).addClass('api-hide');
|
||||
// }, 1000);
|
||||
} else {
|
||||
pwgToaster({ text: message, icon: 'success' });
|
||||
}
|
||||
return true;
|
||||
} else {
|
||||
pwgToaster({ text: str_cant_copy, icon: 'error' });
|
||||
return false;
|
||||
}
|
||||
}
|
||||
|
||||
function saveApiKeyEvent() {
|
||||
const handler = () => {
|
||||
const api_name = $('#api_key_name').val();
|
||||
let api_duration = $('select[name="api_expiration"]').val();
|
||||
|
||||
if (api_name == '') {
|
||||
$('#error_api_key_name').show();
|
||||
return;
|
||||
}
|
||||
|
||||
if ('custom' === api_duration && !$('#api_expiration_date').val()) {
|
||||
$('#error_api_key_date').show();
|
||||
return;
|
||||
}
|
||||
|
||||
|
||||
unbindApiKeyEvents();
|
||||
|
||||
if ('custom' === api_duration) {
|
||||
const today = new Date();
|
||||
const custom_date = new Date($('#api_expiration_date').val());
|
||||
const one_day = 1000 * 60 * 60 * 24;
|
||||
const days = Math.ceil((custom_date.getTime() - today.getTime() ) / (one_day));
|
||||
api_duration = days;
|
||||
} else {
|
||||
api_duration = Number(api_duration) ?? 1;
|
||||
}
|
||||
|
||||
setInfos(
|
||||
{
|
||||
key_name: api_name,
|
||||
duration: api_duration
|
||||
},
|
||||
'pwg.users.api_key.create',
|
||||
(res) => {
|
||||
pwgToaster({ text: str_api_added, icon: 'success' });
|
||||
getAllApiKeys(true);
|
||||
successApiModal(res.apikey_secret, res.auth_key);
|
||||
},
|
||||
(err) => {
|
||||
saveApiKeyEvent();
|
||||
}
|
||||
);
|
||||
}
|
||||
|
||||
$('#save_apikey').on('click.apikey', handler);
|
||||
$(window).on('keydown.apikey', function(e) {
|
||||
if (e.key === 'Enter') {
|
||||
e.preventDefault();
|
||||
handler();
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
function unbindApiKeyEvents() {
|
||||
$('#api_modal').find('*').addBack().off('.apikey');
|
||||
$(window).off('.apikey');
|
||||
}
|
||||
@@ -0,0 +1,133 @@
|
||||
let modeCookie = getCookie("mode");
|
||||
if("" != modeCookie)
|
||||
{
|
||||
toggle_mode(modeCookie);
|
||||
}
|
||||
else
|
||||
{
|
||||
let prefersDark = window.matchMedia('(prefers-color-scheme: dark)').matches;
|
||||
console.log(prefersDark)
|
||||
toggle_mode(prefersDark ? "dark" : "light");
|
||||
}
|
||||
|
||||
window.matchMedia('(prefers-color-scheme: dark)').addEventListener('change', event => {
|
||||
let newMode = event.matches ? "dark" : "light";
|
||||
toggle_mode(newMode);
|
||||
});
|
||||
|
||||
jQuery( document ).ready(function() {
|
||||
jQuery("#selected-language").textContent = selected_language;
|
||||
|
||||
//Override empty input message
|
||||
jQuery("form").on("submit", function (e) {
|
||||
let isValid = true;
|
||||
|
||||
jQuery(".column-flex").each(function (i) {
|
||||
// Because we overid the default browser error message
|
||||
// we need to distinguish which fields are now required
|
||||
// To do this we use data-required="true" on the input
|
||||
let input = $(this).find("input");
|
||||
if($(input).data("required") == true)
|
||||
{
|
||||
let input = jQuery(this).find("input");
|
||||
let errorMessage = jQuery(this).find(".error-message");
|
||||
if (!input.val().trim()) {
|
||||
|
||||
e.preventDefault();
|
||||
input[0].setCustomValidity(""); // Override browser tooltip (empty space hides it)
|
||||
errorMessage.show();
|
||||
isValid = false;
|
||||
} else {
|
||||
input[0].setCustomValidity("");
|
||||
errorMessage.hide();
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
return isValid;
|
||||
});
|
||||
|
||||
// Hide error message and reset validation on input
|
||||
jQuery(".column-flex input").on("input", function () {
|
||||
let errorMessage = jQuery(this).closest(".column-flex").find(".error-message");
|
||||
jQuery(this)[0].setCustomValidity(""); // Reset browser tooltip
|
||||
errorMessage.hide();
|
||||
});
|
||||
|
||||
|
||||
// Hide error message when user starts typing
|
||||
jQuery(".column-flex input").on("input", function () {
|
||||
jQuery(this).closest(".column-flex").find(".error-message").hide();
|
||||
});
|
||||
|
||||
});
|
||||
|
||||
function toggle_mode(mode) {
|
||||
setCookie("mode",mode,30);
|
||||
if ("dark" == mode)
|
||||
{
|
||||
//Dark mode
|
||||
jQuery( "#toggle_mode_light" ).hide();
|
||||
jQuery( "#toggle_mode_dark" ).show();
|
||||
jQuery( "#mode" ).addClass("dark");
|
||||
jQuery( "#mode" ).removeClass("light");
|
||||
jQuery( "#piwigo-logo" ).attr("src", url_logo_dark);
|
||||
}
|
||||
else
|
||||
{
|
||||
//Light mode
|
||||
jQuery( "#toggle_mode_dark" ).hide();
|
||||
jQuery( "#toggle_mode_light" ).show();
|
||||
jQuery( "#mode" ).addClass("light");
|
||||
jQuery( "#mode" ).removeClass("dark");
|
||||
jQuery( "#piwigo-logo" ).attr("src", url_logo_light);
|
||||
}
|
||||
}
|
||||
|
||||
function setCookie(cname, cvalue, exdays) {
|
||||
const d = new Date();
|
||||
d.setTime(d.getTime() + (exdays*24*60*60*1000));
|
||||
let expires = "expires="+ d.toUTCString();
|
||||
document.cookie = cname + "=" + cvalue + ";" + expires + ";path=/";
|
||||
if (cname == "lang")
|
||||
{
|
||||
location.reload();
|
||||
}
|
||||
}
|
||||
|
||||
function getCookie(cname) {
|
||||
let name = cname + "=";
|
||||
let decodedCookie = decodeURIComponent(document.cookie);
|
||||
let ca = decodedCookie.split(';');
|
||||
for(let i = 0; i <ca.length; i++) {
|
||||
let c = ca[i];
|
||||
while (c.charAt(0) == ' ') {
|
||||
c = c.substring(1);
|
||||
}
|
||||
if (c.indexOf(name) == 0) {
|
||||
return c.substring(name.length, c.length);
|
||||
}
|
||||
}
|
||||
return "";
|
||||
}
|
||||
|
||||
jQuery(".togglePassword").click(function(e){
|
||||
var toggle = jQuery(e.target);
|
||||
var input = (jQuery(toggle).siblings('input'))[0];
|
||||
if (input.type === "password") {
|
||||
input.type = "text";
|
||||
jQuery(toggle).css("color", "#ff7700");
|
||||
} else {
|
||||
input.type = "password";
|
||||
jQuery(toggle).css("color","#898989");
|
||||
}
|
||||
});
|
||||
|
||||
jQuery("#other-languages a").click(function(e){
|
||||
let clickedUrl = new URL(jQuery(e.target).attr('href'));
|
||||
let selectedLang = clickedUrl.searchParams.get("lang");
|
||||
|
||||
if (selectedLang) {
|
||||
setCookie('lang',selectedLang,1);
|
||||
}
|
||||
});
|
||||
@@ -0,0 +1,32 @@
|
||||
function pwgToaster(info) {
|
||||
if (!info.text || !info.icon) {
|
||||
console.log('set info.text or info.icon');
|
||||
return;
|
||||
}
|
||||
|
||||
if (typeof info.text !== 'string') {
|
||||
console.log('info.text is not a string');
|
||||
return;
|
||||
}
|
||||
|
||||
if (info.icon !== 'success' && info.icon !== 'error') {
|
||||
console.log('info.icon must be success or error');
|
||||
return;
|
||||
}
|
||||
|
||||
const template = $('#toast_template').clone();
|
||||
|
||||
template.find('.toast_text').html(info.text);
|
||||
template.find('.toast_icon').addClass(info.icon === 'success' ? 'icon-ok' : 'icon-cancel');
|
||||
template.addClass(info.icon === 'success' ? info.icon : 'error');
|
||||
|
||||
template.removeClass('template-pwg-toaster');
|
||||
template.appendTo('#pwg_toaster');
|
||||
|
||||
const time = info.time ?? 3600;
|
||||
setTimeout(() => {
|
||||
template.fadeOut(() => {
|
||||
template.remove();
|
||||
})
|
||||
}, time);
|
||||
}
|
||||
@@ -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;
|
||||
}
|
||||
@@ -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;
|
||||
}
|
||||
Binary file not shown.
|
After Width: | Height: | Size: 25 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 24 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 24 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 24 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 24 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 24 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 23 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 24 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 24 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 24 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 24 KiB |
@@ -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;
|
||||
}
|
||||
@@ -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;
|
||||
}
|
||||
@@ -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;
|
||||
}
|
||||
Binary file not shown.
|
After Width: | Height: | Size: 28 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 29 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 28 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 27 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 29 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 27 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 29 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 30 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 28 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 26 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 28 KiB |
@@ -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;
|
||||
}
|
||||
@@ -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;
|
||||
}
|
||||
@@ -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;
|
||||
}
|
||||
@@ -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;
|
||||
}
|
||||
@@ -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;
|
||||
}
|
||||
@@ -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;
|
||||
}
|
||||
@@ -0,0 +1,6 @@
|
||||
<!-- BEGIN get_combined -->
|
||||
{get_combined_scripts load='footer'}
|
||||
<!-- END get_combined -->
|
||||
|
||||
</body>
|
||||
</html>
|
||||
@@ -0,0 +1,42 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="{$lang_info.code}" dir="{$lang_info.direction}">
|
||||
<head>
|
||||
{if $SHOW_MOBILE_APP_BANNER}
|
||||
<meta name="apple-itunes-app" content="app-id=472225196">
|
||||
{/if}
|
||||
<meta charset="{$CONTENT_ENCODING}">
|
||||
<meta name="generator" content="Piwigo (aka PWG), see piwigo.org">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||
|
||||
<title>{if $PAGE_TITLE!=l10n('Home') && $PAGE_TITLE!=$GALLERY_TITLE}{$PAGE_TITLE} | {/if}{$GALLERY_TITLE}</title>
|
||||
<link rel="shortcut icon" type="image/x-icon" href="{$ROOT_URL}{$themeconf.icon_dir}/favicon.ico">
|
||||
|
||||
{strip}
|
||||
{foreach from=$themes item=theme}
|
||||
{if $theme.load_css}
|
||||
{combine_css path="themes/`$theme.id`/theme.css" order=-10}
|
||||
{/if}
|
||||
{if !empty($theme.local_head)}
|
||||
{include file=$theme.local_head load_css=$theme.load_css}
|
||||
{/if}
|
||||
{/foreach}
|
||||
|
||||
{combine_script id="jquery" load="header"}
|
||||
{/strip}
|
||||
|
||||
<!-- BEGIN get_combined -->
|
||||
{get_combined_css}
|
||||
|
||||
{get_combined_scripts load='header'}
|
||||
<!-- END get_combined -->
|
||||
|
||||
{if not empty($head_elements)}
|
||||
{foreach from=$head_elements item=elt}
|
||||
{$elt}
|
||||
{/foreach}
|
||||
{/if}
|
||||
</head>
|
||||
|
||||
<body id="{$BODY_ID}" class="{foreach from=$BODY_CLASSES item=class}{$class} {/foreach}" data-infos='{$BODY_DATA}'>
|
||||
|
||||
<div id="the_page">
|
||||
@@ -0,0 +1,123 @@
|
||||
{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}
|
||||
|
||||
<script>
|
||||
var selected_language = `{$language_options[$current_language]}`;
|
||||
var url_logo_light = `{$ROOT_URL}themes/standard_pages/images/piwigo_logo.svg`;
|
||||
var url_logo_dark = `{$ROOT_URL}themes/standard_pages/images/piwigo_logo_dark.svg`;
|
||||
</script>
|
||||
{combine_script id='standard_pages_js' load='async' require='jquery' path='themes/standard_pages/js/standard_pages.js'}
|
||||
|
||||
<container id="mode" class="light">
|
||||
|
||||
<section id="header-options">
|
||||
<div>
|
||||
<i class="gallery-icon-moon toggle-mode" id="toggle_mode_light" onclick="toggle_mode('dark')"></i>
|
||||
<i class="gallery-icon-sun toggle-mode" id="toggle_mode_dark" onclick="toggle_mode('light')"></i>
|
||||
</div>
|
||||
<div>
|
||||
<a href="{$HELP_LINK}" target="_blank">{'Help'|translate}</a>
|
||||
{if isset($errors['login_page_error'])}
|
||||
<div class="error_block_container">
|
||||
{foreach from=$errors['login_page_error'] item=error}
|
||||
<div class="error_block">
|
||||
<i class="gallery-icon-cancel"></i>
|
||||
<p>{$error}</p>
|
||||
</div>
|
||||
{/foreach}
|
||||
</div>
|
||||
{/if}
|
||||
</div>
|
||||
</section>
|
||||
|
||||
{if 'none' != $STD_PGS_SELECTED_LOGO}
|
||||
<section id="logo-section">
|
||||
{if 'piwigo_logo' == $STD_PGS_SELECTED_LOGO}
|
||||
<img id="piwigo-logo" src="{$ROOT_URL}themes/standard_pages/images/piwigo_logo.svg">
|
||||
{else if 'custom_logo' == $STD_PGS_SELECTED_LOGO}
|
||||
<img id="custom-logo" src="{$STD_PGS_SELECTED_LOGO_PATH}">
|
||||
{else if 'gallery_title'}
|
||||
<h1>{$GALLERY_TITLE}</h1>
|
||||
{/if}
|
||||
</section>
|
||||
{/if}
|
||||
|
||||
<section id="login-form">
|
||||
<div class="">
|
||||
<h1 class="">
|
||||
{'Login'|translate}
|
||||
</h1>
|
||||
|
||||
<form class="properties" action="{$F_LOGIN_ACTION}" method="post" name="login_form">
|
||||
|
||||
<div class="column-flex">
|
||||
<label for="username">{'Username'|translate}</label>
|
||||
<div class="row-flex input-container">
|
||||
<i class="gallery-icon-user"></i>
|
||||
<input type="text" class="" type="text" name="username" id="username" size="25" autofocus data-required="true">
|
||||
</div>
|
||||
<p class="error-message"><i class="gallery-icon-attention-circled"></i> {'must not be empty'|translate}</p>
|
||||
</div>
|
||||
|
||||
<div class="column-flex">
|
||||
<label for="password">{'Password'|translate}</label>
|
||||
<div class="row-flex input-container">
|
||||
<i class="gallery-icon-lock"></i>
|
||||
<input type="password" class="" name="password" id="password" size="25">
|
||||
<i class="gallery-icon-eye togglePassword"></i>
|
||||
</div>
|
||||
<p class="error-message"><i class="gallery-icon-attention-circled"></i> {'must not be empty'|translate}</p>
|
||||
</div>
|
||||
|
||||
{if $authorize_remembering }
|
||||
<div class="column-flex">
|
||||
<div class="row-flex remember-me-container">
|
||||
<label for="remember_me">
|
||||
<input tabindex="3" type="checkbox" name="remember_me" id="remember_me" value="1">
|
||||
<span class="gallery-icon-checkmark"></span>
|
||||
{'Auto login'|@translate}</label>
|
||||
</div>
|
||||
</div>
|
||||
{/if}
|
||||
|
||||
<div class="column-flex">
|
||||
<input type="hidden" name="redirect" value="{$U_REDIRECT|@urlencode}">
|
||||
<input tabindex="4" type="submit" name="login" value="{'Login'|translate}" class="btn btn-main ">
|
||||
{if isset($errors['login_form_error'])}
|
||||
<p class="error-message" style="display:block;bottom:-20px;"><i class="gallery-icon-attention-circled"></i> {$errors['login_form_error']}</p>
|
||||
{/if}
|
||||
</div>
|
||||
</form>
|
||||
|
||||
<div class="secondary-links">
|
||||
|
||||
{if isset($U_REGISTER)}
|
||||
<p>{'Don\'t have an account yet ?'|translate} <a href="register.php" title="{'Register'|translate}">{'Create an account'|translate}</a></p>
|
||||
<span id="separator"></span>
|
||||
{/if}
|
||||
<a href="password.php" title="{'Forgot your password?'|translate}">{'Forgot your password?'|translate}</a>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<a href="index.php" id="return-to-gallery"><i class="gallery-icon-left"></i> {'Return to the gallery'|translate}</a>
|
||||
|
||||
{if count($language_options) > 1}
|
||||
<section id="language-switch">
|
||||
<div id="lang-select">
|
||||
<span id="other-languages">
|
||||
{foreach from=$language_options key=code item=lang}
|
||||
<span id="lang={$code}" onclick="setCookie('lang','{$code}',30)">{$lang}</span>
|
||||
{/foreach}
|
||||
</span>
|
||||
<div id="selected-language-container">
|
||||
<i class="gallery-icon-left-chevron"></i><span id="selected-language">{$language_options[$current_language]}</span>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</section>
|
||||
{/if}
|
||||
|
||||
</container>
|
||||
@@ -0,0 +1,181 @@
|
||||
{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}
|
||||
|
||||
<script>
|
||||
var selected_language = `{$language_options[$current_language]}`;
|
||||
var url_logo_light = `{$ROOT_URL}themes/standard_pages/images/piwigo_logo.svg`;
|
||||
var url_logo_dark = `{$ROOT_URL}themes/standard_pages/images/piwigo_logo_dark.svg`;
|
||||
</script>
|
||||
{combine_script id='standard_pages_js' load='async' require='jquery' path='themes/standard_pages/js/standard_pages.js'}
|
||||
|
||||
<container id="mode" class="light">
|
||||
|
||||
<section id="header-options">
|
||||
<div>
|
||||
<i class="gallery-icon-moon toggle-mode" id="toggle_mode_light" onclick="toggle_mode('dark')"></i>
|
||||
<i class="gallery-icon-sun toggle-mode" id="toggle_mode_dark" onclick="toggle_mode('light')"></i>
|
||||
</div>
|
||||
<div>
|
||||
<a href="{$HELP_LINK}" target="_blank">{'Help'|translate}</a>
|
||||
{if isset($errors['password_page_error'])}
|
||||
<div class="error_block_container">
|
||||
{foreach from=$errors['password_page_error'] item=error}
|
||||
<div class="error_block">
|
||||
<i class="gallery-icon-cancel"></i>
|
||||
<p>{$error}</p>
|
||||
</div>
|
||||
{/foreach}
|
||||
</div>
|
||||
{/if}
|
||||
</section>
|
||||
|
||||
{if 'none' != $STD_PGS_SELECTED_LOGO}
|
||||
<section id="logo-section">
|
||||
{if 'piwigo_logo' == $STD_PGS_SELECTED_LOGO}
|
||||
<img id="piwigo-logo" src="{$ROOT_URL}themes/standard_pages/images/piwigo_logo.svg">
|
||||
{else if 'custom_logo' == $STD_PGS_SELECTED_LOGO}
|
||||
<img id="custom-logo" src="{$STD_PGS_SELECTED_LOGO_PATH}">
|
||||
{else if 'gallery_title'}
|
||||
<h1>{$GALLERY_TITLE}</h1>
|
||||
{/if}
|
||||
</section>
|
||||
{/if}
|
||||
|
||||
|
||||
<section id="password-form">
|
||||
<div class="">
|
||||
|
||||
{if $action eq 'lost' or $action eq 'reset' or $action eq 'lost_code'}
|
||||
<h1 class="">{if !isset($is_first_login)}{'Forgot your password?'|translate}{else}{'Welcome !'|translate}<br>{'It\'s your first login !'|translate}{/if}</h1>
|
||||
<form id="lostPassword" class="properties" action="{$form_action}?action={$action}{if isset($key)}&key={$key}{/if}" method="post">
|
||||
|
||||
<input type="hidden" name="pwg_token" value="{$PWG_TOKEN}">
|
||||
{if $action eq 'lost'}
|
||||
|
||||
<p class="form-instructions">{'Please enter your username or email address.'|@translate} {'You will receive a link to create a new password via email.'|@translate}</p>
|
||||
|
||||
<div class="column-flex">
|
||||
<label for="username">{'Username or email'|@translate}</label>
|
||||
<div class="row-flex input-container">
|
||||
<i class="gallery-icon-user-2"></i>
|
||||
<input type="text" id="username_or_email" name="username_or_email" size="100" maxlength="100"{if isset($username_or_email)} value="{$username_or_email}"{/if} autofocus data-required="true">
|
||||
</div>
|
||||
<p class="error-message"><i class="gallery-icon-attention-circled"></i> {'must not be empty'|translate}</p>
|
||||
</div>
|
||||
|
||||
<div class="column-flex">
|
||||
<input tabindex="4" type="submit" name="submit" value="{'Change my password'|@translate}" class="btn btn-main ">
|
||||
{if isset($errors['password_form_error'])}
|
||||
<p class="error-message" style="display:block;bottom:-20px;"><i class="gallery-icon-attention-circled"></i> {$errors['password_form_error']}</p>
|
||||
{/if}
|
||||
</div>
|
||||
|
||||
{elseif $action eq 'reset'}
|
||||
<p class="intro-paragraph">
|
||||
{if !isset($is_first_login)}
|
||||
{'Hello <em>%s</em>, enter your new password below.'|@translate:$username}
|
||||
{else}
|
||||
{'Let\'s set your password below.'|translate}
|
||||
{/if}
|
||||
</p>
|
||||
|
||||
{if isset($is_first_login)}
|
||||
<div class="column-flex">
|
||||
<label for="username">{'Username'|translate}</label>
|
||||
<div class="row-flex input-container">
|
||||
<i class="gallery-icon-user-2"></i>
|
||||
<input type="text" class="" type="text" name="username" id="username" size="25" value={$username} disabled >
|
||||
</div>
|
||||
</div>
|
||||
{/if}
|
||||
|
||||
<div class="column-flex">
|
||||
<label for="password">{if isset($is_first_login)}{'Password'|translate}{else}{'New password'|translate}{/if}</label>
|
||||
<div class="row-flex input-container">
|
||||
<i class="gallery-icon-lock"></i>
|
||||
<input type="password" class="" name="use_new_pwd" id="use_new_pwd" size="25" autofocus >
|
||||
<i class="gallery-icon-eye togglePassword"></i>
|
||||
</div>
|
||||
<p class="error-message"><i class="gallery-icon-attention-circled"></i> {'must not be empty'|translate}</p>
|
||||
</div>
|
||||
|
||||
<div class="column-flex">
|
||||
<label for="passwordConf">{if isset($is_first_login)}{'Confirm Password'|translate}{else}{'Confirm new password'|translate}{/if}</label>
|
||||
<div class="row-flex input-container">
|
||||
<i class="gallery-icon-lock"></i>
|
||||
<input type="password" name="passwordConf" id="passwordConf" >
|
||||
<i class="gallery-icon-eye togglePassword"></i>
|
||||
</div>
|
||||
<p class="error-message"><i class="gallery-icon-attention-circled"></i> {'must not be empty'|translate}</p>
|
||||
</div>
|
||||
|
||||
<div class="column-flex">
|
||||
<input tabindex="4" type="submit" name="submit" {if !isset($is_first_login)}value="{'Confirm my new password'|@translate}"{else}value="{'Set my password'|@translate}"{/if} class="btn btn-main ">
|
||||
</div>
|
||||
|
||||
{elseif $action eq 'lost_code'}
|
||||
<span class="success-message"><i class="gallery-icon-ok-circled"></i>{'If your account exists, a verification code has been sent to your email address.'|translate}</span>
|
||||
<div class="column-flex">
|
||||
<label for="user_code">{'Verification code'|@translate}</label>
|
||||
<div class="row-flex input-container">
|
||||
<i class="gallery-icon-user-2"></i>
|
||||
<input type="text" id="user_code" name="user_code" size="100" maxlength="100" autofocus>
|
||||
</div>
|
||||
<p class="error-message"><i class="gallery-icon-attention-circled"></i> {'must not be empty'|translate}</p>
|
||||
</div>
|
||||
|
||||
<div class="column-flex">
|
||||
<input tabindex="4" type="submit" name="submit" value="{'Verify'|@translate}" class="btn btn-main">
|
||||
{if isset($errors['password_form_error'])}
|
||||
<p class="error-message" style="display:block;bottom:-20px;"><i class="gallery-icon-attention-circled"></i> {$errors['password_form_error']}</p>
|
||||
{/if}
|
||||
<p style="font-size: 12px;">{"If you do not receive the email, please contact your webmaster."|translate}</p>
|
||||
</div>
|
||||
{/if}
|
||||
</form>
|
||||
|
||||
<div class="secondary-links">
|
||||
<p>{'Return to <a href="identification.php" title="Sign in">Sign in</a>'|translate}</p>
|
||||
</div>
|
||||
{else}
|
||||
{if $action eq 'lost_end'}
|
||||
<span class="success-message"><i class="gallery-icon-ok-circled"></i>{'An email has been sent with a link to reset your password'|translate}</span>
|
||||
<p>{'Check your inbox.'|translate}</p>
|
||||
{elseif $action eq 'reset_end'}
|
||||
{if isset($is_first_login)}{assign var="string" value=""}{else}{assign var="string" value="reset"}{/if}
|
||||
<span class="success-message"><i class="gallery-icon-ok-circled"></i>
|
||||
{if isset($is_first_login)}
|
||||
{'Your password was successfully set'|translate}
|
||||
{else}
|
||||
{'Your password was successfully reset'|translate}
|
||||
{/if}
|
||||
</span>
|
||||
<a href="identification.php" title="{'Login'|translate}" class="btn-main">{'Login'|translate}</a>
|
||||
{else}
|
||||
<p>{'An error has occured please got back to <a href="identification.php" title="Sign in">Sign in</a> or <a href="register.php">Register</a>'|translate}</p>
|
||||
{/if}
|
||||
{/if}
|
||||
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<a href="index.php" id="return-to-gallery"><i class="gallery-icon-left-chevron"></i> {'Return to the gallery'|translate}</a>
|
||||
|
||||
{if count($language_options) > 1}
|
||||
<section id="language-switch">
|
||||
<div id="lang-select">
|
||||
<span id="other-languages">
|
||||
{foreach from=$language_options key=code item=lang}
|
||||
<span id="lang={$code}" onclick="setCookie('lang','{$code}',30)">{$lang}</span>
|
||||
{/foreach}
|
||||
</span>
|
||||
<div id="selected-language-container">
|
||||
<i class="gallery-icon-left-chevron"></i><span id="selected-language">{$language_options[$current_language]}</span>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</section>
|
||||
{/if}
|
||||
|
||||
|
||||
</container>
|
||||
@@ -0,0 +1,495 @@
|
||||
{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}
|
||||
{combine_css path="admin/themes/default/fontello/css/fontello.css" order=-11}
|
||||
|
||||
<script>
|
||||
var selected_language = `{$language_options[$language_selection]}`;
|
||||
var url_logo_light = `{$ROOT_URL}themes/standard_pages/images/piwigo_logo.svg`;
|
||||
var url_logo_dark = `{$ROOT_URL}themes/standard_pages/images/piwigo_logo_dark.svg`;
|
||||
</script>
|
||||
{combine_script id='standard_pages_js' load='async' require='jquery' path='themes/standard_pages/js/standard_pages.js'}
|
||||
{combine_script id='standard_profile_js' load='footer' require='jquery' path='themes/standard_pages/js/profile.js'}
|
||||
{combine_script id='common' load='footer' require='jquery' path='admin/themes/default/js/common.js'}
|
||||
{footer_script}
|
||||
let user = {
|
||||
username: "{$USERNAME}",
|
||||
email: "{$EMAIL}",
|
||||
nb_image_page: $('input[name="nb_image_page"]').val(),
|
||||
theme: $('select[name="theme"]').val(),
|
||||
language: $('select[name="language"]').val(),
|
||||
recent_period: $('input[name="recent_period"]').val(),
|
||||
opt_album: $('#opt_album').is(':checked'),
|
||||
opt_comment: $('#opt_comment').is(':checked'),
|
||||
opt_hits: $('#opt_hits').is(':checked')
|
||||
}
|
||||
|
||||
const canUpdatePreferences = {if $ALLOW_USER_CUSTOMIZATION}true{else}false{/if};
|
||||
const canUpdatePassword = {if not $SPECIAL_USER}true{else}false{/if};
|
||||
const standardSaveSelector = [];
|
||||
const preferencesDefaultValues = {
|
||||
nb_image_page: {$DEFAULT_USER_VALUES['nb_image_page']},
|
||||
recent_period: {$DEFAULT_USER_VALUES['recent_period']},
|
||||
opt_album: {$DEFAULT_USER_VALUES['expand']},
|
||||
opt_comment: {$DEFAULT_USER_VALUES['show_nb_comments']},
|
||||
opt_hits: {$DEFAULT_USER_VALUES['show_nb_hits']},
|
||||
};
|
||||
const selected_date = "{$API_SELECTED_EXPIRATION}";
|
||||
const can_manage_api = {($API_CAN_MANAGE) ? "true" : "false"};
|
||||
|
||||
const str_copy_key_id = "{"ID copied."|translate|escape:javascript}";
|
||||
const str_copy_key_secret = "{"Secret copied. Keep it in a safe place."|translate|escape:javascript}";
|
||||
const str_cant_copy = "{"Impossible to copy automatically. Please copy manually."|translate|escape:javascript}";
|
||||
const str_api_added = "{"The api key has been successfully created."|translate|escape:javascript}";
|
||||
const str_revoked = "{"Revoked"|translate|escape:javascript}";
|
||||
const str_show_expired = "{"Show expired keys"|translate|escape:javascript}";
|
||||
const str_hide_expired = "{"Hide expired keys"|translate|escape:javascript}";
|
||||
const str_handle_error = "{"An error has occured"|translate|escape:javascript}";
|
||||
const str_expires_in = "{"Expires in"|translate|escape:javascript}";
|
||||
const str_expires_on = "{"Expired on"|translate|escape:javascript}";
|
||||
const str_revoke_key = "{'Do you really want to revoke the "%s" API key?'|translate|escape:javascript}";
|
||||
const str_api_revoked = "{"API Key has been successfully revoked."|translate|escape:javascript}";
|
||||
const str_api_edited = "{"API Key has been successfully edited."|translate|escape:javascript}";
|
||||
const no_time_elapsed = "{"right now"|translate|escape:javascript}";
|
||||
const str_must_not_empty = "{'must not be empty'|translate|escape:javascript}";
|
||||
{/footer_script}
|
||||
|
||||
<container id="mode" class="light">
|
||||
<section id="header-options">
|
||||
<div>
|
||||
<i class="gallery-icon-moon toggle-mode" id="toggle_mode_light" onclick="toggle_mode('dark')"></i>
|
||||
<i class="gallery-icon-sun toggle-mode" id="toggle_mode_dark" onclick="toggle_mode('light')"></i>
|
||||
</div>
|
||||
<div>
|
||||
<a href="{$HELP_LINK}" target="_blank">{'Help'|translate}</a>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
{if 'none' != $STD_PGS_SELECTED_LOGO}
|
||||
<section id="logo-section">
|
||||
{if 'piwigo_logo' == $STD_PGS_SELECTED_LOGO}
|
||||
<img id="piwigo-logo" src="{$ROOT_URL}themes/standard_pages/images/piwigo_logo.svg">
|
||||
{else if 'custom_logo' == $STD_PGS_SELECTED_LOGO}
|
||||
<img id="custom-logo" src="{$STD_PGS_SELECTED_LOGO_PATH}">
|
||||
{else if 'gallery_title'}
|
||||
<h1>{$GALLERY_TITLE}</h1>
|
||||
{/if}
|
||||
</section>
|
||||
{/if}
|
||||
|
||||
<a href="{$U_HOME}" id="return-to-gallery"><i class="gallery-icon-left"></i> {'Return to the gallery'|translate}</a>
|
||||
|
||||
{* ACCOUNT *}
|
||||
<section id="account-section" class="profile-section">
|
||||
<div class="title display-section" data-display="account-display">
|
||||
<div class="column-flex">
|
||||
<h1>{'Account'|translate}</h1>
|
||||
<p>{'Manage your account'|translate}</p>
|
||||
</div>
|
||||
<i class="gallery-icon-up-open display-btn close"></i>
|
||||
</div>
|
||||
<div class="form" id="account-display">
|
||||
<div class="column-flex first">
|
||||
<label>{'Username'|translate}</label>
|
||||
<div class="row-flex input-container username">
|
||||
<i class="gallery-icon-user"></i>
|
||||
<p id="username">{$USERNAME}</p>
|
||||
<input id="pwg_token" type="hidden" value="{$PWG_TOKEN}" />
|
||||
</div>
|
||||
</div>
|
||||
<div class="column-flex">
|
||||
<label for="email">{'Email address'|translate}</label>
|
||||
<div class="row-flex input-container">
|
||||
<i class="icon-mail-alt"></i>
|
||||
<input type="email" name="mail_address" id="email" value="{$EMAIL}" />
|
||||
</div>
|
||||
<p id="email_error" class="error-message"><i class="gallery-icon-attention-circled"></i>
|
||||
{'must not be empty'|translate}</p>
|
||||
</div>
|
||||
<div class="save">
|
||||
<button class="btn btn-main" id="save_account">{'Submit'|translate}</button>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
{* PREFERENCES *}
|
||||
{if $ALLOW_USER_CUSTOMIZATION}
|
||||
<section id="preferences-section" class="profile-section">
|
||||
<div class="title display-section" data-display="preferences-display">
|
||||
<div class="column-flex">
|
||||
<h1>{'Preferences'|translate}</h1>
|
||||
<p>{'Choose how you want to see your gallery'|translate}</p>
|
||||
</div>
|
||||
<i class="gallery-icon-up-open display-btn close" ></i>
|
||||
</div>
|
||||
<div class="form" id="preferences-display">
|
||||
<div class="column-flex first">
|
||||
<label for="nb_image_page">{'Number of photos per page'|translate}</label>
|
||||
<div class="row-flex input-container">
|
||||
<i class="icon-picture"></i>
|
||||
<input type="number" size="4" maxlength="3" name="nb_image_page" id="nb_image_page"
|
||||
value="{$NB_IMAGE_PAGE}" />
|
||||
</div>
|
||||
<p id="error_nb_image" class="error-message"><i class="gallery-icon-attention-circled"></i>
|
||||
{'must not be empty'|translate}</p>
|
||||
</div>
|
||||
|
||||
<div class="column-flex">
|
||||
<label>{'Theme'|translate}</label>
|
||||
<div class="row-flex input-container">
|
||||
<i class="icon-brush"></i>
|
||||
{html_options name=theme options=$template_options selected=$template_selection}
|
||||
</div>
|
||||
<p class="error-message"><i class="gallery-icon-attention-circled"></i> {'must not be empty'|translate}</p>
|
||||
</div>
|
||||
|
||||
<div class="column-flex">
|
||||
<label>{'Language'|translate}</label>
|
||||
<div class="row-flex input-container">
|
||||
<i class="icon-language"></i>
|
||||
{html_options name=language options=$language_options selected=$language_selection}
|
||||
</div>
|
||||
<p class="error-message"><i class="gallery-icon-attention-circled"></i> {'must not be empty'|translate}</p>
|
||||
</div>
|
||||
|
||||
<div class="column-flex">
|
||||
<label for="recent_period">{'Recent period'|translate}</label>
|
||||
<div class="row-flex input-container">
|
||||
<i class="icon-calendar"></i>
|
||||
<input type="number" size="3" maxlength="2" name="recent_period" id="recent_period"
|
||||
value="{$RECENT_PERIOD}" />
|
||||
</div>
|
||||
<p id="error_period" class="error-message"><i class="gallery-icon-attention-circled"></i>
|
||||
{'must not be empty'|translate}</p>
|
||||
</div>
|
||||
|
||||
{* OPTIONS *}
|
||||
<label class="options-title">{'Options'|translate}</label>
|
||||
<div class="column-flex input-container preferences-options">
|
||||
<div class="row-flex option">
|
||||
<label class="switch">
|
||||
<input type="checkbox" id="opt_album" {if "true" === $EXPAND}checked{/if}>
|
||||
<span class="slider round"></span>
|
||||
</label>
|
||||
<p>{'Expand all albums'|@translate}</p>
|
||||
</div>
|
||||
|
||||
{if $ACTIVATE_COMMENTS}
|
||||
<div class="row-flex option">
|
||||
<label class="switch">
|
||||
<input type="checkbox" id="opt_comment" {if "true" === $NB_COMMENTS}checked{/if}>
|
||||
<span class="slider round"></span>
|
||||
</label>
|
||||
<p>{'Show number of comments'|@translate}</p>
|
||||
</div>
|
||||
{/if}
|
||||
|
||||
<div class="row-flex option">
|
||||
<label class="switch">
|
||||
<input type="checkbox" id="opt_hits" {if "true" === $NB_HITS}checked{/if}>
|
||||
<span class="slider round"></span>
|
||||
</label>
|
||||
<p>{'Show number of hits'|@translate}</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="reset">
|
||||
<button class="btn btn-main btn-secondary"
|
||||
id="default_preferences">{'Reset to default values'|translate}</button>
|
||||
<div class="save">
|
||||
<button class="btn btn-main btn-secondary" id="reset_preferences">{'Reset'|translate}</button>
|
||||
<button class="btn btn-main" id="save_preferences">{'Submit'|translate}</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
{/if}
|
||||
|
||||
{* PASSWORD *}
|
||||
{if not $SPECIAL_USER}
|
||||
<section id="password-section" class="profile-section">
|
||||
<div class="title display-section" data-display="password-display">
|
||||
<div class="column-flex">
|
||||
<h1>{'Password'|translate}</h1>
|
||||
<p>{'Change your password'|translate}</p>
|
||||
</div>
|
||||
<i class="gallery-icon-up-open display-btn close" ></i>
|
||||
</div>
|
||||
<div class="form" id="password-display">
|
||||
<div class="column-flex">
|
||||
<label for="password">{'Password'|translate}</label>
|
||||
<div class="row-flex input-container">
|
||||
<i class="gallery-icon-lock"></i>
|
||||
<input type="password" class="" name="password" id="password" size="25" />
|
||||
<i class="gallery-icon-eye togglePassword"></i>
|
||||
</div>
|
||||
<p class="error-message"><i class="gallery-icon-attention-circled"></i> {'must not be empty'|translate}</p>
|
||||
</div>
|
||||
|
||||
<div class="column-flex">
|
||||
<label for="password_new">{'New password'|translate}</label>
|
||||
<div class="row-flex input-container">
|
||||
<i class="gallery-icon-lock"></i>
|
||||
<input type="password" class="" name="new-password" id="password_new" size="25" />
|
||||
<i class="gallery-icon-eye togglePassword"></i>
|
||||
</div>
|
||||
<p class="error-message"><i class="gallery-icon-attention-circled"></i> {'must not be empty'|translate}</p>
|
||||
</div>
|
||||
|
||||
<div class="column-flex">
|
||||
<label for="password_conf">{'Confirm my new password'|translate}</label>
|
||||
<div class="row-flex input-container">
|
||||
<i class="gallery-icon-lock"></i>
|
||||
<input type="password" class="" name="password_conf" id="password_conf" size="25" />
|
||||
<i class="gallery-icon-eye togglePassword"></i>
|
||||
</div>
|
||||
<p class="error-message"><i class="gallery-icon-attention-circled"></i> {'must not be empty'|translate}</p>
|
||||
</div>
|
||||
|
||||
<div class="save">
|
||||
<button class="btn btn-main" id="save_password">{'Submit'|translate}</button>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
{/if}
|
||||
|
||||
{* API KEY *}
|
||||
<section id="apikey-section" class="profile-section">
|
||||
<div class="title display-section" data-display="apikey-display">
|
||||
<div class="column-flex">
|
||||
<h1>{'API Keys'|translate}</h1>
|
||||
<p>{'Create API Keys to secure your acount'|translate}</p>
|
||||
</div>
|
||||
<i class="gallery-icon-up-open display-btn close"></i>
|
||||
</div>
|
||||
|
||||
<div class="form" id="apikey-display">
|
||||
<div class="api-cant-manage" id="cant_manage_api">
|
||||
<p>{'To manage your API keys, please log in with your username/password.'|translate|escape:html}</p>
|
||||
</div>
|
||||
|
||||
<div class="new-apikey can-manage">
|
||||
<button class="btn btn-main" id="new_apikey">{'New API Key'|translate}</button>
|
||||
</div>
|
||||
<div class="api-list can-manage">
|
||||
<div class="api-list-head api-tab">
|
||||
<div aria-hidden="true"></div>
|
||||
<p>{'API Key name'|translate}</p>
|
||||
<p>{'Created at'|translate}</p>
|
||||
<p>{'Last use'|translate}</p>
|
||||
<p id="api_expires_in">{'Expires in'|translate}</p>
|
||||
<div aria-hidden="true"></div>
|
||||
</div>
|
||||
<div class="api-list-body" id="api_key_list">
|
||||
|
||||
<div class="api-tab-line border-line template-api" id="api_line">
|
||||
<div class="api-icon-collapse">
|
||||
<i class="gallery-icon-up-open icon-collapse close" data-api=""></i>
|
||||
</div>
|
||||
<p class="api_name"></p>
|
||||
<p class="api_creation"></p>
|
||||
<p class="api_last_use"></p>
|
||||
<p class="api_expiration"></p>
|
||||
<div class="api-icon-action row-flex" data-api="" data-pkid="">
|
||||
<i class="icon-pencil edit-mode"></i>
|
||||
<i class="icon-trash-1 delete-mode"></i>
|
||||
</div>
|
||||
</div>
|
||||
<div class="api-tab-collapse border-line template-api" style="display: none;" id="api_collapse">
|
||||
<div aria-hidden="true"></div>
|
||||
<div class="keys">
|
||||
<div class="row-flex key">
|
||||
<i class="gallery-icon-hash"></i>
|
||||
<p class="api_key"></p>
|
||||
<i class="icon-clone" data-copy="" data-success=""></i>
|
||||
<p id="" class="api-copy api-hide success-message">{"ID copied."|translate|escape:html}</p>
|
||||
</div>
|
||||
<div class="row-flex key">
|
||||
<i class="icon-user-secret"></i>
|
||||
<p>{"The secret key can no longer be displayed."|translate}</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="new-apikey">
|
||||
<button class="btn btn-link" id="show_expired_list" data-show="false">{'Show expired keys'|translate}</button>
|
||||
</div>
|
||||
<div class="api-list-body" id="api_key_list_expired">
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{* API KEY MODAL *}
|
||||
<div class="bg-modal" id="api_modal">
|
||||
<div class="body-modal">
|
||||
<a class="icon-cancel close-modal" id="close_api_modal"></a>
|
||||
|
||||
<div id="generate_keyapi">
|
||||
<div class="head-modal">
|
||||
<p class="title-modal">{'Generate API Key'|translate}</p>
|
||||
<p class="subtitle-modal">{'Create a new API key to secure your account.'|translate}</p>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<div class="column-flex first">
|
||||
<label for="api_key_name">{'API Key name'|translate}</label>
|
||||
<div class="row-flex input-container">
|
||||
<i class="icon-key"></i>
|
||||
<input type="text" id="api_key_name" />
|
||||
</div>
|
||||
<p id="error_api_key_name" class="error-message"><i class="gallery-icon-attention-circled"></i>
|
||||
{'must not be empty'|translate}</p>
|
||||
</div>
|
||||
|
||||
<div class="row-flex section-expiration">
|
||||
<div class="column-flex">
|
||||
<label>{'Duration'|translate}</label>
|
||||
<div class="row-flex input-container api-expiration">
|
||||
<i class="gallery-icon-calendar"></i>
|
||||
{html_options name=api_expiration options=$API_EXPIRATION}
|
||||
</div>
|
||||
<p id="error_api_key_date" class="error-message"><i class="gallery-icon-attention-circled"></i>
|
||||
{'you must choose a date'|translate}</p>
|
||||
</div>
|
||||
|
||||
<div class="column-flex" id="api_custom_date">
|
||||
<label for="api_expiration_date">{'Custom date'|translate}</label>
|
||||
<div class="row-flex input-container api-expiration">
|
||||
<input type="date" id="api_expiration_date" name="api_expiration_custom" min="{$API_CURRENT_DATE}" />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<p class="api-mail-infos">{$API_EMAIL_INFOS}</p>
|
||||
|
||||
<div class="save">
|
||||
<button class="btn btn-cancel" id="cancel_apikey">{'Cancel'|translate}</button>
|
||||
<button class="btn btn-main" id="save_apikey">{'Generate key'|translate}</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="retrieves_keyapi">
|
||||
<div class="head-modal">
|
||||
<p class="title-modal">{'Generate API Key'|translate}</p>
|
||||
<p class="subtitle-modal">{'Save your ID and secret'|translate}</p>
|
||||
<p class="modal-secret">{'The secret will no longer be displayed. You must copy it to continue.'|translate}
|
||||
<p>
|
||||
</div>
|
||||
|
||||
<div class="modal-input-keys">
|
||||
<p id="api_id_copy_success" class="api-copy api-hide success-message">
|
||||
{"ID copied."|translate|escape:html}</p>
|
||||
</div>
|
||||
<div class="input-modal input-modal-id row-flex">
|
||||
<i class="gallery-icon-hash"></i>
|
||||
<input type="text" id="api_id_key" />
|
||||
<i class="icon-clone" id="api_id_copy"></i>
|
||||
</div>
|
||||
|
||||
<div class="modal-input-keys">
|
||||
<p id="api_key_copy_success" class="modal-input-key api-copy api-hide success-message">
|
||||
{"Secret copied. Keep it in a safe place."|translate|escape:html}</p>
|
||||
</div>
|
||||
<div class="input-modal input-modal-key row-flex">
|
||||
<i class="icon-user-secret"></i>
|
||||
<input type="text" id="api_secret_key" />
|
||||
<i class="icon-clone" id="api_secret_copy"></i>
|
||||
</div>
|
||||
|
||||
<div class="save">
|
||||
<button class="btn btn-main" id="done_apikey" disabled>{'Done'|translate}</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{* API KEY MODAL EDIT *}
|
||||
<div class="bg-modal" id="api_modal_edit">
|
||||
<div class="body-modal">
|
||||
<a class="icon-cancel close-modal" id="close_api_modal_edit"></a>
|
||||
|
||||
<div>
|
||||
<div class="head-modal">
|
||||
<p class="title-modal">{'Edit API Key'|translate}</p>
|
||||
</div>
|
||||
|
||||
<div class="column-flex first">
|
||||
<label for="api_key_edit">{'API Key name'|translate}</label>
|
||||
<div class="row-flex input-container">
|
||||
<i class="icon-key"></i>
|
||||
<input type="text" id="api_key_edit" />
|
||||
</div>
|
||||
<p id="error_api_key_edit" class="error-message"><i class="gallery-icon-attention-circled"></i>
|
||||
{'must not be empty'|translate}</p>
|
||||
</div>
|
||||
|
||||
<div class="save">
|
||||
<button class="btn btn-main" id="save_api_edit">{'Save'|translate}</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{* API KEY MODAL REVOKE *}
|
||||
<div class="bg-modal" id="api_modal_revoke">
|
||||
<div class="body-modal">
|
||||
<a class="icon-cancel close-modal" id="close_api_modal_revoke"></a>
|
||||
|
||||
<div>
|
||||
<div class="head-modal">
|
||||
<p class="title-modal" id="api_modal_revoke_title"></p>
|
||||
</div>
|
||||
|
||||
<div class="save">
|
||||
<button class="btn btn-cancel" id="cancel_api_revoke">{'Cancel'|translate}</button>
|
||||
<button class="btn btn-main btn-revoked" id="revoke_api_key">{'Revoke'|translate}</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
{if isset($PLUGINS_PROFILE)}
|
||||
{foreach from=$PLUGINS_PROFILE item=plugin_block key=k_block}
|
||||
<section id="{$k_block}-section" class="profile-section">
|
||||
<div class="title display-section" data-display="{$k_block}-display">
|
||||
<div class="column-flex">
|
||||
<h1>{$plugin_block.name}</h1>
|
||||
<p>{$plugin_block.desc}</p>
|
||||
</div>
|
||||
<i class="gallery-icon-up-open display-btn close" ></i>
|
||||
</div>
|
||||
<div class="form plugins" id="{$k_block}-display">
|
||||
{include file=$plugin_block.template}
|
||||
{if $plugin_block.standard_show_save}
|
||||
<div class="save">
|
||||
<button class="btn btn-main" id="save_{$k_block}">{'Submit'|translate}</button>
|
||||
</div>
|
||||
{footer_script}
|
||||
standardSaveSelector.push('#save_{$k_block}');
|
||||
{/footer_script}
|
||||
{/if}
|
||||
</div>
|
||||
</section>
|
||||
{/foreach}
|
||||
{/if}
|
||||
|
||||
{if count($language_options) > 1}
|
||||
<section id="language-switch">
|
||||
<div id="lang-select">
|
||||
<span id="other-languages">
|
||||
{foreach from=$language_options key=code item=lang}
|
||||
<span id="lang={$code}" onclick="setCookie('lang','{$code}',30)">{$lang}</span>
|
||||
{/foreach}
|
||||
</span>
|
||||
<div id="selected-language-container">
|
||||
<i class="gallery-icon-left-chevron"></i><span
|
||||
id="selected-language">{$language_options[$language_selection]}</span>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
{/if}
|
||||
{include file='toaster.tpl'}
|
||||
</container>
|
||||
@@ -0,0 +1,125 @@
|
||||
{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}
|
||||
|
||||
<script>
|
||||
var selected_language = `{$language_options[$current_language]}`;
|
||||
var url_logo_light = `{$ROOT_URL}themes/standard_pages/images/piwigo_logo.svg`;
|
||||
var url_logo_dark = `{$ROOT_URL}themes/standard_pages/images/piwigo_logo_dark.svg`;
|
||||
</script>
|
||||
{combine_script id='standard_pages_js' load='async' require='jquery' path='themes/standard_pages/js/standard_pages.js'}
|
||||
|
||||
<container id="mode" class="light">
|
||||
|
||||
<section id="header-options">
|
||||
<div>
|
||||
<i class="gallery-icon-moon toggle-mode" id="toggle_mode_light" onclick="toggle_mode('dark')"></i>
|
||||
<i class="gallery-icon-sun toggle-mode" id="toggle_mode_dark" onclick="toggle_mode('light')"></i>
|
||||
</div>
|
||||
<div>
|
||||
<a href="{$HELP_LINK}" target="_blank">{'Help'|translate}</a>
|
||||
{if isset($errors['register_page_error'])}
|
||||
<div class="error_block_container">
|
||||
{foreach from=$errors['register_page_error'] item=error}
|
||||
<div class="error_block">
|
||||
<i class="gallery-icon-cancel"></i>
|
||||
<p>{$error}</p>
|
||||
</div>
|
||||
{/foreach}
|
||||
</div>
|
||||
{/if}
|
||||
</section>
|
||||
|
||||
{if 'none' != $STD_PGS_SELECTED_LOGO}
|
||||
<section id="logo-section">
|
||||
{if 'piwigo_logo' == $STD_PGS_SELECTED_LOGO}
|
||||
<img id="piwigo-logo" src="{$ROOT_URL}themes/standard_pages/images/piwigo_logo.svg">
|
||||
{else if 'custom_logo' == $STD_PGS_SELECTED_LOGO}
|
||||
<img id="custom-logo" src="{$STD_PGS_SELECTED_LOGO_PATH}">
|
||||
{else if 'gallery_title'}
|
||||
<h1>{$GALLERY_TITLE}</h1>
|
||||
{/if}
|
||||
</section>
|
||||
{/if}
|
||||
|
||||
|
||||
<section id="register-form">
|
||||
<div class="">
|
||||
<h1 class="">
|
||||
{'Create an account'|translate}
|
||||
</h1>
|
||||
|
||||
<form class="properties" method="post" action="{$F_ACTION}" name="register_form" autocomplete="off">
|
||||
|
||||
<div class="column-flex">
|
||||
<label for="mail_address">{'Email address'|translate}{if not $obligatory_user_mail_address} ({'useful when password forgotten'|@translate}){/if}</label>
|
||||
<div class="row-flex input-container">
|
||||
<i class="gallery-icon-user-2"></i>
|
||||
<input type="email" name="mail_address" id="login" value="{$F_EMAIL}"{if $obligatory_user_mail_address}data-required="true"{/if}>
|
||||
</div>
|
||||
<p class="error-message"><i class="gallery-icon-attention-circled"></i> {'must not be empty'|translate}</p>
|
||||
</div>
|
||||
|
||||
<div class="column-flex">
|
||||
<label for="username">{'Username'|translate}</label>
|
||||
<div class="row-flex input-container">
|
||||
<i class="gallery-icon-user-2"></i>
|
||||
<input type="text" name="login" id="login" value="{$F_LOGIN}" data-required="true">
|
||||
</div>
|
||||
<p class="error-message"><i class="gallery-icon-attention-circled"></i> {'must not be empty'|translate}</p>
|
||||
</div>
|
||||
|
||||
<div class="column-flex">
|
||||
<label for="password">{'Password'|translate}</label>
|
||||
<div class="row-flex input-container">
|
||||
<i class="gallery-icon-lock"></i>
|
||||
<input type="password" class="" name="password" id="password" size="25" data-required="true">
|
||||
<i class="gallery-icon-eye togglePassword"></i>
|
||||
</div>
|
||||
<p class="error-message"><i class="gallery-icon-attention-circled"></i> {'must not be empty'|translate}</p>
|
||||
</div>
|
||||
|
||||
<div class="column-flex">
|
||||
<label for="password">{'Confirm Password'|translate}</label>
|
||||
<div class="row-flex input-container">
|
||||
<i class="gallery-icon-lock"></i>
|
||||
<input type="password" class="" name="password_conf" id="password_conf" size="25" data-required="true">
|
||||
<i class="gallery-icon-eye togglePassword"></i>
|
||||
</div>
|
||||
<p class="error-message"><i class="gallery-icon-attention-circled"></i> {'must not be empty'|translate}</p>
|
||||
</div>
|
||||
|
||||
<div class="column-flex">
|
||||
<input type="hidden" name="key" value="{$F_KEY}" >
|
||||
<input tabindex="4" type="submit" name="submit" value="{'Register'|translate}" class="btn btn-main ">
|
||||
{if isset($errors['register_form_error'])}
|
||||
<p class="error-message" style="display:block;bottom:-20px;"><i class="gallery-icon-attention-circled"></i> {$errors['register_form_error']}</p>
|
||||
{/if}
|
||||
</div>
|
||||
</form>
|
||||
|
||||
<div class="secondary-links">
|
||||
<p>{'Already have an account ?'|translate} <a href="identification.php" title="{'Login'|translate}">{'Login'|translate}</a></p>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<a href="index.php" id="return-to-gallery"><i class="gallery-icon-left"></i> {'Return to the gallery'|translate}</a>
|
||||
|
||||
{if count($language_options) > 1}
|
||||
<section id="language-switch">
|
||||
<div id="lang-select">
|
||||
<span id="other-languages">
|
||||
{foreach from=$language_options key=code item=lang}
|
||||
<span id="lang={$code}" onclick="setCookie('lang','{$code}',30)">{$lang}</span>
|
||||
{/foreach}
|
||||
</span>
|
||||
<div id="selected-language-container">
|
||||
<i class="gallery-icon-left-chevron"></i><span id="selected-language">{$language_options[$current_language]}</span>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</section>
|
||||
{/if}
|
||||
|
||||
</container>
|
||||
@@ -0,0 +1,59 @@
|
||||
{combine_script id='toaster_js' load='async' require='jquery' path='themes/standard_pages/js/toaster.js'}
|
||||
{html_style}
|
||||
.toast.template-pwg-toaster {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.toaster {
|
||||
position: fixed;
|
||||
right: 15px;
|
||||
max-width: 300px;
|
||||
top: 40px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 10px;
|
||||
z-index: 9999;
|
||||
}
|
||||
|
||||
.toast {
|
||||
display: flex;
|
||||
gap: 5px;
|
||||
padding: 10px;
|
||||
border-radius: 5px;
|
||||
align-items: center;
|
||||
font-size: 15px;
|
||||
width: fit-content;
|
||||
align-self: flex-end;
|
||||
box-shadow: 0px 4px 10px 0px rgba(0, 0, 0, 0.15);
|
||||
}
|
||||
|
||||
.toast i:before {
|
||||
font-size: 33px;
|
||||
}
|
||||
|
||||
.light .toast.success {
|
||||
background-color: #D6FFCF;
|
||||
color: #4CA530;
|
||||
}
|
||||
|
||||
.light .toast.error {
|
||||
background-color: #F8D7DC;
|
||||
color: #EB3D33;
|
||||
}
|
||||
|
||||
.dark .toast.success {
|
||||
background-color: #4EA590;
|
||||
color: #AAF6E4;
|
||||
}
|
||||
|
||||
.dark .toast.error {
|
||||
background-color: #BE4949;
|
||||
color: #FFC8C8;
|
||||
}
|
||||
{/html_style}
|
||||
<div class="toaster" id="pwg_toaster">
|
||||
<div class="toast template-pwg-toaster" id="toast_template">
|
||||
<i class="toast_icon"></i>
|
||||
<p class="toast_text"></p>
|
||||
</div>
|
||||
</div>
|
||||
@@ -0,0 +1,859 @@
|
||||
@font-face {
|
||||
font-family: Open_Sans;
|
||||
src: url(fonts/OpenSans-VariableFont_wdth\,wght.ttf);
|
||||
}
|
||||
|
||||
html{
|
||||
min-height:100%;
|
||||
}
|
||||
|
||||
#theHeader,
|
||||
#copyright,
|
||||
#api_custom_date,
|
||||
#cant_manage_api,
|
||||
#retrieves_keyapi,
|
||||
.template-section,
|
||||
.template-api,
|
||||
.api_name_edit {
|
||||
display:none;
|
||||
}
|
||||
|
||||
.api-hide {
|
||||
display: none !important;
|
||||
}
|
||||
|
||||
#theIdentificationPage,
|
||||
#theRegisterPage,
|
||||
#thePasswordPage,
|
||||
#theProfilePage{
|
||||
width:100%;
|
||||
height:100%;
|
||||
min-height:100vh;
|
||||
margin:0;
|
||||
font-family: 'Open_Sans', sans-serif;
|
||||
}
|
||||
|
||||
#theIdentificationPage #the_page,
|
||||
#theRegisterPage #the_page,
|
||||
#thePasswordPage #the_page,
|
||||
#theProfilePage #the_page{
|
||||
min-height:100vh;
|
||||
height:100%;
|
||||
}
|
||||
|
||||
#mode{
|
||||
display:flex;
|
||||
flex-direction:column;
|
||||
height:100%;
|
||||
min-height:100vh;
|
||||
overflow-y:auto;
|
||||
max-width:100vw;
|
||||
overflow-x:hidden;
|
||||
}
|
||||
|
||||
#login-form,
|
||||
#register-form,
|
||||
#password-form,
|
||||
.profile-section{
|
||||
border-radius:15px;
|
||||
max-width:400px;
|
||||
width:75%;
|
||||
margin:0 auto;
|
||||
margin-top:50px;
|
||||
box-shadow: 0px 4px 10px 0px rgba(0, 0, 0, 0.15);
|
||||
padding:50px;
|
||||
}
|
||||
|
||||
#logo-section{
|
||||
max-width:300px;
|
||||
margin:0 auto;
|
||||
padding-top:50px;
|
||||
}
|
||||
|
||||
#logo-section h1{
|
||||
margin:0;
|
||||
}
|
||||
|
||||
#logo-section img{
|
||||
width: 100%;
|
||||
min-width: 300px;
|
||||
max-height: 200px;
|
||||
object-fit: contain;
|
||||
}
|
||||
|
||||
h1{
|
||||
font-size: 30px;
|
||||
font-weight: 400;
|
||||
margin:0;
|
||||
margin-bottom:30px;
|
||||
text-align:center;
|
||||
}
|
||||
|
||||
h1 i{
|
||||
margin:10px;
|
||||
}
|
||||
|
||||
#login-form form,
|
||||
#register-form form,
|
||||
#password-form form{
|
||||
display:flex;
|
||||
justify-content:center;
|
||||
flex-direction:column;
|
||||
}
|
||||
|
||||
#password-form p,
|
||||
.profile-section p{
|
||||
text-align:center;
|
||||
font-size:15px;
|
||||
font-weight:500;
|
||||
margin:0;
|
||||
}
|
||||
|
||||
#password-form .error-message{
|
||||
bottom:0;
|
||||
}
|
||||
|
||||
.input-container,
|
||||
.input-modal {
|
||||
border-radius:3px;
|
||||
padding:5px 15px;
|
||||
margin-bottom:25px;
|
||||
flex-wrap:nowrap;
|
||||
}
|
||||
|
||||
.input-container input,
|
||||
.input-modal input,
|
||||
.input-container select,
|
||||
.input-container textarea{
|
||||
background-color:transparent;
|
||||
border:none;
|
||||
width:100%;
|
||||
line-height:25px;
|
||||
}
|
||||
|
||||
.input-container textarea {
|
||||
resize: none;
|
||||
}
|
||||
|
||||
input:-webkit-autofill {
|
||||
background-color: transparent !important;
|
||||
color: inherit !important;
|
||||
}
|
||||
|
||||
input:-webkit-autofill::first-line {
|
||||
color: inherit !important;
|
||||
}
|
||||
|
||||
.input-container input:focus,
|
||||
.input-modal input:focus,
|
||||
.profile-section .api-tab-line.edit input:focus,
|
||||
.input-container select:focus,
|
||||
.input-container textarea:focus{
|
||||
border:none;
|
||||
outline:none;
|
||||
}
|
||||
|
||||
select {
|
||||
padding: 5px 0;
|
||||
}
|
||||
|
||||
.input-container i,
|
||||
.input-modal i {
|
||||
font-size:15px;
|
||||
margin-right:5px;
|
||||
}
|
||||
|
||||
.column-flex{
|
||||
display:flex;
|
||||
flex-direction:column;
|
||||
position:relative;
|
||||
}
|
||||
|
||||
.row-flex{
|
||||
display:flex;
|
||||
flex-direction:row;
|
||||
align-items:center;
|
||||
}
|
||||
|
||||
.remember-me-container {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
cursor: pointer;
|
||||
font-family: 'Open_Sans', sans-serif;
|
||||
font-size: 16px;
|
||||
margin-bottom:5px;
|
||||
margin-left:20px;
|
||||
}
|
||||
|
||||
.gallery-icon-checkmark {
|
||||
width: 18px;
|
||||
height: 18px;
|
||||
border-radius: 2px;
|
||||
display: inline-block;
|
||||
margin-right: 8px;
|
||||
line-height: 18px;
|
||||
font-size: 14px;
|
||||
}
|
||||
|
||||
.remember-me-container:hover label{
|
||||
cursor:pointer;
|
||||
}
|
||||
|
||||
.gallery-icon-checkmark::before {
|
||||
opacity: 0;
|
||||
}
|
||||
|
||||
input[type="checkbox"]#remember_me {
|
||||
display: none;
|
||||
}
|
||||
|
||||
input[type="checkbox"]#remember_me:checked + label ~ .gallery-icon-checkmark::before,
|
||||
input[type="checkbox"]#remember_me:checked + .gallery-icon-checkmark::before {
|
||||
opacity: 1;
|
||||
font-size: 12px;
|
||||
margin: 2px;
|
||||
vertical-align: text-top;
|
||||
}
|
||||
|
||||
label{
|
||||
margin-bottom:5px;
|
||||
font-size:15px;
|
||||
font-weight:700;
|
||||
}
|
||||
|
||||
p.form-instructions{
|
||||
padding-bottom:25px;
|
||||
}
|
||||
|
||||
.btn-main{
|
||||
border:none;
|
||||
padding:15px;
|
||||
margin-top:15px;
|
||||
cursor:pointer;
|
||||
text-decoration:none!important;
|
||||
}
|
||||
|
||||
.btn-cancel,
|
||||
.btn-link {
|
||||
background: none;
|
||||
border: none;
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
font: inherit;
|
||||
color: inherit;
|
||||
cursor: pointer;
|
||||
font-size: 14px;
|
||||
line-height: 1;
|
||||
height: fit-content;
|
||||
}
|
||||
|
||||
.btn-link {
|
||||
text-decoration: underline;
|
||||
margin-top: 15px;
|
||||
}
|
||||
|
||||
a.btn-main{
|
||||
display:block;
|
||||
text-align:center;
|
||||
}
|
||||
|
||||
.btn-main:disabled {
|
||||
cursor: not-allowed;
|
||||
}
|
||||
|
||||
#return-to-gallery{
|
||||
margin: 30px auto;
|
||||
display:block;
|
||||
width:fit-content;
|
||||
}
|
||||
|
||||
.secondary-links{
|
||||
margin-top:40px;
|
||||
text-align:center;
|
||||
}
|
||||
|
||||
#theIdentificationPage a,
|
||||
#theRegisterPage a,
|
||||
#thePasswordPage a,
|
||||
#theProfilePage a{
|
||||
text-decoration:underline;
|
||||
}
|
||||
|
||||
#theIdentificationPage a:hover,
|
||||
#theRegisterPage a:hover,
|
||||
#thePasswordPage a:hover,
|
||||
#theProfilePage a:hover{
|
||||
border-bottom:none;
|
||||
}
|
||||
|
||||
#separator{
|
||||
width:300px;
|
||||
display:block;
|
||||
margin: 15px auto;
|
||||
}
|
||||
|
||||
#header-options{
|
||||
position:fixed;
|
||||
width:100%;
|
||||
display:flex;
|
||||
justify-content: space-between;
|
||||
font-size:15px;
|
||||
}
|
||||
|
||||
#header-options > *{
|
||||
padding:15px;
|
||||
}
|
||||
|
||||
#theIdentificationPage #header-options .toggle-mode,
|
||||
#theProfilePage #header-options .toggle-mode{
|
||||
cursor:pointer;
|
||||
}
|
||||
|
||||
.gallery-icon-sun{
|
||||
display:none;
|
||||
}
|
||||
|
||||
.gallery-icon-eye{
|
||||
cursor:pointer;
|
||||
}
|
||||
|
||||
#language-switch{
|
||||
display:flex;
|
||||
justify-content: flex-end;
|
||||
font-size:15px;
|
||||
position: fixed;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
}
|
||||
|
||||
#lang-select{
|
||||
width:fit-content;
|
||||
position:relative;
|
||||
}
|
||||
|
||||
#selected-language-container{
|
||||
padding:15px;
|
||||
}
|
||||
|
||||
#lang-select #other-languages{
|
||||
display:none;
|
||||
border-radius: 5px;
|
||||
padding: 15px;
|
||||
box-shadow: 0 0 10px rgba(0, 0, 0, 0.15);
|
||||
margin-right:11px;
|
||||
width:max-content;
|
||||
position:absolute;
|
||||
bottom:40px;
|
||||
right:0;
|
||||
max-height:50vh;
|
||||
overflow:auto;
|
||||
}
|
||||
|
||||
#lang-select #other-languages span{
|
||||
text-decoration:none;
|
||||
display:block;
|
||||
padding:5px 0;
|
||||
}
|
||||
|
||||
#lang-select #other-languages span:hover{
|
||||
cursor:pointer;
|
||||
}
|
||||
|
||||
#lang-select:hover #other-languages{
|
||||
display:block;
|
||||
}
|
||||
|
||||
#lang-select .gallery-icon-left-chevron:before{
|
||||
rotate: 90deg;
|
||||
}
|
||||
|
||||
#selected-language{
|
||||
margin-left:5px;
|
||||
text-decoration:underline;
|
||||
}
|
||||
|
||||
.success-message,
|
||||
.infos-message {
|
||||
width: calc(100% - 34px);
|
||||
display: block;
|
||||
padding: 15px;
|
||||
margin-bottom:15px;
|
||||
font-weight:700;
|
||||
}
|
||||
|
||||
.error-message{
|
||||
text-align: left;
|
||||
position: absolute;
|
||||
bottom: 5px;
|
||||
left:0;
|
||||
margin: 0;
|
||||
display:none;
|
||||
}
|
||||
|
||||
#error_api_key_date.error-message {
|
||||
bottom: -20px;
|
||||
}
|
||||
|
||||
.error-message i,
|
||||
p.error-message,
|
||||
.modal-secret {
|
||||
color: #EB3223!important;
|
||||
}
|
||||
|
||||
.error_block_container {
|
||||
position: absolute;
|
||||
right: 15px;
|
||||
max-width: 300px;
|
||||
top:40px;
|
||||
}
|
||||
|
||||
.error_block {
|
||||
display:flex;
|
||||
background-color:#BE4949;
|
||||
border-radius:5px;
|
||||
color:#FFC8C8;
|
||||
padding:15px;
|
||||
position:relative;
|
||||
align-items:center;
|
||||
}
|
||||
|
||||
.error_block p{
|
||||
margin:0;
|
||||
}
|
||||
|
||||
.error_block .gallery-icon-cancel:before{
|
||||
font-size:33px;
|
||||
margin-left:0;
|
||||
margin-right:15px;
|
||||
}
|
||||
|
||||
#password-form p.intro-paragraph{
|
||||
margin-bottom:15px;
|
||||
}
|
||||
|
||||
.profile-section {
|
||||
width: 100%;
|
||||
max-width: 700px;
|
||||
margin-top: 0;
|
||||
margin-bottom: 25px;
|
||||
}
|
||||
|
||||
#account-section {
|
||||
margin-top: 25px;
|
||||
}
|
||||
|
||||
.profile-section .title {
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.profile-section .title p {
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
|
||||
.profile-section .form {
|
||||
margin-top: 0;
|
||||
max-height: 0;
|
||||
overflow: hidden;
|
||||
transition: max-height 0.6s ease;
|
||||
}
|
||||
|
||||
.profile-section .form.open {
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.profile-section .reset {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
/* gap: 15px; */
|
||||
}
|
||||
|
||||
.profile-section .save,
|
||||
.profile-section .new-apikey,
|
||||
.profile-section .modal-input-keys {
|
||||
display: flex;
|
||||
gap: 15px;
|
||||
justify-content: flex-end;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.profile-section .modal-input-keys {
|
||||
position: absolute;
|
||||
right: 30px;
|
||||
}
|
||||
|
||||
.profile-section .save .btn-main,
|
||||
.profile-section .new-apikey .btn-main,
|
||||
.profile-section .reset .btn-main {
|
||||
padding: 10px 35px;
|
||||
}
|
||||
|
||||
.profile-section h1 {
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
|
||||
.gallery-icon-up-open:not(
|
||||
.api-list .gallery-icon-up-open,
|
||||
#api_key_list_expired .gallery-icon-up-open
|
||||
) {
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
cursor: pointer;
|
||||
right: 0;
|
||||
transition: transform 0.5s ease;
|
||||
}
|
||||
|
||||
.gallery-icon-up-open.close,
|
||||
.profile-section .icon-collapse.close {
|
||||
position: relative;
|
||||
transform: rotate(180deg);
|
||||
}
|
||||
|
||||
.profile-section .api-icon-collapse .icon-collapse.close {
|
||||
top: 2px;
|
||||
left: -0.2px;
|
||||
}
|
||||
|
||||
.profile-section .icon-collapse {
|
||||
display: inline-block;
|
||||
transition: transform 0.4s;
|
||||
vertical-align: middle;
|
||||
}
|
||||
|
||||
.profile-section .username {
|
||||
width: fit-content;
|
||||
cursor: not-allowed;
|
||||
background-color: transparent !important;
|
||||
border: none !important;
|
||||
}
|
||||
|
||||
.profile-section .input-container.radio,
|
||||
.profile-section .section-expiration,
|
||||
.profile-section .api-icon-action {
|
||||
gap: 10px;
|
||||
}
|
||||
|
||||
.profile-section .api-icon-action {
|
||||
padding-right: 10px;
|
||||
font-size: 14px;
|
||||
}
|
||||
|
||||
.profile-section .input-container.radio label {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
margin-bottom: 0;
|
||||
padding: 5px 0;
|
||||
gap: 5px;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.profile-section .preferences-options {
|
||||
gap: 20px;
|
||||
padding: 20px;
|
||||
margin-top: 5px;
|
||||
}
|
||||
|
||||
.profile-section .preferences-options .option {
|
||||
gap: 15px;
|
||||
}
|
||||
|
||||
.profile-section .api-tab {
|
||||
display: grid;
|
||||
grid-template-columns: 60px 2fr 1fr 1fr 1fr 0.5fr;
|
||||
/* grid-template-columns: 60px 200px 100px 100px 100px 30px; */
|
||||
justify-items: start;
|
||||
align-items: center;
|
||||
max-height: 40px;
|
||||
}
|
||||
|
||||
.profile-section .api-list-head {
|
||||
padding: 15px 0;
|
||||
border-radius: 8px;
|
||||
margin-top: 15px;
|
||||
}
|
||||
|
||||
.profile-section .api-expiration {
|
||||
width: fit-content;
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
.profile-section .api-mail-infos {
|
||||
position: relative;
|
||||
font-size: 12px;
|
||||
padding-top: 20px;
|
||||
margin-bottom: 25px;
|
||||
text-align: start;
|
||||
}
|
||||
|
||||
.profile-section .api-icon-collapse {
|
||||
justify-self: center;
|
||||
}
|
||||
|
||||
.profile-section .api-tab-line,
|
||||
.profile-section .api-tab-collapse {
|
||||
padding: 10px 0;
|
||||
border-radius: 8px;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.profile-section .api-tab-line.open {
|
||||
border-bottom-left-radius: 0;
|
||||
border-bottom-right-radius: 0;
|
||||
}
|
||||
|
||||
.profile-section .api-tab-collapse.open {
|
||||
border-top-left-radius: 0;
|
||||
border-top-right-radius: 0;
|
||||
}
|
||||
|
||||
.profile-section .api-tab-line i:not(#api_key_list_expired, .api_expiration .api-skull),
|
||||
.profile-section .icon-clone {
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.profile-section .api-tab-collapse .key {
|
||||
gap: 10px;
|
||||
padding: 5px 0;
|
||||
}
|
||||
|
||||
.profile-section .api-tab-collapse {
|
||||
padding-bottom: 20px;
|
||||
display: grid;
|
||||
grid-template-columns: 60px auto;
|
||||
}
|
||||
|
||||
.profile-section .api_name,
|
||||
.profile-section .api_creation,
|
||||
.profile-section .api_expiration {
|
||||
text-overflow: ellipsis;
|
||||
max-width: 90%;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.profile-section #show_expired_list {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.profile-section #api_key_list_expired .api_expiration {
|
||||
text-overflow: unset;
|
||||
max-width: unset;
|
||||
}
|
||||
|
||||
.profile-section #api_key_list .border-line {
|
||||
border: 1px solid transparent !important;
|
||||
}
|
||||
|
||||
.profile-section .api-list-head > p{
|
||||
text-align: start !important;
|
||||
}
|
||||
|
||||
.profile-section .api_last_use {
|
||||
max-width: 98%;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
}
|
||||
|
||||
.profile-section .api_name_edit {
|
||||
width: max-content;
|
||||
background-color: transparent;
|
||||
border: none;
|
||||
border-radius: 3px;
|
||||
width: 90%;
|
||||
}
|
||||
|
||||
.profile-section .new-apikey .btn-link{
|
||||
font-weight: 700;
|
||||
}
|
||||
|
||||
.profile-section .api-copy {
|
||||
padding: 1px 10px;
|
||||
width: fit-content;
|
||||
font-size: 12px;
|
||||
}
|
||||
|
||||
.profile-section #show_expired_list {
|
||||
margin: 15px 0;
|
||||
}
|
||||
|
||||
.profile-section #api_key_list_expired {
|
||||
max-height: 0;
|
||||
transition: max-height 0.3s ease;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.profile-section .api-info {
|
||||
font-size: 12px;
|
||||
}
|
||||
|
||||
.profile-section .api_key
|
||||
.profile-section #api_id_key,
|
||||
.profile-section #api_secret_key {
|
||||
font-family: monospace !important;
|
||||
}
|
||||
|
||||
.profile-section .display-section {
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
/* Modal */
|
||||
|
||||
.bg-modal {
|
||||
display: none;
|
||||
position: fixed;
|
||||
z-index: 100;
|
||||
left: 0;
|
||||
top: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
overflow: auto;
|
||||
}
|
||||
|
||||
.close-modal {
|
||||
position: absolute;
|
||||
right: -40px;
|
||||
top: -40px;
|
||||
font-size: 30px;
|
||||
text-decoration: none !important;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.body-modal {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
position: absolute;
|
||||
border-radius: 10px;
|
||||
left: 50%;
|
||||
top: 50%;
|
||||
transform: translate(-50%, -48%);
|
||||
text-align: left;
|
||||
padding: 30px;
|
||||
max-width: 600px;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
#api_modal_revoke .body-modal {
|
||||
max-width: 400px;
|
||||
}
|
||||
|
||||
.body-modal .btn-main {
|
||||
margin-top: 0;
|
||||
}
|
||||
|
||||
.title-modal {
|
||||
font-size: 24px !important;
|
||||
font-weight: 600 !important;
|
||||
}
|
||||
|
||||
.subtitle-modal {
|
||||
font-size: 16px !important;
|
||||
font-weight: 400;
|
||||
}
|
||||
|
||||
.head-modal {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: start;
|
||||
gap: 5px;
|
||||
}
|
||||
|
||||
#generate_keyapi .head-modal,
|
||||
#api_modal_edit .head-modal,
|
||||
#api_modal_revoke .head-modal {
|
||||
margin-bottom: 25px;
|
||||
}
|
||||
|
||||
.input-modal-id {
|
||||
margin-top: 25px;
|
||||
margin-bottom: 5px;
|
||||
}
|
||||
|
||||
.input-modal-key {
|
||||
margin-top: 30px;
|
||||
}
|
||||
|
||||
/* The switch */
|
||||
.switch {
|
||||
position: relative;
|
||||
display: inline-block;
|
||||
width: 60px;
|
||||
height: 24px;
|
||||
}
|
||||
|
||||
.switch input {
|
||||
opacity: 0;
|
||||
width: 0;
|
||||
height: 0;
|
||||
}
|
||||
|
||||
label.switch {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
.slider {
|
||||
position: absolute;
|
||||
cursor: pointer;
|
||||
top: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
-webkit-transition: .4s;
|
||||
transition: .4s;
|
||||
}
|
||||
|
||||
.slider:before {
|
||||
position: absolute;
|
||||
content: "";
|
||||
height: 16px;
|
||||
width: 16px;
|
||||
left: 4px;
|
||||
bottom: 4px;
|
||||
-webkit-transition: .4s;
|
||||
transition: .4s;
|
||||
}
|
||||
|
||||
input:checked + .slider:before {
|
||||
-webkit-transform: translateX(26px);
|
||||
-ms-transform: translateX(26px);
|
||||
transform: translateX(26px);
|
||||
}
|
||||
|
||||
input:checked + .slider:before, input:checked + .slider::after {
|
||||
margin-left: 10px;
|
||||
}
|
||||
|
||||
.slider.round {
|
||||
border-radius: 34px;
|
||||
}
|
||||
|
||||
.slider.round:before {
|
||||
border-radius: 50%;
|
||||
}
|
||||
|
||||
/* Tooltips */
|
||||
[data-tooltip]:hover::after {
|
||||
position: absolute;
|
||||
content: attr(data-tooltip);
|
||||
animation: fadeIn 100ms cubic-bezier(0.42, 0, 0.62, 1.32) forwards;
|
||||
animation-delay: 100ms;
|
||||
border-radius: 5px;
|
||||
max-width: 100%;
|
||||
text-align: center;
|
||||
font-size: 12px;
|
||||
padding: 5px 10px;
|
||||
box-shadow: 0px 10px 33px #3333332e;
|
||||
}
|
||||
|
||||
/*Responsive display*/
|
||||
@media only screen and (max-width: 768px) {
|
||||
#login-form, #register-form, #password-form, .profile-section{
|
||||
max-width:300px;
|
||||
width:50vw;
|
||||
}
|
||||
|
||||
#separator{
|
||||
width:100%;
|
||||
}
|
||||
|
||||
#language-switch{
|
||||
position:unset;
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,28 @@
|
||||
<?php
|
||||
$themeconf = array(
|
||||
'name' => 'standard_pages',
|
||||
'parent' => 'default',
|
||||
'load_parent_css' => false,
|
||||
'img_dir' => 'themes/standard_pages/images',
|
||||
);
|
||||
|
||||
//send stantard pages conf options to tpl
|
||||
$this->assign(
|
||||
array(
|
||||
'STD_PGS_SELECTED_SKIN' => conf_get_param('standard_pages_selected_skin', 'default'),
|
||||
'STD_PGS_SELECTED_LOGO' => conf_get_param('standard_pages_selected_logo', 'piwigo_logo'),
|
||||
'GALLERY_TITLE' => isset($page['gallery_title']) ? $page['gallery_title'] : $conf['gallery_title'],
|
||||
)
|
||||
);
|
||||
|
||||
//Send custom logo path if custom_logo is the selected option
|
||||
if ('custom_logo' == conf_get_param('standard_pages_selected_logo', 'piwigo_logo'))
|
||||
{
|
||||
$this->assign(
|
||||
array(
|
||||
'STD_PGS_SELECTED_LOGO_PATH' => conf_get_param('standard_pages_selected_logo_path', ''),
|
||||
)
|
||||
);
|
||||
}
|
||||
|
||||
?>
|
||||
Reference in New Issue
Block a user