on 05-30-2016 7:22 AM
Hello All, I am not able to see customized CSS in to my code. Please advise
CssCode: .IconTabFilter_PIMD .sapMITBAll .sapMITBText
{ max-height: 4rem !important;
max-width: 7rem !important; }
Index Code: <link type="text/css" href="CSS/ControlStyle.css" rel="stylesheet" /> and
XML view code : <IconTabFilter id="UPMD_ITF5" text="Milestones and status of quality Control" class="IconTabFilter_PIMD" showAll="true" design="sap.m.IconTabFilterDesign.Horizontal" >
</IconTabFilter>
Hi Rahul,
You CSS class is not working because may be you are picking wrong classs/id for the Icon tab Bar control
Solution: Using inspect element in chrome developer console pick up the icon tab bar and find the appropriate class to apply the CSS
If you are still stuck share your code here, I''ll try to help. Create a new Gist · GitHub
Regards,
Devaarth
You must be a registered user to add a comment. If you've already registered, sign in. Otherwise, register and sign in.
Hello Devaarth,
Thanks for replay,
I have checked i think i have used correct class.
Please find below screen shots Issue Screen.png and After Manual editing.png.
Where i have applyed my CSS for Icon Tab Bar, where text of the IconTab not get full displayed please see screen shot Issue Screen.png. After manual editing the .sapMITBAll .sapMITBText class file for values
max-height: 3rem;
max-width: 4rem;
to
max-height: 4rem;
max-width: 5rem;
but when i pass this value by CSS it not work.
Please guide me here.
Thanks,
Rahul
Issue Screen.png
After Manual editing.png
Hi Rahul,
What I can see from your customized CSS is that you are applying CSS to the complete class. What you can do is pick up that selected id and the class(if any) and apply the CSS.
Use the plus sign on right side of the box where you are put CSS code and add the CSS to that class.
Regards,
Devaarth
Hi Rahul ,
Can you tell me what exactly you want to change in Css for icontab Filter control ?
Thanks
Viplove
You must be a registered user to add a comment. If you've already registered, sign in. Otherwise, register and sign in.
Create css file as per below screen shot.
element.css
div.sapMBtnInner.sapMBtnAccept {
background-color: #cc1919;
}
.sapMFooter-CTX .sapMBtn:hover>.sapMBtnHoverable.sapMBtnAccept:not(.sapMBtnActive) {
background-color: #007cc0;
border-color: #007cc0;
}
index.html
<script
id="sap-ui-bootstrap"
src="resources/sap-ui-core.js"
data-sap-ui-theme="sap_bluecrystal"
data-sap-ui-libs="sap.m, sap.ui.layout"
data-sap-ui-xx-bindingSyntax="complex"
data-sap-ui-resourceroots='{
"sap.ui.demo.myFiori": "./"
}' >
</script>
<link rel="stylesheet" href="Style/element.css"/>
Calls the "element.css" file where you want. for example:
<Button class ="div.sapMBtnInner.sapMBtnAccept"
text="{i18n>EditButtonText}"
type="Accept"
icon="sap-icon://accept"
press="handleApprove" />
Regards
Vijay K
You must be a registered user to add a comment. If you've already registered, sign in. Otherwise, register and sign in.
User | Count |
---|---|
88 | |
23 | |
11 | |
9 | |
8 | |
5 | |
5 | |
5 | |
5 | |
4 |
You must be a registered user to add a comment. If you've already registered, sign in. Otherwise, register and sign in.