mirror of
https://github.com/sissbruecker/linkding
synced 2024-11-10 06:04:15 +00:00
Improve docs
This commit is contained in:
Sascha Ißbrücker
parent
ceceb56164
commit
f3c1101746
9 changed files with 225 additions and 37 deletions
|
|
@ -35,7 +35,7 @@ The name comes from:
|
|||
|
||||
**Screenshot:**
|
||||
|
||||
|
||||
|
||||
|
||||
## Getting Started
|
||||
|
||||
|
|
|
|||
|
|
@ -18,6 +18,7 @@ export default defineConfig({
|
|||
label: 'Getting Started',
|
||||
items: [
|
||||
{ label: 'Installation', slug: 'installation' },
|
||||
{ label: 'Options', slug: 'options' },
|
||||
{ label: 'Managed Hosting', slug: 'managed-hosting' },
|
||||
{ label: 'Browser Extension', slug: 'browser-extension' },
|
||||
],
|
||||
|
|
@ -25,7 +26,6 @@ export default defineConfig({
|
|||
{
|
||||
label: 'Guides',
|
||||
items: [
|
||||
{ label: 'Options', slug: 'options' },
|
||||
{ label: 'Backups', slug: 'backups' },
|
||||
{ label: 'Admin', slug: 'admin' },
|
||||
{ label: 'Keyboard Shortcuts', slug: 'shortcuts' },
|
||||
|
|
|
|||
BIN
docs/public/linkding-screenshot-dark.png
Normal file
BIN
docs/public/linkding-screenshot-dark.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 432 KiB |
|
Before Width: | Height: | Size: 447 KiB After Width: | Height: | Size: 447 KiB |
45
docs/src/components/Card.astro
Normal file
45
docs/src/components/Card.astro
Normal file
|
|
@ -0,0 +1,45 @@
|
|||
---
|
||||
import {icons} from './icons';
|
||||
interface Props {
|
||||
icon: keyof typeof icons;
|
||||
title: string;
|
||||
}
|
||||
|
||||
const {icon, title} = Astro.props;
|
||||
---
|
||||
|
||||
<article class="card sl-flex">
|
||||
<p class="title sl-flex">
|
||||
{icon && <span class="icon" set:html={icons[icon]}/>}
|
||||
<span set:html={title}/>
|
||||
</p>
|
||||
<div class="body">
|
||||
<slot/>
|
||||
</div>
|
||||
</article>
|
||||
|
||||
<style>
|
||||
.card {
|
||||
flex-direction: column;
|
||||
gap: clamp(0.5rem, calc(0.125rem + 1vw), 1rem);
|
||||
}
|
||||
|
||||
.title {
|
||||
font-weight: 600;
|
||||
font-size: var(--sl-text-h4);
|
||||
color: var(--sl-color-white);
|
||||
line-height: var(--sl-line-height-headings);
|
||||
gap: .8rem;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.card .icon {
|
||||
border-radius: 0.25rem;
|
||||
color: var(--sl-color-text-accent);
|
||||
}
|
||||
|
||||
.card .body {
|
||||
margin: 0;
|
||||
font-size: clamp(var(--sl-text-sm), calc(0.5rem + 1vw), var(--sl-text-body));
|
||||
}
|
||||
</style>
|
||||
13
docs/src/components/icons.ts
Normal file
13
docs/src/components/icons.ts
Normal file
|
|
@ -0,0 +1,13 @@
|
|||
export const icons = {
|
||||
'focus': `<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path stroke="none" d="M0 0h24v24H0z" fill="none"/><circle cx="12" cy="12" r=".5" fill="currentColor" /><path d="M12 12m-9 0a9 9 0 1 0 18 0a9 9 0 1 0 -18 0" /></svg>`,
|
||||
'settings': `<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path stroke="none" d="M0 0h24v24H0z" fill="none"/><path d="M10.325 4.317c.426 -1.756 2.924 -1.756 3.35 0a1.724 1.724 0 0 0 2.573 1.066c1.543 -.94 3.31 .826 2.37 2.37a1.724 1.724 0 0 0 1.065 2.572c1.756 .426 1.756 2.924 0 3.35a1.724 1.724 0 0 0 -1.066 2.573c.94 1.543 -.826 3.31 -2.37 2.37a1.724 1.724 0 0 0 -2.572 1.065c-.426 1.756 -2.924 1.756 -3.35 0a1.724 1.724 0 0 0 -2.573 -1.066c-1.543 .94 -3.31 -.826 -2.37 -2.37a1.724 1.724 0 0 0 -1.065 -2.572c-1.756 -.426 -1.756 -2.924 0 -3.35a1.724 1.724 0 0 0 1.066 -2.573c-.94 -1.543 .826 -3.31 2.37 -2.37c1 .608 2.296 .07 2.572 -1.065z" /><path d="M9 12a3 3 0 1 0 6 0a3 3 0 0 0 -6 0" /></svg>`,
|
||||
'plus': `<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path stroke="none" d="M0 0h24v24H0z" fill="none"/><path d="M12 5l0 14" /><path d="M5 12l14 0" /></svg>`,
|
||||
'archive': `<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path stroke="none" d="M0 0h24v24H0z" fill="none"/><path d="M3 4m0 2a2 2 0 0 1 2 -2h14a2 2 0 0 1 2 2v0a2 2 0 0 1 -2 2h-14a2 2 0 0 1 -2 -2z" /><path d="M5 8v10a2 2 0 0 0 2 2h10a2 2 0 0 0 2 -2v-10" /><path d="M10 12l4 0" /></svg>`,
|
||||
'checkbox': `<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path stroke="none" d="M0 0h24v24H0z" fill="none"/><path d="M3 3m0 2a2 2 0 0 1 2 -2h14a2 2 0 0 1 2 2v14a2 2 0 0 1 -2 2h-14a2 2 0 0 1 -2 -2z" /><path d="M9 12l2 2l4 -4" /></svg>`,
|
||||
'file-export': `<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path stroke="none" d="M0 0h24v24H0z" fill="none"/><path d="M14 3v4a1 1 0 0 0 1 1h4" /><path d="M11.5 21h-4.5a2 2 0 0 1 -2 -2v-14a2 2 0 0 1 2 -2h7l5 5v5m-5 6h7m-3 -3l3 3l-3 3" /></svg>`,
|
||||
'users': `<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path stroke="none" d="M0 0h24v24H0z" fill="none"/><path d="M9 7m-4 0a4 4 0 1 0 8 0a4 4 0 1 0 -8 0" /><path d="M3 21v-2a4 4 0 0 1 4 -4h4a4 4 0 0 1 4 4v2" /><path d="M16 3.13a4 4 0 0 1 0 7.75" /><path d="M21 21v-2a4 4 0 0 0 -3 -3.85" /></svg>`,
|
||||
'login': `<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path stroke="none" d="M0 0h24v24H0z" fill="none"/><path d="M15 8v-2a2 2 0 0 0 -2 -2h-7a2 2 0 0 0 -2 2v12a2 2 0 0 0 2 2h7a2 2 0 0 0 2 -2v-2" /><path d="M21 12h-13l3 -3" /><path d="M11 15l-3 -3" /></svg>`,
|
||||
'puzzle': `<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path stroke="none" d="M0 0h24v24H0z" fill="none"/><path d="M4 7h3a1 1 0 0 0 1 -1v-1a2 2 0 0 1 4 0v1a1 1 0 0 0 1 1h3a1 1 0 0 1 1 1v3a1 1 0 0 0 1 1h1a2 2 0 0 1 0 4h-1a1 1 0 0 0 -1 1v3a1 1 0 0 1 -1 1h-3a1 1 0 0 1 -1 -1v-1a2 2 0 0 0 -4 0v1a1 1 0 0 1 -1 1h-3a1 1 0 0 1 -1 -1v-3a1 1 0 0 1 1 -1h1a2 2 0 0 0 0 -4h-1a1 1 0 0 1 -1 -1v-3a1 1 0 0 1 1 -1" /></svg>`,
|
||||
'cloud': `<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path stroke="none" d="M0 0h24v24H0z" fill="none"/><path d="M6.657 18c-2.572 0 -4.657 -2.007 -4.657 -4.483c0 -2.475 2.085 -4.482 4.657 -4.482c.393 -1.762 1.794 -3.2 3.675 -3.773c1.88 -.572 3.956 -.193 5.444 1c1.488 1.19 2.162 3.007 1.77 4.769h.99c1.913 0 3.464 1.56 3.464 3.486c0 1.927 -1.551 3.487 -3.465 3.487h-11.878" /></svg>`,
|
||||
'mood-smile': `<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="icon icon-tabler icons-tabler-outline icon-tabler-mood-smile"><path stroke="none" d="M0 0h24v24H0z" fill="none"/><path d="M12 12m-9 0a9 9 0 1 0 18 0a9 9 0 1 0 -18 0" /><path d="M9 10l.01 0" /><path d="M15 10l.01 0" /><path d="M9.5 15a3.5 3.5 0 0 0 5 0" /></svg>`,
|
||||
}
|
||||
|
|
@ -1,33 +0,0 @@
|
|||
---
|
||||
title: "Linkding"
|
||||
description: "Linkding is a self-hosted bookmarking service that is designed be to be minimal, fast, and easy to set up using Docker."
|
||||
---
|
||||
|
||||
linkding is a bookmark manager that you can host yourself.
|
||||
It's designed be to be minimal, fast, and easy to set up using Docker.
|
||||
|
||||
The name comes from:
|
||||
- *link* which is often used as a synonym for URLs and bookmarks in common language
|
||||
- *Ding* which is German for thing
|
||||
- ...so basically something for managing your links
|
||||
|
||||
**Feature Overview:**
|
||||
- Clean UI optimized for readability
|
||||
- Organize bookmarks with tags
|
||||
- Bulk editing, Markdown notes, read it later functionality
|
||||
- Share bookmarks with other users or guests
|
||||
- Automatically provides titles, descriptions and icons of bookmarked websites
|
||||
- Automatically archive websites, either as local HTML file or on Internet Archive
|
||||
- Import and export bookmarks in Netscape HTML format
|
||||
- Installable as a Progressive Web App (PWA)
|
||||
- Extensions for [Firefox](https://addons.mozilla.org/firefox/addon/linkding-extension/) and [Chrome](https://chrome.google.com/webstore/detail/linkding-extension/beakmhbijpdhipnjhnclmhgjlddhidpe), as well as a bookmarklet
|
||||
- SSO support via OIDC or authentication proxies
|
||||
- REST API for developing 3rd party apps
|
||||
- Admin panel for user self-service and raw data access
|
||||
|
||||
|
||||
**Demo:** https://demo.linkding.link/
|
||||
|
||||
**Screenshot:**
|
||||
|
||||
|
||||
69
docs/src/content/docs/index.mdx
Normal file
69
docs/src/content/docs/index.mdx
Normal file
|
|
@ -0,0 +1,69 @@
|
|||
---
|
||||
title: linkding
|
||||
description: A self-hosted bookmarking service that is designed to be minimal, fast and easy to set up.
|
||||
template: splash
|
||||
hero:
|
||||
tagline: A self-hosted bookmark manager designed be to be minimal, fast, and easy to set up.
|
||||
actions:
|
||||
- text: Get started
|
||||
link: /installation
|
||||
icon: right-arrow
|
||||
- text: GitHub
|
||||
link: https://github.com/sissbruecker/linkding
|
||||
icon: external
|
||||
variant: minimal
|
||||
attrs:
|
||||
target: _blank
|
||||
- text: Demo
|
||||
link: https://demo.linkding.link
|
||||
icon: external
|
||||
variant: minimal
|
||||
attrs:
|
||||
target: _blank
|
||||
---
|
||||
|
||||
import { CardGrid } from '@astrojs/starlight/components';
|
||||
import Card from '../../components/Card.astro';
|
||||
|
||||
<a href="/linkding-screenshot.png" className="hero-image light">
|
||||
<img src="/linkding-screenshot.png"/>
|
||||
</a>
|
||||
<a href="/linkding-screenshot-dark.png" className="hero-image dark">
|
||||
<img src="/linkding-screenshot-dark.png"/>
|
||||
</a>
|
||||
|
||||
|
||||
## Features
|
||||
|
||||
<CardGrid>
|
||||
<Card title="Focused" icon="focus">
|
||||
Optimized for readability, allowing to quickly add and find bookmarks without distractions.
|
||||
</Card>
|
||||
<Card title="Customizable" icon="settings">
|
||||
Features can be enabled or disabled as needed, adjustable UI through a number of settings.
|
||||
</Card>
|
||||
<Card title="Metadata" icon="plus">
|
||||
Automatically fetches titles, descriptions, icons and preview images of bookmarked websites.
|
||||
</Card>
|
||||
<Card title="Archiving" icon="archive">
|
||||
Automatically create snapshots of bookmarked websites, either as local HTML file or on the Internet Archive.
|
||||
</Card>
|
||||
<Card title="Bulk editing" icon="checkbox">
|
||||
Apply any operation to a selection of bookmarks or the whole collection.
|
||||
</Card>
|
||||
<Card title="Import / Export" icon="file-export">
|
||||
Import and export bookmarks in the Netscape HTML format.
|
||||
</Card>
|
||||
<Card title="Multi-User" icon="users">
|
||||
Supports multiple users, with the ability to share bookmarks with other users or guests.
|
||||
</Card>
|
||||
<Card title="Browser extension" icon="puzzle">
|
||||
Extensions for [Firefox](https://addons.mozilla.org/firefox/addon/linkding-extension/) and [Chrome](https://chrome.google.com/webstore/detail/linkding-extension/beakmhbijpdhipnjhnclmhgjlddhidpe) allow adding and searching bookmarks from within the browser.
|
||||
</Card>
|
||||
<Card title="REST API" icon="cloud">
|
||||
REST API for developing scripts or 3rd party apps.
|
||||
</Card>
|
||||
<Card title="Low maintenance" icon="mood-smile">
|
||||
A single Docker container, using SQLite as database. Automated migrations, zero breaking changes.
|
||||
</Card>
|
||||
</CardGrid>
|
||||
|
|
@ -1,9 +1,29 @@
|
|||
:root {
|
||||
--sl-nav-gap: 0.8rem;
|
||||
|
||||
--sl-text-xs: var(--sl-text-sm);
|
||||
}
|
||||
|
||||
:root,
|
||||
::backdrop {
|
||||
/* Colors (dark mode) */
|
||||
--sl-color-white: hsl(0, 0%, 97%); /* “white” */
|
||||
--sl-color-gray-1: hsl(224, 20%, 94%);
|
||||
--sl-color-gray-2: hsl(224, 6%, 85%);
|
||||
--sl-color-gray-3: hsl(224, 6%, 70%);
|
||||
--sl-color-gray-4: hsl(224, 7%, 36%);
|
||||
--sl-color-gray-5: hsl(224, 10%, 23%);
|
||||
--sl-color-gray-6: hsl(224, 14%, 16%);
|
||||
--sl-color-black: hsl(224, 10%, 10%);
|
||||
|
||||
--sl-color-accent: hsl(241, 75%, 64%);
|
||||
--sl-color-text-accent: hsl(241, 90%, 82%);
|
||||
}
|
||||
|
||||
:root[data-theme='light'],
|
||||
[data-theme='light'] ::backdrop {
|
||||
--sl-color-accent: hsl(241, 63%, 59%);
|
||||
--sl-color-text-accent: hsl(241, 63%, 55%);
|
||||
|
||||
--sl-nav-gap: 0.8rem;
|
||||
}
|
||||
|
||||
/* Align site search */
|
||||
|
|
@ -11,6 +31,80 @@
|
|||
justify-content: flex-end;
|
||||
}
|
||||
|
||||
/* Site title */
|
||||
.site-title img {
|
||||
height: 36px;
|
||||
}
|
||||
|
||||
/* Social icon size */
|
||||
.social-icons svg {
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
}
|
||||
|
||||
/* Index page */
|
||||
[data-has-hero] header {
|
||||
background: transparent;
|
||||
border-bottom: solid 1px transparent;
|
||||
backdrop-filter: blur(10px);
|
||||
}
|
||||
|
||||
[data-has-hero] .page {
|
||||
--hero-gradient: hsla(241, 63%, 59%, 0.2);
|
||||
background: linear-gradient(205deg, var(--hero-gradient), transparent 30%);
|
||||
}
|
||||
|
||||
[data-has-hero][data-theme="dark"] .page {
|
||||
--hero-gradient: hsla(241, 63%, 59%, 0.25);
|
||||
}
|
||||
|
||||
[data-has-hero] .hero {
|
||||
padding-bottom: 1rem;
|
||||
}
|
||||
|
||||
[data-has-hero] .hero-image img {
|
||||
width: 100%;
|
||||
border: solid 1px var(--sl-color-gray-5);
|
||||
border-radius: .4rem;
|
||||
box-shadow: var(--sl-shadow-lg);
|
||||
}
|
||||
|
||||
[data-has-hero] .hero-image.dark img {
|
||||
box-shadow: none;
|
||||
}
|
||||
|
||||
[data-has-hero][data-theme="dark"] .hero-image.light {
|
||||
display: none;
|
||||
}
|
||||
|
||||
[data-has-hero][data-theme="light"] .hero-image.dark {
|
||||
display: none;
|
||||
}
|
||||
|
||||
[data-has-hero] h2 {
|
||||
margin-top: 3rem;
|
||||
}
|
||||
|
||||
[data-has-hero] .card-grid {
|
||||
margin-top: 2rem !important;
|
||||
}
|
||||
|
||||
@media (min-width: 50rem) {
|
||||
[data-has-hero] .page {
|
||||
--hero-gradient: hsla(241, 63%, 59%, 0.2);
|
||||
background: linear-gradient(205deg, var(--hero-gradient), transparent 50%);
|
||||
}
|
||||
|
||||
[data-has-hero] .hero {
|
||||
padding-bottom: 4rem;
|
||||
}
|
||||
|
||||
[data-has-hero] h2 {
|
||||
margin-top: 6rem !important;
|
||||
}
|
||||
|
||||
[data-has-hero] .card-grid {
|
||||
margin-top: 3rem !important;
|
||||
gap: 3rem;
|
||||
}
|
||||
}
|
||||
Loading…
Reference in a new issue