chore(icons): abide code style when passing icons

Author: radkostanev

_contentTemplates/grid/export.md

@@ -27,7 +27,7 @@
         <TelerikGrid Data="@GridData" AutoGenerateColumns="true" Pageable="true">
             <GridToolBarTemplate>
                 <GridCommandButton OnClick="@ShowLoadingSign" Command="ExcelExport" Icon="@FontIcon.FileExcel">Export to Excel</GridCommandButton>
-                <GridCommandButton OnClick="@ShowLoadingSign" Command="CsvExport" Icon=FontIcon.FileCsv>Export to CSV</GridCommandButton>
+                <GridCommandButton OnClick="@ShowLoadingSign" Command="CsvExport" Icon="@FontIcon.FileCsv">Export to CSV</GridCommandButton>
             </GridToolBarTemplate>
             <GridExport>
                 <GridExcelExport AllPages="true" FileName="telerik-grid-export" />

common-features/loading-sign.md

@@ -98,7 +98,7 @@ This sample shows only an indicator for the initial data load, only the DELETE o
                  OnDelete="@DeleteHandlerWithDelay">
         <GridColumns>
             <GridCommandColumn>
-                <GridCommandButton Command="Delete" Icon=FontIcon.Trash>Delete</GridCommandButton>
+                <GridCommandButton Command="Delete" Icon="@FontIcon.Trash">Delete</GridCommandButton>
             </GridCommandColumn>
         </GridColumns>
     </TelerikGrid>

components/autocomplete/templates.md

@@ -60,7 +60,7 @@ The AutoComplete component allows you to change what is rendered in its items, h
     </FooterTemplate>
     <NoDataTemplate>
         <div class="no-data-template">
-            <TelerikFontIcon Class="k-icon k-icon-lg" Icon=FontIcon.FilesError></TelerikFontIcon>
+            <TelerikFontIcon Class="k-icon k-icon-lg" Icon="@FontIcon.FilesError"></TelerikFontIcon>
             <p>No items available</p>
         </div>
     </NoDataTemplate>

components/avatar/types.md

@@ -41,7 +41,7 @@ If the `Type` parameter value is not matching the type of the content, you will
 
 <TelerikAvatar Type="AvatarType.Icon">
 
-    <TelerikFontIcon Icon=FontIcon.User></TelerikIcon>
+    <TelerikFontIcon Icon="@FontIcon.User"></TelerikIcon>
 
 </TelerikAvatar>
 ````

components/breadcrumb/separator.md

@@ -23,7 +23,7 @@ Furthermore, you can take full control over the Separator rendering with the [Se
 ````CSHTML
 @* This example demonstrates how to change the default Telerik icon used as a Breadcrumb Separator*@
 
-<TelerikBreadcrumb SeparatorIcon=FontIcon.CaretDoubleAltRight
+<TelerikBreadcrumb SeparatorIcon="@FontIcon.CaretDoubleAltRight"
                    Data="@Items">
 </TelerikBreadcrumb>
 

components/calendar/templates/decade-cell.md

@@ -25,7 +25,7 @@ The template receives the `DateTime` corresponding to its cell.
     <DecadeCellTemplate>
         @if (yearsWithEvents.Contains(context.Year))
         {
-            <TelerikFontIcon Icon="FontIcon.ExclamationCircle"></TelerikFontIcon>
+            <TelerikFontIcon Icon="@FontIcon.ExclamationCircle"></TelerikFontIcon>
         }
         @context.Year
     </DecadeCellTemplate>

components/calendar/templates/header-template.md

@@ -20,11 +20,11 @@ The example below is using a [Calendar reference and methods]({%slug components/
 <TelerikCalendar @bind-Value="@CalendarValue" @bind-Date="@CalendarDate">
     <HeaderTemplate>
 
-        <TelerikButton OnClick="@GoToPrevious" Icon="FontIcon.ArrowLeft" Title="Go to Previous Month"></TelerikButton>
+        <TelerikButton OnClick="@GoToPrevious" Icon="@FontIcon.ArrowLeft" Title="Go to Previous Month"></TelerikButton>
         <TelerikButton OnClick="@SelectToday">Today</TelerikButton>
-        <TelerikButton OnClick="@GoToNext" Icon="FontIcon.ArrowRight" Title="Go to Next Month"></TelerikButton>
+        <TelerikButton OnClick="@GoToNext" Icon="@FontIcon.ArrowRight" Title="Go to Next Month"></TelerikButton>
 
-        <TelerikFontIcon Icon="FontIcon.ParameterDateTime" /> @CalendarValue.ToShortDateString()
+        <TelerikFontIcon Icon="@FontIcon.ParameterDateTime" /> @CalendarValue.ToShortDateString()
 
     </HeaderTemplate>
 </TelerikCalendar>

components/calendar/templates/year-cell.md

@@ -25,7 +25,7 @@ The template receives the `DateTime` corresponding to its cell.
     <YearCellTemplate>
         @if (monthsWithEvents.Contains(context.Month))
         {
-            <TelerikFontIcon Icon="FontIcon.RoundCorners"></TelerikFontIcon>
+            <TelerikFontIcon Icon="@FontIcon.RoundCorners"></TelerikFontIcon>
         }
         @context.ToString("MMM")
     </YearCellTemplate>

components/card/image.md

@@ -28,9 +28,9 @@ Every Blazor Card can have a dedicated area to render a card image that will fil
     <CardImage Src="https://docs.telerik.com/blazor-ui/components/card/images/rila_lakes.jpg"></CardImage>
 
     <CardActions Layout="CardActionsLayout.Stretch">
-        <TelerikButton Class="k-flat" Icon="FontIcon.HeartOutline" Title="Like"></TelerikButton>
-        <TelerikButton Class="k-flat" Icon="SvgIcon.Comment" Title="Comment"></TelerikButton>
-        <TelerikButton Class="k-flat" Icon="SvgIcon.Share" Title="Share"></TelerikButton>
+        <TelerikButton Class="k-flat" Icon="@FontIcon.HeartOutline" Title="Like"></TelerikButton>
+        <TelerikButton Class="k-flat" Icon="@SvgIcon.Comment" Title="Comment"></TelerikButton>
+        <TelerikButton Class="k-flat" Icon="@SvgIcon.Share" Title="Share"></TelerikButton>
     </CardActions>
 </TelerikCard>
 ````

components/card/overview.md

@@ -43,8 +43,8 @@ The below snippet demonstrates the setup of a Card component with all building b
         </p>
     </CardBody>
     <CardActions Layout="@CardActionsLayout.Stretch">
-        <TelerikButton Class="k-flat" Icon="FontIcon.HeartOutline" Title="Like"></TelerikButton>
-        <TelerikButton Class="k-flat" Icon="SvgIcon.Comment" Title="Comment"></TelerikButton>
+        <TelerikButton Class="k-flat" Icon="@FontIcon.HeartOutline" Title="Like"></TelerikButton>
+        <TelerikButton Class="k-flat" Icon="@SvgIcon.Comment" Title="Comment"></TelerikButton>
         <TelerikButton Class="k-flat">Read More</TelerikButton>
     </CardActions>
     <CardFooter>