Refactor image type entry css, fix (remove) image-type-link underline.

This commit is contained in:
kor 2018-10-31 14:26:21 +13:00
parent ee0bdca87b
commit 66d868454b
2 changed files with 26 additions and 10 deletions

View File

@ -230,7 +230,9 @@ body {
} }
/*IMAGE*/ /*IMAGE*/
.griditem-image .griditem-containerupper { .griditem-containerupper-image {
padding: var(--size-grid-gutter) var(--size-grid-gutter) 0 var(--size-grid-gutter);
display: inline-block;
position: absolute; position: absolute;
height: 100%; height: 100%;
width: 100%; width: 100%;
@ -238,14 +240,17 @@ body {
z-index: 200; z-index: 200;
top: 0; top: 0;
} }
.griditem-image .griditem-containerlower { .griditem-containerlower-image {
padding-bottom: var(--size-grid-gutter); padding: var(--size-grid-gutter);
position: absolute; position: absolute;
width: 100%; width: 100%;
bottom: 0; bottom: 0;
z-index: 200; z-index: 200;
left: 0; left: 0;
} }
.griditem-containerlower-image:empty {
display: none;
}
.griditem-image { .griditem-image {
background: transparent; background: transparent;
padding-bottom: 0; padding-bottom: 0;
@ -371,6 +376,7 @@ body {
vertical-align: top; vertical-align: top;
text-align: center; text-align: center;
float: right; float: right;
text-decoration: none;
} }
.griditem-typeicon { .griditem-typeicon {
opacity: var(--alpha-idleicon); opacity: var(--alpha-idleicon);
@ -451,10 +457,10 @@ body {
} }
/* IMAGE */ /* IMAGE */
.griditem-image .griditem-containerlower { .griditem-containerlower-image {
display: none; display: none;
} }
.griditem-image:hover .griditem-containerlower { .griditem-image:hover .griditem-containerlower-image {
display: initial; display: initial;
} }
.griditem-taglink { .griditem-taglink {

View File

@ -88,7 +88,8 @@ function View()
} }
let onclickImage = ``; let onclickImage = ``;
if (SETTINGS.SHOWIMAG && this.isType(value.TYPE, 'image')) let entryIsImageType = (SETTINGS.SHOWIMAG && this.isType(value.TYPE, 'image'));
if (entryIsImageType)
{ {
itemClass += " griditem-image"; itemClass += " griditem-image";
onclickImage = `onclick="main.view.handleImageClick(event, this, '${value.FILE}');" onclickImage = `onclick="main.view.handleImageClick(event, this, '${value.FILE}');"
@ -118,7 +119,12 @@ function View()
// UPPER CONTENT START // UPPER CONTENT START
if (SETTINGS.SHOWUPPER) if (SETTINGS.SHOWUPPER)
{ {
entry += `<div class="griditem-containerupper" ${onclickImage}>`; let upperClass = 'griditem-containerupper';
if (entryIsImageType)
{
upperClass = 'griditem-containerupper-image';
}
entry += `<div class="${upperClass}" ${onclickImage}>`;
// TITLE // TITLE
if (SETTINGS.SHOWTITLE) if (SETTINGS.SHOWTITLE)
@ -165,7 +171,12 @@ function View()
// LOWER CONTENT START // LOWER CONTENT START
if (SETTINGS.SHOWLOWER) if (SETTINGS.SHOWLOWER)
{ {
entry += `<div class="griditem-containerlower" ${onclickImage}>`; let lowerClass = 'griditem-containerlower';
if (entryIsImageType)
{
lowerClass = 'griditem-containerlower-image';
}
entry += `<div class="${lowerClass}" ${onclickImage}>`;
// AUTHOR // AUTHOR
if (SETTINGS.SHOWAUTH && this.isDefined(value.AUTH)) if (SETTINGS.SHOWAUTH && this.isDefined(value.AUTH))
@ -260,8 +271,7 @@ function View()
} }
// IMAGE - for image-type-entry // IMAGE - for image-type-entry
if (SETTINGS.SHOWIMAG if (entryIsImageType
&& this.isType(value.TYPE, 'image')
&& this.isDefined(value.FILE) && this.isDefined(value.FILE)
&& this.isImage(value.FILE)) && this.isImage(value.FILE))
{ {