add new adapter: followin (#467)

* 加了一个ReadButton, 把GPT输出的文本转换为语音朗读出来

* add new adapter: followin

* 适配长推文,调整列表边距

---------

Co-authored-by: Petaflops <wangzw@outlook.com>

src/content-script/site-adapters/followin/index.mjs

@@ -0,0 +1,28 @@
+import { cropText } from '../../../utils'
+
+export default {
+  inputQuery: async () => {
+    try {
+      const author = document.querySelector('main article a > span')?.textContent
+      const description =
+        document.querySelector('#article-content')?.textContent ||
+        document.querySelector('#thead-gallery')?.textContent
+      if (author && description) {
+        const title = document.querySelector('main article h1')?.textContent
+        if (title) {
+          return await cropText(
+            `以下是一篇文章,请给出文章的结论和3到5个要点.标题是:"${title}",作者是:"${author}",内容是:\n"${description}".
+          `,
+          )
+        } else {
+          return await cropText(
+            `以下是一篇长推文,请给出文章的结论和3到5个要点.作者是:"${author}",内容是:\n"${description}".
+          `,
+          )
+        }
+      }
+    } catch (e) {
+      console.log(e)
+    }
+  },
+}

src/content-script/site-adapters/index.mjs

@@ -9,6 +9,7 @@ import quora from './quora'
 import stackoverflow from './stackoverflow'
 import juejin from './juejin'
 import weixin from './weixin'
+import followin from './followin'
 
 /**
  * @typedef {object} SiteConfigAction
@@ -185,4 +186,10 @@ export const config = {
     appendContainerQuery: [],
     resultsContainerQuery: ['#js_content'],
   },
+  followin: {
+    inputQuery: followin.inputQuery,
+    sidebarContainerQuery: [],
+    appendContainerQuery: [],
+    resultsContainerQuery: ['#article-content', '#thead-gallery'],
+  },
 }

src/content-script/styles.scss

@@ -3,6 +3,7 @@
 
 [data-theme='auto'] {
   @import 'github-markdown-css/github-markdown.css';
+
   @media screen and (prefers-color-scheme: dark) {
     @import 'highlight.js/scss/github-dark.scss';
     --font-color: #c9d1d9;
@@ -13,6 +14,7 @@
     --color-neutral-muted: rgba(110, 118, 129, 0.4);
     --code-background-color: rgb(13, 17, 23);
   }
+
   @media screen and (prefers-color-scheme: light) {
     @import 'highlight.js/scss/github.scss';
     --font-color: #24292f;
@@ -98,26 +100,32 @@
       background-color: var(--theme-color);
       width: 9px;
     }
+
     ::-webkit-scrollbar-thumb {
       background-color: var(--theme-border-color);
       border-radius: 20px;
       border: transparent;
     }
+
     ::-webkit-scrollbar-corner {
       background: transparent;
     }
+
     &::-webkit-scrollbar {
       background-color: var(--theme-color);
       width: 9px;
     }
+
     &::-webkit-scrollbar-thumb {
       background-color: var(--theme-border-color);
       border-radius: 20px;
       border: transparent;
     }
+
     &::-webkit-scrollbar-corner {
       background: transparent;
     }
+
     p {
       color: var(--font-color);
     }
@@ -133,6 +141,7 @@
 
       li {
         counter-increment: item;
+        margin-bottom: 0px;
 
         &::marker {
           content: counter(item) '. ';
@@ -288,11 +297,13 @@
       background-color: var(--theme-color);
       width: 9px;
     }
+
     &::-webkit-scrollbar-thumb {
       background-color: var(--theme-border-color);
       border-radius: 20px;
       border: transparent;
     }
+
     &::-webkit-scrollbar-corner {
       background: transparent;
     }