diff --git a/src/app/_shared/components/card-text/card-text.component.ts b/src/app/_shared/components/card-text/card-text.component.ts
index b922f24..37af430 100644
--- a/src/app/_shared/components/card-text/card-text.component.ts
+++ b/src/app/_shared/components/card-text/card-text.component.ts
@@ -23,7 +23,7 @@ export class CardTextComponent {
   }
 
   private fixText(): string {
-    return this.text().split('+').join('\\+').split('-').join('\\-');
+    return (this.text() ?? '').split('+').join('\\+').split('-').join('\\-');
   }
 
   private getCustomRenderer(): marked.Renderer {
diff --git a/src/app/_shared/components/search-cards/search-cards.component.html b/src/app/_shared/components/search-cards/search-cards.component.html
index 013a637..add64d0 100644
--- a/src/app/_shared/components/search-cards/search-cards.component.html
+++ b/src/app/_shared/components/search-cards/search-cards.component.html
@@ -1,19 +1,19 @@
-@if(displayTotal === 0) {
+@if(searchService.displayTotal() === 0) {
 <div class="no-results ion-text-center">
   <h2>No results found</h2>
   <p>For help using the search tool, check the <a target="_blank" [routerLink]="['/syntax']">help guide</a>.</p>
 </div>
 }
 
-@if(displayTotal > 0) {
+@if(searchService.displayTotal() > 0) {
 <ng-container>
   <ng-container *ngTemplateOutlet="cardSwitches"></ng-container>
 
   <ion-grid class="info">
     <ion-row>
       <ion-col>
-        <span>{{ displayCurrent | number }} - {{ displayMaximum | number }}
-          of&nbsp;</span> {{ displayTotal | number }} {{ queryDesc }}
+        <span>{{ searchService.displayCurrent() | number }} - {{ searchService.displayMaximum() | number }}
+          of&nbsp;</span> {{ searchService.displayTotal() | number }} {{ searchService.queryDesc() }}
       </ion-col>
     </ion-row>
   </ion-grid>
@@ -21,17 +21,18 @@ <h2>No results found</h2>
   <div class="page-container">
     <ion-grid class="cards">
       <ion-row>
-        @for(card of visibleCards; track card.id) {
+        @for(card of searchService.visibleCards(); track card.id) {
         <ion-col class="card-container" [sizeMd]="3" [sizeSm]="6" [sizeXs]="12">
           <a [routerLink]="['/card', card.id]">
-            <app-card-display class="card" [cardCode]="card.id" [display]="queryDisplayValue"></app-card-display>
+            <app-card-display class="card" [cardCode]="card.id"
+              [display]="searchService.queryDisplayValue"></app-card-display>
           </a>
         </ion-col>
         }
       </ion-row>
     </ion-grid>
 
-    @if(visibleCards.length > 4) {
+    @if(searchService.visibleCards().length > 4) {
     <ng-container *ngTemplateOutlet="cardSwitches"></ng-container>
     }
   </div>
@@ -43,8 +44,8 @@ <h2>No results found</h2>
     <ion-row>
       <ion-col [sizeXs]="12" [sizeMd]="2">
         <div class="text-display">Cards as</div>
-        <ion-select class="themed" [(ngModel)]="queryDisplayValue" interface="popover" placeholder="Card Display"
-          (ionChange)="redoCurrentSearch()">
+        <ion-select class="themed" [(ngModel)]="searchService.queryDisplayValue" interface="popover"
+          placeholder="Card Display" (ionChange)="searchService.redoCurrentSearch()">
           <ion-select-option value="images">Images</ion-select-option>
           <ion-select-option value="text">Text</ion-select-option>
         </ion-select>
@@ -52,36 +53,41 @@ <h2>No results found</h2>
 
       <ion-col [sizeXs]="12" [sizeMd]="4">
         <div class="text-display">Sorted by</div>
-        <ion-select class="themed" [(ngModel)]="querySortValue" interface="popover" placeholder="Sort Prop"
-          (ionChange)="redoCurrentSearch()">
+        <ion-select class="themed" [(ngModel)]="searchService.querySortValue" interface="popover"
+          placeholder="Sort Prop" (ionChange)="searchService.redoCurrentSearch()">
           <ion-select-option value="name">Name</ion-select-option>
           <ion-select-option value="id">ID</ion-select-option>
           <ion-select-option value="product">Product</ion-select-option>
         </ion-select>
 
-        <ion-select class="themed" [(ngModel)]="querySortByValue" interface="popover" placeholder="Sort Dir"
-          (ionChange)="redoCurrentSearch()">
+        <ion-select class="themed" [(ngModel)]="searchService.querySortByValue" interface="popover"
+          placeholder="Sort Dir" (ionChange)="searchService.redoCurrentSearch()">
           <ion-select-option value="asc">Asc ↑</ion-select-option>
           <ion-select-option value="desc">Desc ↓</ion-select-option>
         </ion-select>
       </ion-col>
 
       <ion-col [sizeXs]="12" [sizeMd]="6" class="pagination ion-justify-content-center">
-        <ion-button fill="outline" color="secondary" [disabled]="pageValue <= 0" (click)="changePage(0)">
+        <ion-button fill="outline" color="secondary" [disabled]="searchService.pageValue() <= 0"
+          (click)="changePage(0)">
           <span class="symbol">&laquo;</span>
         </ion-button>
 
-        <ion-button fill="outline" color="secondary" [disabled]="pageValue <= 0" (click)="changePage(pageValue - 1)">
+        <ion-button fill="outline" color="secondary" [disabled]="searchService.pageValue() <= 0"
+          (click)="changePage(searchService.pageValue() - 1)">
           <span class="symbol left">&lsaquo;</span> <span class="ion-hide-sm-down">Previous</span>
         </ion-button>
 
-        <ion-button fill="outline" color="secondary" [disabled]="pageValue >= totalPages"
-          (click)="changePage(pageValue + 1)">
-          <span class="ion-hide-sm-down">Next {{ cardsPerPage }}</span> <span class="symbol right">&rsaquo;</span>
+        <ion-button fill="outline" color="secondary"
+          [disabled]="searchService.pageValue() >= searchService.totalPages()"
+          (click)="changePage(searchService.pageValue() + 1)">
+          <span class="ion-hide-sm-down">Next {{ searchService.cardsPerPage }}</span> <span
+            class="symbol right">&rsaquo;</span>
         </ion-button>
 
-        <ion-button fill="outline" color="secondary" [disabled]="pageValue >= totalPages"
-          (click)="changePage(totalPages)">
+        <ion-button fill="outline" color="secondary"
+          [disabled]="searchService.pageValue() >= searchService.totalPages()"
+          (click)="changePage(searchService.totalPages())">
           <span class="symbol">&raquo;</span>
         </ion-button>
       </ion-col>
diff --git a/src/app/_shared/components/search-cards/search-cards.component.ts b/src/app/_shared/components/search-cards/search-cards.component.ts
index f347f55..7c8f338 100644
--- a/src/app/_shared/components/search-cards/search-cards.component.ts
+++ b/src/app/_shared/components/search-cards/search-cards.component.ts
@@ -1,23 +1,8 @@
 /* eslint-disable @typescript-eslint/no-explicit-any */
-import {
-  Component,
-  effect,
-  inject,
-  input,
-  output,
-  ViewChild,
-} from '@angular/core';
-import { ActivatedRoute, Router } from '@angular/router';
-import { DatatableComponent, SelectionType } from '@siemens/ngx-datatable';
-import { sortBy } from 'lodash';
+import { Component, inject, output } from '@angular/core';
 
-import { type ICard } from '../../../../../interfaces';
-import { queryToText } from '../../../../../search/search';
-import { CardsService } from '../../../cards.service';
-
-type QueryDisplay = 'images' | 'text';
-type QuerySort = keyof ICard;
-type QuerySortBy = 'asc' | 'desc';
+import { ActivatedRoute } from '@angular/router';
+import { SearchService } from '../../../search.service';
 
 @Component({
   selector: 'app-search-cards',
@@ -25,139 +10,16 @@ type QuerySortBy = 'asc' | 'desc';
   styleUrls: ['./search-cards.component.scss'],
 })
 export class SearchCardsComponent {
-  private router = inject(Router);
   private route = inject(ActivatedRoute);
-  private cardsService = inject(CardsService);
-
-  @ViewChild(DatatableComponent) table!: DatatableComponent;
-
-  private queryValue = '';
-  public queryDisplayValue: QueryDisplay = 'images';
-  public querySortValue: QuerySort = 'name';
-  public querySortByValue: QuerySortBy = 'asc';
-  public pageValue = 0;
-
-  public query = input<string>('');
-  public queryDisplay = input<QueryDisplay>('images');
-  public querySort = input<QuerySort>('name');
-  public querySortBy = input<QuerySortBy>('asc');
-  public page = input<number>(0);
+  private searchService = inject(SearchService);
 
   public pageChanged = output<number>();
 
   public queryDesc = '';
 
-  public readonly cardsPerPage = 60;
-  public totalPages = 0;
-  public queriedCards: ICard[] = [];
-  public visibleCards: ICard[] = [];
-
-  public displayCurrent = 0;
-  public displayTotal = 0;
-  public displayMaximum = 0;
-
-  public selected: any[] = [];
-  public expanded: any = {};
-  public checkboxSelectionType: SelectionType = SelectionType.checkbox;
-
-  constructor() {
-    effect(() => {
-      this.queryValue = this.query();
-      this.queryDisplayValue = this.queryDisplay();
-      this.querySortValue = this.querySort();
-      this.querySortByValue = this.querySortBy();
-      this.pageValue = this.page();
-
-      this.search(this.queryValue, false);
-      this.changePage(this.pageValue);
-    });
-  }
-
-  redoCurrentSearch() {
-    this.search(this.queryValue);
-  }
-
-  search(query: string, changePage = true) {
-    this.queryValue = query;
-    this.pageValue = 0;
-    this.totalPages = 0;
-    this.displayCurrent = 0;
-    this.displayTotal = 0;
-    this.displayMaximum = 0;
-
-    if (!this.query) {
-      this.queriedCards = [];
-      this.visibleCards = [];
-      this.updateParams();
-      return;
-    }
-
-    this.queryDesc = queryToText(this.queryValue);
-
-    this.queriedCards = this.cardsService.searchCards(this.queryValue);
-    this.doExtraSorting();
-
-    if (changePage) {
-      this.changePage(0);
-    }
-  }
-
-  updateParams() {
-    if (!this.queryValue) {
-      return;
-    }
-
-    this.router.navigate([], {
-      relativeTo: this.route,
-      queryParams: {
-        q: this.queryValue,
-        d: this.queryDisplayValue,
-        s: this.querySortValue,
-        b: this.querySortByValue,
-        p: this.pageValue,
-      },
-      queryParamsHandling: 'merge',
-    });
-  }
-
-  doExtraSorting() {
-    this.queriedCards = sortBy(this.queriedCards, this.querySortValue);
-    if (this.querySortByValue === 'desc') {
-      this.queriedCards = this.queriedCards.reverse();
-    }
-  }
-
   changePage(newPage: number) {
-    this.pageValue = newPage;
-    this.totalPages =
-      Math.ceil(this.queriedCards.length / this.cardsPerPage) - 1;
-
-    if (this.pageValue > this.totalPages) {
-      this.pageValue = this.totalPages;
-    }
-
-    if (this.pageValue < 0) {
-      this.pageValue = 0;
-    }
-
-    this.visibleCards = this.queriedCards.slice(
-      this.pageValue * this.cardsPerPage,
-      (this.pageValue + 1) * this.cardsPerPage
-    );
-
-    this.displayCurrent = this.pageValue * this.cardsPerPage + 1;
-    this.displayTotal = this.queriedCards.length;
-    this.displayMaximum = Math.min(
-      this.displayTotal,
-      (this.pageValue + 1) * this.cardsPerPage
-    );
-
-    this.updateParams();
-    this.pageChanged.emit(this.pageValue);
-  }
-
-  select({ selected }: any) {
-    this.selected = [...selected];
+    this.searchService.changePage(newPage);
+    this.pageChanged.emit(newPage);
   }
 
   public getDetailHeight(): any {
diff --git a/src/app/_shared/components/topbar/topbar.component.html b/src/app/_shared/components/topbar/topbar.component.html
index d3fc88d..ec7d375 100644
--- a/src/app/_shared/components/topbar/topbar.component.html
+++ b/src/app/_shared/components/topbar/topbar.component.html
@@ -13,8 +13,7 @@
         }
 
         @if(showSearch()) {
-        <app-omnisearch (type)="type.emit($event)" (enter)="enter.emit($event)"
-          [initialQuery]="query()"></app-omnisearch>
+        <app-omnisearch (type)="doType($event)" (enter)="doEnter($event)" [initialQuery]="query()"></app-omnisearch>
         }
       </ion-col>
 
diff --git a/src/app/_shared/components/topbar/topbar.component.ts b/src/app/_shared/components/topbar/topbar.component.ts
index 61483e0..e07e6ef 100644
--- a/src/app/_shared/components/topbar/topbar.component.ts
+++ b/src/app/_shared/components/topbar/topbar.component.ts
@@ -1,4 +1,6 @@
-import { Component, input, output } from '@angular/core';
+import { Component, inject, input } from '@angular/core';
+import { Router } from '@angular/router';
+import { SearchService } from '../../../search.service';
 
 @Component({
   selector: 'app-topbar',
@@ -6,10 +8,32 @@ import { Component, input, output } from '@angular/core';
   styleUrls: ['./topbar.component.scss'],
 })
 export class TopbarComponent {
+  private router = inject(Router);
+  private searchService = inject(SearchService);
+
   public title = input<string>('');
   public showSearch = input<boolean>(true);
   public query = input<string>('');
 
-  public type = output<string>();
-  public enter = output<string>();
+  public searchOnType = input<boolean>(false);
+  public searchOnEnter = input<boolean>(false);
+
+  doType($event: string) {
+    if (!this.searchOnType()) return;
+    this.search($event);
+  }
+
+  doEnter($event: string) {
+    if (!this.searchOnEnter()) return;
+    this.search($event);
+  }
+
+  private search(query: string) {
+    this.router.navigate(['/search'], {
+      queryParamsHandling: 'merge',
+      queryParams: { q: query },
+    });
+
+    this.searchService.search(query);
+  }
 }
diff --git a/src/app/card/card.page.html b/src/app/card/card.page.html
index 68347ba..371b037 100644
--- a/src/app/card/card.page.html
+++ b/src/app/card/card.page.html
@@ -1,5 +1,5 @@
 <ion-header>
-  <app-topbar (enter)="search($event)"></app-topbar>
+  <app-topbar [searchOnEnter]="true"></app-topbar>
 </ion-header>
 
 <ion-content>
diff --git a/src/app/faq/faq.page.html b/src/app/faq/faq.page.html
index 72c175c..291294f 100644
--- a/src/app/faq/faq.page.html
+++ b/src/app/faq/faq.page.html
@@ -1,5 +1,5 @@
 <ion-header>
-  <app-topbar (enter)="search($event)"></app-topbar>
+  <app-topbar [searchOnEnter]="true"></app-topbar>
 </ion-header>
 
 <ion-content>
diff --git a/src/app/faq/faq.page.ts b/src/app/faq/faq.page.ts
index aba34c7..07e7c62 100644
--- a/src/app/faq/faq.page.ts
+++ b/src/app/faq/faq.page.ts
@@ -47,8 +47,4 @@ export class FaqPage {
     this.locale.set(faq.locale);
     this.productId.set(faq.productId);
   }
-
-  search(query: string) {
-    this.router.navigate(['/search'], { queryParams: { q: query } });
-  }
 }
diff --git a/src/app/home/home.page.ts b/src/app/home/home.page.ts
index 8a6a515..84238ca 100644
--- a/src/app/home/home.page.ts
+++ b/src/app/home/home.page.ts
@@ -12,6 +12,8 @@ export class HomePage {
   public searchQuery = '';
 
   search(query: string) {
-    this.router.navigate(['/search'], { queryParams: { q: query } });
+    this.router.navigate(['/search'], {
+      queryParams: { q: query },
+    });
   }
 }
diff --git a/src/app/search.service.ts b/src/app/search.service.ts
new file mode 100644
index 0000000..af8d2cc
--- /dev/null
+++ b/src/app/search.service.ts
@@ -0,0 +1,127 @@
+import { inject, Injectable, signal } from '@angular/core';
+import { ActivatedRoute, Router } from '@angular/router';
+import { sortBy } from 'lodash';
+import type { ICard } from '../../interfaces';
+import { queryToText } from '../../search/search';
+import { CardsService } from './cards.service';
+
+export type QueryDisplay = 'images' | 'text';
+export type QuerySort = keyof ICard;
+export type QuerySortBy = 'asc' | 'desc';
+
+@Injectable({
+  providedIn: 'root',
+})
+export class SearchService {
+  private router = inject(Router);
+  private route = inject(ActivatedRoute);
+  private cardsService = inject(CardsService);
+
+  public visibleCards = signal<ICard[]>([]);
+  public queryDesc = signal<string>('');
+
+  public readonly cardsPerPage = 60;
+  public queriedCards: ICard[] = [];
+
+  public totalPages = signal<number>(0);
+  public pageValue = signal<number>(0);
+
+  public displayCurrent = signal<number>(0);
+  public displayTotal = signal<number>(0);
+  public displayMaximum = signal<number>(0);
+
+  private queryValue = '';
+
+  public queryDisplayValue: QueryDisplay = 'images';
+  public querySortValue: QuerySort = 'name';
+  public querySortByValue: QuerySortBy = 'asc';
+
+  search(query: string, changePage = true) {
+    this.queryValue = query;
+    this.pageValue.set(0);
+    this.totalPages.set(0);
+    this.displayCurrent.set(0);
+    this.displayTotal.set(0);
+    this.displayMaximum.set(0);
+
+    if (!this.queryValue) {
+      this.queriedCards = [];
+      this.visibleCards.set([]);
+      this.updateParams();
+      return;
+    }
+
+    this.queryDesc.set(queryToText(this.queryValue));
+
+    this.queriedCards = this.cardsService.searchCards(this.queryValue);
+    this.doExtraSorting();
+
+    if (changePage) {
+      this.changePage(0);
+    }
+  }
+
+  redoCurrentSearch() {
+    this.updateParams();
+    this.search(this.queryValue);
+  }
+
+  changePage(newPage: number) {
+    this.pageValue.set(newPage);
+    this.totalPages.set(
+      Math.ceil(this.queriedCards.length / this.cardsPerPage) - 1
+    );
+
+    if (this.pageValue() > this.totalPages()) {
+      this.pageValue.set(this.totalPages());
+    }
+
+    if (this.pageValue() < 0) {
+      this.pageValue.set(0);
+    }
+
+    this.visibleCards.set(
+      this.queriedCards.slice(
+        this.pageValue() * this.cardsPerPage,
+        (this.pageValue() + 1) * this.cardsPerPage
+      )
+    );
+
+    this.displayCurrent.set(this.pageValue() * this.cardsPerPage + 1);
+    this.displayTotal.set(this.queriedCards.length);
+    this.displayMaximum.set(
+      Math.min(this.displayTotal(), (this.pageValue() + 1) * this.cardsPerPage)
+    );
+
+    this.updateParams();
+  }
+
+  private updateParams() {
+    if (!this.queryValue) {
+      return;
+    }
+
+    this.router.navigate([], {
+      relativeTo: this.route,
+      queryParams: {
+        q: this.queryValue,
+        d: this.queryDisplayValue,
+        s: this.querySortValue,
+        b: this.querySortByValue,
+        p: this.pageValue(),
+      },
+      queryParamsHandling: 'merge',
+    });
+  }
+
+  private doExtraSorting() {
+    this.queriedCards = sortBy(this.queriedCards, this.querySortValue);
+    if (this.querySortByValue === 'desc') {
+      this.queriedCards = this.queriedCards.reverse();
+    }
+  }
+
+  public resetCards() {
+    this.visibleCards.set([]);
+  }
+}
diff --git a/src/app/search/search.page.html b/src/app/search/search.page.html
index b1677a2..7df8402 100644
--- a/src/app/search/search.page.html
+++ b/src/app/search/search.page.html
@@ -1,11 +1,10 @@
 <ion-header>
-  <app-topbar [query]="query" (type)="search($event)"></app-topbar>
+  <app-topbar [query]="query" [searchOnType]="true" [searchOnEnter]="true"></app-topbar>
 </ion-header>
 
 <ion-content #content>
   <div class="container">
-    <app-search-cards [query]="query" [queryDisplay]="queryDisplay" [querySort]="querySort" [querySortBy]="querySortBy"
-      [page]="page" (pageChanged)="content.scrollToTop()"></app-search-cards>
+    <app-search-cards (pageChanged)="content.scrollToTop()"></app-search-cards>
   </div>
 
   <app-below-the-fold></app-below-the-fold>
diff --git a/src/app/search/search.page.ts b/src/app/search/search.page.ts
index ccbd58a..b6b3873 100644
--- a/src/app/search/search.page.ts
+++ b/src/app/search/search.page.ts
@@ -1,8 +1,12 @@
-import { Component, inject, ViewChild } from '@angular/core';
+import { Component, inject } from '@angular/core';
 import { ActivatedRoute } from '@angular/router';
-import { DatatableComponent } from '@siemens/ngx-datatable';
 
-import { type ICard } from '../../../interfaces';
+import {
+  SearchService,
+  type QueryDisplay,
+  type QuerySort,
+  type QuerySortBy,
+} from '../search.service';
 
 @Component({
   selector: 'app-search',
@@ -11,32 +15,24 @@ import { type ICard } from '../../../interfaces';
 })
 export class SearchPage {
   private route = inject(ActivatedRoute);
-
-  @ViewChild(DatatableComponent) table!: DatatableComponent;
+  private searchService = inject(SearchService);
 
   public query = '';
 
-  public queryDisplay: 'images' | 'text' = 'images';
-  public querySort: keyof ICard = 'name';
-  public querySortBy: 'asc' | 'desc' = 'asc';
   public page = 0;
 
   ionViewDidEnter() {
     this.query = this.route.snapshot.queryParamMap.get('q') || '';
-    this.queryDisplay =
-      (this.route.snapshot.queryParamMap.get('d') as 'images' | 'text') ||
-      'images';
-    this.querySort =
-      (this.route.snapshot.queryParamMap.get('s') as keyof ICard) || 'name';
-    this.querySortBy =
-      (this.route.snapshot.queryParamMap.get('b') as 'asc' | 'desc') || 'asc';
-
-    this.page = parseInt(this.route.snapshot.queryParamMap.get('p') || '0', 10);
-
-    this.search(this.query);
-  }
-
-  search(query: string) {
-    this.query = query;
+    this.searchService.queryDisplayValue =
+      (this.route.snapshot.queryParamMap.get('d') as QueryDisplay) || 'images';
+    this.searchService.querySortValue =
+      (this.route.snapshot.queryParamMap.get('s') as QuerySort) || 'name';
+    this.searchService.querySortByValue =
+      (this.route.snapshot.queryParamMap.get('b') as QuerySortBy) || 'asc';
+    this.searchService.pageValue.set(
+      parseInt(this.route.snapshot.queryParamMap.get('p') || '0', 10)
+    );
+
+    this.searchService.search(this.query);
   }
 }
diff --git a/src/app/sets/sets.page.html b/src/app/sets/sets.page.html
index 2399130..39ac96e 100644
--- a/src/app/sets/sets.page.html
+++ b/src/app/sets/sets.page.html
@@ -1,5 +1,5 @@
 <ion-header>
-  <app-topbar (enter)="search($event)"></app-topbar>
+  <app-topbar [searchOnEnter]="true"></app-topbar>
 </ion-header>
 
 <ion-content>
diff --git a/src/app/sets/sets.page.ts b/src/app/sets/sets.page.ts
index 1d9eaf2..24bad55 100644
--- a/src/app/sets/sets.page.ts
+++ b/src/app/sets/sets.page.ts
@@ -1,6 +1,5 @@
 import { HttpClient } from '@angular/common/http';
 import { Component, inject, type OnInit } from '@angular/core';
-import { Router } from '@angular/router';
 import { sortBy } from 'lodash';
 import { type IProduct } from '../../../interfaces';
 import { environment } from '../../environments/environment';
@@ -11,7 +10,6 @@ import { environment } from '../../environments/environment';
   styleUrls: ['./sets.page.scss'],
 })
 export class SetsPage implements OnInit {
-  private router = inject(Router);
   private http = inject(HttpClient);
 
   public allProducts: IProduct[] = [];
@@ -27,8 +25,4 @@ export class SetsPage implements OnInit {
   formatSetNameForSearch(productId: string, subproductId: string): string {
     return `product:"${productId}" subproduct:"${subproductId}"`;
   }
-
-  search(query: string) {
-    this.router.navigate(['/search'], { queryParams: { q: query } });
-  }
 }
diff --git a/src/app/syntax/syntax.page.html b/src/app/syntax/syntax.page.html
index dcae3ba..7486b5a 100644
--- a/src/app/syntax/syntax.page.html
+++ b/src/app/syntax/syntax.page.html
@@ -1,5 +1,5 @@
 <ion-header>
-  <app-topbar (enter)="search($event)"></app-topbar>
+  <app-topbar [searchOnEnter]="true"></app-topbar>
 </ion-header>
 
 <ion-content>
diff --git a/src/app/syntax/syntax.page.ts b/src/app/syntax/syntax.page.ts
index 950765e..7b5b175 100644
--- a/src/app/syntax/syntax.page.ts
+++ b/src/app/syntax/syntax.page.ts
@@ -1,6 +1,5 @@
 import { Component, inject, type OnInit } from '@angular/core';
 import { DomSanitizer, type SafeHtml } from '@angular/platform-browser';
-import { Router } from '@angular/router';
 
 import { marked } from 'marked';
 
@@ -20,7 +19,6 @@ import {
   styleUrls: ['./syntax.page.scss'],
 })
 export class SyntaxPage implements OnInit {
-  private router = inject(Router);
   private domSanitizer = inject(DomSanitizer);
 
   public allOperators: ICardHelp[] = [
@@ -39,10 +37,6 @@ export class SyntaxPage implements OnInit {
     }
   }
 
-  search(query: string) {
-    this.router.navigate(['/search'], { queryParams: { q: query } });
-  }
-
   formatText(text: string): SafeHtml {
     return this.domSanitizer.bypassSecurityTrustHtml(marked.parse(text));
   }