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