chore: render button with svg icon telerik/kendo#19541

Author: Dimitar-Goshev

KendoUIBootstrapIntegration/Content/styles.css

@@ -158,10 +158,6 @@ header {
     color: #fff;
 }
 
-    #configure .k-i-menu {
-        font-size: 18px !important;
-    }
-
 #demo {
     padding-top: 46px;
 }

KendoUIBootstrapIntegration/Views/Shared/_Layout.cshtml

@@ -18,13 +18,13 @@
     <header>
         <div class="container-sm">
             <div class="row">
-                
                 <h1 class="col-md-4 header-description">Telerik UI for ASP.NET MVC<sup>&reg;</sup> &hearts; Bootstrap</h1>
-                
-                <button id="configure" class="d-md-none">
-                    <span class="k-icon k-i-menu"></span>
-                </button>
-
+                @(Html.Kendo().Button()
+                    .Name("configure")
+                    .Icon("menu")
+                    .Size(ComponentSize.Large)
+                    .HtmlAttributes(new { @class="d-md-none" })
+                )
                 <div id="configurator-wrap" class="col-md-8 d-none d-md-block">
                     <div id="configurator" class="row">
                         <label class="col-md-4 col-sm-12 col-xs-12">
@@ -119,9 +119,7 @@
     </header>
     @RenderBody()
     <script>
-
         $(document).ready(function () {
-
             changeFontSize();
 
             $("#theme-list, #swatch-list, #font-size-list").addClass("ra-list");