diff --git a/view/templates/index.html b/view/templates/index.html
index faecdef..dfbd4ab 100644
--- a/view/templates/index.html
+++ b/view/templates/index.html
@@ -4,142 +4,12 @@
 
 {% block body %}
 <div class="bg-white sticky top-0 py-3 border-b z-10 mb-6">
-	<section class="container">
-		<div class="flex items-center flex-wrap shrink-0 gap-x-2 gap-y-2">
-			<form
-				method="get"
-				class="flex gap-x-2"
-				hx-trigger="change"
-				hx-get="/"
-				hx-target="#diff-list"
-				hx-select="#diff-list"
-			>
-				<input
-					class="text-input w-full max-w-20rem"
-					type="text"
-					id="search"
-					name="search"
-					value="{{ search|e }}"
-				/>
-				<button class="button button-md" type="submit" value="Hledat">
-					Search
-					<svg class="w-4 fill-current" viewBox="0 0 24 24">
-						<path
-							d="M18.031 16.6168L22.3137 20.8995L20.8995 22.3137L16.6168 18.031C15.0769 19.263 13.124 20 11 20C6.032 20 2 15.968 2 11C2 6.032 6.032 2 11 2C15.968 2 20 6.032 20 11C20 13.124 19.263 15.0769 18.031 16.6168ZM16.0247 15.8748C17.2475 14.6146 18 12.8956 18 11C18 7.1325 14.8675 4 11 4C7.1325 4 4 7.1325 4 11C4 14.8675 7.1325 18 11 18C12.8956 18 14.6146 17.2475 15.8748 16.0247L16.0247 15.8748Z"
-						></path>
-					</svg>
-				</button>
-			</form>
-
-			<button class="button-outline button-md" @click="document.querySelector('#feeds-dialog').showModal()">
-				<svg class="w-4 fill-current" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M10 14L4 5V3H20V5L14 14V20L10 22V14Z"></path></svg>
-				Feeds
-			</button>
-
-			<dialog id="feeds-dialog" hx-boost="false" class="dialog">
-				<header class="flex justify-between mb-6 items-center">
-					<p>Filter by feed</p>
-					<form method="dialog">
-						<button formmethod="dialog" class="button-outline button-md">
-							✕
-						</button>
-					</form>
-				</header>
-
-				<form action="/" method="GET" id="feeds-filter">
-					<div class="columns-2 mb-6">
-						{% for feed in feeds %}
-						<label
-							class="flex items-center gap-3 px-2 py-1.5 hover:bg-gray-100 rounded"
-						>
-							<input type="checkbox" name="feeds[]" value="{{ feed['feed_name'] }}"
-							{{ 'checked' if feed['feed_name'] in selected_feeds }} > {{
-							feed['feed_name'] }}
-						</label>
-						{% endfor %}
-					</div>
-
-					<button type="submit" class="button button-md">
-						Filter diffs
-					</button>
-				</form>
-			</dialog>
-
-			<label class="checkbox mx-2">
-				<input
-					type="checkbox"
-					x-model="expandDiffs"
-					x-bind:checked="expandDiffs"
-				/>
-				<p>Expand diffs</p>
-			</label>
-		</div>
-
-		{% if selected_feeds|length > 0 %}
-		<div class="text-xs font-medium text-muted flex items-center mt-3">
-			<svg class="w-3 fill-current mr-2" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M10 14L4 5V3H20V5L14 14V20L10 22V14Z"></path></svg>
-			<div>
-				Feeds: <span>{{ ", ".join(selected_feeds) }}</span>
-				<a href="/" class="ml-2">✕ Clear</a>
-			</div>
-		</div>
-		{% endif %}
-	</section>
+	{% include "parts/filters.html" %}
 </div>
 
 <div id="diff-list">
 	<section class="container mb-8">
