Heading.css 2.6 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485
  1. /* dojox.mobile.Heading */
  2. .mblHeading {
  3. position: relative;
  4. margin: 0px;
  5. width: 100%;
  6. overflow: hidden;
  7. white-space: nowrap;
  8. text-overflow: ellipsis;
  9. z-index: 1;
  10. padding: 0;
  11. height: 40px;
  12. background-color: #5cb0ff;
  13. background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0, #ffffff), color-stop(2.5%, #ffffff), color-stop(2.5%, rgba(255, 255, 255, 0.14)), color-stop(5%, rgba(255, 255, 255, 0.14)), color-stop(5%, rgba(255, 255, 255, 0.52)), color-stop(7.5%, rgba(255, 255, 255, 0.52)), color-stop(7.5%, rgba(255, 255, 255, 0.68)), color-stop(10%, rgba(255, 255, 255, 0.68)), color-stop(1, rgba(255, 255, 255, 0)));
  14. border-bottom: 1px solid #769dc0;
  15. color: #131313;
  16. font-size: 18px;
  17. font-family: Helvetica;
  18. font-weight: normal;
  19. text-shadow: rgba(0, 0, 0, 0.2) 0px 1px 2px;
  20. text-align: center;
  21. line-height: 42px;
  22. }
  23. .mblHeading * {
  24. z-index: 2;
  25. }
  26. .mblHeadingDivTitle {
  27. position: absolute;
  28. width: 100%;
  29. display: none;
  30. left: 0px;
  31. z-index: 1;
  32. }
  33. .mblHeadingCenterTitle .mblHeadingDivTitle {
  34. display: block;
  35. }
  36. .mblHeadingCenterTitle .mblHeadingSpanTitle {
  37. display: none;
  38. }
  39. /* Heading Arrow Button */
  40. .mblArrowButton {
  41. position: relative;
  42. float: left;
  43. height: 30px;
  44. margin: 0px 8px;
  45. }
  46. .mblArrowButtonHead {
  47. position: absolute;
  48. top: 5px;
  49. left: 17px;
  50. width: 21px;
  51. height: 21px;
  52. border: 1px solid #b5bcc7;
  53. -webkit-transform-origin: left top;
  54. -webkit-transform: scale(0.9, 0.99) rotate(45deg);
  55. background-color: #5cb0ff;
  56. background-image: -webkit-gradient(linear, left top, right bottom, color-stop(0, #ffffff), color-stop(3.3333333333333335%, rgba(255, 255, 255, 0.1)), color-stop(0.5, rgba(255, 255, 255, 0.6)), color-stop(1, rgba(255, 255, 255, 0.3)));
  57. }
  58. .dj_chrome .mblArrowButtonHead {
  59. border-style: inset;
  60. }
  61. .mblArrowButtonBody {
  62. position: absolute;
  63. cursor: pointer;
  64. -webkit-tap-highlight-color: rgba(255, 255, 255, 0);
  65. top: 5px;
  66. left: 17px;
  67. padding: 0px 10px 0px 3px;
  68. height: 30px;
  69. border-width: 1px 1px 1px 0px;
  70. border-style: inset;
  71. border-color: #b5bcc7;
  72. font-size: 14px;
  73. font-family: Helvetica;
  74. font-weight: normal;
  75. text-shadow: none;
  76. color: #131313;
  77. line-height: 30px;
  78. -webkit-border-top-right-radius: 2px;
  79. -webkit-border-bottom-right-radius: 2px;
  80. background-color: #5cb0ff;
  81. background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0, #ffffff), color-stop(3.3333333333333335%, rgba(255, 255, 255, 0.1)), color-stop(0.5, rgba(255, 255, 255, 0.6)), color-stop(1, rgba(255, 255, 255, 0.3)));
  82. }
  83. .mblArrowButtonSelected .mblArrowButtonHead, .mblArrowButtonSelected .mblArrowButtonBody {
  84. background-color: #0064c2;
  85. }