diff --git a/admin/themes/clear/theme.css b/admin/themes/clear/theme.css index 943aacf45..60d7cf1f6 100644 --- a/admin/themes/clear/theme.css +++ b/admin/themes/clear/theme.css @@ -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;} diff --git a/admin/themes/default/template/themes_installed.tpl b/admin/themes/default/template/themes_installed.tpl index 7e9123f3b..4fcd4dab7 100644 --- a/admin/themes/default/template/themes_installed.tpl +++ b/admin/themes/default/template/themes_installed.tpl @@ -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}
diff --git a/admin/themes/default/template/themes_new.tpl b/admin/themes/default/template/themes_new.tpl index 69383f4c3..b15df45ab 100644 --- a/admin/themes/default/template/themes_new.tpl +++ b/admin/themes/default/template/themes_new.tpl @@ -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}

{'Add New Theme'|@translate}

diff --git a/admin/themes/default/theme.css b/admin/themes/default/theme.css index 41fdf00e8..386143ce3 100644 --- a/admin/themes/default/theme.css +++ b/admin/themes/default/theme.css @@ -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; diff --git a/admin/themes/roma/theme.css b/admin/themes/roma/theme.css index 93a6d3256..d95aced2e 100644 --- a/admin/themes/roma/theme.css +++ b/admin/themes/roma/theme.css @@ -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}