xxxxxxxxxx1
2
<html lang="en">3
<head>4
<meta charset="utf-8" />5
<meta content="width=device-width, initial-scale=1.0" />6
<title>Home</title>7
8
<!-- Font Awesome -->9
<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.11.2/css/all.css" />10
11
<!-- Google Fonts Roboto -->12
<link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Roboto:wght@300;400;500;700&display=swap" />13
14
<!-- MDB -->15
<link rel="stylesheet" href="~/mdb/css/mdb.min.css" /> 16
17
<!-- MDB Plugins -->18
<link rel="stylesheet" href="~/mdb/plugins/css/all.min.css"/>19
20
21
</head>22
<body>23
<header>24
<!-- Sidenav -->25
<div26
id="sidenav-1"27
class="sidenav"28
role="navigation"29
data-mdb-mode="push"30
data-mdb-hidden="true"31
data-mdb-accordion="true"32
data-mdb-content="#mainview"33
>34
<a35
class="ripple d-flex justify-content-center py-4"36
asp-action="Dashboard"37
data-mdb-ripple-color="primary"38
>39
<img40
id="MDB-logo"41
src=""42
alt="MDB Logo"43
draggable="false"44
/>45
</a>46
<hr class="m-0" />47
<ul class="sidenav-menu">48
<li class="sidenav-item">49
<a class="sidenav-link" asp-action="Dashboard">50
<i class="fas fa-home fa-fw me-3"></i51
><span>Dashboard</span></a>52
</li>53
</ul>54
<ul class="sidenav-menu">55
<li class="sidenav-item">56
<a class="sidenav-link" asp-action="UserProfile">57
<i class="fas fa-user fa-fw me-3"></i58
><span>User Profile</span></a>59
</li>60
</ul>61
<hr class="m-0" />62
<ul class="sidenav-menu">63
<li class="sidenav-item text-muted">64
<a class="sidenav-link">65
<i class="fas fa-chart-line fa-fw me-3"></i66
><span>Analytics</span></a>67
</li>68
<li class="sidenav-item text-muted">69
<a class="sidenav-link">70
<i class="fas fa-chart-bar fa-fw me-3"></i71
><span>Orders</span></a>72
</li>73
<li class="sidenav-item text-muted">74
<a class="sidenav-link">75
<i class="fas fa-chart-area fa-fw me-3"></i76
><span>Webiste traffic</span></a>77
</li>78
<li class="sidenav-item text-muted">79
<a class="sidenav-link">80
<i class="fas fa-globe fa-fw me-3"></i81
><span>International</span></a>82
</li>83
<li class="sidenav-item text-muted">84
<a class="sidenav-link">85
<i class="fas fa-building fa-fw me-3"></i86
><span>Partners</span></a>87
</li>88
<li class="sidenav-item text-muted">89
<a class="sidenav-link">90
<i class="fas fa-calendar fa-fw me-3"></i91
><span>Calendar</span></a>92
</li>93
<li class="sidenav-item text-muted">94
<a class="sidenav-link">95
<i class="fas fa-users fa-fw me-3"></i96
><span>Users</span></a>97
</li>98
<li class="sidenav-item text-muted">99
<a class="sidenav-link">100
<i class="fas fa-money-bill fa-fw me-3"></i101
><span>Sales</span></a>102
</li>103
</ul>104
</div>105
<!-- Sidenav -->106
<!-- Navbar -->107
<nav108
id="main-navbar"109
class="navbar navbar-expand-lg navbar-light bg-light fixed-top"110
>111
<!-- Container wrapper -->112
<div class="container-fluid">113
<!-- Toggler -->114
<button115
data-mdb-toggle="sidenav"116
data-mdb-target="#sidenav-1"117
class="btn shadow-0 p-0 me-3 d-block"118
aria-controls="#sidenav-1"119
aria-haspopup="true"120
>121
<i class="fas fa-bars fa-lg"></i>122
</button>123
124
<!-- Search form -->125
<form class="d-none d-md-flex input-group w-auto my-auto">126
<input127
autocomplete="off"128
type="search"129
class="form-control rounded"130
placeholder='Search (ctrl + "/" to focus)'131
style="min-width: 225px"132
/>133
<span class="input-group-text border-0"134
><i class="fas fa-search"></i135
></span>136
</form>137
138
<!-- Right links -->139
<ul class="navbar-nav ms-auto d-flex flex-row">140
<!-- Notification dropdown -->141
<li class="nav-item dropdown">142
<a143
class="nav-link me-3 me-lg-0 dropdown-toggle hidden-arrow"144
href="#"145
id="navbarDropdownMenuLink"146
role="button"147
data-mdb-toggle="dropdown"148
aria-expanded="false"149
>150
<i class="fas fa-bell"></i>151
<span class="badge rounded-pill badge-notification bg-danger"152
>1</span153
>154
</a>155
<ul156
class="dropdown-menu dropdown-menu-end"157
aria-labelledby="navbarDropdownMenuLink"158
>159
<li><a class="dropdown-item" href="#">Some news</a></li>160
<li><a class="dropdown-item" href="#">Another news</a></li>161
<li>162
<a class="dropdown-item" href="#">Something else here</a>163
</li>164
</ul>165
</li>166
167
<!-- Icon -->168
<li class="nav-item">169
<a class="nav-link me-3 me-lg-0" href="#">170
<i class="fas fa-fill-drip"></i>171
</a>172
</li>173
<!-- Icon -->174
<li class="nav-item me-3 me-lg-0">175
<a class="nav-link" href="#">176
<i class="fab fa-github"></i>177
</a>178
</li>179
180
<!-- Icon dropdown -->181
<li class="nav-item dropdown">182
<a183
class="nav-link me-3 me-lg-0 dropdown-toggle hidden-arrow"184
href="#"185
id="navbarDropdown"186
role="button"187
data-mdb-toggle="dropdown"188
aria-expanded="false"189
>190
<i class="united kingdom flag m-0"></i>191
</a>192
<ul193
class="dropdown-menu dropdown-menu-end"194
aria-labelledby="navbarDropdown"195
>196
<li>197
<a class="dropdown-item"198
><i class="united kingdom flag"></i>English199
<i class="fa fa-check text-success ms-2"></i200
></a>201
</li>202
<li><hr class="dropdown-divider" /></li>203
<li>204
<a class="dropdown-item"205
><i class="poland flag"></i>Polski</a206
>207
</li>208
<li>209
<a class="dropdown-item"210
><i class="china flag"></i>中文</a211
>212
</li>213
<li>214
<a class="dropdown-item"215
><i class="japan flag"></i>日本語</a216
>217
</li>218
<li>219
<a class="dropdown-item"220
><i class="germany flag"></i>Deutsch</a221
>222
</li>223
<li>224
<a class="dropdown-item"225
><i class="france flag"></i>Français</a226
>227
</li>228
<li>229
<a class="dropdown-item"230
><i class="spain flag"></i>Español</a231
>232
</li>233
<li>234
<a class="dropdown-item"235
><i class="russia flag"></i>Русский</a236
>237
</li>238
<li>239
<a class="dropdown-item"240
><i class="portugal flag"></i>Português</a241
>242
</li>243
</ul>244
</li>245
246
<!-- Avatar -->247
<li class="nav-item dropdown">248
<a249
class="nav-link dropdown-toggle hidden-arrow d-flex align-items-center"250
href="#"251
id="navbarDropdownMenuLink"252
role="button"253
data-mdb-toggle="dropdown"254
aria-expanded="false"255
>256
@*<img257
src="@avatarPreview"258
class="rounded-circle"259
height="22"260
alt=""261
loading="lazy"262
/>*@263
<i class="portugal flag"></i>264
</a>265
<ul266
class="dropdown-menu dropdown-menu-end"267
aria-labelledby="navbarDropdownMenuLink"268
>269
<li><a class="dropdown-item" asp-action="UserProfile">My Profile</a></li>270
<li><a class="dropdown-item" asp-controller="Auth" asp-action="Logout">Logout</a></li>271
</ul>272
</li>273
</ul>274
</div>275
<!-- Container wrapper -->276
</nav>277
<!-- Navbar -->278
</header>279
280
<main id="mainview" role="main" class="pb-3 py-5">281
aaaaaaaaaaaaaaaaa282
<div class="container-fluid">283
<h1 class="h3 text-center mb-0">Home</h1>284
@RenderBody()285
</div>286
287
<!--Alerts-->288
<div289
class="alert fade"290
id="alert-success"291
role="alert"292
data-mdb-color="success"293
data-mdb-position="top-right"294
data-mdb-stacking="true"295
data-mdb-width="535px"296
data-mdb-append-to-body="true"297
data-mdb-hidden="true"298
data-mdb-autohide="true"299
>300
</div>301
<div302
class="alert fade"303
id="alert-error"304
role="alert"305
data-mdb-color="danger"306
data-mdb-position="top-right"307
data-mdb-stacking="true"308
data-mdb-width="535px"309
data-mdb-append-to-body="true"310
data-mdb-hidden="true"311
data-mdb-autohide="true"312
>313
<strong>Error</strong> - Something went wrong!314
</div>315
</main>316
317
318
<!-- Footer -->319
<footer class="mt-5"></footer>320
<!-- Footer -->321
322
<!-- MDB -->323
324
325
326
</body>327
</html>xxxxxxxxxx1
@media (min-width: 1400px) {2
main,3
header,4
#main-navbar {5
/*padding-left: 240px;*/6
}7
}8
9
.table > thead > tr > th {10
border-bottom-width: 2px;11
}12
13
.table > :not(:last-child) > :last-child > * {14
border-bottom-color: inherit;15
}16
17
body {18
background-color: #fbfbfb;19
}20
21
.navbar {22
padding-left: 0 !important;23
z-index: 1041;24
}25
#mainview{26
margin-top:38px;27
}xxxxxxxxxx1
let sidenav = document.querySelector("#sidenav-1");2
3
const instance = new mdb.Sidenav(sidenav);4
console.log(instance)5
let innerWidth = null;6
7
const setMode = (e) => {8
// Check necessary for Android devices9
if (window.innerWidth === innerWidth) {10
return;11
}12
13
innerWidth = window.innerWidth;14
15
if (window.innerWidth < 768) {16
instance.changeMode("over");17
instance.hide();18
} else {19
instance.changeMode("push");20
instance.show();21
}22
};23
24
setMode();25
26
// Event listeners27
window.addEventListener("resize", setMode); Console errors: 0