toolbar.theme.css

toolbar.theme.css

File

drupal/core/modules/toolbar/css/toolbar.theme.css
View source
  1. /**

  2.  * @file toolbar.theme.css

  3.  */

  4. .toolbar {

  5.   font-family: "Source Sans Pro", "Lucida Grande", Verdana, sans-serif;

  6.   /* Set base font size to 13px based on root ems. */

  7.   font-size: 0.8125rem;

  8.   -moz-tap-highlight-color: rgba(0,0,0,0);

  9.   -o-tap-highlight-color: rgba(0,0,0,0);

  10.   -webkit-tap-highlight-color: rgba(0,0,0,0);

  11.   tap-highlight-color: rgba(0,0,0,0);

  12.   -moz-touch-callout: none;

  13.   -o-touch-callout: none;

  14.   -webkit-touch-callout: none;

  15.   touch-callout: none;

  16. }

  17. .toolbar a {

  18.   cursor: pointer;

  19.   padding: 1em 1.3333em;

  20.   text-decoration: none;

  21. }

  22. .toolbar a:hover {

  23.   text-decoration: underline;

  24. }

  25. 

  26. /**

  27.  * Toolbar bar.

  28.  */

  29. .toolbar .bar {

  30.   background-color: #0f0f0f;

  31.   box-shadow: -1px 0 3px 1px rgba(0, 0, 0, 0.3333); /* LTR */

  32.   color: #dddddd;

  33. }

  34. .toolbar .bar a {

  35.   color: #ffffff;

  36. }

  37. .toolbar .bar .tab > a {

  38.   font-weight: bold;

  39. }

  40. .toolbar .bar .tab > a:hover {

  41.   background-image: -webkit-linear-gradient(rgba(255, 255, 255, 0.125) 20%, transparent 200%);

  42.   background-image: linear-gradient(rgba(255, 255, 255, 0.125) 20%, transparent 200%);

  43.   text-decoration: none;

  44. }

  45. .toolbar .bar .tab > a.active {

  46.   background-image: -webkit-linear-gradient(rgba(255, 255, 255, 0.25) 20%, transparent 200%);

  47.   background-image: linear-gradient(rgba(255, 255, 255, 0.25) 20%, transparent 200%);

  48. }

  49. 

  50. /**

  51.  * Toolbar tray.

  52.  */

  53. .toolbar .tray {

  54.   background-color: #ffffff;

  55. }

  56. .toolbar .horizontal > .lining {

  57.   padding-right: 5em; /* LTR */

  58. }

  59. .toolbar .vertical > .lining,

  60. .toolbar .vertical > .lining:before {

  61.   background-color: #ffffff;

  62.   border-right: 1px solid #aaaaaa; /* LTR */

  63. }

  64. .toolbar .vertical > .lining:before {

  65.   box-shadow: -1px 0 5px 2px rgba(0, 0, 0, 0.3333); /* LTR */

  66. }

  67. .toolbar .horizontal {

  68.   border-bottom: 1px solid #aaaaaa;

  69.   box-shadow: -2px 1px 3px 1px rgba(0, 0, 0, 0.3333); /* LTR */

  70. }

  71. .toolbar .horizontal .tray {

  72.   background-color: #f5f5f5;

  73. }

  74. .toolbar .tray a {

  75.   color: #707070;

  76. }

  77. .toolbar .tray a:hover,

  78. .toolbar .tray a:active,

  79. .toolbar .tray a.active {

  80.   color: #000;

  81. }

  82. .toolbar .horizontal .menu {

  83.   background-color: #ffffff;

  84. }

  85. .toolbar .horizontal .menu li + li {

  86.   border-left: 1px solid #dddddd; /* LTR */

  87. }

  88. .toolbar .horizontal .menu li:last-child {

  89.   border-right: 1px solid #dddddd; /* LTR */

  90. }

  91. .toolbar .vertical .menu li + li {

  92.   border-top: 1px solid #dddddd;

  93. }

  94. .toolbar .vertical .menu li:last-child {

  95.   border-bottom: 1px solid #dddddd;

  96. }

  97. .toolbar .vertical .menu .menu li {

  98.   border: 0 none;

  99. }

  100. .toolbar .vertical .menu ul ul {

  101.   border-bottom: 1px solid #dddddd;

  102.   border-top: 1px solid #dddddd;

  103. }

  104. .toolbar .vertical .menu li:last-child > ul {

  105.   border-bottom: 0;

  106. }

  107. .toolbar .vertical .menu .menu .menu {

  108.   margin-left: 1.3333em; /* LTR */

  109. }

  110. .toolbar .vertical .menu .menu .menu .menu {

  111.   margin-left: 0.25em; /* LTR */

  112. }

  113. .toolbar .menu .menu a {

  114.   color: #434343;

  115. }

  116. .toolbar .vertical .menu .menu .menu a {

  117.   padding-left: 0.6667em; /* LTR */

  118. }

  119. 

  120. /**

  121.  * Orientation toggle.

  122.  */

  123. .toolbar .toggle-orientation {

  124.   background-color: #f5f5f5;

  125.   padding: 0.6667em;

  126. }

  127. .toolbar .horizontal .toggle-orientation {

  128.   border-left: 1px solid #c9c9c9; /* LTR */

  129. }

  130. .toolbar .toggle-orientation > .lining {

  131.   float: right; /* LTR */

  132.   padding: 0.1667em;

  133. }

  134. .toolbar .toggle-orientation button {

  135.   cursor: pointer;

  136.   display: inline-block;

  137.   height: 16px;

  138.   padding: 0;

  139.   text-indent: -999em;

  140.   width: 20px;

  141. }

  142. .toolbar .toggle-orientation button:before {

  143.   left: 0; /* LTR */

  144. }

  145. .toolbar .toggle-orientation [value="vertical"]:before {

  146.   background-image: url('../images/icon-toggle-vertical.png'); /* LTR */

  147. }

  148. .toolbar .toggle-orientation [value="horizontal"]:before {

  149.   background-image: url('../images/icon-toggle-horizontal.png');

  150. }