You are here

quickbar.css in Quickbar 6

Same filename and directory in other branches
  1. 7.2 theme/quickbar.css
  2. 7 theme/quickbar.css
/**
 * Aggressive resets so we can achieve a consistent look in
 * hostile CSS environments.
 */
#quickbar,
#quickbar * {
  border: 0;
  font-size: 100%;
  line-height: inherit;
  margin: 0;
  outline: 0;
  padding: 0;
  text-align: left;
  vertical-align: baseline;
}

/**
 * Base styles
 */
#quickbar {
  background: url(sprite.png) 0px -20px repeat-x;
  color: #ccc;
  font: normal 11px/20px "Lucida Grande",Verdana,sans-serif;
  position: relative;
  z-index: 100;
}

body.quickbar-sticky {
  margin-top: 30px;
}

#quickbar.sticky {
  position: fixed;
  top: 0;
  width: 100%;
}

#quickbar .collapsed {
  display: none;
}

#quickbar div.shadow {
  background: url(sprite.png) 0 -100px repeat-x;
  bottom: -10px;
  height: 10px;
  left: 0;
  position: absolute;
  right: 0;
}

#quickbar a {
  color: #fff;
  text-decoration: none;
}

#quickbar ul.links li,
#quickbar ul.links li a {
  float: left; /* LTR */
}

/**
 * First level menus
 */
#quickbar div.depth-0 {
  height: 20px;
  line-height: 20px;
  overflow: hidden;
  padding: 5px 10px;
}

#quickbar div.depth-0 #quickbar-admin {
  float: left; /* LTR */
}

#quickbar div.depth-0 #quickbar-user {
  float: right; /* LTR */
}

#quickbar div.depth-0 ul.links li a {
  -moz-border-radius: 10px;
  -webkit-border-radius: 10px;
  border-radius: 10px;
  padding: 0 10px;
}

#quickbar div.depth-0 ul.links li a.active {
  background: url(sprite.png) 0 0 repeat-x;
  text-shadow: #333 0 1px 0;
}

#quickbar div.depth-0 .icon {
  display: none;
}

/**
 * Second level menus
 */
#quickbar div.depth-1 {
  padding: 0 10px;
  position: relative;
}

#quickbar div.depth-1 span.close {
  background: url(sprite.png) 0 -135px no-repeat;
  cursor: pointer;
  height: 20px;
  overflow: hidden;
  position: absolute;
  right: 10px; /* LTR */
  text-indent: -9999px;
  top: 15px;
  width: 20px;
}

#quickbar div.depth-1 ul.links {
  float: left; /* LTR */
  height: 40px;
  line-height: 30px;
  overflow: hidden;
  padding: 5px 0;
}

#quickbar div.depth-1 ul.links li.view-all {
  background-color: transparent;
  margin: 0;
  padding: 10px 0;
  position: absolute;
  right: 40px; /* LTR */
  top: 5px;
}

#quickbar div.depth-1 ul.links li.view-all a
#quickbar div.depth-1 ul.links li.view-all a.active, {
  background: #333 url(sprite.png) 100% -135px no-repeat;
  -moz-border-radius: 10px;
  -webkit-border-radius: 10px;
  border-radius: 10px;
  font-size: 9px;
  line-height: 20px;
  margin: 0;
  padding: 0 15px 0 10px;
  text-transform: uppercase;
}
#quickbar div.depth-1 ul.links li a {
  -moz-border-radius: 5px;
  -webkit-border-radius: 5px;
  border-radius: 5px;
  margin-right: 5px;
  padding: 5px 15px 5px 5px;
}
#quickbar div.depth-1 ul.links li a.active {
  background-color: #333;
}

#quickbar div.depth-1 span.icon {
  float: left; /* LTR */
  height: 30px;
  margin-right: 5px; /* LTR */
  width: 30px;
}

File

