1/* 2 * Copyright (C) 2013 Apple Inc. All rights reserved. 3 * 4 * Redistribution and use in source and binary forms, with or without 5 * modification, are permitted provided that the following conditions 6 * are met: 7 * 1. Redistributions of source code must retain the above copyright 8 * notice, this list of conditions and the following disclaimer. 9 * 2. Redistributions in binary form must reproduce the above copyright 10 * notice, this list of conditions and the following disclaimer in the 11 * documentation and/or other materials provided with the distribution. 12 * 13 * THIS SOFTWARE IS PROVIDED BY APPLE INC. AND ITS CONTRIBUTORS ``AS IS'' 14 * AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO, 15 * THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR 16 * PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL APPLE INC. OR ITS CONTRIBUTORS 17 * BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL, EXEMPLARY, OR 18 * CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT LIMITED TO, PROCUREMENT OF 19 * SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, DATA, OR PROFITS; OR BUSINESS 20 * INTERRUPTION) HOWEVER CAUSED AND ON ANY THEORY OF LIABILITY, WHETHER IN 21 * CONTRACT, STRICT LIABILITY, OR TORT (INCLUDING NEGLIGENCE OR OTHERWISE) 22 * ARISING IN ANY WAY OUT OF THE USE OF THIS SOFTWARE, EVEN IF ADVISED OF 23 * THE POSSIBILITY OF SUCH DAMAGE. 24 */ 25 26.toolbar { 27 display: -webkit-flex; 28 29 white-space: nowrap; 30 overflow: hidden; 31 32 border-bottom: 1px solid rgb(179, 179, 179); 33 background-image: linear-gradient(to bottom, rgb(232, 232, 232), rgb(209, 209, 209)); 34 box-shadow: inset rgba(255, 255, 255, 0.5) 0 1px 1px; 35 36 outline: none; 37} 38 39body.window-inactive .toolbar { 40 background-image: none; 41 background-color: rgb(246, 246, 246); 42} 43 44.toolbar.icon-and-label-vertical { 45 height: 56px; 46} 47 48.toolbar.icon-and-label-vertical.small-size { 49 height: 48px; 50} 51 52.toolbar.icon-and-label-horizontal, 53.toolbar.icon-only { 54 height: 40px; 55} 56 57.toolbar.icon-and-label-horizontal.small-size, 58.toolbar.icon-only.small-size, 59.toolbar.label-only { 60 height: 32px; 61} 62 63body.mac-platform:not(.legacy):not(.docked) .toolbar { 64 padding-top: 22px; 65} 66 67body.mac-platform:not(.legacy):not(.docked) .toolbar.icon-and-label-vertical { 68 height: 78px; 69} 70 71body.mac-platform:not(.legacy):not(.docked) .toolbar.icon-and-label-vertical.small-size { 72 height: 70px; 73} 74 75body.mac-platform:not(.legacy):not(.docked) .toolbar.icon-and-label-horizontal, 76body.mac-platform:not(.legacy):not(.docked) .toolbar.icon-only { 77 height: 62px; 78} 79 80body.mac-platform:not(.legacy):not(.docked) .toolbar.icon-and-label-horizontal.small-size, 81body.mac-platform:not(.legacy):not(.docked) .toolbar.icon-only.small-size, 82body.mac-platform:not(.legacy):not(.docked) .toolbar.label-only { 83 height: 54px; 84} 85 86body.mac-platform.legacy .toolbar { 87 box-shadow: none; 88 background-image: none; 89 background-color: transparent; 90 border-bottom-color: rgb(85, 85, 85); 91} 92 93body.mac-platform.legacy.docked .toolbar { 94 background-image: linear-gradient(to bottom, rgb(216, 216, 216), rgb(190, 190, 190)); 95 box-shadow: inset rgba(255, 255, 255, 0.1) 0 1px 0, inset rgba(0, 0, 0, 0.02) 0 -1px 0; 96} 97 98body.mac-platform.legacy:not(.docked) .toolbar .item.button > .label { 99 /* We need to disable sub-pixel antialiasing in the toolbar when not docked because the 100 toolbar is transparent and so is the WebView. */ 101 -webkit-font-smoothing: antialiased; 102 103 /* Compensate for the text not being sub-pixel antialiased by adding a small stroke. */ 104 -webkit-text-stroke: 0.2px; 105} 106 107body.mac-platform.legacy.window-inactive .toolbar { 108 border-bottom-color: rgb(128, 128, 128); 109} 110 111.toolbar .control-section { 112 display: -webkit-flex; 113 114 -webkit-flex-direction: column; 115 -webkit-align-items: center; 116 -webkit-justify-content: center; 117 118 padding-left: 6px; 119 padding-right: 6px; 120 121 min-width: -webkit-min-content; 122} 123 124.toolbar.icon-and-label-horizontal.small-size .control-section, 125.toolbar.icon-only.small-size .control-section, 126.toolbar.label-only .control-section { 127 -webkit-flex-direction: row; 128} 129 130.toolbar .item-section { 131 display: -webkit-flex; 132 min-width: -webkit-min-content; 133} 134 135.toolbar .item-section:not(.center) { 136 -webkit-flex: 1; 137} 138 139.toolbar .item-section.left { 140 -webkit-justify-content: flex-start; 141 margin-right: 12px; 142} 143 144.toolbar .item-section.center { 145 -webkit-flex: 2; 146 -webkit-justify-content: center; 147} 148 149.toolbar .item-section.right { 150 -webkit-justify-content: flex-end; 151 margin-left: 12px; 152 margin-right: 12px; 153} 154 155.toolbar .item { 156 display: -webkit-flex; 157 outline: none; 158} 159