Fix to overlay, non-image bottom padding, image onclick coverage.

This commit is contained in:
kor 2018-11-05 00:19:50 +13:00
parent 260e5f48dc
commit a92964b37d
2 changed files with 14 additions and 9 deletions

View File

@ -18,7 +18,7 @@
--color-page-e: #333; /*enabled*/
--color-page-a: #666; /*ascent*/
--alpha-darken: 0.2;
--alpha-darken: 0.3;
--alpha-idleicon: 0.2;
--alpha-idle: 0.4;
--alpha-enabledicon: 0.4;
@ -258,8 +258,7 @@ main:after {
}
/* GRID ITEM */
article, .article-wide {
/*padding-bottom: var(--size-grid-gutter);*/
.article, .article-wide {
border-radius: var(--size-item-corner);
margin-bottom: var(--size-grid-gutter);
background: var(--color-itembg);
@ -267,6 +266,7 @@ article, .article-wide {
text-decoration: none;
position: relative;
float: left;
/*padding-bottom: var(--size-grid-gutter);*/
}
@media screen and (min-width: 886px) {
.article-wide {
@ -286,7 +286,8 @@ article::selection {
width: 100%;
}
.article-containerlower {
padding: 0 var(--size-grid-gutter) 0 var(--size-grid-gutter);
padding: 0 var(--size-grid-gutter) var(--size-grid-gutter);
display: inline-block;
z-index: 100;
}
.article-containerlower:empty {

View File

@ -86,18 +86,22 @@ function Grid()
let onclickImage = ``;
let articleIsImageType = (SETTINGS.SHOWIMAG && main.util.isType(value.TYPE, 'image'));
// ARTICLE
let article = `<article class="${itemClass}" id="${SETTINGS.ARTICLEIDBASE + value.DIID}">`;
if (articleIsImageType)
{
// itemClass += " article-image";
// itemClass = 'article-typeImg';
// if (SETTINGS.WIDEARTICLE && main.util.isDefined(value.WIDE) && value.WIDE)
// {
// itemClass = 'article-typeImg-wide';
// }
// article += `<div class='article-image'>`;
onclickImage = `onclick="main.grid.handleImageClick(event, this, '${value.FILE}');"
style="cursor: pointer;"`;
}
// ARTICLE
let article = `<article class="${itemClass}" id="${SETTINGS.ARTICLEIDBASE + value.DIID}">`;
if (main.util.isDefined(value.LINK))
{
var idUrl = "url";
@ -187,7 +191,7 @@ function Grid()
article += `<div class="article-imageType-imgContainer">`;
if (SETTINGS.SHOWOVERLAY)
{
article += `<div class="image-overlay"></div>`;
article += `<div class="image-overlay" ${onclickImage}></div>`;
}
article += `<img class="article-image-img" src="content/media/${value.FILE}">`;