Hello All,
I am developing a small UI5 application as a PoC. What I want to achieve is, applying custom theme to UI5 elements and hosting this application on share-point.
In the script section, I have added controls which include buttons. I have declared buttons using code displayed below. I created a custom style and I have declared it just before </HEAD> and thus making it the last style that is being called. When I used code inspector, I noticed that there are several other standard classes that are assigned to the button and hence it fails to render the intended look i.e. rounded borders. It works well for everything else. Can someone help?
The complete HTML is as follows:-
<head>
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<script src="resources/sap-ui-core.js"
id="sap-ui-bootstrap"
data-sap-ui-libs="sap.ui.commons">
</script>
<script>
//Add input fields for username and password entry
var txt_username = new sap.ui.commons.TextField("txt_uname");
txt_username.placeAt("uname");
var txt_password = new sap.ui.commons.TextField("txt_pwd");
txt_password.placeAt("pwd");
//Add buttons to submit and clear
var btn_sub = new sap.ui.commons.Button("btn_submit");
btn_sub.setText("Submit");
btn_sub.addStyleClass("btn");
btn_sub.placeAt("uname");
//Clear button
var btn_canc = new sap.ui.commons.Button("btn_cancel");
btn_canc.setText("Cancel");
btn_canc.addStyleClass("btn");
btn_canc.placeAt("pwd");
</script>
<link rel = "stylesheet" type="text/css" href="./resources/sap/ui/library.css" />
</head>
<body class="sapUiBody" role="application">
<div id="content">
<div id="left">Username:
<BR>Password:
</div>
<div id="right">
<div id="uname">
</div>
<div id="pwd">
</div>
</div>
</div>
</body>
Regards
Abhi