portal.teladin.com
Open in
urlscan Pro
52.231.12.202
Public Scan
URL:
https://portal.teladin.com/
Submission: On December 12 via manual from JP — Scanned from JP
Submission: On December 12 via manual from JP — Scanned from JP
Form analysis 2 forms found in the DOM
<form novalidate="" fxlayout="column" fxlayoutalign="space-between" class="pr-8 ng-tns-c180-10 ng-untouched ng-pristine ng-invalid"
style="flex-direction: column; box-sizing: border-box; display: flex; place-content: stretch space-between; align-items: stretch;"><mat-form-field appearance="outline"
class="mat-form-field ng-tns-c180-10 ng-tns-c93-11 mat-primary mat-form-field-type-mat-input mat-form-field-appearance-outline mat-form-field-can-float ng-untouched ng-pristine ng-invalid">
<div class="mat-form-field-wrapper ng-tns-c93-11">
<div class="mat-form-field-flex ng-tns-c93-11">
<div class="mat-form-field-outline ng-tns-c93-11 ng-star-inserted">
<div class="mat-form-field-outline-start ng-tns-c93-11"></div>
<div class="mat-form-field-outline-gap ng-tns-c93-11"></div>
<div class="mat-form-field-outline-end ng-tns-c93-11"></div>
</div>
<div class="mat-form-field-outline mat-form-field-outline-thick ng-tns-c93-11 ng-star-inserted">
<div class="mat-form-field-outline-start ng-tns-c93-11"></div>
<div class="mat-form-field-outline-gap ng-tns-c93-11"></div>
<div class="mat-form-field-outline-end ng-tns-c93-11"></div>
</div><!----><!----><!---->
<div class="mat-form-field-infix ng-tns-c93-11"><input matinput="" formcontrolname="userid" class="mat-input-element mat-form-field-autofill-control ng-tns-c93-11 cdk-text-field-autofill-monitored ng-untouched ng-pristine ng-invalid"
id="mat-input-0" aria-invalid="false" aria-required="false"><span class="mat-form-field-label-wrapper ng-tns-c93-11"><!----></span></div><!---->
</div><!---->
<div class="mat-form-field-subscript-wrapper ng-tns-c93-11"><!---->
<div class="mat-form-field-hint-wrapper ng-tns-c93-11 ng-trigger ng-trigger-transitionMessages ng-star-inserted" style="opacity: 1; transform: translateY(0%);"><!---->
<div class="mat-form-field-hint-spacer ng-tns-c93-11"></div>
</div><!---->
</div>
</div>
</mat-form-field><mat-form-field appearance="outline" class="mat-form-field ng-tns-c180-10 ng-tns-c93-12 mat-primary mat-form-field-type-mat-input mat-form-field-appearance-outline mat-form-field-can-float ng-untouched ng-pristine ng-invalid">
<div class="mat-form-field-wrapper ng-tns-c93-12">
<div class="mat-form-field-flex ng-tns-c93-12">
<div class="mat-form-field-outline ng-tns-c93-12 ng-star-inserted">
<div class="mat-form-field-outline-start ng-tns-c93-12"></div>
<div class="mat-form-field-outline-gap ng-tns-c93-12"></div>
<div class="mat-form-field-outline-end ng-tns-c93-12"></div>
</div>
<div class="mat-form-field-outline mat-form-field-outline-thick ng-tns-c93-12 ng-star-inserted">
<div class="mat-form-field-outline-start ng-tns-c93-12"></div>
<div class="mat-form-field-outline-gap ng-tns-c93-12"></div>
<div class="mat-form-field-outline-end ng-tns-c93-12"></div>
</div><!----><!----><!---->
<div class="mat-form-field-infix ng-tns-c93-12"><input matinput="" type="password" formcontrolname="password"
class="mat-input-element mat-form-field-autofill-control ng-tns-c93-12 cdk-text-field-autofill-monitored ng-untouched ng-pristine ng-invalid" id="mat-input-1" aria-invalid="false" aria-required="false"><span
class="mat-form-field-label-wrapper ng-tns-c93-12"><!----></span></div><!---->
</div><!---->
<div class="mat-form-field-subscript-wrapper ng-tns-c93-12"><!---->
<div class="mat-form-field-hint-wrapper ng-tns-c93-12 ng-trigger ng-trigger-transitionMessages ng-star-inserted" style="opacity: 1; transform: translateY(0%);"><!---->
<div class="mat-form-field-hint-spacer ng-tns-c93-12"></div>
</div><!---->
</div>
</div>
</mat-form-field></form><form novalidate="" class="ng-tns-c164-1 ng-untouched ng-pristine ng-valid">
<div class="group ng-tns-c164-1">
<h2 class="ng-tns-c164-1">Color themes</h2><mat-radio-group role="radiogroup" fxlayout="column" fxlayoutalign="start start" formcontrolname="colorTheme" class="mat-radio-group ng-tns-c164-1 ng-untouched ng-pristine ng-valid"
style="flex-direction: column; box-sizing: border-box; display: flex; place-content: flex-start; align-items: flex-start;"><mat-radio-button value="theme-default" class="mat-radio-button mb-12 ng-tns-c164-1 mat-radio-checked mat-accent"
tabindex="-1" id="mat-radio-2"><label class="mat-radio-label" for="mat-radio-2-input">
<div class="mat-radio-container">
<div class="mat-radio-outer-circle"></div>
<div class="mat-radio-inner-circle"></div>
<div mat-ripple="" class="mat-ripple mat-radio-ripple">
<div class="mat-ripple-element mat-radio-persistent-ripple"></div>
</div><input type="radio" class="mat-radio-input cdk-visually-hidden" id="mat-radio-2-input" tabindex="0" name="mat-radio-group-0" value="theme-default">
</div>
<div class="mat-radio-label-content"><span style="display: none;"> </span>Default Light</div>
</label></mat-radio-button><mat-radio-button value="theme-yellow-light" class="mat-radio-button mb-12 ng-tns-c164-1 mat-accent" tabindex="-1" id="mat-radio-3"><label class="mat-radio-label" for="mat-radio-3-input">
<div class="mat-radio-container">
<div class="mat-radio-outer-circle"></div>
<div class="mat-radio-inner-circle"></div>
<div mat-ripple="" class="mat-ripple mat-radio-ripple">
<div class="mat-ripple-element mat-radio-persistent-ripple"></div>
</div><input type="radio" class="mat-radio-input cdk-visually-hidden" id="mat-radio-3-input" tabindex="0" name="mat-radio-group-0" value="theme-yellow-light">
</div>
<div class="mat-radio-label-content"><span style="display: none;"> </span>Yellow Light</div>
</label></mat-radio-button><mat-radio-button value="theme-blue-gray-dark" class="mat-radio-button mb-12 ng-tns-c164-1 mat-accent" tabindex="-1" id="mat-radio-4"><label class="mat-radio-label" for="mat-radio-4-input">
<div class="mat-radio-container">
<div class="mat-radio-outer-circle"></div>
<div class="mat-radio-inner-circle"></div>
<div mat-ripple="" class="mat-ripple mat-radio-ripple">
<div class="mat-ripple-element mat-radio-persistent-ripple"></div>
</div><input type="radio" class="mat-radio-input cdk-visually-hidden" id="mat-radio-4-input" tabindex="0" name="mat-radio-group-0" value="theme-blue-gray-dark">
</div>
<div class="mat-radio-label-content"><span style="display: none;"> </span>Blue-Gray Dark</div>
</label></mat-radio-button><mat-radio-button value="theme-pink-dark" class="mat-radio-button mb-12 ng-tns-c164-1 mat-accent" tabindex="-1" id="mat-radio-5"><label class="mat-radio-label" for="mat-radio-5-input">
<div class="mat-radio-container">
<div class="mat-radio-outer-circle"></div>
<div class="mat-radio-inner-circle"></div>
<div mat-ripple="" class="mat-ripple mat-radio-ripple">
<div class="mat-ripple-element mat-radio-persistent-ripple"></div>
</div><input type="radio" class="mat-radio-input cdk-visually-hidden" id="mat-radio-5-input" tabindex="0" name="mat-radio-group-0" value="theme-pink-dark">
</div>
<div class="mat-radio-label-content"><span style="display: none;"> </span>Pink Dark</div>
</label></mat-radio-button></mat-radio-group>
</div>
<div formgroupname="layout" class="group ng-tns-c164-1 ng-untouched ng-pristine ng-valid">
<h2 class="ng-tns-c164-1">Layout Styles</h2><mat-radio-group role="radiogroup" fxlayout="column" fxlayoutalign="start start" formcontrolname="style" class="mat-radio-group ng-tns-c164-1 ng-untouched ng-pristine ng-valid"
style="flex-direction: column; box-sizing: border-box; display: flex; place-content: flex-start; align-items: flex-start;"><mat-radio-button value="vertical-layout-1" class="mat-radio-button mb-12 ng-tns-c164-1 mat-radio-checked mat-accent"
tabindex="-1" id="mat-radio-7"><label class="mat-radio-label" for="mat-radio-7-input">
<div class="mat-radio-container">
<div class="mat-radio-outer-circle"></div>
<div class="mat-radio-inner-circle"></div>
<div mat-ripple="" class="mat-ripple mat-radio-ripple">
<div class="mat-ripple-element mat-radio-persistent-ripple"></div>
</div><input type="radio" class="mat-radio-input cdk-visually-hidden" id="mat-radio-7-input" tabindex="0" name="mat-radio-group-5" value="vertical-layout-1">
</div>
<div class="mat-radio-label-content"><span style="display: none;"> </span> Vertical Layout #1 </div>
</label></mat-radio-button><mat-radio-button value="vertical-layout-2" class="mat-radio-button mb-12 ng-tns-c164-1 mat-accent" tabindex="-1" id="mat-radio-8"><label class="mat-radio-label" for="mat-radio-8-input">
<div class="mat-radio-container">
<div class="mat-radio-outer-circle"></div>
<div class="mat-radio-inner-circle"></div>
<div mat-ripple="" class="mat-ripple mat-radio-ripple">
<div class="mat-ripple-element mat-radio-persistent-ripple"></div>
</div><input type="radio" class="mat-radio-input cdk-visually-hidden" id="mat-radio-8-input" tabindex="0" name="mat-radio-group-5" value="vertical-layout-2">
</div>
<div class="mat-radio-label-content"><span style="display: none;"> </span> Vertical Layout #2 </div>
</label></mat-radio-button><mat-radio-button value="vertical-layout-3" class="mat-radio-button mb-12 ng-tns-c164-1 mat-accent" tabindex="-1" id="mat-radio-9"><label class="mat-radio-label" for="mat-radio-9-input">
<div class="mat-radio-container">
<div class="mat-radio-outer-circle"></div>
<div class="mat-radio-inner-circle"></div>
<div mat-ripple="" class="mat-ripple mat-radio-ripple">
<div class="mat-ripple-element mat-radio-persistent-ripple"></div>
</div><input type="radio" class="mat-radio-input cdk-visually-hidden" id="mat-radio-9-input" tabindex="0" name="mat-radio-group-5" value="vertical-layout-3">
</div>
<div class="mat-radio-label-content"><span style="display: none;"> </span> Vertical Layout #3 </div>
</label></mat-radio-button><mat-radio-button value="horizontal-layout-1" class="mat-radio-button mb-12 ng-tns-c164-1 mat-accent" tabindex="-1" id="mat-radio-10"><label class="mat-radio-label" for="mat-radio-10-input">
<div class="mat-radio-container">
<div class="mat-radio-outer-circle"></div>
<div class="mat-radio-inner-circle"></div>
<div mat-ripple="" class="mat-ripple mat-radio-ripple">
<div class="mat-ripple-element mat-radio-persistent-ripple"></div>
</div><input type="radio" class="mat-radio-input cdk-visually-hidden" id="mat-radio-10-input" tabindex="0" name="mat-radio-group-5" value="horizontal-layout-1">
</div>
<div class="mat-radio-label-content"><span style="display: none;"> </span> Horizontal Layout #1 </div>
</label></mat-radio-button></mat-radio-group>
<div class="group mt-32 ng-tns-c164-1 ng-star-inserted">
<h2 class="ng-tns-c164-1">Layout Width</h2><mat-radio-group role="radiogroup" fxlayout="column" fxlayoutalign="start start" formcontrolname="width" class="mat-radio-group ng-tns-c164-1 ng-untouched ng-pristine ng-valid"
style="flex-direction: column; box-sizing: border-box; display: flex; place-content: flex-start; align-items: flex-start;"><mat-radio-button value="fullwidth" class="mat-radio-button mb-12 ng-tns-c164-1 mat-radio-checked mat-accent"
tabindex="-1" id="mat-radio-12"><label class="mat-radio-label" for="mat-radio-12-input">
<div class="mat-radio-container">
<div class="mat-radio-outer-circle"></div>
<div class="mat-radio-inner-circle"></div>
<div mat-ripple="" class="mat-ripple mat-radio-ripple">
<div class="mat-ripple-element mat-radio-persistent-ripple"></div>
</div><input type="radio" class="mat-radio-input cdk-visually-hidden" id="mat-radio-12-input" tabindex="0" name="mat-radio-group-10" value="fullwidth">
</div>
<div class="mat-radio-label-content"><span style="display: none;"> </span>Fullwidth</div>
</label></mat-radio-button><mat-radio-button value="boxed" class="mat-radio-button mb-12 ng-tns-c164-1 mat-accent" tabindex="-1" id="mat-radio-13"><label class="mat-radio-label" for="mat-radio-13-input">
<div class="mat-radio-container">
<div class="mat-radio-outer-circle"></div>
<div class="mat-radio-inner-circle"></div>
<div mat-ripple="" class="mat-ripple mat-radio-ripple">
<div class="mat-ripple-element mat-radio-persistent-ripple"></div>
</div><input type="radio" class="mat-radio-input cdk-visually-hidden" id="mat-radio-13-input" tabindex="0" name="mat-radio-group-10" value="boxed">
</div>
<div class="mat-radio-label-content"><span style="display: none;"> </span>Boxed</div>
</label></mat-radio-button></mat-radio-group>
</div>
<div formgroupname="navbar" class="group ng-tns-c164-1 ng-untouched ng-pristine ng-valid ng-star-inserted">
<h2 class="ng-tns-c164-1">Navbar</h2><mat-slide-toggle formcontrolname="hidden" class="mat-slide-toggle ng-tns-c164-1 mat-accent ng-untouched ng-pristine ng-valid mat-checked" id="mat-slide-toggle-5" tabindex="-1"><label
class="mat-slide-toggle-label" for="mat-slide-toggle-5-input">
<div class="mat-slide-toggle-bar"><input type="checkbox" role="switch" class="mat-slide-toggle-input cdk-visually-hidden" id="mat-slide-toggle-5-input" tabindex="0" aria-checked="true">
<div class="mat-slide-toggle-thumb-container">
<div class="mat-slide-toggle-thumb"></div>
<div mat-ripple="" class="mat-ripple mat-slide-toggle-ripple">
<div class="mat-ripple-element mat-slide-toggle-persistent-ripple"></div>
</div>
</div>
</div><span class="mat-slide-toggle-content"><span style="display: none;"> </span> Hide </span>
</label></mat-slide-toggle><mat-slide-toggle formcontrolname="folded" class="mat-slide-toggle mt-24 ng-tns-c164-1 mat-accent ng-untouched ng-pristine ng-valid" id="mat-slide-toggle-6" tabindex="-1"><label class="mat-slide-toggle-label"
for="mat-slide-toggle-6-input">
<div class="mat-slide-toggle-bar"><input type="checkbox" role="switch" class="mat-slide-toggle-input cdk-visually-hidden" id="mat-slide-toggle-6-input" tabindex="0" aria-checked="false">
<div class="mat-slide-toggle-thumb-container">
<div class="mat-slide-toggle-thumb"></div>
<div mat-ripple="" class="mat-ripple mat-slide-toggle-ripple">
<div class="mat-ripple-element mat-slide-toggle-persistent-ripple"></div>
</div>
</div>
</div><span class="mat-slide-toggle-content"><span style="display: none;"> </span> Folded </span>
</label></mat-slide-toggle>
<h3 class="mt-24 ng-tns-c164-1">Position:</h3><mat-radio-group role="radiogroup" fxlayout="column" fxlayoutalign="start start" formcontrolname="position" class="mat-radio-group ng-tns-c164-1 ng-untouched ng-pristine ng-valid"
style="flex-direction: column; box-sizing: border-box; display: flex; place-content: flex-start; align-items: flex-start;"><mat-radio-button value="left" class="mat-radio-button mb-16 ng-tns-c164-1 mat-radio-checked mat-accent" tabindex="-1"
id="mat-radio-15"><label class="mat-radio-label" for="mat-radio-15-input">
<div class="mat-radio-container">
<div class="mat-radio-outer-circle"></div>
<div class="mat-radio-inner-circle"></div>
<div mat-ripple="" class="mat-ripple mat-radio-ripple">
<div class="mat-ripple-element mat-radio-persistent-ripple"></div>
</div><input type="radio" class="mat-radio-input cdk-visually-hidden" id="mat-radio-15-input" tabindex="0" name="mat-radio-group-13" value="left">
</div>
<div class="mat-radio-label-content"><span style="display: none;"> </span>Left</div>
</label></mat-radio-button><mat-radio-button value="right" class="mat-radio-button mb-16 ng-tns-c164-1 mat-accent" tabindex="-1" id="mat-radio-16"><label class="mat-radio-label" for="mat-radio-16-input">
<div class="mat-radio-container">
<div class="mat-radio-outer-circle"></div>
<div class="mat-radio-inner-circle"></div>
<div mat-ripple="" class="mat-ripple mat-radio-ripple">
<div class="mat-ripple-element mat-radio-persistent-ripple"></div>
</div><input type="radio" class="mat-radio-input cdk-visually-hidden" id="mat-radio-16-input" tabindex="0" name="mat-radio-group-13" value="right">
</div>
<div class="mat-radio-label-content"><span style="display: none;"> </span>Right</div>
</label></mat-radio-button></mat-radio-group>
<h3 class="mt-8 ng-tns-c164-1">Variant:</h3><mat-radio-group role="radiogroup" fxlayout="column" fxlayoutalign="start start" formcontrolname="variant" class="mat-radio-group ng-tns-c164-1 ng-untouched ng-pristine ng-valid"
style="flex-direction: column; box-sizing: border-box; display: flex; place-content: flex-start; align-items: flex-start;"><mat-radio-button value="vertical-style-1" class="mat-radio-button mb-16 ng-tns-c164-1 mat-radio-checked mat-accent"
tabindex="-1" id="mat-radio-18"><label class="mat-radio-label" for="mat-radio-18-input">
<div class="mat-radio-container">
<div class="mat-radio-outer-circle"></div>
<div class="mat-radio-inner-circle"></div>
<div mat-ripple="" class="mat-ripple mat-radio-ripple">
<div class="mat-ripple-element mat-radio-persistent-ripple"></div>
</div><input type="radio" class="mat-radio-input cdk-visually-hidden" id="mat-radio-18-input" tabindex="0" name="mat-radio-group-16" value="vertical-style-1">
</div>
<div class="mat-radio-label-content"><span style="display: none;"> </span>Style 1</div>
</label></mat-radio-button><mat-radio-button value="vertical-style-2" class="mat-radio-button mb-16 ng-tns-c164-1 mat-accent" tabindex="-1" id="mat-radio-19"><label class="mat-radio-label" for="mat-radio-19-input">
<div class="mat-radio-container">
<div class="mat-radio-outer-circle"></div>
<div class="mat-radio-inner-circle"></div>
<div mat-ripple="" class="mat-ripple mat-radio-ripple">
<div class="mat-ripple-element mat-radio-persistent-ripple"></div>
</div><input type="radio" class="mat-radio-input cdk-visually-hidden" id="mat-radio-19-input" tabindex="0" name="mat-radio-group-16" value="vertical-style-2">
</div>
<div class="mat-radio-label-content"><span style="display: none;"> </span>Style 2</div>
</label></mat-radio-button></mat-radio-group>
<h3 class="mt-16 mb-8 ng-tns-c164-1">Primary background:</h3><fuse-material-color-picker formcontrolname="primaryBackground" class="mb-16 ng-tns-c164-1 ng-tns-c163-2 ng-untouched ng-pristine ng-valid"><button aria-haspopup="true"
mat-icon-button="" class="mat-menu-trigger mat-elevation-z1 ng-tns-c163-2 mat-icon-button mat-button-base undefined-500"><span class="mat-button-wrapper"><mat-icon role="img" class="mat-icon notranslate material-icons mat-icon-no-color"
aria-hidden="true">palette</mat-icon></span>
<div matripple="" class="mat-ripple mat-button-ripple mat-button-ripple-round"></div>
<div class="mat-button-focus-overlay"></div>
</button><!----><mat-menu class=""><!----></mat-menu></fuse-material-color-picker>
<h3 class="mt-16 mb-8 ng-tns-c164-1">Secondary background:</h3><fuse-material-color-picker formcontrolname="secondaryBackground" class="mb-16 ng-tns-c164-1 ng-tns-c163-3 ng-untouched ng-pristine ng-valid"><button aria-haspopup="true"
mat-icon-button="" class="mat-menu-trigger mat-elevation-z1 ng-tns-c163-3 mat-icon-button mat-button-base undefined-500"><span class="mat-button-wrapper"><mat-icon role="img" class="mat-icon notranslate material-icons mat-icon-no-color"
aria-hidden="true">palette</mat-icon></span>
<div matripple="" class="mat-ripple mat-button-ripple mat-button-ripple-round"></div>
<div class="mat-button-focus-overlay"></div>
</button><!----><mat-menu class=""><!----></mat-menu></fuse-material-color-picker>
</div>
<div formgroupname="toolbar" class="group ng-tns-c164-1 ng-untouched ng-pristine ng-valid ng-star-inserted">
<h2 class="ng-tns-c164-1">Toolbar</h2><mat-slide-toggle formcontrolname="hidden" class="mat-slide-toggle ng-tns-c164-1 mat-accent ng-untouched ng-pristine ng-valid mat-checked" id="mat-slide-toggle-7" tabindex="-1"><label
class="mat-slide-toggle-label" for="mat-slide-toggle-7-input">
<div class="mat-slide-toggle-bar"><input type="checkbox" role="switch" class="mat-slide-toggle-input cdk-visually-hidden" id="mat-slide-toggle-7-input" tabindex="0" aria-checked="true">
<div class="mat-slide-toggle-thumb-container">
<div class="mat-slide-toggle-thumb"></div>
<div mat-ripple="" class="mat-ripple mat-slide-toggle-ripple">
<div class="mat-ripple-element mat-slide-toggle-persistent-ripple"></div>
</div>
</div>
</div><span class="mat-slide-toggle-content"><span style="display: none;"> </span> Hide </span>
</label></mat-slide-toggle>
<h3 class="mt-24 ng-tns-c164-1">Position:</h3><mat-radio-group role="radiogroup" fxlayout="column" fxlayoutalign="start start" formcontrolname="position" class="mat-radio-group ng-tns-c164-1 ng-untouched ng-pristine ng-valid"
style="flex-direction: column; box-sizing: border-box; display: flex; place-content: flex-start; align-items: flex-start;"><mat-radio-button value="above" class="mat-radio-button mb-12 ng-tns-c164-1 mat-accent" tabindex="-1"
id="mat-radio-21"><label class="mat-radio-label" for="mat-radio-21-input">
<div class="mat-radio-container">
<div class="mat-radio-outer-circle"></div>
<div class="mat-radio-inner-circle"></div>
<div mat-ripple="" class="mat-ripple mat-radio-ripple">
<div class="mat-ripple-element mat-radio-persistent-ripple"></div>
</div><input type="radio" class="mat-radio-input cdk-visually-hidden" id="mat-radio-21-input" tabindex="0" name="mat-radio-group-19" value="above">
</div>
<div class="mat-radio-label-content"><span style="display: none;"> </span>Above</div>
</label></mat-radio-button><mat-radio-button value="below-static" class="mat-radio-button mb-12 ng-tns-c164-1 mat-radio-checked mat-accent" tabindex="-1" id="mat-radio-22"><label class="mat-radio-label" for="mat-radio-22-input">
<div class="mat-radio-container">
<div class="mat-radio-outer-circle"></div>
<div class="mat-radio-inner-circle"></div>
<div mat-ripple="" class="mat-ripple mat-radio-ripple">
<div class="mat-ripple-element mat-radio-persistent-ripple"></div>
</div><input type="radio" class="mat-radio-input cdk-visually-hidden" id="mat-radio-22-input" tabindex="0" name="mat-radio-group-19" value="below-static">
</div>
<div class="mat-radio-label-content"><span style="display: none;"> </span>Below Static</div>
</label></mat-radio-button><mat-radio-button value="below-fixed" class="mat-radio-button mb-12 ng-tns-c164-1 mat-accent" tabindex="-1" id="mat-radio-23"><label class="mat-radio-label" for="mat-radio-23-input">
<div class="mat-radio-container">
<div class="mat-radio-outer-circle"></div>
<div class="mat-radio-inner-circle"></div>
<div mat-ripple="" class="mat-ripple mat-radio-ripple">
<div class="mat-ripple-element mat-radio-persistent-ripple"></div>
</div><input type="radio" class="mat-radio-input cdk-visually-hidden" id="mat-radio-23-input" tabindex="0" name="mat-radio-group-19" value="below-fixed">
</div>
<div class="mat-radio-label-content"><span style="display: none;"> </span>Below Fixed</div>
</label></mat-radio-button></mat-radio-group><mat-checkbox formcontrolname="customBackgroundColor" class="mat-checkbox mt-24 ng-tns-c164-1 mat-accent ng-untouched ng-pristine ng-valid" id="mat-checkbox-1"><label class="mat-checkbox-layout"
for="mat-checkbox-1-input">
<div class="mat-checkbox-inner-container"><input type="checkbox" class="mat-checkbox-input cdk-visually-hidden" id="mat-checkbox-1-input" tabindex="0" aria-checked="false">
<div matripple="" class="mat-ripple mat-checkbox-ripple">
<div class="mat-ripple-element mat-checkbox-persistent-ripple"></div>
</div>
<div class="mat-checkbox-frame"></div>
<div class="mat-checkbox-background"><svg version="1.1" focusable="false" viewBox="0 0 24 24" xml:space="preserve" class="mat-checkbox-checkmark">
<path fill="none" stroke="white" d="M4.1,12.7 9,17.6 20.3,6.3" class="mat-checkbox-checkmark-path"></path>
</svg>
<div class="mat-checkbox-mixedmark"></div>
</div>
</div><span class="mat-checkbox-label"><span style="display: none;"> </span> Use custom background color </span>
</label></mat-checkbox>
<h3 class="mt-24 mb-8 ng-tns-c164-1">Background color:</h3><fuse-material-color-picker formcontrolname="background" class="mb-16 ng-tns-c164-1 ng-tns-c163-4 ng-untouched ng-pristine ng-valid"><button aria-haspopup="true" mat-icon-button=""
class="mat-menu-trigger mat-elevation-z1 ng-tns-c163-4 mat-icon-button mat-button-base fuse-white-500"><span class="mat-button-wrapper"><mat-icon role="img" class="mat-icon notranslate material-icons mat-icon-no-color"
aria-hidden="true">palette</mat-icon></span>
<div matripple="" class="mat-ripple mat-button-ripple mat-button-ripple-round"></div>
<div class="mat-button-focus-overlay"></div>
</button><!----><mat-menu class=""><!----></mat-menu></fuse-material-color-picker>
</div>
<div formgroupname="footer" class="group ng-tns-c164-1 ng-untouched ng-pristine ng-valid ng-star-inserted">
<h2 class="ng-tns-c164-1">Footer</h2><mat-slide-toggle formcontrolname="hidden" class="mat-slide-toggle ng-tns-c164-1 mat-accent mat-checked ng-untouched ng-pristine ng-valid" id="mat-slide-toggle-8" tabindex="-1"><label
class="mat-slide-toggle-label" for="mat-slide-toggle-8-input">
<div class="mat-slide-toggle-bar"><input type="checkbox" role="switch" class="mat-slide-toggle-input cdk-visually-hidden" id="mat-slide-toggle-8-input" tabindex="0" aria-checked="true">
<div class="mat-slide-toggle-thumb-container">
<div class="mat-slide-toggle-thumb"></div>
<div mat-ripple="" class="mat-ripple mat-slide-toggle-ripple">
<div class="mat-ripple-element mat-slide-toggle-persistent-ripple"></div>
</div>
</div>
</div><span class="mat-slide-toggle-content"><span style="display: none;"> </span> Hide </span>
</label></mat-slide-toggle>
<h3 class="mt-24 ng-tns-c164-1">Position:</h3><mat-radio-group role="radiogroup" fxlayout="column" fxlayoutalign="start start" formcontrolname="position" class="mat-radio-group ng-tns-c164-1 ng-untouched ng-pristine ng-valid"
style="flex-direction: column; box-sizing: border-box; display: flex; place-content: flex-start; align-items: flex-start;"><mat-radio-button value="above" class="mat-radio-button mb-12 ng-tns-c164-1 mat-accent" tabindex="-1"
id="mat-radio-25"><label class="mat-radio-label" for="mat-radio-25-input">
<div class="mat-radio-container">
<div class="mat-radio-outer-circle"></div>
<div class="mat-radio-inner-circle"></div>
<div mat-ripple="" class="mat-ripple mat-radio-ripple">
<div class="mat-ripple-element mat-radio-persistent-ripple"></div>
</div><input type="radio" class="mat-radio-input cdk-visually-hidden" id="mat-radio-25-input" tabindex="0" name="mat-radio-group-23" value="above">
</div>
<div class="mat-radio-label-content"><span style="display: none;"> </span>Above</div>
</label></mat-radio-button><mat-radio-button value="below-static" class="mat-radio-button mb-12 ng-tns-c164-1 mat-accent" tabindex="-1" id="mat-radio-26"><label class="mat-radio-label" for="mat-radio-26-input">
<div class="mat-radio-container">
<div class="mat-radio-outer-circle"></div>
<div class="mat-radio-inner-circle"></div>
<div mat-ripple="" class="mat-ripple mat-radio-ripple">
<div class="mat-ripple-element mat-radio-persistent-ripple"></div>
</div><input type="radio" class="mat-radio-input cdk-visually-hidden" id="mat-radio-26-input" tabindex="0" name="mat-radio-group-23" value="below-static">
</div>
<div class="mat-radio-label-content"><span style="display: none;"> </span>Below Static</div>
</label></mat-radio-button><mat-radio-button value="below-fixed" class="mat-radio-button mb-12 ng-tns-c164-1 mat-radio-checked mat-accent" tabindex="-1" id="mat-radio-27"><label class="mat-radio-label" for="mat-radio-27-input">
<div class="mat-radio-container">
<div class="mat-radio-outer-circle"></div>
<div class="mat-radio-inner-circle"></div>
<div mat-ripple="" class="mat-ripple mat-radio-ripple">
<div class="mat-ripple-element mat-radio-persistent-ripple"></div>
</div><input type="radio" class="mat-radio-input cdk-visually-hidden" id="mat-radio-27-input" tabindex="0" name="mat-radio-group-23" value="below-fixed">
</div>
<div class="mat-radio-label-content"><span style="display: none;"> </span>Below Fixed</div>
</label></mat-radio-button></mat-radio-group><mat-checkbox formcontrolname="customBackgroundColor" class="mat-checkbox mt-24 ng-tns-c164-1 mat-accent mat-checkbox-checked ng-untouched ng-pristine ng-valid" id="mat-checkbox-2"><label
class="mat-checkbox-layout" for="mat-checkbox-2-input">
<div class="mat-checkbox-inner-container"><input type="checkbox" class="mat-checkbox-input cdk-visually-hidden" id="mat-checkbox-2-input" tabindex="0" aria-checked="true">
<div matripple="" class="mat-ripple mat-checkbox-ripple">
<div class="mat-ripple-element mat-checkbox-persistent-ripple"></div>
</div>
<div class="mat-checkbox-frame"></div>
<div class="mat-checkbox-background"><svg version="1.1" focusable="false" viewBox="0 0 24 24" xml:space="preserve" class="mat-checkbox-checkmark">
<path fill="none" stroke="white" d="M4.1,12.7 9,17.6 20.3,6.3" class="mat-checkbox-checkmark-path"></path>
</svg>
<div class="mat-checkbox-mixedmark"></div>
</div>
</div><span class="mat-checkbox-label"><span style="display: none;"> </span> Use custom background color </span>
</label></mat-checkbox>
<h3 class="mt-24 mb-8 ng-tns-c164-1">Color:</h3><fuse-material-color-picker formcontrolname="background" class="mb-16 ng-tns-c164-1 ng-tns-c163-5 ng-untouched ng-pristine ng-valid"><button aria-haspopup="true" mat-icon-button=""
class="mat-menu-trigger mat-elevation-z1 ng-tns-c163-5 mat-icon-button mat-button-base fuse-navy-300"><span class="mat-button-wrapper"><mat-icon role="img" class="mat-icon notranslate material-icons mat-icon-no-color"
aria-hidden="true">palette</mat-icon></span>
<div matripple="" class="mat-ripple mat-button-ripple mat-button-ripple-round"></div>
<div class="mat-button-focus-overlay"></div>
</button><!----><mat-menu class=""><!----></mat-menu></fuse-material-color-picker>
</div>
<div formgroupname="sidepanel" class="group ng-tns-c164-1 ng-untouched ng-pristine ng-valid ng-star-inserted">
<h2 class="ng-tns-c164-1">Side Panel</h2><mat-slide-toggle formcontrolname="hidden" class="mat-slide-toggle ng-tns-c164-1 mat-accent ng-untouched ng-pristine ng-valid mat-checked" id="mat-slide-toggle-9" tabindex="-1"><label
class="mat-slide-toggle-label" for="mat-slide-toggle-9-input">
<div class="mat-slide-toggle-bar"><input type="checkbox" role="switch" class="mat-slide-toggle-input cdk-visually-hidden" id="mat-slide-toggle-9-input" tabindex="0" aria-checked="true">
<div class="mat-slide-toggle-thumb-container">
<div class="mat-slide-toggle-thumb"></div>
<div mat-ripple="" class="mat-ripple mat-slide-toggle-ripple">
<div class="mat-ripple-element mat-slide-toggle-persistent-ripple"></div>
</div>
</div>
</div><span class="mat-slide-toggle-content"><span style="display: none;"> </span> Hide </span>
</label></mat-slide-toggle>
<h3 class="mt-24 ng-tns-c164-1">Position:</h3><mat-radio-group role="radiogroup" fxlayout="column" fxlayoutalign="start start" formcontrolname="position" class="mat-radio-group ng-tns-c164-1 ng-untouched ng-pristine ng-valid"
style="flex-direction: column; box-sizing: border-box; display: flex; place-content: flex-start; align-items: flex-start;"><mat-radio-button value="left" class="mat-radio-button mb-12 ng-tns-c164-1 mat-accent" tabindex="-1"
id="mat-radio-29"><label class="mat-radio-label" for="mat-radio-29-input">
<div class="mat-radio-container">
<div class="mat-radio-outer-circle"></div>
<div class="mat-radio-inner-circle"></div>
<div mat-ripple="" class="mat-ripple mat-radio-ripple">
<div class="mat-ripple-element mat-radio-persistent-ripple"></div>
</div><input type="radio" class="mat-radio-input cdk-visually-hidden" id="mat-radio-29-input" tabindex="0" name="mat-radio-group-27" value="left">
</div>
<div class="mat-radio-label-content"><span style="display: none;"> </span>Left</div>
</label></mat-radio-button><mat-radio-button value="right" class="mat-radio-button mb-12 ng-tns-c164-1 mat-radio-checked mat-accent" tabindex="-1" id="mat-radio-30"><label class="mat-radio-label" for="mat-radio-30-input">
<div class="mat-radio-container">
<div class="mat-radio-outer-circle"></div>
<div class="mat-radio-inner-circle"></div>
<div mat-ripple="" class="mat-ripple mat-radio-ripple">
<div class="mat-ripple-element mat-radio-persistent-ripple"></div>
</div><input type="radio" class="mat-radio-input cdk-visually-hidden" id="mat-radio-30-input" tabindex="0" name="mat-radio-group-27" value="right">
</div>
<div class="mat-radio-label-content"><span style="display: none;"> </span>Right</div>
</label></mat-radio-button></mat-radio-group>
</div><!----><!----><!----><!----><!----><!---->
</div>
<div class="group ng-tns-c164-1">
<h2 class="ng-tns-c164-1">Custom scrollbars</h2><mat-slide-toggle formcontrolname="customScrollbars" class="mat-slide-toggle mb-12 ng-tns-c164-1 mat-accent mat-checked ng-untouched ng-pristine ng-valid" id="mat-slide-toggle-1"
tabindex="-1"><label class="mat-slide-toggle-label" for="mat-slide-toggle-1-input">
<div class="mat-slide-toggle-bar"><input type="checkbox" role="switch" class="mat-slide-toggle-input cdk-visually-hidden" id="mat-slide-toggle-1-input" tabindex="0" aria-checked="true">
<div class="mat-slide-toggle-thumb-container">
<div class="mat-slide-toggle-thumb"></div>
<div mat-ripple="" class="mat-ripple mat-slide-toggle-ripple">
<div class="mat-ripple-element mat-slide-toggle-persistent-ripple"></div>
</div>
</div>
</div><span class="mat-slide-toggle-content"><span style="display: none;"> </span> Enable custom scrollbars </span>
</label></mat-slide-toggle>
</div>
</form>Text Content
DEVICE MONITORING SYSTEM LOGIN TODAY Monday 12th December EVENTS NOTES QUICK SETTINGS NOTIFICATIONS CLOUD SYNC RETRO THRUSTERS settings Theme Optionsclose COLOR THEMES Default Light Yellow Light Blue-Gray Dark Pink Dark LAYOUT STYLES Vertical Layout #1 Vertical Layout #2 Vertical Layout #3 Horizontal Layout #1 LAYOUT WIDTH Fullwidth Boxed NAVBAR Hide Folded POSITION: Left Right VARIANT: Style 1 Style 2 PRIMARY BACKGROUND: palette SECONDARY BACKGROUND: palette TOOLBAR Hide POSITION: Above Below Static Below Fixed Use custom background color BACKGROUND COLOR: palette FOOTER Hide POSITION: Above Below Static Below Fixed Use custom background color COLOR: palette SIDE PANEL Hide POSITION: Left Right CUSTOM SCROLLBARS Enable custom scrollbars