theme/quickbar.css
View source
  1. /**
  2. * Aggressive resets so we can achieve a consistent look in
  3. * hostile CSS environments.
  4. */
  5. #quickbar,
  6. #quickbar * {
  7. border: 0;
  8. font-size: 100%;
  9. line-height: inherit;
  10. margin: 0;
  11. outline: 0;
  12. padding: 0;
  13. text-align: left;
  14. vertical-align: baseline;
  15. }
  16. /**
  17. * Base styles
  18. */
  19. #quickbar {
  20. background: url(sprite.png) 0px -20px repeat-x;
  21. color: #ccc;
  22. font: normal 11px/20px "Lucida Grande",Verdana,sans-serif;
  23. position: relative;
  24. z-index: 100;
  25. }
  26. body.quickbar-sticky {
  27. margin-top: 30px;
  28. }
  29. #quickbar.sticky {
  30. position: fixed;
  31. top: 0;
  32. width: 100%;
  33. }
  34. #quickbar .collapsed {
  35. display: none;
  36. }
  37. #quickbar div.shadow {
  38. background: url(sprite.png) 0 -100px repeat-x;
  39. bottom: -10px;
  40. height: 10px;
  41. left: 0;
  42. position: absolute;
  43. right: 0;
  44. }
  45. #quickbar a {
  46. color: #fff;
  47. text-decoration: none;
  48. }
  49. #quickbar ul.links li,
  50. #quickbar ul.links li a {
  51. float: left; /* LTR */
  52. }
  53. /**
  54. * First level menus
  55. */
  56. #quickbar div.depth-0 {
  57. height: 20px;
  58. line-height: 20px;
  59. overflow: hidden;
  60. padding: 5px 10px;
  61. }
  62. #quickbar div.depth-0 #quickbar-admin {
  63. float: left; /* LTR */
  64. }
  65. #quickbar div.depth-0 #quickbar-user {
  66. float: right; /* LTR */
  67. }
  68. #quickbar div.depth-0 ul.links li a {
  69. -moz-border-radius: 10px;
  70. -webkit-border-radius: 10px;
  71. border-radius: 10px;
  72. padding: 0 10px;
  73. }
  74. #quickbar div.depth-0 ul.links li a.active {
  75. background: url(sprite.png) 0 0 repeat-x;
  76. text-shadow: #333 0 1px 0;
  77. }
  78. #quickbar div.depth-0 .icon {
  79. display: none;
  80. }
  81. /**
  82. * Second level menus
  83. */
  84. #quickbar div.depth-1 {
  85. padding: 0 10px;
  86. position: relative;
  87. }
  88. #quickbar div.depth-1 span.close {
  89. background: url(sprite.png) 0 -135px no-repeat;
  90. cursor: pointer;
  91. height: 20px;
  92. overflow: hidden;
  93. position: absolute;
  94. right: 10px; /* LTR */
  95. text-indent: -9999px;
  96. top: 15px;
  97. width: 20px;
  98. }
  99. #quickbar div.depth-1 ul.links {
  100. float: left; /* LTR */
  101. height: 40px;
  102. line-height: 30px;
  103. overflow: hidden;
  104. padding: 5px 0;
  105. }
  106. #quickbar div.depth-1 ul.links li.view-all {
  107. background-color: transparent;
  108. margin: 0;
  109. padding: 10px 0;
  110. position: absolute;
  111. right: 40px; /* LTR */
  112. top: 5px;
  113. }
  114. #quickbar div.depth-1 ul.links li.view-all a
  115. #quickbar div.depth-1 ul.links li.view-all a.active, {
  116. background: #333 url(sprite.png) 100% -135px no-repeat;
  117. -moz-border-radius: 10px;
  118. -webkit-border-radius: 10px;
  119. border-radius: 10px;
  120. font-size: 9px;
  121. line-height: 20px;
  122. margin: 0;
  123. padding: 0 15px 0 10px;
  124. text-transform: uppercase;
  125. }
  126. #quickbar div.depth-1 ul.links li a {
  127. -moz-border-radius: 5px;
  128. -webkit-border-radius: 5px;
  129. border-radius: 5px;
  130. margin-right: 5px;
  131. padding: 5px 15px 5px 5px;
  132. }
  133. #quickbar div.depth-1 ul.links li a.active {
  134. background-color: #333;
  135. }
  136. #quickbar div.depth-1 span.icon {
  137. float: left; /* LTR */
  138. height: 30px;
  139. margin-right: 5px; /* LTR */
  140. width: 30px;
  141. }