Changes for page CLB Search Component
Last modified by bougault on 2023/01/17 11:42
Summary
-
Page properties (1 modified, 0 added, 0 removed)
Details
- Page properties
-
- Content
-
... ... @@ -53,7 +53,7 @@ 53 53 this.$('#prev').addEventListener('click', this.handlePrevPage); 54 54 this.$('#next').addEventListener('click', this.handleNextPage); 55 55 searchInput.addEventListener('keypress', this.handleKeyPress); 56 - 56 + searchInput.focus(); 57 57 } 58 58 59 59 disconnectedCallback() { ... ... @@ -66,8 +66,23 @@ 66 66 get styles() { 67 67 return ` 68 68 input[type="text"] { 69 - border: 1px solid red; 69 + display: block; 70 + width: 100%; 71 + padding: 6px 12px; 72 + font-size: 16px; 73 + line-height: 1.428571429; 74 + color: #555555; 75 + background-color: #fff; 76 + background-image: none; 77 + border: 1px solid #ccc; 78 + border-radius: 4px; 79 + -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075); 80 + box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075); 81 + -webkit-transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s; 82 + -o-transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s; 83 + transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s; 70 70 } 85 + 71 71 ` 72 72 } 73 73 handlePrevPage = () => { ... ... @@ -89,7 +89,9 @@ 89 89 } 90 90 91 91 handleKeyPress = (e) => { 92 - console.log(e.code); 107 + if(e.code === 'Enter') { 108 + this.handleSearch(); 109 + } 93 93 } 94 94 95 95 get html() { ... ... @@ -146,7 +146,7 @@ 146 146 get html() { 147 147 return ` 148 148 <div> 149 - <a href=${this.hrefAttr}>${this.titleAttr}</a> 166 + <a href="/bin/view/${this.hrefAttr}">${this.titleAttr}</a> 150 150 <div> 151 151 <slot></slot> 152 152 </div> ... ... @@ -157,6 +157,7 @@ 157 157 this.attachShadow({ mode: 'open' }); 158 158 this.shadowRoot.appendChild(this.template.content.cloneNode(true)); 159 159 } 177 + 160 160 } 161 161 ); 162 162 </script>