https://en.wikipedia.org/wiki/Cube
A cube is a three-dimensional solid object in geometry. A cube has eight vertices and twelve straight edges of the same length, so that these edges form six faces.
Highlighting matches helps users quickly understand why a result is relevant and speeds up navigation through lists. Depending on the context, one of two styles is used.
Koobiq provides two pipes for highlighting text matches — kbqHighlightBackground and kbqHighlightBold. Both take a string and a search argument, wrapping the found matches in a <mark> tag — kbq-highlight-background for the background-color style and kbq-highlight for the bold style.
Used in selects and other dropdown pickers with filtering, and to highlight matches in complex content: descriptions, messages, and articles. The solid background remains legible in hover and active states within overlays and makes matches noticeable even in long texts.
Matches in text:
Matches in search results with a complex layout:
A cube is a three-dimensional solid object in geometry. A cube has eight vertices and twelve straight edges of the same length, so that these edges form six faces.
Cube is a 1997 Canadian science fiction horror film directed and co-written by Vincenzo Natali. A product of the Canadian Film Centre's First Feature Project.
In arithmetic and algebra, the cube of a number n is its third power, that is, the result of multiplying three instances of n together.
The story centers on a group of strangers who awaken in a cube-shaped room connected to adjacent rooms, forming an elaborate maze filled with traps.
Matches in a table:
| City | Company | Person | Notes |
|---|---|---|---|
| Manchester | Blue Harbor Ltd | Alice Brown | Annual review completed |
| Liverpool | Mancraft Studio | Daniel Reed | New client onboarded |
| Bristol | GreenField Tech | Mancini Robert | Budget approved |
| Leeds | Northwind Labs | Emma Stone | Visit planned for Manchester office |
| York | Delta Systems | Michael Turner | Contract with Mancorp signed |
| Oxford | Silver Bridge | Laura Green | Archived in mancategory B |
This style is unobtrusive and ideal for quickly scanning familiar data: the user immediately sees that the searched word is in the row but is not distracted from the main choice.
<span [innerHTML]="item | kbqHighlightBold: searchQuery"></span>The pipe used to be called mcHighlight: that name is deprecated and will be removed in 22.0.0.