mirror of
https://github.com/Piwigo/Piwigo.git
synced 2026-06-02 04:15:05 +02:00
fixes #2345 create piwigo standard pages
create new theme standard pages with tpl, css, js and images update backend to handle pages add config use_standard_pages on update set config to false, on install set config to true add standard pages to no be ingored in git
This commit is contained in:
HWFord
@@ -0,0 +1,480 @@
|
||||
html{
|
||||
min-height:100%;
|
||||
}
|
||||
|
||||
#theHeader,
|
||||
#copyright{
|
||||
display:none;
|
||||
}
|
||||
|
||||
#theIdentificationPage,
|
||||
#theRegisterPage,
|
||||
#thePasswordPage{
|
||||
width:100%;
|
||||
height:100%;
|
||||
min-height:100vh;
|
||||
margin:0;
|
||||
font-family:Arial, Helvetica, sans-serif;
|
||||
}
|
||||
|
||||
#theIdentificationPage #the_page,
|
||||
#theRegisterPage #the_page,
|
||||
#thePasswordPage #the_page{
|
||||
min-height:100vh;
|
||||
height:100%;
|
||||
}
|
||||
|
||||
#mode{
|
||||
display:flex;
|
||||
flex-direction:column;
|
||||
height:100%;
|
||||
min-height:100vh;
|
||||
overflow-y:auto;
|
||||
}
|
||||
|
||||
#login-form,
|
||||
#register-form,
|
||||
#password-form{
|
||||
border-radius:15px;
|
||||
width:400px;
|
||||
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 img{
|
||||
width:100%;
|
||||
}
|
||||
|
||||
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{
|
||||
text-align:center;
|
||||
font-size:15px;
|
||||
font-weight:500;
|
||||
margin:0;
|
||||
}
|
||||
|
||||
#password-form .error-message{
|
||||
bottom:0;
|
||||
}
|
||||
|
||||
.input-container{
|
||||
border-radius:3px;
|
||||
padding:5px 15px;
|
||||
margin-bottom:25px;
|
||||
flex-wrap:nowrap;
|
||||
}
|
||||
|
||||
.input-container input{
|
||||
background-color:transparent;
|
||||
border:none;
|
||||
width:100%;
|
||||
line-height:25px;
|
||||
}
|
||||
|
||||
.input-container input:focus{
|
||||
border:none;
|
||||
outline:none;
|
||||
}
|
||||
|
||||
.input-container:focus-within{
|
||||
border:1px solid #ff7700!important;
|
||||
}
|
||||
|
||||
.input-container 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: sans-serif;
|
||||
font-size: 16px;
|
||||
margin-bottom:5px;
|
||||
}
|
||||
|
||||
.gallery-icon-checkmark {
|
||||
width: 18px;
|
||||
height: 18px;
|
||||
border: 1px solid #777;
|
||||
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;
|
||||
}
|
||||
|
||||
p.form-instructions{
|
||||
padding-bottom:25px;
|
||||
}
|
||||
|
||||
.btn-main{
|
||||
background-color:#ff7700!important;
|
||||
color:white!important;
|
||||
border:none;
|
||||
padding:15px;
|
||||
margin-top:15px;
|
||||
cursor:pointer;
|
||||
text-decoration:none!important;
|
||||
}
|
||||
|
||||
a.btn-main{
|
||||
display:block;
|
||||
text-align:center;
|
||||
}
|
||||
|
||||
#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{
|
||||
text-decoration:underline;
|
||||
}
|
||||
|
||||
#theIdentificationPage a:hover,
|
||||
#theRegisterPage a:hover,
|
||||
#thePasswordPage a:hover{
|
||||
border-bottom:none;
|
||||
}
|
||||
|
||||
#separator{
|
||||
width:300px;
|
||||
border-bottom:1px solid #D8D8D8;
|
||||
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{
|
||||
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;
|
||||
}
|
||||
|
||||
#lang-select #other-languages span{
|
||||
text-decoration:none;
|
||||
display:block;
|
||||
padding:5px 0;
|
||||
}
|
||||
|
||||
#lang-select #other-languages span:hover{
|
||||
color:#ff7700;
|
||||
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{
|
||||
width: calc(100% - 34px);
|
||||
display: block;
|
||||
padding: 15px;
|
||||
margin-bottom:15px;
|
||||
}
|
||||
|
||||
.error-message{
|
||||
text-align: left;
|
||||
position: absolute;
|
||||
bottom: 10px;
|
||||
left:0;
|
||||
margin: 0;
|
||||
display:none;
|
||||
}
|
||||
|
||||
.error-message i,
|
||||
p.error-message{
|
||||
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;
|
||||
}
|
||||
|
||||
|
||||
/* Light */
|
||||
#theIdentificationPage .light,
|
||||
#theRegisterPage .light,
|
||||
#thePasswordPage .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 {
|
||||
background-color:#ffffff;
|
||||
}
|
||||
|
||||
#theIdentificationPage .light a,
|
||||
#theRegisterPage .light a,
|
||||
#thePasswordPage .light a,
|
||||
.light h1,
|
||||
.light .input-container input,
|
||||
.light .secondary-links,
|
||||
.light .properties label,
|
||||
.light .properties i,
|
||||
.light #password-form p,
|
||||
.light #lang-select #other-languages span{
|
||||
color:#3C3C3C;
|
||||
}
|
||||
|
||||
#theIdentificationPage .light a:hover,
|
||||
#theRegisterPage .light a:hover,
|
||||
#thePasswordPage .light a:hover{
|
||||
color:#ff7700;
|
||||
}
|
||||
|
||||
.light #header-options a,
|
||||
.light #header-options .toggle-mode,
|
||||
.light #selected-language-container{
|
||||
color:#ff7700;
|
||||
}
|
||||
|
||||
.light .input-container{
|
||||
background-color:#F0F0F0;
|
||||
border:1px solid #F0F0F0;
|
||||
}
|
||||
|
||||
.light #separator{
|
||||
border-bottom:1px solid #D8D8D8;
|
||||
}
|
||||
|
||||
.light .gallery-icon-eye{
|
||||
color:#898989;
|
||||
}
|
||||
|
||||
.light .success-message{
|
||||
background-color: #DBF6D7;
|
||||
color: #6DCE5E;
|
||||
border-left: 4px solid #6DCE5E;
|
||||
}
|
||||
|
||||
/* Dark */
|
||||
#theIdentificationPage .dark,
|
||||
#theRegisterPage .dark,
|
||||
#thePasswordPage .dark{
|
||||
background: linear-gradient(75.69deg, #1B1B1D 7.64%, #2F2F2F 77.87%);
|
||||
}
|
||||
|
||||
.dark #login-form,
|
||||
.dark #register-form,
|
||||
.dark #password-form{
|
||||
background-color:#3C3C3C;
|
||||
}
|
||||
|
||||
#theIdentificationPage .dark a,
|
||||
#theRegisterPage .dark a,
|
||||
#thePasswordPage .dark a,
|
||||
.dark h1,
|
||||
.dark .input-container input,
|
||||
.dark .secondary-links,
|
||||
.dark .properties label,
|
||||
.dark .properties i,
|
||||
.dark #password-form p,
|
||||
.dark #lang-select #other-languages span{
|
||||
color:#D6D6D6;
|
||||
}
|
||||
|
||||
#theIdentificationPage .dark a:hover,
|
||||
#theRegisterPage .dark a:hover,
|
||||
#thePasswordPage .dark a:hover,
|
||||
.dark #lang-select #other-languages span{
|
||||
color:#ff7700;
|
||||
}
|
||||
|
||||
.dark #header-options a,
|
||||
.dark #header-options .toggle-mode,
|
||||
.dark #selected-language-container{
|
||||
color:#FFEBD0;
|
||||
}
|
||||
|
||||
.dark .input-container{
|
||||
background-color:#303030;
|
||||
border:1px solid #303030;
|
||||
}
|
||||
|
||||
.dark #separator{
|
||||
border-bottom:1px solid #303030;
|
||||
}
|
||||
|
||||
.dark .gallery-icon-eye{
|
||||
color:#898989;
|
||||
}
|
||||
|
||||
.dark #lang-select #other-languages {
|
||||
background-color: #3C3C3C;
|
||||
}
|
||||
|
||||
.dark .success-message{
|
||||
background-color: #4EA590;
|
||||
color: #AAF6E4;
|
||||
border-left: 4px solid #AAF6E4;
|
||||
}
|
||||
|
||||
/*Responsive display*/
|
||||
@media (max-width: 768px) {
|
||||
#login-form,
|
||||
#register-form,
|
||||
#password-form{
|
||||
max-width:300px;
|
||||
}
|
||||
}
|
||||
@@ -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,115 @@
|
||||
let modeCookie = getCookie("mode");
|
||||
if("" != modeCookie)
|
||||
{
|
||||
toggle_mode(modeCookie);
|
||||
}
|
||||
|
||||
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 () {
|
||||
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,6 @@
|
||||
<!-- BEGIN get_combined -->
|
||||
{get_combined_scripts load='footer'}
|
||||
<!-- END get_combined -->
|
||||
|
||||
</body>
|
||||
</html>
|
||||
@@ -0,0 +1,114 @@
|
||||
{combine_css id='identification_register' path="themes/standard_pages/css/identification_register.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='identification_register' load='async' require='jquery' path='themes/standard_pages/js/identification_register.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>
|
||||
|
||||
<section id="logo-section">
|
||||
<img id="piwigo-logo" src="{$ROOT_URL}themes/standard_pages/images/piwigo_logo.svg">
|
||||
</section>
|
||||
|
||||
<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-2"></i>
|
||||
<input type="text" class="" type="text" name="username" id="username" size="25" autofocus>
|
||||
</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 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,155 @@
|
||||
{combine_css id='identification_register' path="themes/standard_pages/css/identification_register.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='identification_register' load='async' require='jquery' path='themes/standard_pages/js/identification_register.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>
|
||||
|
||||
<section id="logo-section">
|
||||
<img id="piwigo-logo" src="{$ROOT_URL}themes/standard_pages/images/piwigo_logo.svg">
|
||||
</section>
|
||||
|
||||
|
||||
<section id="password-form">
|
||||
<div class="">
|
||||
|
||||
{if $action eq 'lost' or $action eq 'reset'}
|
||||
<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}<br>{'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>
|
||||
</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>
|
||||
|
||||
{/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,117 @@
|
||||
{combine_css id='identification_register' path="themes/standard_pages/css/identification_register.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='identification_register' load='async' require='jquery' path='themes/standard_pages/js/identification_register.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>
|
||||
|
||||
<section id="logo-section">
|
||||
<img id="piwigo-logo" src="{$ROOT_URL}themes/standard_pages/images/piwigo_logo.svg">
|
||||
</section>
|
||||
|
||||
|
||||
<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}</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}">
|
||||
</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}">
|
||||
</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>
|
||||
|
||||
<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">
|
||||
<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,8 @@
|
||||
<?php
|
||||
$themeconf = array(
|
||||
'name' => 'standard_pages',
|
||||
'parent' => 'default',
|
||||
'load_parent_css' => false,
|
||||
'img_dir' => 'themes/standard_pages/images',
|
||||
);
|
||||
?>
|
||||
Reference in New Issue
Block a user