diff options
| -rw-r--r-- | public/assets/css/hootstream.css | 18 | ||||
| -rw-r--r-- | public/assets/js/lib/views/stream/hootstream.js | 12 |
2 files changed, 27 insertions, 3 deletions
diff --git a/public/assets/css/hootstream.css b/public/assets/css/hootstream.css index da65bc5..97d1a77 100644 --- a/public/assets/css/hootstream.css +++ b/public/assets/css/hootstream.css @@ -60,7 +60,7 @@ padding-left: 7.5rem; margin-bottom: 1rem; display: flex; - flex-direction: row; + flex-flow: row wrap; align-items: flex-end; } #hootevents .hootText img { @@ -188,6 +188,7 @@ margin-left: 8.25rem; width: calc(100% - 12rem); height: 0; + display: none; } #hootevents .divider.dark { border-top: 1px solid rgba(88, 88, 88, 0.4); @@ -196,14 +197,24 @@ border-bottom: 0; } #hootevents .thread { + margin-top: 1rem; + margin-bottom: 1rem; +} +#hootevents .thread:nth-child(odd) { background: linear-gradient( 90deg, rgba(127, 127, 127, 0), rgba(127, 127, 127, 0.05), rgba(127, 127, 127, 0) ); - margin-top: 1rem; - margin-bottom: 1rem; +} +#hootevents .thread:nth-child(even) { + background: linear-gradient( + 90deg, + rgba(96, 96, 96, 0), + rgba(96, 96, 96, 0.05), + rgba(96, 96, 96, 0) + ); } #hootevents .thread + .thread { margin-top: 0; @@ -263,6 +274,7 @@ flex: 1; overflow: hidden; text-overflow: ellipsis; + cursor: pointer; } #hootevents .fileRow div { color: rgba(64, 64, 64, 1); diff --git a/public/assets/js/lib/views/stream/hootstream.js b/public/assets/js/lib/views/stream/hootstream.js index a7a15d2..51d26ba 100644 --- a/public/assets/js/lib/views/stream/hootstream.js +++ b/public/assets/js/lib/views/stream/hootstream.js @@ -3,6 +3,7 @@ var HootStream = View.extend({ events: { "click a": "onClickLink", + "click .filename": "onClickFilename", }, initialize: function ({ parent }) { @@ -14,6 +15,7 @@ var HootStream = View.extend({ this.fileTemplate = this.$(".fileTemplate").html(); this.imageTemplate = this.$(".imageTemplate").html(); this.onClickLink = this.onClickLink.bind(this); + this.onClickFilename = this.onClickFilename.bind(this); }, onClickLink: function (event) { @@ -46,6 +48,16 @@ var HootStream = View.extend({ // this.parent.onKeyword(keyword) }, + onClickFilename: function (event) { + const linkTag = event.target.querySelector("a.file"); + if (linkTag) { + this.onClickLink({ + preventDefault: event.preventDefault, + target: linkTag, + }); + } + }, + load: function (data, filters) { this.state = { ...this.agglutinate(data), |