UI Enhancement

.github/pull_request_template.md

@@ -23,8 +23,8 @@ Testing sections can be removed for documentation changes
 ## Types of changes
 <!-- What types of changes does your code introduce? Put an `x` in all the boxes that apply: -->
 - [ ] Bug fix (non-breaking change which fixes an issue)
-- [ ] New feature (non-breaking change which adds functionality)
-- [ ] Breaking change (fix or feature that would cause existing functionality to not work as expected)
+- [ ] New Template
+- [ ] Template Enhancement
 
 <!-- If you made any visual changes, provide screenshots of before/after, it its moving parts, please provide high quality gif, wemb or mp4 -->
 

.github/workflows/pr.yml

@@ -9,21 +9,21 @@ jobs:
       - uses: actions/github-script@v6
         with:
           script: |
-            const pr = context.payload.pul_request;
+            const pr = context.payload.pull_request;
             const body = pr.body;
-            let labels =[];
+            let labels = [];
             const isChecked = /-\s*\[\s*[x|X]\s*\]\s*/;
-            if (RegExp(isChecked.source) + "Bug fix \\(non-breaking change which fixes an issue\\)").test(body)){
+            if (RegExp(isChecked.source + "Bug fix \\(non-breaking change which fixes an issue\\)").test(body)) {
               labels.push("bug");
               console.log("PR type: bug fix.");
             }
-
-            if(RegExp(isChecked.source + "New feature \\(non-breaking change which adds functionality\\)").test(body)) {
+            
+            if(RegExp(isChecked.source + "New Template").test(body)) {
               labels.push("enhancement");
               console.log("PR type: enhancement.");
             }
 
-            if(RegExp(isChecked.source + "Breaking change \\(fix or feature that would cause existing functionality to not work as expected\\)").test(body)) {
+            if(RegExp(isChecked.source + "Template Enhancement").test(body)) {
               labels.push("breaking change");
               console.log("PR type: breaking change.");
             }

src/content/CleanArchitecture.Blazored/src/WebUi/WebUi/Components/Layout/NavMenu.razor

@@ -39,39 +39,39 @@
         <AuthorizeView>
             <div class="nav-item px-3">
                 <NavLink class="nav-link" href="claims">
-                    <span class="oi oi-document" aria-hidden="true"></span> Claims
+                    <span class="bi bi-card-checklist" aria-hidden="true"></span> Claims
                 </NavLink>
             </div>
         </AuthorizeView>
 
         <FlexibleAuthorizeView Permissions="@Permissions.Todo">
             <div class="nav-item px-3">
                 <NavLink class="nav-link" href="todo">
-                    <span class="oi oi-list" aria-hidden="true"></span> Todo
+                    <span class="bi bi-list-task" aria-hidden="true"></span> Todo
                 </NavLink>
             </div>
         </FlexibleAuthorizeView>
 
         <FlexibleAuthorizeView Permissions="@(Permissions.ViewUsers | Permissions.ManageUsers)">
             <div class="nav-item px-3">
                 <NavLink class="nav-link" href="admin/users">
-                    <span class="oi oi-people" aria-hidden="true"></span> Users
+                    <span class="bi bi-people-fill" aria-hidden="true"></span> Users
                 </NavLink>
             </div>
         </FlexibleAuthorizeView>
 
         <FlexibleAuthorizeView Permissions="@(Permissions.ViewRoles | Permissions.ManageRoles)">
             <div class="nav-item px-3">
                 <NavLink class="nav-link" href="admin/roles">
-                    <span class="oi oi-badge" aria-hidden="true"></span> Roles
+                    <span class="bi bi-person-badge" aria-hidden="true"></span> Roles
                 </NavLink>
             </div>
         </FlexibleAuthorizeView>
 
         <FlexibleAuthorizeView Permissions="@(Permissions.ViewAccessControl | Permissions.ConfigureAccessControl)">
             <div class="nav-item px-3">
                 <NavLink class="nav-link" href="admin/access-control">
-                    Access Control
+                    <span class="bi bi-universal-access"></span> Access Control
                 </NavLink>
             </div>
         </FlexibleAuthorizeView>

src/content/CleanArchitecture.Blazored/src/WebUi/WebUi/Components/Layout/NavMenu.razor.css

@@ -66,6 +66,26 @@
     background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' class='bi bi-arrow-bar-left' viewBox='0 0 16 16'%3E%3Cpath d='M12.5 15a.5.5 0 0 1-.5-.5v-13a.5.5 0 0 1 1 0v13a.5.5 0 0 1-.5.5ZM10 8a.5.5 0 0 1-.5.5H3.707l2.147 2.146a.5.5 0 0 1-.708.708l-3-3a.5.5 0 0 1 0-.708l3-3a.5.5 0 1 1 .708.708L3.707 7.5H9.5a.5.5 0 0 1 .5.5Z'/%3E%3C/svg%3E");
 }
 
+.bi-card-checklist {
+    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' class='bi bi-card-checklist' viewBox='0 0 16 16'%3E%3Cpath d='M14.5 3a.5.5 0 0 1 .5.5v9a.5.5 0 0 1-.5.5h-13a.5.5 0 0 1-.5-.5v-9a.5.5 0 0 1 .5-.5zm-13-1A1.5 1.5 0 0 0 0 3.5v9A1.5 1.5 0 0 0 1.5 14h13a1.5 1.5 0 0 0 1.5-1.5v-9A1.5 1.5 0 0 0 14.5 2z'/%3E%3Cpath d='M7 5.5a.5.5 0 0 1 .5-.5h5a.5.5 0 0 1 0 1h-5a.5.5 0 0 1-.5-.5m-1.496-.854a.5.5 0 0 1 0 .708l-1.5 1.5a.5.5 0 0 1-.708 0l-.5-.5a.5.5 0 1 1 .708-.708l.146.147 1.146-1.147a.5.5 0 0 1 .708 0M7 9.5a.5.5 0 0 1 .5-.5h5a.5.5 0 0 1 0 1h-5a.5.5 0 0 1-.5-.5m-1.496-.854a.5.5 0 0 1 0 .708l-1.5 1.5a.5.5 0 0 1-.708 0l-.5-.5a.5.5 0 0 1 .708-.708l.146.147 1.146-1.147a.5.5 0 0 1 .708 0'/%3E%3C/svg%3E ");
+}
+
+.bi-list-task {
+    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' class='bi bi-list-task' viewBox='0 0 16 16'%3E%3Cpath fill-rule='evenodd' d='M2 2.5a.5.5 0 0 0-.5.5v1a.5.5 0 0 0 .5.5h1a.5.5 0 0 0 .5-.5V3a.5.5 0 0 0-.5-.5zM3 3H2v1h1z'/%3E%3Cpath d='M5 3.5a.5.5 0 0 1 .5-.5h9a.5.5 0 0 1 0 1h-9a.5.5 0 0 1-.5-.5M5.5 7a.5.5 0 0 0 0 1h9a.5.5 0 0 0 0-1zm0 4a.5.5 0 0 0 0 1h9a.5.5 0 0 0 0-1z'/%3E%3Cpath fill-rule='evenodd' d='M1.5 7a.5.5 0 0 1 .5-.5h1a.5.5 0 0 1 .5.5v1a.5.5 0 0 1-.5.5H2a.5.5 0 0 1-.5-.5zM2 7h1v1H2zm0 3.5a.5.5 0 0 0-.5.5v1a.5.5 0 0 0 .5.5h1a.5.5 0 0 0 .5-.5v-1a.5.5 0 0 0-.5-.5zm1 .5H2v1h1z'/%3E%3C/svg%3E");
+}
+
+.bi-people-fill {
+    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' class='bi bi-people-fill' viewBox='0 0 16 16'%3E%3Cpath d='M7 14s-1 0-1-1 1-4 5-4 5 3 5 4-1 1-1 1zm4-6a3 3 0 1 0 0-6 3 3 0 0 0 0 6m-5.784 6A2.24 2.24 0 0 1 5 13c0-1.355.68-2.75 1.936-3.72A6.3 6.3 0 0 0 5 9c-4 0-5 3-5 4s1 1 1 1zM4.5 8a2.5 2.5 0 1 0 0-5 2.5 2.5 0 0 0 0 5'/%3E%3C/svg%3E");
+}
+
+.bi-person-badge {
+    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' class='bi bi-person-badge' viewBox='0 0 16 16'%3E%3Cpath d='M6.5 2a.5.5 0 0 0 0 1h3a.5.5 0 0 0 0-1zM11 8a3 3 0 1 1-6 0 3 3 0 0 1 6 0'/%3E%3Cpath d='M4.5 0A2.5 2.5 0 0 0 2 2.5V14a2 2 0 0 0 2 2h8a2 2 0 0 0 2-2V2.5A2.5 2.5 0 0 0 11.5 0zM3 2.5A1.5 1.5 0 0 1 4.5 1h7A1.5 1.5 0 0 1 13 2.5v10.795a4.2 4.2 0 0 0-.776-.492C11.392 12.387 10.063 12 8 12s-3.392.387-4.224.803a4.2 4.2 0 0 0-.776.492z'/%3E%3C/svg%3E");
+}
+
+.bi-universal-access {
+    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' class='bi bi-universal-access' viewBox='0 0 16 16'%3E%3Cpath d='M9.5 1.5a1.5 1.5 0 1 1-3 0 1.5 1.5 0 0 1 3 0M6 5.5l-4.535-.442A.531.531 0 0 1 1.531 4H14.47a.531.531 0 0 1 .066 1.058L10 5.5V9l.452 6.42a.535.535 0 0 1-1.053.174L8.243 9.97c-.064-.252-.422-.252-.486 0l-1.156 5.624a.535.535 0 0 1-1.053-.174L6 9z'/%3E%3C/svg%3E");
+}
+
 .nav-item {
     font-size: 0.9rem;
     padding-bottom: 0.5rem;

src/content/CleanArchitecture.Blazored/src/WebUi/WebUi/wwwroot/css/app.css

@@ -1,5 +1,3 @@
-@import url('open-iconic/font/css/open-iconic-bootstrap.min.css');
-
 html, body {
     font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;
 }