feat: make central place for documentation

.github/workflows/gh-pages.yml

@@ -8,6 +8,10 @@ on:
     branches:
       - main
 
+concurrency:
+  group: ${{ github.workflow }}-${{ github.ref }}
+  cancel-in-progress: true
+
 jobs:
   build:
     runs-on: ubuntu-latest
@@ -37,6 +41,10 @@ jobs:
     runs-on: ubuntu-latest
     needs: build
     if: github.ref == 'refs/heads/main'
+    permissions:
+      contents: read
+      pages: write
+      id-token: write
     steps:
       - name: Download artifact
         uses: actions/download-artifact@v4

.github/workflows/lint.yml

@@ -0,0 +1,28 @@
+name: lint
+
+on:
+  pull_request:
+    branches:
+      - main
+
+concurrency:
+  group: ${{ github.workflow }}-${{ github.head_ref }}
+  cancel-in-progress: true
+
+jobs:
+  lint:
+    runs-on: ubuntu-latest
+    steps:
+      - uses: actions/checkout@v4
+
+      - name: Set up Node.js
+        uses: actions/setup-node@v4
+        with:
+          node-version: "24"
+          cache: "yarn"
+
+      - name: Install dependencies
+        run: yarn install --frozen-lockfile
+
+      - name: Run linters
+        run: yarn lint

.prettierignore

@@ -0,0 +1,3 @@
+_site
+node_modules
+yarn.lock

.prettierrc.json

@@ -0,0 +1,4 @@
+{
+  "singleQuote": false,
+  "trailingComma": "all"
+}

.stylelintrc.json

