add photon client (#239)

* add photon client

* fix: add closing div

---------

Co-authored-by: Nutomic <me@nutomic.com>

src/assets/images/photon-logo.svg

@@ -0,0 +1,4 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="100" height="100" viewBox="0 0 100 100" fill="none">
+<circle cx="50" cy="50" fill="white" r="50" />
+<path d="M45 20.8868C48.094 19.1004 51.906 19.1004 55 20.8868L72.7128 31.1132C75.8068 32.8996 77.7128 36.2008 77.7128 39.7735V60.2265C77.7128 63.7992 75.8068 67.1004 72.7128 68.8868L55 79.1132C51.906 80.8996 48.094 80.8996 45 79.1132L27.2872 68.8868C24.1932 67.1004 22.2872 63.7992 22.2872 60.2265V39.7735C22.2872 36.2008 24.1932 32.8996 27.2872 31.1132L45 20.8868Z" fill="black"/>
+</svg>

src/shared/components/apps.tsx

@@ -164,58 +164,74 @@ export class Apps extends Component<any, any> {
 
             <div class="card col-6">
               <AppDetails
-                name="lemmy-lite"
-                description="A static, JSless, touch-friendly Lemmy frontend built for legacy web clients and maximum performance"
-                link="https://github.com/IronOxidizer/lemmy-lite"
-                banner="/static/assets/images/lemmy_lite_screen.webp"
+                name="Photon"
+                description="A sleek lemmy web UI."
+                link="https://github.com/Xyphyn/photon"
+                banner="/static/assets/images/photon.webp"
+                icon="/static/assets/images/photon-logo.svg"
                 links={[
                   {
-                    link: "https://github.com/IronOxidizer/lemmy-lite",
+                    link: "https://github.com/Xyphyn/photon",
                     icon: "github",
                   },
                 ]}
               />
+
+              <div class="card col-6">
+                <AppDetails
+                  name="lemmy-lite"
+                  description="A static, JSless, touch-friendly Lemmy frontend built for legacy web clients and maximum performance"
+                  link="https://github.com/IronOxidizer/lemmy-lite"
+                  banner="/static/assets/images/lemmy_lite_screen.webp"
+                  links={[
+                    {
+                      link: "https://github.com/IronOxidizer/lemmy-lite",
+                      icon: "github",
+                    },
+                  ]}
+                />
+              </div>
             </div>
-          </div>
 
-          <h1>{i18n.t("cli_apps")}</h1>
+            <h1>{i18n.t("cli_apps")}</h1>
 
-          <div class="row">
-            <div class="card col-6">
-              <AppDetails
-                name="neonmodem"
-                description="BBS-style TUI client"
-                link="https://github.com/mrusme/neonmodem"
-                banner="/static/assets/images/neonmodem.webp"
-                links={[
-                  {
-                    link: "https://github.com/mrusme/neonmodem",
-                    icon: "github",
-                  },
-                ]}
-              />
+            <div class="row">
+              <div class="card col-6">
+                <AppDetails
+                  name="neonmodem"
+                  description="BBS-style TUI client"
+                  link="https://github.com/mrusme/neonmodem"
+                  banner="/static/assets/images/neonmodem.webp"
+                  links={[
+                    {
+                      link: "https://github.com/mrusme/neonmodem",
+                      icon: "github",
+                    },
+                  ]}
+                />
+              </div>
             </div>
-          </div>
 
-          <h1>{i18n.t("api_libraries")}</h1>
-          <ul>
-            <li>
-              <a href="https://github.com/LemmyNet/lemmy-js-client">
-                lemmy-js-client
-              </a>{" "}
-              - a javascript / typescript client.
-            </li>
-            <li>
-              <a href="https://github.com/LemmurOrg/lemmy_api_client">
-                lemmy-dart client
-              </a>{" "}
-              - a dart / flutter client.
-            </li>
-            <li>
-              <a href="https://github.com/Arsen6331/go-lemmy">go-lemmy</a> - a
-              Go client.
-            </li>
-          </ul>
+            <h1>{i18n.t("api_libraries")}</h1>
+            <ul>
+              <li>
+                <a href="https://github.com/LemmyNet/lemmy-js-client">
+                  lemmy-js-client
+                </a>{" "}
+                - a javascript / typescript client.
+              </li>
+              <li>
+                <a href="https://github.com/LemmurOrg/lemmy_api_client">
+                  lemmy-dart client
+                </a>{" "}
+                - a dart / flutter client.
+              </li>
+              <li>
+                <a href="https://github.com/Arsen6331/go-lemmy">go-lemmy</a> - a
+                Go client.
+              </li>
+            </ul>
+          </div>
         </div>
       </div>
     );