vertical-tabs.css

Same filename in this branch
  1. 8.x drupal/core/misc/vertical-tabs.css
  2. 8.x drupal/core/themes/seven/vertical-tabs.css
/**
 * Override of misc/vertical-tabs.css.
 */
.vertical-tabs {
  position: relative;
  overflow: hidden;
  margin: 10px 0;
  border: 1px solid #bdbdbd;
  border-radius: 4px;
  background: #e6e5e1;
}
.vertical-tabs-list {
  float: left; /* LTR */
  width: 240px;
  margin: 0 -100% -1px 0; /* LTR */
  padding: 0;
  border-bottom: 1px solid #ccc;
  line-height: 1;
}
.vertical-tab-button {
  position: relative;
  margin: 0;
  list-style: none;
  list-style-image: none;
}
.vertical-tab-button.selected {
  z-index: 1;
  overflow-x: hidden;
  width: 100%;
  border-right: 1px solid #fcfcfa; /* LTR */
  box-shadow: 0 5px 5px -5px hsla(0, 0%, 0%, 0.3);
}
.vertical-tab-button:focus,
.vertical-tab-button:active {
  z-index: 2;
}
.vertical-tab-button a {
  display: block;
  padding: 10px 15px 15px;
  border-bottom: 1px solid #b3b2ad;
  background-color: #f2f2f0;
  text-shadow: 0 1px hsla(0, 0%, 100%, 0.6);
  text-decoration: none;
}
.vertical-tab-button.last a {
  border-bottom: 0;
}
.vertical-tab-button.selected a,
.vertical-tab-button a:hover,
.vertical-tab-button a:focus {
  background: #fcfcfa;
  text-shadow: none;
  text-decoration: none;
}
.vertical-tab-button.selected a {
  border-bottom-color: #b3b2ad;
  color: #004f80;
}
.vertical-tab-button.selected a:hover,
.vertical-tab-button.selected a:focus {
  color: #007ecc;
}
.vertical-tabs-panes {
  margin: 0 0 0 240px; /* LTR */
  padding: 10px 15px 10px 15px;
  border-left: 1px solid #a6a5a1; /* LTR */
  background-color: #fcfcfa;
}
.vertical-tabs-panes:after {
  content: "";
  display: table;
  clear: both;
}
.vertical-tabs-pane {
  margin: 0;
  padding: 0;
  border: 0;
  color: #595959;
}
.vertical-tab-button strong {
  font-size: 0.923em;
}
.vertical-tab-button .summary {
  display: block;
  padding-top: 0.4em;
  color: #666;
  font-size: 0.846em;
}
.vertical-tab-button.selected a:focus strong {
  text-decoration: underline;
}
.vertical-tabs-pane > summary {
  display: none;
}

File

drupal/core/themes/seven/vertical-tabs.css
View source
  1. /**

  2.  * Override of misc/vertical-tabs.css.

  3.  */

  4. .vertical-tabs {

  5.   position: relative;

  6.   overflow: hidden;

  7.   margin: 10px 0;

  8.   border: 1px solid #bdbdbd;

  9.   border-radius: 4px;

  10.   background: #e6e5e1;

  11. }

  12. .vertical-tabs-list {

  13.   float: left; /* LTR */

  14.   width: 240px;

  15.   margin: 0 -100% -1px 0; /* LTR */

  16.   padding: 0;

  17.   border-bottom: 1px solid #ccc;

  18.   line-height: 1;

  19. }

  20. .vertical-tab-button {

  21.   position: relative;

  22.   margin: 0;

  23.   list-style: none;

  24.   list-style-image: none;

  25. }

  26. .vertical-tab-button.selected {

  27.   z-index: 1;

  28.   overflow-x: hidden;

  29.   width: 100%;

  30.   border-right: 1px solid #fcfcfa; /* LTR */

  31.   box-shadow: 0 5px 5px -5px hsla(0, 0%, 0%, 0.3);

  32. }

  33. .vertical-tab-button:focus,

  34. .vertical-tab-button:active {

  35.   z-index: 2;

  36. }

  37. .vertical-tab-button a {

  38.   display: block;

  39.   padding: 10px 15px 15px;

  40.   border-bottom: 1px solid #b3b2ad;

  41.   background-color: #f2f2f0;

  42.   text-shadow: 0 1px hsla(0, 0%, 100%, 0.6);

  43.   text-decoration: none;

  44. }

  45. .vertical-tab-button.last a {

  46.   border-bottom: 0;

  47. }

  48. .vertical-tab-button.selected a,

  49. .vertical-tab-button a:hover,

  50. .vertical-tab-button a:focus {

  51.   background: #fcfcfa;

  52.   text-shadow: none;

  53.   text-decoration: none;

  54. }

  55. .vertical-tab-button.selected a {

  56.   border-bottom-color: #b3b2ad;

  57.   color: #004f80;

  58. }

  59. .vertical-tab-button.selected a:hover,

  60. .vertical-tab-button.selected a:focus {

  61.   color: #007ecc;

  62. }

  63. .vertical-tabs-panes {

  64.   margin: 0 0 0 240px; /* LTR */

  65.   padding: 10px 15px 10px 15px;

  66.   border-left: 1px solid #a6a5a1; /* LTR */

  67.   background-color: #fcfcfa;

  68. }

  69. .vertical-tabs-panes:after {

  70.   content: "";

  71.   display: table;

  72.   clear: both;

  73. }

  74. .vertical-tabs-pane {

  75.   margin: 0;

  76.   padding: 0;

  77.   border: 0;

  78.   color: #595959;

  79. }

  80. .vertical-tab-button strong {

  81.   font-size: 0.923em;

  82. }

  83. .vertical-tab-button .summary {

  84.   display: block;

  85.   padding-top: 0.4em;

  86.   color: #666;

  87.   font-size: 0.846em;

  88. }

  89. .vertical-tab-button.selected a:focus strong {

  90.   text-decoration: underline;

  91. }

  92. .vertical-tabs-pane > summary {

  93.   display: none;

  94. }