-		{% for diff in diffs %}
-		<article class="card px-5 py-4 mb-4">
-			<p class="flex gap-x-4 gap-y-2 mb-3 flex-wrap shrink-0">
-				<span class="text-sm font-medium">{{ diff.feed_name }}</span>
-				<time class="text-sm font-medium">{{ diff.diff_time }}</time>
-				<a class="action-link" href="{{ diff.article_url }}">
-					<svg class="w-4 fill-current" viewBox="0 0 24 24">
-						<path
-							d="M10 6V8H5V19H16V14H18V20C18 20.5523 17.5523 21 17 21H4C3.44772 21 3 20.5523 3 20V7C3 6.44772 3.44772 6 4 6H10ZM21 3V11H19L18.9999 6.413L11.2071 14.2071L9.79289 12.7929L17.5849 5H13V3H21Z"
-						></path>
-					</svg>
-					Display current article
-				</a>
-				<a class="action-link" href="/article/{{ diff.article_id }}">
-					<svg class="w-4 fill-current" viewBox="0 0 24 24">
-						<path
-							d="M12 22C6.47715 22 2 17.5228 2 12C2 6.47715 6.47715 2 12 2C17.5228 2 22 6.47715 22 12C22 17.5228 17.5228 22 12 22ZM12 20C16.4183 20 20 16.4183 20 12C20 7.58172 16.4183 4 12 4C7.58172 4 4 7.58172 4 12C4 16.4183 7.58172 20 12 20ZM13 12H17V14H11V7H13V12Z"
-						></path>
-					</svg>
-					Show change history
-				</a>
-			</p>
-
-			<div class="text-lg" x-bind:class="{ hidden: expandDiffs }">
-				{{ diff.diff_html|safe }}
-			</div>
-			<div x-bind:class="{ hidden: !expandDiffs }">
-				<div class="md:hidden">
-					<div class="mb-2">
-						<p class="text-caption">Before</p>
-						<p class="diff-before text-lg">{{ diff.diff_html|safe }}</p>
-					</div>
-					<div>
-						<p class="text-caption">After</p>
-						<p class="diff-after text-lg">{{ diff.diff_html|safe }}</p>
-					</div>
-				</div>
-
-				<table class="display-none md:display-table">
-					<tr>
-						<th class="text-caption pr-2">Before</th>
-						<td class="diff-before text-lg">{{ diff.diff_html|safe }}</td>
-					</tr>
-					<tr>
-						<th class="text-caption pr-2">After</th>
-						<td class="diff-after text-lg">{{ diff.diff_html|safe }}</td>
-					</tr>
-				</table>
-			</div>
-		</article>
-		{% endfor %}
+		{% include "parts/diff_list.html" %}
 	</section>
 
 	<div class="overflow-x-auto">