@@ -5,28 +5,8 @@
     "stylelint-config-recess-order"
   ],
   "rules": {
-    "function-comma-space-after": "always",
     "no-descending-specificity": null,
     "declaration-block-single-line-max-declarations": 1,
-    "unit-whitelist": [
-      "%",
-      "ch",
-      "deg",
-      "em",
-      "fr",
-      "ms",
-      "px",
-      "rem",
-      "s",
-      "turn",
-      "vh",
-      "vw"
-    ],
-    "max-empty-lines": 1,
-    "max-line-length": 110,
-    "no-empty-first-line": true,
-    "indentation": 2,
-    "number-leading-zero": "always",
     "media-feature-name-no-unknown": [
       true,
       {

Makefile

@@ -1,13 +1,22 @@
-default: setup clean fix serve
+default: setup clean lintfix serve
 
 setup:
 	yarn check || yarn
 	bundle check || bundle
 	make update
 
-fix:
-	prettier --write --no-semi "**/*.yml" "**/*.md" "**/*.scss" "assets/**/*.js"
-	yarn run stylelint --fix "assets/**/*.scss" || echo 'stylelint: found no scss files to lint'
+lint:
+	yarn lint
+	make lint-ruby
+
+lintfix:
+	yarn lintfix
+	make lintfix-ruby
+
+lint-ruby:
+	bundle exec rubocop
+
+lintfix-ruby:
 	bundle exec rubocop -a
 
 clean:

README.md

@@ -1,3 +1,7 @@
 # html2rss.github.io
 
-🚧 WIP / Work in progress 🚧
+This repository hosts the documentation and website for `html2rss`, a tool for creating RSS feeds from any website.
+
+## Contributing
+
+Contributions are welcome! See our [Get Involved page](https://html2rss.github.io/get-involved) for details on discussions, reporting issues, and contributing.

_config.yml

@@ -24,10 +24,6 @@ aux_links:
   "GitHub":
     - "https://github.com/html2rss"
 
-header_pages:
-  - configs/index.html
-  - contributing.md
-
 # Footer "Edit this page on GitHub" link text
 gh_edit_link: true # show or hide edit this page link
 gh_edit_link_text: "Edit this page on GitHub."

_includes/head_custom.html

@@ -1,18 +1,109 @@
-<meta name="apple-mobile-web-app-capable" content="yes">
-<meta name="apple-mobile-web-app-status-bar-style" content="black">
+<meta name="mobile-web-app-capable" content="yes" />
+<meta name="apple-mobile-web-app-capable" content="yes" />
+<meta name="apple-mobile-web-app-status-bar-style" content="black" />
 <meta name="referrer" content="no-referrer" />
+<meta
+  name="description"
+  content="{% if page.description %}{{ page.description | strip_html | strip_newlines | truncate: 160 }}{% else %}{{ site.description }}{% endif %}"
+/>
 <meta
   name="robots"
   content="{% if page.noindex %}noindex, noarchive, follow{% else %}index, follow{% endif %}"
 />
+
+<meta
+  property="og:url"
+  content="{{ page.url | replace:'index.html','' | absolute_url }}"
+/>
+<meta
+  property="og:title"
+  content="{% if page.title %}{{ page.title }}{% else %}{{ site.title }}{% endif %}"
+/>
+<meta
+  property="og:description"
+  content="{% if page.description %}{{ page.description | strip_html | strip_newlines | truncate: 160 }}{% else %}{{ site.description }}{% endif %}"
+/>
+<meta property="og:site_name" content="{{ site.title }}" />
+<meta
+  property="og:image"
+  content="{{ '/assets/images/logo.png' | absolute_url }}"
+/>
+<meta property="og:type" content="website" />
+
 <link rel="stylesheet" href="{{ '/assets/css/main.css' | relative_url }}" />
-<link rel="apple-touch-icon" sizes="180x180" href="/assets/images/apple-touch-icon.png">
-<link rel="icon" type="image/png" sizes="32x32" href="/assets/images/favicon-32x32.png">
-<link rel="icon" type="image/png" sizes="16x16" href="/assets/images/favicon-16x16.png">
-<link rel="manifest" href="/assets/images/site.webmanifest">
-<link rel="mask-icon" href="/assets/images/safari-pinned-tab.svg" color="#111111">
-<link rel="shortcut icon" href="/assets/images/favicon.ico">
-<meta name="msapplication-TileColor" content="#111111">
-<meta name="msapplication-config" content="/assets/images/browserconfig.xml">
-<meta name="theme-color" content="#111111">
-<script data-goatcounter="https://html2rss.goatcounter.com/count" async src="//gc.zgo.at/count.js"></script>
+<link
+  rel="apple-touch-icon"
+  sizes="180x180"
+  href="/assets/images/apple-touch-icon.png"
+/>
+<link
+  rel="icon"
+  type="image/png"
+  sizes="32x32"
+  href="/assets/images/favicon-32x32.png"
+/>
+<link
+  rel="icon"
+  type="image/png"
+  sizes="16x16"
+  href="/assets/images/favicon-16x16.png"
+/>
+<link rel="manifest" href="/assets/images/site.webmanifest" />
+<link
+  rel="mask-icon"
+  href="/assets/images/safari-pinned-tab.svg"
+  color="#111111"
+/>
+<link rel="shortcut icon" href="/assets/images/favicon.ico" />
+<meta name="msapplication-TileColor" content="#111111" />
+<meta name="msapplication-config" content="/assets/images/browserconfig.xml" />
+<meta name="theme-color" content="#111111" />
+<script
+  data-goatcounter="https://html2rss.goatcounter.com/count"
+  async
+  src="//gc.zgo.at/count.js"
+></script>
+<div class="svg-defs-hidden">
+  <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512" id="rss-icon">
+    <rect
+      width="512"
+      height="512"
+      x="-512"
+      y="-512"
+      rx="70"
+      ry="70"
+      style="fill: #ea7819; fill-opacity: 1; stroke: none"
+      transform="scale(-1)"
+    />
+    <path
+      d="M81.056 267.05c43.705 0 84.79 17.072 115.665 48.124 30.931 31.051 47.961 72.411 47.961 116.44h67.35c0-127.885-103.62-231.921-230.976-231.921zm.106-119.4c155.76 0 282.488 127.42 282.488 284.049H431C431 237.925 274.054 80.301 81.162 80.301zm93.135 236.998c0 25.757-20.892 46.649-46.649 46.649-25.756 0-46.648-20.885-46.648-46.649C81 358.878 101.885 338 127.641 338c25.757 0 46.656 20.878 46.656 20.878"
+      style="fill: #fff"
+    />
+  </svg>
+  <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" id="edit-icon">
+    <path
+      fill="currentColor"
+      d="M3 17.25V21h3.75L18.75 9.75l-3.75-3.75L3 17.25zM20.71 7.04c.39-.39.39-1.02 0-1.41l-2.34-2.34c-.39-.39-1.02-.39-1.41 0l-1.83 1.83 3.75 3.75 1.83-1.83z"
+    />
+  </svg>
+  <svg
+    xmlns="http://www.w3.org/2000/svg"
+    viewBox="0 0 32 32"
+    id="settings-icon"
+  >
+    <path
+      fill="currentColor"
+      d="M28 13V8a2 2 0 0 0-2-2h-3v2h3v5a3.98 3.98 0 0 0 1.382 3A3.98 3.98 0 0 0 26 19v5h-3v2h3a2 2 0 0 0 2-2v-5a2 2 0 0 1 2-2v-2a2 2 0 0 1-2-2"
+    />
+    <path
+      fill="currentColor"
+      d="m17 9-.857 3h2L19 9h2l-.857 3H22v2h-2.428l-1.143 4H21v2h-3.143L17 23h-2l.857-3h-2L13 23h-2l.857-3H10v-2h2.429l1.143-4H11v-2h3.143L15 9Zm.572 5h-2l-1.143 4h2Z"
+      style="fill-rule: evenodd"
+    />
+    <path
+      fill="currentColor"
+      d="M6 13V8h3V6H6a2 2 0 0 0-2 2v5a2 2 0 0 1-2 2v2a2 2 0 0 1 2 2v5a2 2 0 0 0 2 2h3v-2H6v-5a3.98 3.98 0 0 0-1.382-3A3.98 3.98 0 0 0 6 13"
+    />
+    <path d="M0 0h32v32H0z" style="fill: none" />
+  </svg>
+</div>

about.md

@@ -0,0 +1,34 @@
+---
+layout: default
+title: About html2rss
+nav_order: 2
+---
+
+# About html2rss
+
+`html2rss` is an open-source project dedicated to empowering you to take control of your web content. In an age where traditional RSS feeds are often missing, `html2rss` provides a robust and flexible solution to convert almost any HTML content into a structured RSS format.
+
+Started in 2018, the project has evolved into a comprehensive suite of tools designed to help you create and consume RSS feeds effortlessly.
+
+---
+
+## Our Vision and Principles
+
+Our mission is to provide a simple, powerful, and accessible tool that enables individuals and developers to create custom RSS feeds from any web page. We believe in the power of open standards and the freedom to access information on your own terms.
+
+Our project is guided by these core principles:
+
+- **User Empowerment:** Giving you the tools to customize your web experience.
+- **Simplicity & Power:** Offering an easy-to-use interface with powerful underlying capabilities.
+- **Open Source:** Fostering a collaborative environment where the community can contribute and improve the project.
+- **Reliability:** Striving for a stable and dependable tool that consistently delivers.
+
+For insights into our ongoing development, project roadmap, and how you can get involved, please visit our [Get Involved]({{ '/get-involved' | relative_url }}) page.
+
+---
+
+### The Team
+
+`html2rss` is maintained by a dedicated group of volunteers and contributors from around the world. We are passionate about open source and committed to continuously improving the project.
+
+Want to join us? Check out our [Contributing Guide]({{ '/contributing' | relative_url }})!

assets/css/main.scss

@@ -8,6 +8,6 @@
 // @import files directly from the sass/ directory:;
 
 @import "base";
-
+@import "feed-directory";
 // Don't write any SCSS in this file as stylelint does not fix it,
 // just use the sass directory.

assets/css/sass/base.scss

@@ -16,85 +16,32 @@
   --transition-shadow: box-shadow 0.2s ease-in-out;
 }
 
-#configs input {
-  width: 100%;
-  padding: var(--spacing-xs);
-  box-sizing: border-box;
-  line-height: var(--line-height-base);
-  font-size: var(--font-size-base);
-  color: var(--color-text);
-  font-family: var(--font-family-mono);
-  background-color: transparent;
-  border: 0;
-  border-radius: 0;
-  outline: none;
-  appearance: none;
-  -webkit-font-smoothing: antialiased;
-  -moz-osx-font-smoothing: grayscale;
-}
-
-.config__headline > span,
-.config__url {
-  hyphens: none;
-  word-break: break-word;
-  overflow-wrap: break-word;
-  text-wrap: wrap;
+details {
+  transition: all 0.2s ease-in-out;
 }
 
-.config__url em {
-  padding-right: 0.125em;
-  letter-spacing: -0.05em;
-  opacity: 0.75;
-  font-style: italic;
-}
-
-.config__url .config__url-amp:last-child {
-  display: none !important;
+summary {
+  cursor: pointer;
+  outline: none;
 }
 
-.js__copy-element {
-  position: fixed;
-  top: 0;
-  left: 0;
-  width: 0;
-  height: 0;
-  opacity: 0;
-  pointer-events: none;
-  user-select: text;
+summary:hover {
+  color: var(--link-color);
 }
 
-.js__copy-element::selection {
-  background-color: transparent;
+#configs input[name="instance"],
+#configs input[name="search"] {
+  inline-size: 100%;
 }
 
 .noscript {
+  padding: var(--spacing-sm);
   font-weight: 600;
   color: var(--color-error);
   background: var(--color-error-bg);
-  padding: var(--spacing-sm);
   border: 1px solid var(--color-error);
 }
 
-button[data-bind-click="copy"] {
-  padding: var(--button-padding-y) var(--button-padding-x);
-  border: 2px solid transparent;
-  border-radius: var(--border-radius-sm);
-  background-color: #fff;
-  color: var(--color-text);
-  cursor: pointer;
-  font: inherit;
-  line-height: 1.2;
-  transition: var(--transition-border), var(--transition-shadow);
-}
-
-button[data-bind-click="copy"]:focus-visible {
-  outline: 2px dashed var(--color-accent);
-  outline-offset: 2px;
-}
-
-button[data-bind-click="copy"].copied,
-button[data-bind-click="copy"].copied:hover,
-button[data-bind-click="copy"].copied:active {
-  border-color: var(--color-accent);
-  box-shadow: inset 0 2px 4px var(--color-accent-bg);
+.svg-defs-hidden {
+  display: none;
 }