Copy the following code into the theme_base.css file. This code configures Siebel Open UI to display account names in a series of vertical boxes:
/*---------------------------------------------*/
/* Styles for alternate List display demo */
/*---------------------------------------------*/
.siebui-boxlist {
width: 100%;
height: 100%;
overflow: auto;
}
.siebui-boxlist-pager,.siebui-boxlist-items{
display: table-row;
white-space: nowrap;
width: 100%;
}
.siebui-boxlist-item, siebui-boxlist-item-selected {
padding: 100px 0px;
height: 40px;
border-radius: 5px;
float: left;
width: 120px;
overflow: hidden;
margin: 5px 12px;
color: #222!important;
text-shadow: 0 1px 0 rgba(255, 255, 255, 0.7);
text-align: center;
}
.siebui-boxlist-item {
background: rgb(250, 250, 250);
background: -moz-linear-gradient(top, rgba(250, 250, 250, 1) 0%, rgba(225, 225, 225, 1) 100%);
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, rgba(250, 250, 250, 1)), color-stop(100%, rgba(225, 225, 225, 1)));
background: -webkit-linear-gradient(top, rgba(250, 250, 250, 1) 0%, rgba(225, 225, 225, 1) 100%);
border-bottom: 1px solid #AAA;
box-shadow: 0 0 3px rgba(0, 0, 0, 0.4);
-webkit-box-shadow: 0 0 3px rgba(0, 0, 0, 0.4);
}
.siebui-boxlist-item-selected {
background: rgb(250, 250, 250);
background: -moz-linear-gradient(top, rgba(249, 238, 167, 0.5) 0%, rgba(251, 236, 136, 0.5) 100%)!important;
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, rgba(249, 238, 167, 0.5)), color-stop(100%, rgba(251, 236, 136, 0.5)))!important;
background: -webkit-linear-gradient(top, rgba(249, 238, 167, 0.5) 0%, rgba(251, 236, 136, 0.5) 100%)!important;
border-bottom: 1px solid #AAA;
box-shadow: 0 0 3px rgba(0, 0, 0, 0.4);
-webkit-box-shadow: 0 0 3px rgba(0, 0, 0, 0.4);
}
/*---------------------------------------------*/
/* Styles for alternate List display demo */
/*---------------------------------------------*/