Chris@0
|
1 /**
|
Chris@0
|
2 * @file
|
Chris@0
|
3 * Vertical Tabs.
|
Chris@0
|
4 */
|
Chris@0
|
5
|
Chris@0
|
6 .vertical-tabs {
|
Chris@0
|
7 margin: 1em 0 1em 15em; /* LTR */
|
Chris@0
|
8 border: 1px solid #ccc;
|
Chris@0
|
9 }
|
Chris@0
|
10 [dir="rtl"] .vertical-tabs {
|
Chris@18
|
11 margin-right: 15em;
|
Chris@0
|
12 margin-left: 0;
|
Chris@0
|
13 }
|
Chris@0
|
14 .vertical-tabs__menu {
|
Chris@0
|
15 float: left; /* LTR */
|
Chris@0
|
16 width: 15em;
|
Chris@0
|
17 margin: -1px 0 -1px -15em; /* LTR */
|
Chris@0
|
18 padding: 0;
|
Chris@18
|
19 list-style: none;
|
Chris@0
|
20 border-top: 1px solid #ccc;
|
Chris@0
|
21 }
|
Chris@0
|
22 [dir="rtl"] .vertical-tabs__menu {
|
Chris@0
|
23 float: right;
|
Chris@18
|
24 margin-right: -15em;
|
Chris@0
|
25 margin-left: 0;
|
Chris@0
|
26 }
|
Chris@0
|
27 .vertical-tabs__pane {
|
Chris@0
|
28 margin: 0;
|
Chris@0
|
29 border: 0;
|
Chris@0
|
30 }
|
Chris@0
|
31 .vertical-tabs__pane > summary {
|
Chris@0
|
32 display: none;
|
Chris@0
|
33 }
|
Chris@0
|
34
|
Chris@0
|
35 /* Layout of each tab. */
|
Chris@0
|
36 .vertical-tabs__menu-item {
|
Chris@0
|
37 border: 1px solid #ccc;
|
Chris@0
|
38 border-top: 0;
|
Chris@0
|
39 background: #eee;
|
Chris@0
|
40 }
|
Chris@0
|
41 .vertical-tabs__menu-item a {
|
Chris@0
|
42 display: block;
|
Chris@0
|
43 padding: 0.5em 0.6em;
|
Chris@0
|
44 text-decoration: none;
|
Chris@0
|
45 }
|
Chris@0
|
46 .vertical-tabs__menu-item a:focus .vertical-tabs__menu-item-title,
|
Chris@0
|
47 .vertical-tabs__menu-item a:active .vertical-tabs__menu-item-title,
|
Chris@0
|
48 .vertical-tabs__menu-item a:hover .vertical-tabs__menu-item-title {
|
Chris@0
|
49 text-decoration: underline;
|
Chris@0
|
50 }
|
Chris@0
|
51 .vertical-tabs__menu-item a:hover {
|
Chris@0
|
52 outline: 1px dotted;
|
Chris@0
|
53 }
|
Chris@0
|
54 .vertical-tabs__menu-item.is-selected {
|
Chris@0
|
55 border-right-width: 0; /* LTR */
|
Chris@0
|
56 background-color: #fff;
|
Chris@0
|
57 }
|
Chris@0
|
58 [dir="rtl"] .vertical-tabs__menu-item.is-selected {
|
Chris@18
|
59 border-right-width: 1px;
|
Chris@0
|
60 border-left-width: 0;
|
Chris@0
|
61 }
|
Chris@0
|
62 .vertical-tabs__menu-item.is-selected .vertical-tabs__menu-item-title {
|
Chris@0
|
63 color: #000;
|
Chris@0
|
64 }
|
Chris@0
|
65 .vertical-tabs__menu-item-summary {
|
Chris@0
|
66 display: block;
|
Chris@0
|
67 margin-bottom: 0;
|
Chris@0
|
68 line-height: normal;
|
Chris@0
|
69 }
|