Update pattern

README.md

@@ -17,15 +17,11 @@ Dashboard template from [Creative Tim](https://www.creative-tim.com/product/blac
         title           = "CostaPy"
         baseurl         = "http://localhost"
 
-        menu_icon       = "fa fa-user-tie"
-        menu_name       = "Dashboard"
-        profile_picture = "http://localhost/profile/1.jpg"
-        profile_name    = "John Smith"
         logout          = "http://localhost/logout"
 
         color           = "blue"              # blue | green | orange | red
         logo            = "http://localhost/logo.png"
-        user_roles      = ["member"]          # A roles that user have
+        roles           = [2]                 # A roles that user have
         active_page     = "Dashboard"         # Current active page name
 
         copyright       = "Dita Aji Pratama"  # Copyright on the footer
@@ -34,29 +30,34 @@ Dashboard template from [Creative Tim](https://www.creative-tim.com/product/blac
 
         navbar_menu = [
           {
-            "name"  :"Home",
+            "icon"  :"tim-icons icon-bell-55",
-            "href"  :"/"
+            "name"  :"Notifications",
-          },
+            "list"  :[
-          {
+              {
-            "name"  :"Dashboard",
+                "name"  :"See all notifications",
-            "href"  :"#"
+                "href"  :"#"
-          },
+              }
-          {
+            ],
-            "name"  :"CostaPy Website",
+            "notification":False
-            "href"  :"https://costapy.ditaajipratama.com"
           }
         ]
 
-        profile_menu = [
+- Config a profile on your modules function
-          {
+
-            "name"  :"Profile",
+        data_profile	= {
-            "href"  :"/profile"
+  				"picture"	: "http://localhost/profile/1.jpg",
-          },
+  				"name"		: "John Smith",
-          {
+  				"menu"		: [
-            "name"  :"Setting",
+            {
-            "href"  :"/setting"
+              "name"  :"Profile",
-          }
+              "href"  :"/profile"
-        ]
+            },
+            {
+              "name"  :"Setting",
+              "href"  :"/setting"
+            }
+          ]
+  			}
 
 - Config a sidebar menu on your modules function
 
@@ -65,13 +66,13 @@ Dashboard template from [Creative Tim](https://www.creative-tim.com/product/blac
             "icon"  :"fa fa-home",
             "name"  :"Dashboard",
             "href"  :"/",
-            "roles" :["member", "admin"]
+            "roles" :[1,2]
           },
           {
             "icon"  :"fa fa-users",
             "name"  :"Users",
             "href"  :"/users",
-            "roles" :["admin"]
+            "roles" :[1]
           }
         ]
 
@@ -93,20 +94,15 @@ Dashboard template from [Creative Tim](https://www.creative-tim.com/product/blac
           baseurl   = baseurl,
           navbar    = Template(params["mako"]["website"]['navbar']).render(
             title           = title,
-            baseurl         = baseurl,
-            menu_icon       = menu_icon,
-            menu_name       = menu_name,
             menu            = navbar_menu,
-            profile_picture = profile_picture,
+            profile         = data_profile,
-            profile_name    = profile_name,
-            profile_menu    = profile_menu,
             logout          = logout
           ),
           sidebar   = Template(params["mako"]["website"]['sidebar']).render(
             color           = color,
             logo            = logo,
             title           = title,
-            user_roles      = user_roles,
+            roles           = roles,
             active_page     = active_page,
             menu            = sidebar_menu
           ),

blackdashboard/html/navbar.html

@@ -9,7 +9,7 @@
           <span class="navbar-toggler-bar bar3"></span>
         </button>
       </div>
-      <a class="navbar-brand" href="${baseurl}">${title}</a>
+      <a class="navbar-brand" href="javascript:void(0)">${title}</a>
     </div>
     <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navigation" aria-expanded="false" aria-label="Toggle navigation">
       <span class="navbar-toggler-bar navbar-kebab"></span>
@@ -24,38 +24,40 @@
           </button>
         </li> -->
 
-        <li class="dropdown nav-item">
+        % for item in menu:
-          <a href="javascript:void(0)" class="dropdown-toggle nav-link" data-toggle="dropdown">
+          <li class="dropdown nav-item">
-            <div class="notification d-none d-lg-block d-xl-block"></div>
+            <a href="javascript:void(0)" class="dropdown-toggle nav-link" data-toggle="dropdown">
-            <i class="${menu_icon}"></i>
+              <div class="${'notification' if item['notification'] == True else ''} d-none d-lg-block d-xl-block"></div>
-            <p class="d-lg-none">
+              <i class="${item['icon']}"></i>
-              ${menu_name}
+              <p class="d-lg-none">
-            </p>
+                ${item['name']}
-          </a>
+              </p>
-          <ul class="dropdown-menu dropdown-menu-right dropdown-navbar">
+            </a>
-            % for item in menu:
+            <ul class="dropdown-menu dropdown-menu-right dropdown-navbar">
-              <li class="nav-link">
+              % for link in item['list']:
-                <a href="${item['href']}" class="nav-item dropdown-item">
+                <li class="nav-link">
-                  ${item['name']}
+                  <a href="${link['href']}" class="nav-item dropdown-item">
-                </a>
+                    ${link['name']}
-              </li>
+                  </a>
-            % endfor
+                </li>
-          </ul>
+              % endfor
-        </li>
+            </ul>
+          </li>
+        % endfor
 
         <li class="dropdown nav-item">
           <a href="#" class="dropdown-toggle nav-link" data-toggle="dropdown">
             <div class="photo">
-              <img src="${profile_picture}" alt="Profile Photo">
+              <img src="${profile['picture']}" alt="Photo">
             </div>
             <b class="caret d-none d-lg-block d-xl-block"></b>
             <p class="d-lg-none">
-              ${profile_name}
+              ${profile['name']}
             </p>
           </a>
           <ul class="dropdown-menu dropdown-navbar">
 
-            % for item in profile_menu:
+            % for item in profile['menu']:
               <li class="nav-link">
                 <a href="${item['href']}" class="nav-item dropdown-item">
                   ${item['name']}

blackdashboard/html/sidebar.html

@@ -13,7 +13,7 @@
     </div>
     <ul class="nav">
       % for item in menu:
-        % if any(role in item['roles'] for role in user_roles):
+        % if any(role in item['roles'] for role in roles):
           <li class="${'active' if item['name'] == active_page else ''}">
             <a href="${item['href']}">
               <i class="${item['icon']}"></i>