diff --git a/view/templates/parts/diff_list.html b/view/templates/parts/diff_list.html
new file mode 100644
index 0000000..c579850
--- /dev/null
+++ b/view/templates/parts/diff_list.html
@@ -0,0 +1,51 @@
+{% for diff in diffs %}
+	<article class="card px-5 py-4 mb-4">
+		<p class="flex gap-x-4 gap-y-2 mb-3 flex-wrap shrink-0">
+			<span class="text-sm font-medium">{{ diff.feed_name }}</span>
+			<time class="text-sm font-medium">{{ diff.diff_time }}</time>
+			<a class="action-link" href="{{ diff.article_url }}">
+				<svg class="w-4 fill-current" viewBox="0 0 24 24">
+					<path
+						d="M10 6V8H5V19H16V14H18V20C18 20.5523 17.5523 21 17 21H4C3.44772 21 3 20.5523 3 20V7C3 6.44772 3.44772 6 4 6H10ZM21 3V11H19L18.9999 6.413L11.2071 14.2071L9.79289 12.7929L17.5849 5H13V3H21Z"
+					></path>
+				</svg>
+				Display current article
+			</a>
+			<a class="action-link" href="/article/{{ diff.article_id }}">
+				<svg class="w-4 fill-current" viewBox="0 0 24 24">
+					<path
+						d="M12 22C6.47715 22 2 17.5228 2 12C2 6.47715 6.47715 2 12 2C17.5228 2 22 6.47715 22 12C22 17.5228 17.5228 22 12 22ZM12 20C16.4183 20 20 16.4183 20 12C20 7.58172 16.4183 4 12 4C7.58172 4 4 7.58172 4 12C4 16.4183 7.58172 20 12 20ZM13 12H17V14H11V7H13V12Z"
+					></path>
+				</svg>
+				Show change history
+			</a>
+		</p>
+
+		<div class="text-lg" x-bind:class="{ hidden: expandDiffs }">
+			{{ diff.diff_html|safe }}
+		</div>
+		<div x-bind:class="{ hidden: !expandDiffs }">
+			<div class="md:hidden">
+				<div class="mb-2">
+					<p class="text-caption">Before</p>
+					<p class="diff-before text-lg">{{ diff.diff_html|safe }}</p>
+				</div>
+				<div>
+					<p class="text-caption">After</p>
+					<p class="diff-after text-lg">{{ diff.diff_html|safe }}</p>
+				</div>
+			</div>
+
+			<table class="display-none md:display-table">
+				<tr>
+					<th class="text-caption pr-2">Before</th>
+					<td class="diff-before text-lg">{{ diff.diff_html|safe }}</td>
+				</tr>
+				<tr>
+					<th class="text-caption pr-2">After</th>
+					<td class="diff-after text-lg">{{ diff.diff_html|safe }}</td>
+				</tr>
+			</table>
+		</div>
+	</article>
+	{% endfor %}
diff --git a/view/templates/parts/filters.html b/view/templates/parts/filters.html
new file mode 100644
index 0000000..63e4ef4
--- /dev/null
+++ b/view/templates/parts/filters.html
@@ -0,0 +1,81 @@
+<section class="container">
+	<div class="flex items-center flex-wrap shrink-0 gap-x-2 gap-y-2">
+		<form
+			method="get"
+			class="flex gap-x-2"
+			hx-trigger="change"
+			hx-get="/"
+			hx-target="#diff-list"
+			hx-select="#diff-list"
+		>
+			<input
+				class="text-input w-full max-w-20rem"
+				type="text"
+				id="search"
+				name="search"
+				value="{{ search|e }}"
+			/>
+			<button class="button button-md" type="submit" value="Hledat">
+				Search
+				<svg class="w-4 fill-current" viewBox="0 0 24 24">
+					<path
+						d="M18.031 16.6168L22.3137 20.8995L20.8995 22.3137L16.6168 18.031C15.0769 19.263 13.124 20 11 20C6.032 20 2 15.968 2 11C2 6.032 6.032 2 11 2C15.968 2 20 6.032 20 11C20 13.124 19.263 15.0769 18.031 16.6168ZM16.0247 15.8748C17.2475 14.6146 18 12.8956 18 11C18 7.1325 14.8675 4 11 4C7.1325 4 4 7.1325 4 11C4 14.8675 7.1325 18 11 18C12.8956 18 14.6146 17.2475 15.8748 16.0247L16.0247 15.8748Z"
+					></path>
+				</svg>
+			</button>
+		</form>
+
+		<button class="button-outline button-md" @click="document.querySelector('#feeds-dialog').showModal()">
+			<svg class="w-4 fill-current" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M10 14L4 5V3H20V5L14 14V20L10 22V14Z"></path></svg>
+			Feeds
+		</button>
+
+		<dialog id="feeds-dialog" hx-boost="false" class="dialog">
+			<header class="flex justify-between mb-6 items-center">
+				<p>Filter by feed</p>
+				<form method="dialog">
+					<button formmethod="dialog" class="button-outline button-md">
+						✕
+					</button>
+				</form>
+			</header>
+
+			<form action="/" method="GET" id="feeds-filter">
+				<div class="columns-2 mb-6">
+					{% for feed in feeds %}
+					<label
+						class="flex items-center gap-3 px-2 py-1.5 hover:bg-gray-100 rounded"
+					>
+						<input type="checkbox" name="feeds[]" value="{{ feed['feed_name'] }}"
+						{{ 'checked' if feed['feed_name'] in selected_feeds }} > {{
+						feed['feed_name'] }}
+					</label>
+					{% endfor %}
+				</div>
+
+				<button type="submit" class="button button-md">
+					Filter diffs
+				</button>
+			</form>
+		</dialog>
+
+		<label class="checkbox mx-2">
+			<input
+				type="checkbox"
+				x-model="expandDiffs"
+				x-bind:checked="expandDiffs"
+			/>
+			<p>Expand diffs</p>
+		</label>
+	</div>
+
+	{% if selected_feeds|length > 0 %}
+	<div class="text-xs font-medium text-muted flex items-center mt-3">
+		<svg class="w-3 fill-current mr-2" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M10 14L4 5V3H20V5L14 14V20L10 22V14Z"></path></svg>
+		<div>
+			Feeds: <span>{{ ", ".join(selected_feeds) }}</span>
+			<a href="/" class="ml-2">✕ Clear</a>
+		</div>
+	</div>
+	{% endif %}
+</section>