Upstream version 5.34.104.0
[platform/framework/web/crosswalk.git] / src / chrome / browser / resources / options / subpages_tab_controls.css
1 /* Copyright (c) 2012 The Chromium Authors. All rights reserved.
2  * Use of this source code is governed by a BSD-style license that can be
3  * found in the LICENSE file. */
4
5 .subpages-nav-tabs .tab {
6   padding: 4px 8px;
7   position: relative;
8 }
9
10 .subpages-nav-tabs .active-tab {
11   -webkit-box-shadow: 8px -8px 12px -6px rgb(240, 240, 240);
12   background: white;
13   border: 1px solid #ddd;
14   border-bottom: 2px solid white;
15   border-top-left-radius: 3px;
16   border-top-right-radius: 3px;
17   position: relative;
18 }
19
20 /* To avoid tabs changing size when they are clicked and their labels become
21  * bold, we actually put two labels inside each tab: an inactive label and an
22  * active label. Only one is visible at a time, but the bold label is used to
23  * size the tab even when it's not visible. This keeps the tab size constant.
24  */
25 .subpages-nav-tabs .active-tab-label,
26 .subpages-nav-tabs .tab-label:hover {
27   font-weight: bold;
28 }
29
30 .subpages-nav-tabs .tab-label {
31   left: 9px;
32   position: absolute;
33   top: 5px;
34 }
35
36 html[dir=rtl] .subpages-nav-tabs .tab-label {
37   right: 9px;
38 }
39
40 .subpages-nav-tabs .active-tab-label,
41 .subpages-nav-tabs .active-tab .tab-label {
42   visibility: hidden;
43 }
44
45 /* .tab is not removed when .active-tab is added, so we must
46  * override the hidden visibility above in the active tab case.
47  */
48 .subpages-nav-tabs .active-tab .active-tab-label {
49   visibility: visible;
50 }
51
52 .subpages-nav-tabs {
53   background-image: linear-gradient(
54                         to bottom,
55                         rgb(255,255,255),
56                         rgb(255,255,255) 60%,
57                         rgb(250, 250, 250) 80%,
58                         rgb(242,242,242)
59   );
60   border-bottom: 1px solid #ddd;
61   padding: 4px 20px;
62 }
63
64 .subpages-tab-contents {
65    -webkit-padding-start: 10px;
66   display: none;
67   padding-top: 15px;
68 }
69
70 .active-tab-contents {
71   display: block;
72 }