Search results

Change Size

The different Switch sizes available are default and small. To reduce the size of default Switch to small, set the cssClass property to e-small.

tagHelper
default.cs
@section ControlsSection {
    <div id='container'>
        <table class='size'>
            <tr>
                <td class='lSize'>Small</td>
                <td>
                    <ejs-switch id="switch1" cssClass="e-small"></ejs-switch>
                </td>
            </tr>
            <tr>
                <td class='lSize'>Default</td>
                <td>
                   <ejs-switch id="switch2"></ejs-switch>
                </td>
            </tr>   
        </table>
    </div>
}

<style>
#container {
    visibility: hidden;
    margin-left: 10px;
}

#loader {
  color: #008cff;
  height: 40px;
  width: 30%;
  position: absolute;
  top: 45%;
  left: 45%;
}

.size tr td {
  padding: 10px;
}

.size .lSize {
  font-family: "Roboto", "Segoe UI", "GeezaPro", "DejaVu Serif", "sans-serif";
  font-size: 13px;
  cursor: pointer;
  user-select: none;
}
</style>
public IActionResult Default()
    {
            return View();
    }