Issue-97: Clean up

ProjectEvergreen · Oct 14, 2024 · 4a797d9 · 4a797d9
1 parent 5de50f9
commit 4a797d9
Show file tree

Hide file tree

Showing 3 changed files with 14 additions and 14 deletions.
diff --git a/src/components/edit-on-github/edit-on-github.js b/src/components/edit-on-github/edit-on-github.js
@@ -3,7 +3,6 @@ import styles from './edit-on-github.module.css';
 const REPO_PREFIX = 'https://github.com/ProjectEvergreen/www.greenwoodjs.dev/blob/main/src/pages/';
 
 function convertRouteToSubLink(route) {
-  console.log('incoming route', route);
   if (route === "/") return "index.md"; // root of diretory === index
 
   const DIRS = [
@@ -25,17 +24,18 @@ function convertRouteToSubLink(route) {
 
 export default class EditOnGitHub extends HTMLElement {
   connectedCallback() {
+    const label = this.getAttribute('label') || 'Edit on GitHub';
     const route = this.getAttribute('route');
-    const subLink = convertRouteToSubLink(route);
+    const href = `${REPO_PREFIX}${convertRouteToSubLink(route)}`;
 
     this.innerHTML = `
       <div class="${styles.container}">
-        <a title="Edit on GitHub" href="${REPO_PREFIX}${subLink}" target="_blank">
-          Edit on GitHub
+        <a title="${label}" href="${href}" target="_blank">
+          ${label}
         </a>
       </div>
     `
   }
 }
 
-customElements.define("app-edit-on-github", EditOnGitHub);
+customElements.define("app-edit-on-github", EditOnGitHub);
diff --git a/src/components/edit-on-github/edit-on-github.spec.js b/src/components/edit-on-github/edit-on-github.spec.js
@@ -44,12 +44,12 @@ describe("Components/Edit on GitHub", () => {
     });
 
     it("should render the text 'Edit on GitHub'", () => {
-      // use trim due to allow backtick use
+      // use trim to allow backtick use in code
       expect(editLink.text.trim()).equal("Edit on GitHub");
     });
 
-    describe("when the route is ONLY a leading slash", () => {
-      it("should return root-level ('/') as 'index.md'", () => {
+    describe("when the route is ONLY a slash", () => {
+      it("should return 'index.md' for root-level ('/')", () => {
         const expected = `${EXPECTED_BASE}index.md`;
 
         expect(editLink.getAttribute("href")).equal(expected);
@@ -72,7 +72,7 @@ describe("Components/Edit on GitHub", () => {
         editLink = editWrapper.querySelector("a")
       });
 
-      it("should include a href attribute which includes the index.md filepath", () => {
+      it("should include a href attribute which includes filepath.md", () => {
         const expected = `${EXPECTED_BASE}some/static/filename.md`;
 
         expect(editLink.getAttribute("href")).equal(expected);
@@ -95,11 +95,11 @@ describe("Components/Edit on GitHub", () => {
         editLink = editWrapper.querySelector("a")
       });
 
-      it("should include a href attribute which includes the provided route", () => {
+      it("should include a href attribute which includes index.md", () => {
         const expected = `${EXPECTED_BASE}some/path/to/hosting/index.md`
 
         expect(editLink.getAttribute("href")).equal(expected);
       });
     });
   });
-});
+});
diff --git a/src/layouts/guides.html b/src/layouts/guides.html
@@ -83,8 +83,8 @@
         margin-top: 26px;
       }
 
-      .content-footer a[title="Edit on GitHub"] {
-        box-shadow: 0px 0px 20px -3px #fff;
+      .content-footer a {
+        box-shadow: 0px 0px 12px -3px var(--color-white);
       }
 
       app-heading-box {
@@ -184,7 +184,7 @@
     <div class="content-outlet">
       <content-outlet></content-outlet>
       <div class="content-footer">
-        <app-edit-on-github route="${globalThis.page.route}"></app-edit-on-github>
+        <app-edit-on-github route="${globalThis.page.route}" label="something else"></app-edit-on-github>
       </div>
     </div>
   </body>