You are here

Home » API reference » Views Showcase 6

right.css in Views Showcase 6 

.views-showcase {
  background-color: #000;
  width: 520px;
  height: 200px;
  padding: 10px !important;
}

.views-showcase .views-showcase-big-panel ul {
  list-style-image:none;
  margin:0;
  padding:0;
  height: 200px;
}

.views-showcase .views-showcase-big-panel li {
  list-style-image: none;
  margin:0;
  padding:0;
  background: none;
}

.views-showcase-mini-list .views-showcase-pager-item .views-showcase-thumbnail,
.views-showcase-mini-list .views-showcase-pager-item .views-showcase-teaser{
  display: none;
}

.views-showcase-mini-list {
  float: right;
  width: 180px;
  overflow: hidden;
  height: 200px;
  background-color: #000;
}

.views-showcase-big-panel {
  float: left;
  width: 340px;
  height: 220px;
}

.views-showcase-pager-item {
  height: 30px;
  background-color: #000;
  opacity: 0.7;
  filter: alpha(opacity=70);
  padding: 0 5px;
  border-bottom: 1px dashed #FFF;
}

.activeItem, .views-showcase-pager-item:hover {
  background-color: #666;
  opacity: 0.7;
  filter: alpha(opacity=70);
}

.views-showcase-pager-item .views-showcase-title a {
  color: #FFF;
  text-decoration: none;
}

.views-showcase-big-panel .views-showcase-thumbnail {
  height: 200px;
}

.views-showcase-big-panel .views-showcase-teaser {
  background: #000;
  color: #FFFFFF;
  padding: 10px;
  padding-top: 30px;
  width: 320px;
  opacity: 0.8;
  filter: alpha(opacity=80);
  z-index: 2;
  top: -120px;
  height: 40px;
  position: relative;
}


.views-showcase-big-panel .views-showcase-title {
  position: relative;
  width: 320px;
  padding: 5px 0 0 10px;
  opacity: 0.8;
  filter: alpha(opacity=80);
  z-index: 3;
  top: -75px;
  height: 40px;
  z-index: 3;
}

.views-showcase-big-panel .views-showcase-title a {
  color: #FFFFFF;
  font-weight: bold;
  font-size: 23px;
  text-decoration: none;
}

.views-showcase-field-label, .views-showcase-field-content {
  display: inline;
}

File

skins/right.css
View source 
  1. .views-showcase {

  2.   background-color: #000;

  3.   width: 520px;

  4.   height: 200px;

  5.   padding: 10px !important;

  6. }

  7. 

  8. .views-showcase .views-showcase-big-panel ul {

  9.   list-style-image:none;

  10.   margin:0;

  11.   padding:0;

  12.   height: 200px;

  13. }

  14. 

  15. .views-showcase .views-showcase-big-panel li {

  16.   list-style-image: none;

  17.   margin:0;

  18.   padding:0;

  19.   background: none;

  20. }

  21. 

  22. .views-showcase-mini-list .views-showcase-pager-item .views-showcase-thumbnail,

  23. .views-showcase-mini-list .views-showcase-pager-item .views-showcase-teaser{

  24.   display: none;

  25. }

  26. 

  27. .views-showcase-mini-list {

  28.   float: right;

  29.   width: 180px;

  30.   overflow: hidden;

  31.   height: 200px;

  32.   background-color: #000;

  33. }

  34. 

  35. .views-showcase-big-panel {

  36.   float: left;

  37.   width: 340px;

  38.   height: 220px;

  39. }

  40. 

  41. .views-showcase-pager-item {

  42.   height: 30px;

  43.   background-color: #000;

  44.   opacity: 0.7;

  45.   filter: alpha(opacity=70);

  46.   padding: 0 5px;

  47.   border-bottom: 1px dashed #FFF;

  48. }

  49. 

  50. .activeItem, .views-showcase-pager-item:hover {

  51.   background-color: #666;

  52.   opacity: 0.7;

  53.   filter: alpha(opacity=70);

  54. }

  55. 

  56. .views-showcase-pager-item .views-showcase-title a {

  57.   color: #FFF;

  58.   text-decoration: none;

  59. }

  60. 

  61. .views-showcase-big-panel .views-showcase-thumbnail {

  62.   height: 200px;

  63. }

  64. 

  65. .views-showcase-big-panel .views-showcase-teaser {

  66.   background: #000;

  67.   color: #FFFFFF;

  68.   padding: 10px;

  69.   padding-top: 30px;

  70.   width: 320px;

  71.   opacity: 0.8;

  72.   filter: alpha(opacity=80);

  73.   z-index: 2;

  74.   top: -120px;

  75.   height: 40px;

  76.   position: relative;

  77. }

  78. 

  79. 

  80. .views-showcase-big-panel .views-showcase-title {

  81.   position: relative;

  82.   width: 320px;

  83.   padding: 5px 0 0 10px;

  84.   opacity: 0.8;

  85.   filter: alpha(opacity=80);

  86.   z-index: 3;

  87.   top: -75px;

  88.   height: 40px;

  89.   z-index: 3;

  90. }

  91. 

  92. .views-showcase-big-panel .views-showcase-title a {

  93.   color: #FFFFFF;

  94.   font-weight: bold;

  95.   font-size: 23px;

  96.   text-decoration: none;

  97. }

  98. 

  99. .views-showcase-field-label, .views-showcase-field-content {

  100.   display: inline;

  101. }