breadleaf.github.io/ResumeSection.js at main · Breadleaf/breadleaf.github.io · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
customElements.define(
  "resume-section",
  class extends HTMLElement {
    constructor() {
      super();
    }

    connectedCallback() {
      const title = this.getAttribute("title");
      const iconClasses = this.getAttribute("icon")?.split(" ") ?? [];

      this.innerHTML = "";

      const span = document.createElement("span");
      const icon = document.createElement("i");
      icon.classList.add(...iconClasses);
      const heading = document.createElement("h2");
      heading.textContent = title;
      span.append(icon, heading);

      const hr = document.createElement("hr");
      const br = document.createElement("br");
      this.append(span, hr, br);

      if (!document.head.querySelector('link[href="ResumeSection.css"]')) {
        const link = document.createElement("link");
        link.rel = "stylesheet";
        link.href = "ResumeSection.css";
        document.head.appendChild(link);
      }
    }
  }
);