Style tweaks on selection

Signed-off-by: James Ketrenos <james_git@ketrenos.com>
This commit is contained in:
James Ketr 2018-09-06 21:03:00 -07:00
parent bbe87a9456
commit 39264fa56f
2 changed files with 22 additions and 15 deletions

View File

@ -62,6 +62,10 @@
},
"width": {
type: Number
},
"selected": {
type: Boolean,
reflectToAttribute: true
}
},

View File

@ -132,6 +132,14 @@
text-decoration: underline;
}
.date-line {
margin-left: 2em;
}
.date-line .header {
padding: 0.25em 3px;
}
photo-thumbnail {
--photo-thumbnail: {
border: 3px solid white;
@ -140,7 +148,7 @@
photo-thumbnail[selected] {
--photo-thumbnail: {
border-color: blue;
border: 3px solid blue;
};
}
@ -170,13 +178,7 @@
<paper-spinner active$="[[loading]]" class="thin"></paper-spinner>
</div>
</app-header>
<div id="content" fullbleed class="flex layout vertical">
<div id="thumbnails" class="layout horizontal wrap"></div>
<div id="magic"></div>
<div class="layout horizontal">
<paper-button disabled$="[[!next]]" on-tap="loadNextPhotos">next</paper-button>
</div>
</div>
<div id="thumbnails" class="layout horizontal wrap"></div>
</app-header-layout>
</app-drawer-layout>
<paper-toast id="toast"></paper-toast>
@ -425,6 +427,10 @@
lightBoxClose: function(event) {
this.disableScrolling = false;
if (this.lightBoxElement) {
this.lightBoxElement.selected = false;
this.updateStyles();
}
},
lightBoxNext: function(event) {
@ -483,16 +489,18 @@
loadLightbox: function(el) {
if (this.lightBoxElement) {
this.lightBoxElement.removeAttribute("selected");
this.lightBoxElement.selected = false;
}
el.setAttribute("selected", true);
this.$.lightbox.src = this.base + el.item.path + "/" + el.item.filename;
this.lightBoxElement = el;
this.lightBoxElement.selected = true;
this.disableScrolling = true;
this.topStickX = window.scrollX;
this.topStickY = window.scrollY;
this.$.lightbox.open();
this.updateStyles();
},
_imageTap: function(event) {
@ -762,11 +770,6 @@
return true;
}
if (this.next && isElementInViewport(this.$.magic)) {
this.loadNextPhotos();
}
}.bind(this), 500);
this._loadAlbums();