Last active
January 21, 2024 05:14
-
-
Save danpdc/f01028099668a0319fc7297f17f65f76 to your computer and use it in GitHub Desktop.
Smartschool Part 2 Stream
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<div class="modal fade" id="error-modal" tabindex="-1" role="dialog" aria-hidden="true"> | |
<div class="modal-dialog modal-dialog-centered" role="document" style="max-width: 500px"> | |
<div class="modal-content position-relative"> | |
<div class="position-absolute top-0 end-0 mt-2 me-2 z-1"> | |
<button class="btn-close btn btn-sm btn-circle d-flex flex-center transition-base" | |
data-bs-toggle="modal" data-bs-target="#error-modal"></button> | |
</div> | |
<div class="modal-body p-0" style="margin-left:3px"> | |
<div class="rounded-top-3 py-3 ps-4 pe-6 bg-body-tertiary"> | |
<h4 class="mb-1" id="modalExampleDemoLabel">Add a new role </h4> | |
</div> | |
<div class="p-4 pb-0"> | |
<form method="post" @formname="addRole" @onsubmit="SubmitNewRole"> | |
<div class="mb-3"> | |
<label class="col-form-label">Role name:</label> | |
<InputText @bind-Value="NewRoleName" class="form-control" /> | |
</div> | |
</form> | |
</div> | |
</div> | |
<div class="modal-footer"> | |
<button class="btn btn-secondary" type="button" data-bs-dismiss="modal">Close</button> | |
<button type="submit" class="btn btn-success" @onclick="SubmitNewRole">Add role </button> | |
</div> | |
</div> | |
</div> | |
</div> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<div class="page"> | |
<div class="sidebar"> | |
<NavMenu /> | |
</div> | |
<main> | |
<div class="top-row px-4"> | |
</div> | |
<article class="content"> | |
@Body | |
</article> | |
</main> | |
</div> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
.page { | |
position: relative; | |
display: flex; | |
flex-direction: column; | |
} | |
main { | |
flex: 1; | |
} | |
.sidebar { | |
background-image: linear-gradient(180deg, rgb(5, 39, 103) 0%, #3a0647 70%); | |
} | |
.top-row { | |
background-color: #f7f7f7; | |
border-bottom: 1px solid #d6d5d5; | |
justify-content: flex-end; | |
height: 3.5rem; | |
display: flex; | |
align-items: center; | |
} | |
.top-row ::deep a, .top-row ::deep .btn-link { | |
white-space: nowrap; | |
margin-left: 1.5rem; | |
text-decoration: none; | |
} | |
.top-row ::deep a:hover, .top-row ::deep .btn-link:hover { | |
text-decoration: underline; | |
} | |
.top-row ::deep a:first-child { | |
overflow: hidden; | |
text-overflow: ellipsis; | |
} | |
@media (max-width: 640.98px) { | |
.top-row { | |
justify-content: space-between; | |
} | |
.top-row ::deep a, .top-row ::deep .btn-link { | |
margin-left: 0; | |
} | |
} | |
@media (min-width: 641px) { | |
.page { | |
flex-direction: row; | |
} | |
.sidebar { | |
width: 250px; | |
height: 100vh; | |
position: sticky; | |
top: 0; | |
} | |
.top-row { | |
position: sticky; | |
top: 0; | |
z-index: 1; | |
} | |
.top-row.auth ::deep a:first-child { | |
flex: 1; | |
text-align: right; | |
width: 0; | |
} | |
.top-row, article { | |
padding-left: 2rem !important; | |
padding-right: 1.5rem !important; | |
} | |
} | |
#blazor-error-ui { | |
background: lightyellow; | |
bottom: 0; | |
box-shadow: 0 -1px 2px rgba(0, 0, 0, 0.2); | |
display: none; | |
left: 0; | |
padding: 0.6rem 1.25rem 0.7rem 1.25rem; | |
position: fixed; | |
width: 100%; | |
z-index: 1000; | |
} | |
#blazor-error-ui .dismiss { | |
cursor: pointer; | |
position: absolute; | |
right: 0.75rem; | |
top: 0.5rem; | |
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<PageTitle>Roles</PageTitle> | |
<AuthorizeView Roles="superAdmin"> | |
<Authorized> | |
<div class="row" style="margin-top:20px"> | |
<div class="col-3"> | |
<button class="btn btn-primary" type="button" data-bs-toggle="modal" | |
data-bs-target="#error-modal">Add role</button> | |
<AddRoleModal OnRoleAdded="UpdateRoles" /> | |
</div> | |
</div> | |
<div class="row m5"> | |
<div class="table-responsive scrollbar col-6" style="background-color:whitesmoke"> | |
<table class="table"> | |
<thead> | |
<tr> | |
<th scope="col">Role name</th> | |
<th class="text-end" scope="col">Actions</th> | |
</tr> | |
</thead> | |
<tbody> | |
@if (Roles.Count > 0) | |
{ | |
@foreach (var role in Roles) | |
{ | |
<tr> | |
<td>@role.Name</td> | |
<td class="text-end"> | |
<div> | |
<button class="btn btn-danger btn-rounded" type="button" | |
data-bs-toggle="tooltip" data-bs-placement="top" title="Delete" | |
@onclick="@(() => DeleteRole(role))"> | |
Delete | |
</button> | |
</div> | |
</td> | |
</tr> | |
} | |
} | |
</tbody> | |
</table> | |
</div> | |
</div> | |
</Authorized> | |
<NotAuthorized> | |
<Unauthorized /> | |
</NotAuthorized> | |
</AuthorizeView> |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment