mirror of
https://github.com/Piwigo/Piwigo.git
synced 2026-08-07 09:13:02 +02:00
Fix bugs and fix design of the theme manager
This commit is contained in:
@@ -211,7 +211,7 @@ INPUT[type="text"].large { width: 317px; }
|
||||
.themeActions span {background-color: #ddd;}
|
||||
#themesContent H3 {border-bottom:1px solid #aaa;}
|
||||
.themeSelect {background-color: #fafafa;}
|
||||
.themeDefault {background-color: #ffd7ad;}
|
||||
.themeSelect.themeDefault {background-color: #ffd7ad;}
|
||||
|
||||
#pluginsMenuSeparator {border:1px solid #555;}
|
||||
|
||||
|
||||
@@ -4,31 +4,6 @@
|
||||
jQuery(document).ready(function() {
|
||||
$("a.preview-box").colorbox();
|
||||
|
||||
$('.themeBox').each(function() {
|
||||
|
||||
let screenImage = $(this).find(".preview-box img");
|
||||
screenImage.on( 'load', () => {
|
||||
let imageW = screenImage.innerWidth();
|
||||
let imageH = screenImage.innerHeight();
|
||||
let size = $(this).find(".preview-box").innerWidth();
|
||||
|
||||
console.log(screenImage.innerHeight())
|
||||
|
||||
if (imageW > imageH) {
|
||||
screenImage.css('height', size+'px');
|
||||
screenImage.css('width', (imageW * size / imageH)+'px');
|
||||
} else {
|
||||
screenImage.css('width', size+'px');
|
||||
screenImage.css('heigth', (imageH * size / imageW)+'px');
|
||||
}
|
||||
});
|
||||
|
||||
let box = $(this);
|
||||
box.find('.showInfo').on('click', function() {
|
||||
box.find('.showInfo-dropdown').fadeToggle();
|
||||
});
|
||||
})
|
||||
|
||||
$(document).mouseup(function (e) {
|
||||
e.stopPropagation();
|
||||
if (!$(event.target).hasClass('showInfo')) {
|
||||
@@ -38,6 +13,35 @@ jQuery(document).ready(function() {
|
||||
|
||||
});
|
||||
|
||||
$(window).bind("load", function() {
|
||||
$('.themeBox').each(function() {
|
||||
|
||||
let box = $(this);
|
||||
box.find('.showInfo').on('click', function() {
|
||||
let dropdown = box.find('.showInfo-dropdown');
|
||||
$('.showInfo-dropdown').each(function() {
|
||||
if ($(this) !== dropdown) {
|
||||
$(this).fadeOut();
|
||||
}
|
||||
})
|
||||
box.find('.showInfo-dropdown').fadeToggle();
|
||||
});
|
||||
|
||||
let screenImage = $(this).find(".preview-box img");
|
||||
let imageW = screenImage.innerWidth();
|
||||
let imageH = screenImage.innerHeight();
|
||||
let size = $(this).find(".preview-box").innerWidth();
|
||||
|
||||
if (imageW > imageH) {
|
||||
screenImage.css('height', size+'px');
|
||||
screenImage.css('width', (imageW * size / imageH)+'px');
|
||||
} else {
|
||||
screenImage.css('width', size+'px');
|
||||
screenImage.css('heigth', (imageH * size / imageW)+'px');
|
||||
}
|
||||
})
|
||||
})
|
||||
|
||||
{/literal}{/footer_script}
|
||||
|
||||
<div class="titrePage">
|
||||
|
||||
@@ -1,29 +1,23 @@
|
||||
{include file='include/colorbox.inc.tpl'}
|
||||
{footer_script}{literal}
|
||||
|
||||
jQuery(document).ready(function() {
|
||||
$("a.preview-box").colorbox();
|
||||
|
||||
$(window).bind("load", function() {
|
||||
$('.themeBox').each(function() {
|
||||
|
||||
let screenImage = $(this).find(".preview-box img");
|
||||
screenImage.on( 'load', () => {
|
||||
let imageW = screenImage.innerWidth();
|
||||
let imageH = screenImage.innerHeight();
|
||||
let size = $(this).find(".preview-box").innerWidth();
|
||||
let imageW = screenImage.innerWidth();
|
||||
let imageH = screenImage.innerHeight();
|
||||
let size = $(this).find(".preview-box").innerWidth();
|
||||
|
||||
console.log(screenImage.innerHeight())
|
||||
|
||||
if (imageW > imageH) {
|
||||
screenImage.css('height', size+'px');
|
||||
screenImage.css('width', (imageW * size / imageH)+'px');
|
||||
} else {
|
||||
screenImage.css('width', size+'px');
|
||||
screenImage.css('heigth', (imageH * size / imageW)+'px');
|
||||
}
|
||||
});
|
||||
if (imageW > imageH) {
|
||||
screenImage.css('height', size+'px');
|
||||
screenImage.css('width', (imageW * size / imageH)+'px');
|
||||
} else {
|
||||
screenImage.css('width', size+'px');
|
||||
screenImage.css('heigth', (imageH * size / imageW)+'px');
|
||||
}
|
||||
})
|
||||
});
|
||||
})
|
||||
{/literal}{/footer_script}
|
||||
<div class="titrePage">
|
||||
<h2>{'Add New Theme'|@translate}</h2>
|
||||
|
||||
@@ -1483,9 +1483,10 @@ margin-top:4px; padding-bottom:3px; padding-top:3px; top:1px;
|
||||
.themeName {font-size:14px; margin:10px; position:relative; text-transform: capitalize; font-weight: bold; text-align: left; white-space: nowrap; max-width: 180px; overflow: hidden; text-overflow: ellipsis;}
|
||||
.themeName em {font-weight: normal;}
|
||||
.themeName .showInfo {position: absolute; right: 0; top: 50%; transform: translateY(-50%);}
|
||||
.themeBox .showInfo-dropdown {position: absolute; right: 0px; transform: translateX(38%); display: none; text-align: left; padding-bottom: 0;}
|
||||
.themeBox .showInfo-dropdown {position: absolute; right: 0px; transform: translateX(40%); display: none; text-align: left; padding-bottom: 0;}
|
||||
.themeSelect {box-shadow: 0px 2px 1px #00000024; display: inline-block; text-align: center; padding: 0px 10px 8px 10px; margin-right: 10px; transition: 0.4s ease;}
|
||||
.showInfo-dropdown-header {padding: 5px 10px; white-space: nowrap; font-weight: bold; font-size: 12px;}
|
||||
.showInfo-dropdown-header a:hover {color: white;}
|
||||
.showInfo-dropdown-content {padding: 5px 10px}
|
||||
.showInfo-dropdown-action {padding: 8px 10px; border-top: 1px solid #ffffff45; color: white; text-decoration: none !important; display: block; margin-top: 5px; border-radius: 0px 0px 10px 10px; font-weight: bold;}
|
||||
.showInfo-dropdown-action:hover {background-color: rgba(0, 0, 0, 0.192); color: white;}
|
||||
@@ -2977,11 +2978,6 @@ input[type="text"].dError {border-color:#ff7070; background-color:#FFe5e5;}
|
||||
}
|
||||
|
||||
/* Selection mode */
|
||||
|
||||
.content div.titrePage{
|
||||
padding-top:35px;
|
||||
}
|
||||
|
||||
.selection-mode-group-manager{
|
||||
position:absolute;
|
||||
right:15px;
|
||||
|
||||
@@ -280,8 +280,8 @@ a.stat-box:hover {
|
||||
.themeBox {background-color:#333;}
|
||||
.themeName {color:#ccc;}
|
||||
.themeSelect {background-color: #333; box-shadow: none;}
|
||||
.themeDefault {background-color: #f9852c;}
|
||||
.themeDefault a, .themeDefault span, .themeDefault .themeName{ color:#333;}
|
||||
.themeSelect.themeDefault {background-color: #f9852c;}
|
||||
.themeSelect.themeDefault a, .themeSelect.themeDefault span, .themeSelect.themeDefault .themeName{ color:#333;}
|
||||
.themeActions A {border-bottom:none;}
|
||||
.themeActions span {background-color: #888888;color: #666666;}
|
||||
.showInfo-dropdown-header a {color:#3A3A3A}
|
||||
|
||||
Reference in New Issue
Block a user