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 5body.uber-frame { 6 -webkit-margin-start: 155px; 7 color: rgb(48, 57, 66); 8} 9 10html[dir='rtl'] body.uber-frame { 11 /* Enable vertical scrollbar at all times in RTL to avoid visual glitches when 12 * showing sub-pages that vertically overflow. */ 13 overflow-y: scroll; 14} 15 16/* TODO(dbeam): Remove .page class from overlays in settings so the junk below 17 * isn't necessary. */ 18body.uber-frame #extension-settings.page, 19body.uber-frame #mainview-content .page, 20body.uber-frame .subpage-sheet-container .page, 21body.uber-frame > .page { 22 -webkit-margin-end: 24px; 23 min-width: 576px; 24 padding-bottom: 20px; 25 padding-top: 55px; 26} 27 28body.uber-frame header { 29 background-image: -webkit-linear-gradient(white, 30 white 40%, 31 rgba(255, 255, 255, 0.92)); 32 left: 155px; 33 /* <section>s in options currently amount to 638px total, broken up into 34 * 600px max-width + 18px -webkit-padding-start + 20px -webkit-margin-end 35 * so we mirror this value here so the headers match width and horizontal 36 * alignment when scrolling sideways. */ 37 max-width: 738px; 38 min-width: 600px; 39 position: fixed; 40 right: 0; 41 top: 0; 42 /* list.css sets a z-index of up to 2, this is set to 3 to ensure that the 43 * header is in front of the selected list item. */ 44 z-index: 3; 45} 46 47html[dir='rtl'] body.uber-frame header { 48 left: 0; 49 right: 155px; 50} 51 52body.uber-frame header > .search-field-container, 53body.uber-frame header > .header-extras, 54body.uber-frame header > button { 55 position: absolute; 56 right: 20px; 57 top: 21px; 58} 59 60html[dir='rtl'] body.uber-frame header > .search-field-container, 61html[dir='rtl'] body.uber-frame header > .header-extras, 62html[dir='rtl'] body.uber-frame header > button { 63 left: 20px; 64 right: auto; 65} 66 67body.uber-frame header input[type='search'], 68body.uber-frame header input[type='text'], 69body.uber-frame header button { 70 margin: 0; 71} 72 73body.uber-frame header > h1 { 74 margin: 0; 75 padding: 21px 0 13px; 76} 77 78/* Create a border under the h1 (but before anything that gets appended 79 * to the end of the header). */ 80body.uber-frame header > h1::after { 81 -webkit-margin-end: 20px; 82 background-color: #eee; 83 content: ' '; 84 display: block; 85 height: 1px; 86 position: relative; 87 top: 13px; 88} 89 90body.uber-frame footer { 91 border-top: 1px solid #eee; 92 margin-top: 16px; 93 /* min-width and max-width should match the header */ 94 max-width: 638px; 95 min-width: 600px; 96 padding: 8px 0; 97} 98 99/* Sections are used in options pages, help page and history page. This defines 100 * the section metrics to match the header metrics above. */ 101body.uber-frame section { 102 -webkit-padding-start: 18px; 103 margin-bottom: 24px; 104 margin-top: 8px; 105 max-width: 600px; 106} 107 108body.uber-frame section:last-of-type { 109 margin-bottom: 0; 110} 111 112body.uber-frame section > h3 { 113 -webkit-margin-start: -18px; 114} 115 116body.uber-frame section > div:only-of-type { 117 -webkit-box-flex: 1; 118} 119