Bump Fin App JS version and adjust Calendar width

Author: dimodi

sample-applications/blazor-financial-dashboard/BlazorFinancialDashboard/Components/App.razor

@@ -11,7 +11,7 @@
     <link rel="stylesheet" href="https://blazor.cdn.telerik.com/blazor/9.0.0/kendo-theme-material/swatches/material-main-dark.css" />
     <link rel="stylesheet" href="https://unpkg.com/@@progress/kendo-theme-utils/dist/all.css" />
     <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Roboto:300,400,500,700" />
-    <script src="https://blazor.cdn.telerik.com/blazor/8.1.1/telerik-blazor.min.js" defer></script>
+    <script src="https://blazor.cdn.telerik.com/blazor/9.0.0/telerik-blazor.min.js" defer></script>
     <link rel="stylesheet" href="app.css" />
     <link rel="stylesheet" href="BlazorFinancialDashboard.styles.css" />
     <link rel="icon" type="image/png" sizes="48x48" href="favicon-48x48.png" />

sample-applications/blazor-financial-dashboard/BlazorFinancialDashboard/Components/Pages/Settings.razor

@@ -28,7 +28,7 @@
     </TelerikForm>
 </UICard>
 
-<UICard Title="Card Information" ColSpanOnLargeScreen="8" ColSpanOnMediumScreen="6">
+<UICard Title="Card Information" ColSpanOnLargeScreen="7" ColSpanOnMediumScreen="6">
     <TelerikForm Model="@UserCard"
                  Columns="@( IsLargeScreen ? 2 : 1 )"
                  ColumnSpacing="var(--kendo-spacing-4)"
@@ -54,8 +54,8 @@
     </TelerikForm>
 </UICard>
 
-<UICard Title="Calendar" ColSpanOnLargeScreen="4" ColSpanOnMediumScreen="6">
-    <TelerikCalendar Size="@ThemeConstants.Calendar.Size.Small" />
+<UICard Title="Calendar" ColSpanOnLargeScreen="5" ColSpanOnMediumScreen="6">
+    <TelerikCalendar Size="@ThemeConstants.Calendar.Size.Small" Class="centered-calendar" />
 </UICard>
 
 @* <UICard Title="Weather" ColSpanOnLargeScreen="4" ColSpanOnMediumScreen="6"></UICard> *@

sample-applications/blazor-financial-dashboard/BlazorFinancialDashboard/Components/Pages/Transactions.razor

@@ -19,7 +19,7 @@
                  Navigable="true"
                  OnStateInit="@OnGridStateInit"
                  Pageable="true"
-                 SelectionMode="@GridSelectionMode.Multiple"
+                 SelectionMode="@GridSelectionMode.Single"
                  SelectedItems="@GridSelectedItems"
                  SelectedItemsChanged="GridSelectedItemsChanged"
                  ShowColumnMenu="true"
@@ -38,7 +38,7 @@
                            PageOrientation="@GridPdfExportPageOrientation.Landscape" />
         </GridSettings>
         <GridColumns>
-            <GridCheckboxColumn SelectAll="true" SelectAllMode="@GridSelectAllMode.All" ShowColumnMenu="false" />
+            <GridCheckboxColumn SelectAll="false" ShowColumnMenu="false" />
             <GridColumn Field="@nameof(Transaction.Date)" DisplayFormat="{0:d}" />
             <GridColumn Field="@nameof(Transaction.Amount)" DisplayFormat="{0:c2}" TextAlign="@ColumnTextAlign.Right" HeaderClass="right-header" />
             <GridColumn Field="@nameof(Transaction.Merchant)"

sample-applications/blazor-financial-dashboard/BlazorFinancialDashboard/wwwroot/app.css

@@ -225,4 +225,11 @@ div.appbar-bottom.narrow {
 
 .no-content-padding .k-tabstrip-content {
     padding-inline: 0;
+}
+
+/* Settings */
+
+div.centered-calendar {
+    margin: 0 auto;
+    width: 100%;
 }