vertical-tabs.css

Same filename in this branch
  1. 9.x drupal/core/misc/vertical-tabs.css
  2. 9.x drupal/core/themes/seven/vertical-tabs.css
div.vertical-tabs {
  margin: 1em 0 1em 15em; /* LTR */
  border: 1px solid #ccc;
}
.vertical-tabs ul.vertical-tabs-list {
  width: 15em;
  list-style: none;
  border-top: 1px solid #ccc;
  padding: 0;
  margin: -1px 0 -1px -15em; /* LTR */
  float: left; /* LTR */
}
.vertical-tabs .vertical-tabs-pane {
  margin: 0;
  border: 0;
}
.vertical-tabs-pane > summary {
  display: none;
}

/* Layout of each tab */
.vertical-tabs ul.vertical-tabs-list li {
  background: #eee;
  border: 1px solid #ccc;
  border-top: 0;
  padding: 0;
  margin: 0;
}
.vertical-tabs ul.vertical-tabs-list li a {
  display: block;
  text-decoration: none;
  padding: 0.5em 0.6em;
}
.vertical-tabs ul.vertical-tabs-list li a:focus strong,
.vertical-tabs ul.vertical-tabs-list li a:active strong,
.vertical-tabs ul.vertical-tabs-list li a:hover strong {
  text-decoration: underline;
}
.vertical-tabs ul.vertical-tabs-list li a:hover {
  outline: 1px dotted;
}
.vertical-tabs ul.vertical-tabs-list li.selected {
  background-color: #fff;
  border-right-width: 0; /* LTR */
}
.vertical-tabs ul.vertical-tabs-list .selected strong {
  color: #000;
}
.vertical-tabs ul.vertical-tabs-list .summary {
  display: block;
}
.vertical-tabs ul.vertical-tabs ul.vertical-tabs-list .summary {
  line-height: normal;
  margin-bottom: 0;
}

/**
 * Prevent text inputs from overflowing when container is too narrow. "width" is
 * applied to override hardcoded cols or size attributes and used in conjunction
 * with "box-sizing" to prevent box model issues from occurring in most browsers.
*/
.vertical-tabs .form-type-textfield input {
  max-width: 100%;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}

File

drupal/core/misc/vertical-tabs.css
View source
  1. 

  2. div.vertical-tabs {

  3.   margin: 1em 0 1em 15em; /* LTR */

  4.   border: 1px solid #ccc;

  5. }

  6. .vertical-tabs ul.vertical-tabs-list {

  7.   width: 15em;

  8.   list-style: none;

  9.   border-top: 1px solid #ccc;

  10.   padding: 0;

  11.   margin: -1px 0 -1px -15em; /* LTR */

  12.   float: left; /* LTR */

  13. }

  14. .vertical-tabs .vertical-tabs-pane {

  15.   margin: 0;

  16.   border: 0;

  17. }

  18. .vertical-tabs-pane > summary {

  19.   display: none;

  20. }

  21. 

  22. /* Layout of each tab */

  23. .vertical-tabs ul.vertical-tabs-list li {

  24.   background: #eee;

  25.   border: 1px solid #ccc;

  26.   border-top: 0;

  27.   padding: 0;

  28.   margin: 0;

  29. }

  30. .vertical-tabs ul.vertical-tabs-list li a {

  31.   display: block;

  32.   text-decoration: none;

  33.   padding: 0.5em 0.6em;

  34. }

  35. .vertical-tabs ul.vertical-tabs-list li a:focus strong,

  36. .vertical-tabs ul.vertical-tabs-list li a:active strong,

  37. .vertical-tabs ul.vertical-tabs-list li a:hover strong {

  38.   text-decoration: underline;

  39. }

  40. .vertical-tabs ul.vertical-tabs-list li a:hover {

  41.   outline: 1px dotted;

  42. }

  43. .vertical-tabs ul.vertical-tabs-list li.selected {

  44.   background-color: #fff;

  45.   border-right-width: 0; /* LTR */

  46. }

  47. .vertical-tabs ul.vertical-tabs-list .selected strong {

  48.   color: #000;

  49. }

  50. .vertical-tabs ul.vertical-tabs-list .summary {

  51.   display: block;

  52. }

  53. .vertical-tabs ul.vertical-tabs ul.vertical-tabs-list .summary {

  54.   line-height: normal;

  55.   margin-bottom: 0;

  56. }

  57. 

  58. /**

  59.  * Prevent text inputs from overflowing when container is too narrow. "width" is

  60.  * applied to override hardcoded cols or size attributes and used in conjunction

  61.  * with "box-sizing" to prevent box model issues from occurring in most browsers.

  62. */

  63. .vertical-tabs .form-type-textfield input {

  64.   max-width: 100%;

  65.   -moz-box-sizing: border-box;

  66.   -webkit-box-sizing: border-box;

  67.   box-sizing: border-box;

  68. }