Add sponsor

astro
Kamran Ahmed 2 years ago
parent 4f9153fdb3
commit 9f4ffa211e
  1. 2
      src/components/Sponsor/Sponsor.astro
  2. 5
      src/components/Sponsor/sponsor.js
  3. 69
      src/components/TopicSearch/topics.js
  4. 10
      src/pages/[roadmapId]/index.astro

@ -22,7 +22,7 @@ const {
id='sponsor-ad' id='sponsor-ad'
target='_blank' target='_blank'
rel='noopener sponsored' rel='noopener sponsored'
class='fixed bottom-[15px] right-[20px] outline-[2px] outline-transparent z-50 bg-white max-w-[330px] shadow-lg hidden' class='fixed bottom-[15px] right-[20px] outline-transparent z-50 bg-white max-w-[330px] shadow-lg outline-0 hidden'
> >
<img <img
src={ imageUrl } src={ imageUrl }

@ -1,8 +1,9 @@
window.setTimeout(() => { window.setTimeout(() => {
const ad = document.querySelector('.sponsor-ad'); const ad = document.querySelector('#sponsor-ad');
if (!ad) { if (!ad) {
return; return;
} }
ad.classList.remove('hidden'); ad.classList.remove('hidden');
}, 500); ad.classList.add('flex');
}, 500);

@ -1,31 +1,46 @@
class Topics { class Topics {
constructor() { constructor() {
this.onDOMLoaded = this.onDOMLoaded.bind(this); this.topicSearchId = 'search-topic-input';
this.init = this.init.bind(this);
this.filterTopicNodes = this.filterTopicNodes.bind(this); this.onDOMLoaded = this.onDOMLoaded.bind(this);
} this.init = this.init.bind(this);
this.filterTopicNodes = this.filterTopicNodes.bind(this);
filterTopicNodes(e) { }
const value = e.target.value.trim().toLowerCase();
if (!value) { get topicSearchEl() {
document.querySelectorAll(`[data-topic]`).forEach((item) => item.classList.remove('hidden')); return document.getElementById(this.topicSearchId);
return; }
}
filterTopicNodes(e) {
document.querySelectorAll(`[data-topic]`).forEach((item) => item.classList.add('hidden')); const value = e.target.value.trim().toLowerCase();
if (!value) {
document.querySelectorAll(`[data-topic*="${value}"]`).forEach((item) => item.classList.remove('hidden')); document
} .querySelectorAll(`[data-topic]`)
.forEach((item) => item.classList.remove('hidden'));
onDOMLoaded() { return;
document.getElementById('search-topic-input').addEventListener('keyup', this.filterTopicNodes);
} }
init() { document
window.addEventListener('DOMContentLoaded', this.onDOMLoaded); .querySelectorAll(`[data-topic]`)
.forEach((item) => item.classList.add('hidden'));
document
.querySelectorAll(`[data-topic*="${value}"]`)
.forEach((item) => item.classList.remove('hidden'));
}
onDOMLoaded() {
if (!this.topicSearchEl) {
return;
} }
this.topicSearchEl.addEventListener('keyup', this.filterTopicNodes);
}
init() {
window.addEventListener('DOMContentLoaded', this.onDOMLoaded);
} }
}
const topicRef = new Topics();
topicRef.init(); const topicRef = new Topics();
topicRef.init();

@ -42,7 +42,11 @@ const roadmapData = roadmapFile.frontmatter as RoadmapFrontmatter;
) )
} }
<MarkdownRoadmap> {
<roadmapFile.Content /> !roadmapData.jsonUrl && (
</MarkdownRoadmap> <MarkdownRoadmap>
<roadmapFile.Content />
</MarkdownRoadmap>
)
}
</BaseLayout> </BaseLayout>

Loading…
Cancel
Save