Notice: This Wiki is now read only and edits are no longer possible. Please see: https://gitlab.eclipse.org/eclipsefdn/helpdesk/-/wikis/Wiki-shutdown-plan for the plan.
Difference between revisions of "Stardust/Knowledge Base/Customization/Portal/Applying custom skinning to Stardust Portal"
(Applying custom skinning to Stardust portal) |
|||
Line 47: | Line 47: | ||
<br> | <br> | ||
− | + | <br> | |
<br> | <br> | ||
Line 53: | Line 53: | ||
'''To change font of the UI, menu’s background and color of text on mouse hover, branding on banner, color of links on mouse hover use smcskin5.css''' <br> | '''To change font of the UI, menu’s background and color of text on mouse hover, branding on banner, color of links on mouse hover use smcskin5.css''' <br> | ||
− | <css /> | + | <css /> |
− | .panelHeaderTitle {<br> color: #708090;<br> font-weight: bold;<br> } | + | .panelHeaderTitle {<br> color: #708090;<br> font-weight: bold;<br> } |
− | .panelHeader .iceCmdLnk:hover {<br> cursor: hand;<br> text-decoration: none;<br> } | + | .panelHeader .iceCmdLnk:hover {<br> cursor: hand;<br> text-decoration: none;<br> } |
− | .iceCmdLnk .panelHeaderTitle:hover {<br> color: #B0232B;<br> font-weight: bold;<br> }<br> .action-link<br> {<br> color: #00629A;<br> } | + | .iceCmdLnk .panelHeaderTitle:hover {<br> color: #B0232B;<br> font-weight: bold;<br> }<br> .action-link<br> {<br> color: #00629A;<br> } |
− | .action-link:hover<br> {<br> color: #B0232B;<br> text-decoration: underline;<br> }<br>.banner{<br> height: 70px;<br> width 100%;<br> background: #FFFFFF url(./images/smc_newlogo.jpg) left no-repeat;<br> border-bottom: 3px solid #FFFFFF;<br> } | + | .action-link:hover<br> {<br> color: #B0232B;<br> text-decoration: underline;<br> }<br>.banner{<br> height: 70px;<br> width 100%;<br> background: #FFFFFF url(./images/smc_newlogo.jpg) left no-repeat;<br> border-bottom: 3px solid #FFFFFF;<br> } |
− | .iceOutTxt, .iceOutLbl {<br> font-family:'Lucida Sans Unicode','Lucida Grande','Helvetica','Arial',sans-serif;<br> font-size:11px;<br> <br> }<br>.body, table {<br> font-family:'Lucida Sans Unicode','Lucida Grande','Helvetica','Arial',sans-serif;<br> font-size:11px;<br> }<br> .heading .iceOutTxt<br> {<br> font-size: 11px;<br> font-weight: bold;<br> color: #708090;<br> }<br>.label-form {<br> color: #708090;<br> font-weight: normal;<br> }<br>.iceDatTblCol .iceCmdLnk span.iceOutTxt {<br> color: #00629A;<br> }<br>.button, .button-dis<br> {<br> color:#333333;<br> background: #FFFFFF url( "./css-images/button-background.png" ) bottom repeat-x;<br> border:1px solid #CCCCCC;<br> border-bottom:1px solid #999999;<br> border-right:1px solid #999999; <br> cursor: pointer;<br> }<br>.copyright-symbol {<br> color: red;<br>}<br>.copyright-message {<br> color: blue;<br>} | + | .iceOutTxt, .iceOutLbl {<br> font-family:'Lucida Sans Unicode','Lucida Grande','Helvetica','Arial',sans-serif;<br> font-size:11px;<br> <br> }<br>.body, table {<br> font-family:'Lucida Sans Unicode','Lucida Grande','Helvetica','Arial',sans-serif;<br> font-size:11px;<br> }<br> .heading .iceOutTxt<br> {<br> font-size: 11px;<br> font-weight: bold;<br> color: #708090;<br> }<br>.label-form {<br> color: #708090;<br> font-weight: normal;<br> }<br>.iceDatTblCol .iceCmdLnk span.iceOutTxt {<br> color: #00629A;<br> }<br>.button, .button-dis<br> {<br> color:#333333;<br> background: #FFFFFF url( "./css-images/button-background.png" ) bottom repeat-x;<br> border:1px solid #CCCCCC;<br> border-bottom:1px solid #999999;<br> border-right:1px solid #999999; <br> cursor: pointer;<br> }<br>.copyright-symbol {<br> color: red;<br>}<br>.copyright-message {<br> color: blue;<br>} |
− | .form-panel-label{<br>font-family:'Lucida Sans Unicode','Lucida Grande','Helvetica','Arial',sans-serif;<br>}<br>.form-panel-output{<br>font-family:'Lucida Sans Unicode','Lucida Grande','Helvetica','Arial',sans-serif;<br>}<br>.iceMnuItm a{<br> background-color: yellowgreen;<br> <br> color: white;<br>} | + | .form-panel-label{<br>font-family:'Lucida Sans Unicode','Lucida Grande','Helvetica','Arial',sans-serif;<br>}<br>.form-panel-output{<br>font-family:'Lucida Sans Unicode','Lucida Grande','Helvetica','Arial',sans-serif;<br>}<br>.iceMnuItm a{<br> background-color: yellowgreen;<br> <br> color: white;<br>} |
− | .iceMnuItm a:hover{<br> background-color: blue;<br>}<br> | + | .iceMnuItm a:hover{<br> background-color: blue;<br>}<br> |
− | + | <br> |
Revision as of 02:53, 9 July 2013
To apply branding and font on login page like shown in the image below use login.css
.iceOutTxt, .iceOutLbl {
font-family:'Lucida Sans Unicode','Lucida Grande','Helvetica','Arial',sans-serif;
color: #555;
}
div#loginBox .logo {
background: url("./images/smc_newlogo.jpg") no-repeat left top transparent;
border-bottom: 1px solid #CCCCCC;
clear: both;
color: #708090;
font-weight: bold;
height: 65px;
line-height: 70px;
width: auto;
}
div#loginBox .portalTitle {
font-family:'Lucida Sans Unicode','Lucida Grande','Helvetica','Arial',sans-serif;
color: #708090;
font-weight: bold;
height: 70px;
line-height: 70px;
width: auto;
}
.iceFrm {
font-family:'Lucida Sans Unicode','Lucida Grande','Helvetica','Arial',sans-serif;
color: #555;
background:#999;;
background: url("./images/smc_pic.jpg") no-repeat left center transparent;
border: none;
}
div#loginBox .buttonContainer input{
font-family:'Lucida Sans Unicode','Lucida Grande','Helvetica','Arial',sans-serif;
}
.iceCmdLnk, .iceOutLnk {
font-family:'Lucida Sans Unicode','Lucida Grande','Helvetica','Arial',sans-serif;
}
To change font of the UI, menu’s background and color of text on mouse hover, branding on banner, color of links on mouse hover use smcskin5.css
.panelHeaderTitle {
color: #708090;
font-weight: bold;
}
.panelHeader .iceCmdLnk:hover {
cursor: hand;
text-decoration: none;
}
.iceCmdLnk .panelHeaderTitle:hover {
color: #B0232B;
font-weight: bold;
}
.action-link
{
color: #00629A;
}
.action-link:hover
{
color: #B0232B;
text-decoration: underline;
}
.banner{
height: 70px;
width 100%;
background: #FFFFFF url(./images/smc_newlogo.jpg) left no-repeat;
border-bottom: 3px solid #FFFFFF;
}
.iceOutTxt, .iceOutLbl {
font-family:'Lucida Sans Unicode','Lucida Grande','Helvetica','Arial',sans-serif;
font-size:11px;
}
.body, table {
font-family:'Lucida Sans Unicode','Lucida Grande','Helvetica','Arial',sans-serif;
font-size:11px;
}
.heading .iceOutTxt
{
font-size: 11px;
font-weight: bold;
color: #708090;
}
.label-form {
color: #708090;
font-weight: normal;
}
.iceDatTblCol .iceCmdLnk span.iceOutTxt {
color: #00629A;
}
.button, .button-dis
{
color:#333333;
background: #FFFFFF url( "./css-images/button-background.png" ) bottom repeat-x;
border:1px solid #CCCCCC;
border-bottom:1px solid #999999;
border-right:1px solid #999999;
cursor: pointer;
}
.copyright-symbol {
color: red;
}
.copyright-message {
color: blue;
}
.form-panel-label{
font-family:'Lucida Sans Unicode','Lucida Grande','Helvetica','Arial',sans-serif;
}
.form-panel-output{
font-family:'Lucida Sans Unicode','Lucida Grande','Helvetica','Arial',sans-serif;
}
.iceMnuItm a{
background-color: yellowgreen;
color: white;
}
.iceMnuItm a:hover{
background-color: blue;
}