You are here

Home » API reference » Shoutbox 6

shoutbox.css in Shoutbox 6

Same filename and directory in other branches
  1. 5 shoutbox.css
  2. 6.2 shoutbox.css
  3. 7.2 shoutbox.css
  4. 7 shoutbox.css
#shoutbox-body {
    font-size : xx-small;
    margin: 0px;
    padding: 2px;
    border: 1px solid #bbb;
    overflow: auto;
}

/* override drupal.css values */
.shoutbox-add-form .form-item {
    margin-top: 0em;
    margin-bottom: 0em;
}

.shoutbox-view-form .form-submit {
    visibility: hidden;
    display:none;
}

/* 
shoutbox block: main divs 
*/
div#shoutbox-posts {
    text-align: left;
}

div.shoutbox-msg {
    color: #000000;
    font-size : xx-small;
    padding: 5px 0px 5px 0px;
}

div.shoutbox-add-form {	
    text-align: center;
    margin: 3px 0 0 0;
}

div.shoutbox-archive a, div.shoutbox-archive a:visited {
    text-align: center;
    color: #fff;
    background-color: #999;
    display: block;
}

div.shoutbox-archive a:hover {
    color: #fff;
    background-color: #aaa;
    text-decoration: none;
}

/* 
shoutbox box: nested elements 
*/
div.shoutbox-even {
    color : #000000;
    background-color : #eee;
    width: 100%;
}

div.shoutbox-odd {
    color : #000000;
    background-color : #fff;
    width: 100%;
}

.shoutbox-addinput {
    width: 100%;
}

.shoutbox-queue-title {
    font-weight: bold;
    color: #FFFFFF;
    background-color: #999;
    text-align: center;
}

/*
other shoutbox pages
*/
.shoutbox-add-form input.form-text {
    width: 95%;
}

.shoutbox-add-form input.textarea {
    width: 95%;
}

.shoutbox-unpublished {
    background-color: #f00;
}

#shoutbox-throbber {
    width: 16px;
    height: 16px;
    margin: 2px;
    margin-left: 40%; 
    background: transparent url(throbber.gif) no-repeat;
}

/*
 * Image replacement
 *
 */
div.shoutbox-msg a.edit-shout,
div.shoutbox-msg a.delete-shout,
div.shoutbox-msg a.publish-shout,
div.shoutbox-msg a.unpublish-shout
{
    display: block;
    float: right;
    padding-right: 1px;   
}

div.shoutbox-msg a.edit-shout {
    text-indent: -5000px;
    background: url(icon_edit.gif) no-repeat;
    height: 15px; 
    width: 15px;
}

div.shoutbox-msg a.delete-shout {
    text-indent: -5000px;
    background: url(icon_delete.gif) no-repeat;
    height: 15px; 
    width: 15px;
}

div.shoutbox-msg a.publish-shout {
    text-indent: -5000px;
    background: url(thumb_up.gif) no-repeat;
    height: 15px; 
    width: 15px;
}

div.shoutbox-msg a.unpublish-shout {
    text-indent: -5000px;
    background: url(thumb_down.gif) no-repeat;
    height: 15px; 
    width: 15px;
}

File

shoutbox.css
View source 
  1. 

  2. #shoutbox-body {

  3.     font-size : xx-small;

  4.     margin: 0px;

  5.     padding: 2px;

  6.     border: 1px solid #bbb;

  7.     overflow: auto;

  8. }

  9. 

  10. /* override drupal.css values */

  11. .shoutbox-add-form .form-item {

  12.     margin-top: 0em;

  13.     margin-bottom: 0em;

  14. }

  15. 

  16. .shoutbox-view-form .form-submit {

  17.     visibility: hidden;

  18.     display:none;

  19. }

  20. 

  21. /* 

  22. shoutbox block: main divs 

  23. */

  24. div#shoutbox-posts {

  25.     text-align: left;

  26. }

  27. 

  28. div.shoutbox-msg {

  29.     color: #000000;

  30.     font-size : xx-small;

  31.     padding: 5px 0px 5px 0px;

  32. }

  33. 

  34. div.shoutbox-add-form {	

  35.     text-align: center;

  36.     margin: 3px 0 0 0;

  37. }

  38. 

  39. div.shoutbox-archive a, div.shoutbox-archive a:visited {

  40.     text-align: center;

  41.     color: #fff;

  42.     background-color: #999;

  43.     display: block;

  44. }

  45. 

  46. div.shoutbox-archive a:hover {

  47.     color: #fff;

  48.     background-color: #aaa;

  49.     text-decoration: none;

  50. }

  51. 

  52. /* 

  53. shoutbox box: nested elements 

  54. */

  55. div.shoutbox-even {

  56.     color : #000000;

  57.     background-color : #eee;

  58.     width: 100%;

  59. }

  60. 

  61. div.shoutbox-odd {

  62.     color : #000000;

  63.     background-color : #fff;

  64.     width: 100%;

  65. }

  66. 

  67. .shoutbox-addinput {

  68.     width: 100%;

  69. }

  70. 

  71. .shoutbox-queue-title {

  72.     font-weight: bold;

  73.     color: #FFFFFF;

  74.     background-color: #999;

  75.     text-align: center;

  76. }

  77. 

  78. /*

  79. other shoutbox pages

  80. */

  81. .shoutbox-add-form input.form-text {

  82.     width: 95%;

  83. }

  84. 

  85. .shoutbox-add-form input.textarea {

  86.     width: 95%;

  87. }

  88. 

  89. .shoutbox-unpublished {

  90.     background-color: #f00;

  91. }

  92. 

  93. #shoutbox-throbber {

  94.     width: 16px;

  95.     height: 16px;

  96.     margin: 2px;

  97.     margin-left: 40%; 

  98.     background: transparent url(throbber.gif) no-repeat;

  99. }

  100. 

  101. /*

  102.  * Image replacement

  103.  *

  104.  */

  105. div.shoutbox-msg a.edit-shout,

  106. div.shoutbox-msg a.delete-shout,

  107. div.shoutbox-msg a.publish-shout,

  108. div.shoutbox-msg a.unpublish-shout

  109. {

  110.     display: block;

  111.     float: right;

  112.     padding-right: 1px;   

  113. }

  114. 

  115. div.shoutbox-msg a.edit-shout {

  116.     text-indent: -5000px;

  117.     background: url(icon_edit.gif) no-repeat;

  118.     height: 15px; 

  119.     width: 15px;

  120. }

  121. 

  122. div.shoutbox-msg a.delete-shout {

  123.     text-indent: -5000px;

  124.     background: url(icon_delete.gif) no-repeat;

  125.     height: 15px; 

  126.     width: 15px;

  127. }

  128. 

  129. div.shoutbox-msg a.publish-shout {

  130.     text-indent: -5000px;

  131.     background: url(thumb_up.gif) no-repeat;

  132.     height: 15px; 

  133.     width: 15px;

  134. }

  135. 

  136. div.shoutbox-msg a.unpublish-shout {

  137.     text-indent: -5000px;

  138.     background: url(thumb_down.gif) no-repeat;

  139.     height: 15px; 

  140.     width: 15px;

  141. }