jketreno/ketr.photos
1
0
Fork 0
Code Issues 1 Activity

Clicking on memories opens and focuses calendar

Browse Source 
Signed-off-by: James Ketrenos <james_git@ketrenos.com>
This commit is contained in:
James Ketr 2018-09-14 11:41:28 -07:00
parent 53a8c451c6
commit 320b36c37d
1 changed files with 21 additions and 5 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

26
frontend/src/ketr-photos/ketr-photos.html
View File

@ -63,6 +63,11 @@
padding-left: 0.5em; padding-left: 0.5em;
} }
#header [mode='memories'] b:hover {
cursor: pointer;
text-decoration: underline;
}
#breadcrumb { #breadcrumb {
padding: 0.5em; padding: 0.5em;
} }
@ -83,7 +88,7 @@
} }
#pages > div > div { #pages > div > div {
margin: 0.5em; padding: 0.5em;
cursor: pointer; cursor: pointer;
} }
@ -212,6 +217,11 @@
}; };
} }
div:focus {
font-weight: bold;
outline: none;
}
calendar-element { calendar-element {
font-size: 0.8em; font-size: 0.8em;
} }
@ -266,6 +276,7 @@
</div> </div>
<calendar-element <calendar-element
id="calendar" id="calendar"
tabindex
min="2016-01-01" min="2016-01-01"
max="2016-12-31" max="2016-12-31"
date="{{date}}"></calendar-element> date="{{date}}"></calendar-element>
@ -276,10 +287,10 @@
</div> </div>
<div id="albums" class="flex layout vertical"> <div id="albums" class="flex layout vertical">
<template is="dom-repeat" items="[[breadcrumb(path)]]"> <template is="dom-repeat" items="[[breadcrumb(path)]]">
<div on-tap="loadPath">[[item.name]] /</div> <div tabindex="0" on-tap="loadPath">[[item.name]] /</div>
</template> </template>
<template is="dom-repeat" items="[[albums.children]]"> <template is="dom-repeat" items="[[albums.children]]">
<div on-tap="loadPath">[[item.name]]</div> <div tabindex="0" on-tap="loadPath">[[item.name]]</div>
</template> </template>
</div> </div>
</iron-pages> </iron-pages>
@ -291,11 +302,11 @@
<iron-pages attr-for-selected="mode" selected="[[mode]]"> <iron-pages attr-for-selected="mode" selected="[[mode]]">
<div mode="albums" id="breadcrumb" class="horizontal layout center"> <div mode="albums" id="breadcrumb" class="horizontal layout center">
<template is="dom-repeat" items="[[breadcrumb(path)]]"> <template is="dom-repeat" items="[[breadcrumb(path)]]">
<div on-tap="loadPath">[[item.name]] /</div> <div tabindex="0" on-tap="loadPath">[[item.name]] /</div>
</template> </template>
</div> </div>
<div mode="time">time</div> <div mode="time">time</div>
<div mode="memories">Photos taken on <b>[[memoryDate]]</b></div> <div mode="memories">Photos taken on <b on-tap="drawerToggle">[[memoryDate]]</b></div>
</iron-pages> </iron-pages>
</div> </div>
</app-header> </app-header>
@ -456,6 +467,11 @@
if (window.innerWidth >= 800) { if (window.innerWidth >= 800) {
this.$.drawer.persistent = true; this.$.drawer.persistent = true;
} }
if (this.mode == "memories") {
this.async(function() {
this.$.calendar.$.days.focus();
}, 100);
}
} }
}, },