• Home
  • Line#
  • Scopes#
  • Navigate#
  • Raw
  • Download
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 {
6  -webkit-margin-start: 23px;
7  color: rgb(48, 57, 66);
8}
9
10body.uber-frame {
11  -webkit-margin-start: 155px;
12}
13
14html[dir='rtl'] body.uber-frame {
15  /* Enable vertical scrollbar at all times in RTL to avoid visual glitches when
16   * showing sub-pages that vertically overflow. */
17  overflow-y: scroll;
18}
19
20/* TODO(dbeam): Remove .page class from overlays in settings so the junk below
21 * isn't necessary. */
22body #extension-settings.page,
23body #mainview-content .page,
24body .subpage-sheet-container .page,
25body > .page {
26  -webkit-margin-end: 24px;
27  min-width: 576px;
28  padding-bottom: 20px;
29  padding-top: 55px;
30}
31
32body header {
33  background-image: -webkit-linear-gradient(white,
34                                            white 40%,
35                                            rgba(255, 255, 255, 0.92));
36  left: 23px;
37  /* <section>s in options currently amount to 638px total, broken up into
38   * 600px max-width + 18px -webkit-padding-start + 20px -webkit-margin-end
39   * so we mirror this value here so the headers match width and horizontal
40   * alignment when scrolling sideways.
41   * other-devices.css' .device width depends on this, please keep in sync.
42   */
43  max-width: 738px;
44  min-width: 600px;
45  position: fixed;
46  right: 0;
47  top: 0;
48  /* list.css sets a z-index of up to 2, this is set to 3 to ensure that the
49   * header is in front of the selected list item. */
50  z-index: 3;
51}
52
53body.uber-frame header {
54  left: 155px;
55}
56
57html[dir='rtl'] body header {
58  left: 0;
59  right: 23px;
60}
61
62html[dir='rtl'] body.uber-frame header {
63  right: 155px;
64}
65
66body header > .search-field-container,
67body header > .header-extras,
68body header > button {
69  position: absolute;
70  right: 20px;
71  top: 21px;
72}
73
74html[dir='rtl'] body header > .search-field-container,
75html[dir='rtl'] body header > .header-extras,
76html[dir='rtl'] body header > button {
77  left: 20px;
78  right: auto;
79}
80
81body header input[type='search'],
82body header input[type='text'],
83body header button {
84  margin: 0;
85}
86
87body header > h1 {
88  margin: 0;
89  padding: 21px 0 13px;
90}
91
92/* Create a border under the h1 (but before anything that gets appended
93 * to the end of the header). */
94body header > h1::after {
95  -webkit-margin-end: 20px;
96  background-color: #eee;
97  content: ' ';
98  display: block;
99  height: 1px;
100  position: relative;
101  top: 13px;
102}
103
104body footer {
105  border-top: 1px solid #eee;
106  margin-top: 16px;
107  /* min-width and max-width should match the header */
108  max-width: 638px;
109  min-width: 600px;
110  padding: 8px 0;
111}
112
113/* Sections are used in options pages, help page and history page. This defines
114 * the section metrics to match the header metrics above. */
115body section {
116  -webkit-padding-start: 18px;
117  margin-bottom: 24px;
118  margin-top: 8px;
119  max-width: 600px;
120}
121
122body section:last-of-type {
123  margin-bottom: 0;
124}
125
126body section > h3 {
127  -webkit-margin-start: -18px;
128}
129
130body section > div:only-of-type {
131  -webkit-box-flex: 1;
132}
133
134body .section-header {
135  -webkit-margin-start: -18px;
136  margin-bottom: 0.8em;
137  margin-top: 1.2em;
138}
139
140body .section-header > h3 {
141  display: inline;
142}
143
144/* Styles for a hideable notification banner at the top of a page. */
145.page.showing-banner {
146  margin-top: 45px;
147}
148
149.page-banner {
150  background-color: white;
151  width: 100%;
152  z-index: 2;
153}
154
155.page:not(.showing-banner) .page-banner {
156  display: none;
157}
158
159.page-banner-gradient {
160  background: -webkit-linear-gradient(rgb(255, 242, 183),
161                                      rgb(250, 230, 145));
162  border: 1px solid rgb(201, 189, 141);
163  border-radius: 3px;
164  margin: 9px 9px 0 9px;
165  min-height: 25px;
166}
167
168.page-banner .page-banner-gradient {
169  -webkit-margin-end: 20px;
170  -webkit-margin-start: 0;
171  margin-bottom: 9px;
172}
173
174.page-banner-text {
175  -webkit-padding-end: 8px;
176  -webkit-padding-start: 26px;
177  background-image: url('chrome://theme/IDR_CONTROLLED_SETTING_MANDATORY');
178  background-position: 5px center;
179  background-repeat: no-repeat;
180  background-size: 16px;
181  display: block;
182  padding-bottom: 8px;
183  padding-top: 8px;
184}
185
186.page-banner.clickable:active .page-banner-text {
187  background: -webkit-linear-gradient(rgb(250, 230, 145),
188                                      rgb(255, 242, 183));
189}
190