digitalfabrik/integreat-cms

{% extends "_base.html" %}
{% load i18n %}
{% load static %}
{% load widget_tweaks %}
{% block content %}
    <form method="post" data-unsaved-warning>
        {% csrf_token %}
        <div class="flex justify-between mb-4">
            <h1 class="heading">
                {% translate "Search & replace in links" %}
            </h1>
        </div>
        <div class="pb-4">
            <span class="font-bold pb-4">{% translate "Here you can replace internal links, e-mail addresses and phone numbers partially or completely." %}</span>
            <div class="pl-4">
                <span>{% translate "Example 1: " %}</span>
                <span class="bg-red-300">/augsburg/</span> -> <span class="bg-green-300">/nurnberg/</span>
                <div class="pl-10">
                    https://integreat.app<span class="bg-red-300">/augsburg/</span>de/willkommen-in-augsburg -> https://integreat.app<span class="bg-green-300">/nurnberg/</span>de/willkommen-in-augsburg
                </div>
            </div>
            <div class="pl-4">
                <span>{% translate "Example 2: " %}</span>
                <span class="bg-red-300">augsburg</span> -> <span class="bg-green-300">nurnberg</span>
                <div class="pl-10">
                    https://integreat.app/<span class="bg-red-300">augsburg</span>/de/willkommen-in-<span class="bg-red-300">augsburg</span> -> https://integreat.app/<span class="bg-green-300">nurnberg</span>/de/willkommen-in-<span class="bg-green-300">nurnberg</span>
                </div>
            </div>
            <div class="pl-4">
                <span>{% translate "Example 3: " %}</span>
                <span class="bg-red-300">/augsburg/de/willkommen</span> -> <span class="bg-green-300">/augsburg/de/hallo</span>
                <div class="pl-10">
                    https://integreat.app<span class="bg-red-300">/augsburg/de/willkommen</span>-in-augsburg -> https://integreat.app<span class="bg-green-300">/augsburg/de/hallo</span>-in-nurnberg
                </div>
            </div>
        </div>
        <div class="flex flex-wrap">
            <div class="w-full">
                <div class="mb-4 rounded border border-solid border-blue-500 shadow-2xl bg-white">
                    <div class="w-full p-4 rounded bg-water-500">
                        <h3 class="heading font-bold text-black">
                            <i icon-name="replace" class="mr-2"></i> {% translate "Search and replace" %}
                        </h3>
                    </div>
                    <div class="px-4 pb-4">
                        <div>
                            <label for="{{ form.link_types.id_for_label }}">
                                {{ form.link_types.label }}
                            </label>
                            {% render_field form.link_types %}
                        </div>
                        <div class="flex mt-2 mb-2 gap-2">
                            <div>
                                <label for="{{ form.search.id_for_label }}">
                                    {{ form.search.label }}
                                </label>
                                <div class="help-text">
                                    {{ form.search.help_text }}
                                </div>
                                <div class="relative flex-grow">
                                    {% render_field form.search %}
                                </div>
                            </div>
                            <i icon-name="arrow-right" class="mt-auto mb-auto"></i>
                            <div>
                                <label for="{{ form.replace.id_for_label }}">
                                    {{ form.replace.label }}
                                </label>
                                <div class="help-text">
                                    {{ form.replace.help_text }}
                                </div>
                                <div class="relative flex-grow">
                                    {% render_field form.replace %}
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
                <button type="submit" class="btn ml-auto mr-0">
                    {% translate "Replace" %}
                </button>
            </div>
        </div>
    </form>
{% endblock content %}