| OLD | NEW |
| 1 /* | 1 /* |
| 2 * Copyright (C) 2006, 2007, 2008 Apple Inc. All rights reserved. | 2 * Copyright (C) 2006, 2007, 2008 Apple Inc. All rights reserved. |
| 3 * Copyright (C) 2009 Anthony Ricaud <rik@webkit.org> | 3 * Copyright (C) 2009 Anthony Ricaud <rik@webkit.org> |
| 4 * Copyright (C) 2011 Google Inc. All rights reserved. | 4 * Copyright (C) 2011 Google Inc. All rights reserved. |
| 5 * | 5 * |
| 6 * Redistribution and use in source and binary forms, with or without | 6 * Redistribution and use in source and binary forms, with or without |
| 7 * modification, are permitted provided that the following conditions are | 7 * modification, are permitted provided that the following conditions are |
| 8 * met: | 8 * met: |
| 9 * | 9 * |
| 10 * 1. Redistributions of source code must retain the above copyright | 10 * 1. Redistributions of source code must retain the above copyright |
| (...skipping 36 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
| 47 | 47 |
| 48 .tabbed-pane-placeholder { | 48 .tabbed-pane-placeholder { |
| 49 font-size: 14px; | 49 font-size: 14px; |
| 50 text-align: center; | 50 text-align: center; |
| 51 margin-top: 20px; | 51 margin-top: 20px; |
| 52 text-shadow: rgba(255, 255, 255, 0.75) 0 1px 0; | 52 text-shadow: rgba(255, 255, 255, 0.75) 0 1px 0; |
| 53 } | 53 } |
| 54 | 54 |
| 55 .tabbed-pane-header { | 55 .tabbed-pane-header { |
| 56 display: flex; | 56 display: flex; |
| 57 flex: 0 0 23px; | 57 flex: 0 0 27px; |
| 58 border-bottom: 1px solid #dadada; | 58 border-bottom: 1px solid #dadada; |
| 59 overflow: hidden; | 59 overflow: hidden; |
| 60 width: 100%; | 60 width: 100%; |
| 61 background-color: #eee; | 61 background-color: #f3f3f3; |
| 62 } | |
| 63 | |
| 64 :host-context(.material) .tabbed-pane-header { | |
| 65 flex: 0 0 27px; | |
| 66 } | 62 } |
| 67 | 63 |
| 68 .tabbed-pane-header-contents { | 64 .tabbed-pane-header-contents { |
| 69 flex: auto; | 65 flex: auto; |
| 70 pointer-events: none; | 66 pointer-events: none; |
| 71 margin-left: 5px; | 67 margin-left: 5px; |
| 72 position: relative; | 68 position: relative; |
| 73 } | 69 } |
| 74 | 70 |
| 75 .tabbed-pane-header-contents > * { | 71 .tabbed-pane-header-contents > * { |
| 76 pointer-events: initial; | 72 pointer-events: initial; |
| 77 } | 73 } |
| 78 | 74 |
| 79 .tabbed-pane-header-tab { | 75 .tabbed-pane-header-tab { |
| 80 float: left; | 76 float: left; |
| 81 margin-top: 2px; | 77 margin-top: 2px; |
| 82 padding: 2px 4px 2px 4px; | 78 padding: 2px 4px 2px 4px; |
| 83 height: 21px; | 79 height: 24px; |
| 84 border: 1px solid transparent; | 80 border: 1px solid transparent; |
| 85 border-bottom: none; | 81 border-bottom: none; |
| 86 line-height: 15px; | 82 line-height: 15px; |
| 87 white-space: nowrap; | 83 white-space: nowrap; |
| 88 cursor: default; | 84 cursor: default; |
| 89 display: flex; | 85 display: flex; |
| 90 align-items: center; | 86 align-items: center; |
| 91 } | 87 } |
| 92 | 88 |
| 93 .tabbed-pane-header-tab-title { | 89 .tabbed-pane-header-tab-title { |
| 94 text-overflow: ellipsis; | 90 text-overflow: ellipsis; |
| 95 overflow: hidden; | 91 overflow: hidden; |
| 96 } | 92 } |
| 97 | 93 |
| 98 :host-context(.material) .tabbed-pane-header-tab { | |
| 99 height: 25px; | |
| 100 padding-top: 0; | |
| 101 } | |
| 102 | |
| 103 .tabbed-pane-header-tab.measuring { | 94 .tabbed-pane-header-tab.measuring { |
| 104 visibility: hidden; | 95 visibility: hidden; |
| 105 } | 96 } |
| 106 | 97 |
| 107 .tabbed-pane-header-tab.selected { | 98 .tabbed-pane-header-tab.selected { |
| 108 border: 1px solid rgb(163, 163, 163); | 99 border: 1px solid #ccc; |
| 109 border-bottom: none; | 100 border-bottom: none; |
| 110 } | 101 } |
| 111 | 102 |
| 112 .tabbed-pane-header-tab.selected { | 103 .tabbed-pane-header-tab.selected { |
| 113 background: white; | 104 background: white; |
| 114 border-top-color: #bbb; | 105 border-top-color: #ccc; |
| 115 } | 106 } |
| 116 | 107 |
| 117 .tabbed-pane-header-tab .tabbed-pane-close-button { | 108 .tabbed-pane-header-tab .tabbed-pane-close-button { |
| 118 display: inline-block; | 109 display: inline-block; |
| 119 position: relative; | 110 position: relative; |
| 120 top: 2px; | 111 top: 2px; |
| 121 left: 1px; | 112 left: 1px; |
| 122 margin-left: 2px; | 113 margin-left: 2px; |
| 123 margin-top: -3px; | 114 margin-top: -3px; |
| 124 visibility: hidden; | 115 visibility: hidden; |
| 125 } | 116 } |
| 126 | 117 |
| 127 .tabbed-pane-header-tab:hover .tabbed-pane-close-button, | 118 .tabbed-pane-header-tab:hover .tabbed-pane-close-button, |
| 128 .tabbed-pane-header-tab.selected .tabbed-pane-close-button { | 119 .tabbed-pane-header-tab.selected .tabbed-pane-close-button { |
| 129 visibility: visible; | 120 visibility: visible; |
| 130 } | 121 } |
| 131 | 122 |
| 132 .tabbed-pane-header-tabs-drop-down-container { | 123 .tabbed-pane-header-tabs-drop-down-container { |
| 133 float: left; | 124 float: left; |
| 134 position: relative; | 125 position: relative; |
| 135 vertical-align: bottom; | 126 vertical-align: bottom; |
| 136 line-height: 20px; | 127 line-height: 24px; |
| 137 opacity: 0.8; | 128 opacity: 0.8; |
| 138 color: inherit; | 129 color: inherit; |
| 139 font-size: 133%; | 130 font-size: 133%; |
| 140 padding: 0 7px; | 131 padding: 0 7px; |
| 141 cursor: default; | 132 cursor: default; |
| 142 height: 23px; | 133 height: 25px; |
| 143 } | |
| 144 | |
| 145 :host-context(.material) .tabbed-pane-header-tabs-drop-down-container { | |
| 146 line-height: 25px; | |
| 147 height: 28px; | |
| 148 width: 28px; | |
| 149 text-align: center; | |
| 150 padding: 0; | |
| 151 } | 134 } |
| 152 | 135 |
| 153 .tabbed-pane-header-tabs-drop-down-container:hover { | 136 .tabbed-pane-header-tabs-drop-down-container:hover { |
| 154 background-color: rgba(105, 105, 105, 0.1); | 137 background-color: rgba(105, 105, 105, 0.1); |
| 155 } | 138 } |
| 156 | 139 |
| 157 .tabbed-pane-header-tabs-drop-down-container.measuring { | 140 .tabbed-pane-header-tabs-drop-down-container.measuring { |
| 158 visibility: hidden; | 141 visibility: hidden; |
| 159 } | 142 } |
| 160 | 143 |
| (...skipping 56 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
| 217 | 200 |
| 218 .tabbed-pane-shadow.vertical-tab-layout .tabbed-pane-header-tab.selected { | 201 .tabbed-pane-shadow.vertical-tab-layout .tabbed-pane-header-tab.selected { |
| 219 color: inherit; | 202 color: inherit; |
| 220 border: none transparent; | 203 border: none transparent; |
| 221 border-left: 6px solid #666; | 204 border-left: 6px solid #666; |
| 222 } | 205 } |
| 223 | 206 |
| 224 .tabbed-pane-tab-slider { | 207 .tabbed-pane-tab-slider { |
| 225 height: 2px; | 208 height: 2px; |
| 226 position: absolute; | 209 position: absolute; |
| 227 bottom: 0; | 210 bottom: -1px; |
| 228 background-color: #3E82F7; | 211 background-color: #3E82F7; |
| 229 left: 0; | 212 left: 0; |
| 230 z-index: 50; | 213 z-index: 50; |
| 231 transform-origin: 0 0; | 214 transform-origin: 0 0; |
| 232 transition: transform 150ms cubic-bezier(0, 0, 0.2, 1); | 215 transition: transform 150ms cubic-bezier(0, 0, 0.2, 1); |
| 233 visibility: hidden; | 216 visibility: hidden; |
| 234 } | 217 } |
| 235 | 218 |
| 236 .tabbed-pane-tab-slider.enabled { | 219 .tabbed-pane-tab-slider.enabled { |
| 237 visibility: visible; | 220 visibility: visible; |
| 238 } | 221 } |
| 239 | 222 |
| 240 .tabbed-pane-header.tabbed-pane-no-header-background { | 223 .tabbed-pane-header.tabbed-pane-no-header-background { |
| 241 background-color: transparent; | 224 background-color: transparent; |
| 242 } | 225 } |
| OLD | NEW |