{% extends "bookmarks/layout.html" %}

{% block content %}
    <div class="settings-page">

        {% include 'settings/nav.html' %}

        {# Integrations section #}
        <section class="content-area">
            <h2>Bookmarklet</h2>
            <p>The bookmarklet is a quick way to add new bookmarks without opening the linkding application
                first. Here's how it works:</p>
            <ul>
                <li>Drag the bookmarklet below into your browsers bookmark bar / toolbar</li>
                <li>Open the website that you want to bookmark</li>
                <li>Click the bookmarklet in your browsers toolbar</li>
                <li>linkding opens in a new window or tab and allows you to add a bookmark for the site</li>
                <li>After saving the bookmark the linkding window closes and you are back on your website</li>
            </ul>
            <p>Drag the following bookmarklet to your browsers toolbar:</p>
            <a href="javascript: {% include 'bookmarks/bookmarklet.js' %}"
               class="btn btn-primary">📎 Add bookmark</a>
        </section>

    </div>
{% endblock %}