diff --git a/public/js/main.js b/public/js/main.js index ad07309..56d876f 100644 --- a/public/js/main.js +++ b/public/js/main.js @@ -8,6 +8,18 @@ scrollBtn.addEventListener("click", function () { }); }); +const input = document.querySelector('input') +const scrollContainer = document.querySelector('.scroll-container') +//add event listener for when input is focused +input.addEventListener('keydown', (e) => { + if (e.key === 'Enter') { + //stop browser from refreshing + e.preventDefault() + getMatches() + } +}); + + const btn = document.getElementById('keyword-btn'); btn.addEventListener('click', getMatches); @@ -28,6 +40,10 @@ async function getMatches() { } catch (err) { console.error(err); } + //reset search bar to empty + document.querySelector('input').value = '' + //scroll back to the top + scrollContainer.scrollTop = 0 } /** diff --git a/resources.js b/resources.js index 50666f5..9ad725c 100644 --- a/resources.js +++ b/resources.js @@ -259,6 +259,32 @@ const resources = [ url: 'https://cloudconvert.com/jpg-to-webp', keywords: ['jpg', 'webp', 'converter', 'heic', 'formats', 'high-quality', 'api'] }, + + { + name: 'Thumbnails for Social Media "Metatags', + url: 'https://nickcarmont8.medium.com/how-to-add-a-website-thumbnail-for-sharing-your-html-site-on-social-media-facebook-linkedin-12813f8d2618', + keywords: ['metadata', 'metatags', 'thumbnails', 'social media'] + }, + { + name: 'HTML Cheat Sheet', + url: 'https://htmlcheatsheet.com/', + keywords: ['HTML', 'cheat sheet', 'tags'] + }, + { + name: 'CSS Cheat Sheet', + url: 'https://htmlcheatsheet.com/css/', + keywords: ['CSS', 'cheat sheet', 'box model', 'selectors', 'color picker'] + }, + { + name: 'JS "JavaScript" Cheat Sheet', + url: 'https://htmlcheatsheet.com/js/', + keywords: ['JS', 'Javascript', 'cheat sheet', 'conditionals', 'loops', 'variables', 'dates', 'events', 'functions', 'regex', 'json', 'promises', 'arrays'] + }, + { + name: 'SEO Cheat Sheet', + url: 'https://htmlcheatsheet.com/seo/', + keywords: ['SEO', 'cheat sheet'] + }, // Resource Format - please follow the styling below. // { // name: '',