Hi hlp123,
Yes, the menu bar is made using the Bootstrap framework. Depending on you CSS/HTML skill level it should not be hard to implement. The Bootstrap website provides a ton of samples.
Lots of resources:
Awesome button generater
Layout Builder
Huge list of resources
Yes, the badge (status icons) icons are using a COUNT function to count the number of BOs
<<COUNT Object WHERE (Object.Date=CURRENT_DATE AND Object.Status='New')>>
Example messages button:
<button class="btn btn-info" type="button" title="My Messages" onclick="AwareApp.startProcess ('processName', AwareApp.getPanelId('main','tabName','panelName'))"><i class="icon-envelope icon-white"></i> <span class="badge badge-important"><<COUNT Object WHERE (Object.Date=CURRENT_DATE AND Object.Status='New')>></span></button>
You need to download Bootstrap, copy it to C:\AwareIM\Tomcat\webapps\AwareIM\bootstrap folder & include the link
<link rel="stylesheet" type="text/css" href="bootstrap/css/bootstrap.css">
in the <HEAD> element of the startup.html (I think you have to put in below the <!-- CSS SEPARATOR. Don't delete -->
I've changed my startup.html to a HTML5 doctype. Here is what it looks like:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" type="text/css" href="ext-4.1.0/resources/clifton/css/clifton-blue.css" id="bas_cur_theme">
<link rel="stylesheet" type="text/css" href="fw/def2/style/default.css">
<!-- CSS SEPARATOR. Don't delete -->
<link rel="stylesheet" type="text/css" href="bootstrap/css/bootstrap.css">
<link rel="stylesheet" type="text/css" href="bootstrap/css/bootstrap-responsive.css">
<link rel="stylesheet" type="text/css" href="aware_ext/calendar/resources/css/calendar.css">
<link rel="stylesheet" type="text/css" href="aware_ext/scheduler/resources/css/sch-all.css">
<link rel="stylesheet" type="text/css" href="aware_ext/ext/css/ItemSelector.css">
<!--[if lt IE 9]>
<script src="dist/html5shiv.js"></script>
<![endif]-->
</head>
Happy coding 🙂
Cheers