Merge pull request #31 from hyphacoop/snippet

feat: add html snippet to the sidebar
hyphacoop · Dec 5, 2024 · a5284a7 · a5284a7
2 parents c8b5eba + 74d66b1
commit a5284a7
Show file tree

Hide file tree

Showing 3 changed files with 34 additions and 2 deletions.
diff --git a/README.md b/README.md
@@ -21,7 +21,7 @@ You can easily deploy a customized version of the reader by [forking](https://gi
 
 ```json
 {
-  "version": "1.2.0",
+  "version": "1.0.0",
   "communityName": "Akhi's Art Club",
   "theme": {
     "bgColor": "#ecfeff",

diff --git a/sidebar.css b/sidebar.css
@@ -50,6 +50,24 @@ sidebar-nav nav a:hover {
   text-decoration: none;
 }
 
+.dp-snippet {
+  text-align: left;
+  margin-top: 4px;
+  display: flex;
+  flex-direction: column;
+  align-items: flex-start;
+}
+
+.dp-snippet div {
+  font-size: 0.75rem;
+  color: var(--rdp-details-color);
+}
+
+.dp-snippet a img {
+  margin-top: 4px;
+  width: 90px;
+  height: auto;
+}
 
 .release-version {
   font-size: 0.75rem;
@@ -93,6 +111,11 @@ sidebar-nav nav a:hover {
   sidebar-nav nav {
     text-align: center;
   }
+
+  .dp-snippet {
+    text-align: center;
+    align-items: center;
+  }
 }
 
 @media screen and (max-width: 400px) {

diff --git a/sidebar.html b/sidebar.html
@@ -8,8 +8,17 @@ <h1 id="header-branding" class="header-branding">Social Reader</h1>
   <theme-selector></theme-selector>
   <a href="./about.html">About</a>
   <a href="https://hypha.coop/dripline/announcing-dp-social-inbox/">Social Inbox</a>
-  <a href="https://distributed.press">Distributed Press</a>
 </nav>
+<div class="dp-snippet">
+  <div>Powered by</div>
+  <a href="//distributed.press" target="_blank" rel="noopener noreferrer">
+    <img
+      alt="Distributed Press"
+      src="//distributed.press/img/logos/logo-distributedpress-grey.png"
+    />
+  </a>
+</div>
 <distributed-search></distributed-search>
 
 <div id="release-version" class="release-version"></div>
+