Use Phosphor Icons

4 files changed, 54 insertions, 6 deletions

diff --git a/views/_tree.eta b/views/_tree.eta
index ac7b2b1..2549bb8 100644
--- a/views/_tree.eta
+++ b/views/_tree.eta
@@ -2,10 +2,11 @@
   <% for (const item of it.items) { %>
     <tr>
       <td>
-        <span class="icon"><%= item.contentType === 'directory' ? '📁' : '📄' %></span>
         <% if (item.contentType === 'directory') { %>
+          <img src="/static/icons/folder-simple.svg" alt="tree" class="icon">
           <a href="/<%= it.repo.owner %>/<%= it.repo.name %>/tree/<%= it.branch %>/<%= item.path %>"><%= item.name %></a>
         <% } else { %>
+          <img src="/static/icons/file.svg" alt="blob" class="icon">
           <a href="/<%= it.repo.owner %>/<%= it.repo.name %>/blob/<%= it.branch %>/<%= item.path %>"><%= item.name %></a>
         <% } %>
       </td>
diff --git a/views/home.eta b/views/home.eta
new file mode 100644
index 0000000..adb71f2
--- /dev/null
+++ b/views/home.eta
@@ -0,0 +1,47 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <meta charset="UTF-8">
+  <title>cgithub</title>
+  <link rel="stylesheet" href="/static/style.css">
+</head>
+<body>
+  <header>
+    <h1>cgithub</h1>
+    <p>Lightweight GitHub alternative frontend</p>
+  </header>
+
+  <main>
+    <p>Browse any GitHub repository by navigating to <code>/:owner/:repo</code></p>
+  </main>
+
+  <h2>Credits</h2>
+  <p>Icons by <a href="https://phosphoricons.com">Phosphor Icons</a></p>
+  <details>
+    <summary>Phosphor Icons License (MIT)</summary>
+    <pre>
+MIT License
+
+Copyright (c) 2023 Phosphor Icons
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.
+    </pre>
+  </details>
+</body>
+</html>
diff --git a/views/layout.eta b/views/layout.eta
index 8e5d9d9..982f8c0 100644
--- a/views/layout.eta
+++ b/views/layout.eta
@@ -8,7 +8,7 @@
 <body>
   <header>
     <h1><%= it.repo.owner %>/<%= it.repo.name %></h1>
-    <div>branch: <%= it.branch %></div>
+    <div><img src="/static/icons/git-branch.svg" alt="branch" class="icon"> <%= it.branch %></div>
     <% if (it.path) { %>
       <div>
         path: <a href="/<%= it.repo.owner %>/<%= it.repo.name %>/tree/<%= it.branch %>">root</a><%
diff --git a/views/repo.eta b/views/repo.eta
index 0b345df..4338708 100644
--- a/views/repo.eta
+++ b/views/repo.eta
@@ -6,16 +6,16 @@
       <div class="description"><%= it.info.description %></div>
     <% } %>
     <% if (it.info.website) { %>
-      <div><a href="<%= it.info.website %>" rel="noopener noreferrer"><%= it.info.website %></a></div>
+      <div><img src="/static/icons/link.svg" alt="" class="icon"> <a href="<%= it.info.website %>" rel="noopener noreferrer"><%= it.info.website %></a></div>
     <% } %>
     <% if (it.info.stars) { %>
-      <span>★ <%= it.info.stars %></span>
+      <span><img src="/static/icons/star.svg" alt="stars" class="icon"> <%= it.info.stars %></span>
     <% } %>
     <% if (it.info.watchers) { %>
-      <span>👁 <%= it.info.watchers %></span>
+      <span><img src="/static/icons/eye.svg" alt="watchers" class="icon"> <%= it.info.watchers %></span>
     <% } %>
     <% if (it.info.forks) { %>
-      <span>🔀 <%= it.info.forks %></span>
+      <span><img src="/static/icons/git-fork.svg" alt="forks" class="icon"> <%= it.info.forks %></span>
     <% } %>
   </div>
 <% } %>