Chromium Code Reviews
chromiumcodereview-hr@appspot.gserviceaccount.com (chromiumcodereview-hr) | Please choose your nickname with Settings | Help | Chromium Project | Gerrit Changes | Sign out
(367)

Side by Side Diff: chrome/browser/resources/md_history/app.vulcanized.html

Issue 2562393003: MD WebUI: Simplify cr-toolbar CSS (Closed)
Patch Set: Created 4 years ago
Use n/p to move between diff chunks; N/P to move between comments. Draft comments are only viewable by you.
Jump to:
View unified diff | Download patch
OLDNEW
1 <html><head><!-- 1 <html><head><!--
2 @license 2 @license
3 Copyright (c) 2014 The Polymer Project Authors. All rights reserved. 3 Copyright (c) 2014 The Polymer Project Authors. All rights reserved.
4 This code may only be used under the BSD style license found at http://polymer.g ithub.io/LICENSE.txt 4 This code may only be used under the BSD style license found at http://polymer.g ithub.io/LICENSE.txt
5 The complete set of authors may be found at http://polymer.github.io/AUTHORS.txt 5 The complete set of authors may be found at http://polymer.github.io/AUTHORS.txt
6 The complete set of contributors may be found at http://polymer.github.io/CONTRI BUTORS.txt 6 The complete set of contributors may be found at http://polymer.github.io/CONTRI BUTORS.txt
7 Code distributed by Google as part of the polymer project is also 7 Code distributed by Google as part of the polymer project is also
8 subject to an additional IP rights grant found at http://polymer.github.io/PATEN TS.txt 8 subject to an additional IP rights grant found at http://polymer.github.io/PATEN TS.txt
9 --><!-- 9 --><!--
10 @license 10 @license
(...skipping 1961 matching lines...) Expand 10 before | Expand all | Expand 10 after
1972 padding: 6px; 1972 padding: 6px;
1973 width: 32px; 1973 width: 32px;
1974 } 1974 }
1975 1975
1976 #centeredContent { 1976 #centeredContent {
1977 display: flex; 1977 display: flex;
1978 flex: 1 1 0; 1978 flex: 1 1 0;
1979 justify-content: center; 1979 justify-content: center;
1980 } 1980 }
1981 1981
1982 :host([narrow_]) #centeredContent {
1983 -webkit-padding-end: var(--cr-toolbar-field-end-padding, 12px);
1984 }
1985
1986 :host(:not([narrow_])) h1 {
1987 ;
1988 }
1989
1990 :host(:not([narrow_])) #leftContent { 1982 :host(:not([narrow_])) #leftContent {
1991 max-width: calc((100% - var(--cr-toolbar-field-width)) / 2); 1983 max-width: calc((100% - var(--cr-toolbar-field-width)) / 2);
1992 ;
1993 } 1984 }
1994 1985
1995 :host(:not([narrow_])) #centeredContent { 1986 :host(:not([narrow_])) #centeredContent {
1996 -webkit-margin-start: var(--cr-toolbar-field-margin, 0); 1987 -webkit-margin-start: var(--cr-toolbar-field-margin, 0);
1997 } 1988 }
1998 1989
1999 :host(:not([narrow_])) #rightContent {
2000 position: var(--cr-toolbar-right-content-wide_-_position); left: var(--cr-tool bar-right-content-wide_-_left); right: var(--cr-toolbar-right-content-wide_-_rig ht);
2001 }
2002
2003 :host([narrow_]) #centeredContent { 1990 :host([narrow_]) #centeredContent {
2004 justify-content: flex-end; 1991 justify-content: flex-end;
2005 } 1992 }
2006 1993
2007 :host([narrow_][showing-search_]) #leftContent { 1994 :host([narrow_][showing-search_]) #leftContent {
2008 opacity: 0; 1995 opacity: 0;
2009 } 1996 }
2010 1997
1998 #rightContent {
1999 -webkit-padding-end: var(--cr-toolbar-field-end-padding, 12px);
2000 }
2001
2002 :host(:not([narrow_])) #rightContent {
2003 position: absolute;
2004 right: 0;
2005 }
2006
2007 :host-context([dir=rtl]):host(:not([narrow_])) #rightContent {
2008 right: auto;
2009 left: 0;
2010 }
2011
2011 #menuPromo { 2012 #menuPromo {
2012 -webkit-padding-end: 12px; 2013 -webkit-padding-end: 12px;
2013 -webkit-padding-start: 8px; 2014 -webkit-padding-start: 8px;
2014 align-items: center; 2015 align-items: center;
2015 background: #616161; 2016 background: #616161;
2016 border-radius: 2px; 2017 border-radius: 2px;
2017 color: white; 2018 color: white;
2018 display: flex; 2019 display: flex;
2019 font-size: 92.3%; 2020 font-size: 92.3%;
2020 font-weight: 500; 2021 font-weight: 500;
2021 opacity: 0; 2022 opacity: 0;
2022 padding-bottom: 6px; 2023 padding-bottom: 6px;
2023 padding-top: 6px; 2024 padding-top: 6px;
2024 position: absolute; 2025 position: absolute;
2025 top: var(--cr-toolbar-height); 2026 top: var(--cr-toolbar-height);
2026 white-space: nowrap; 2027 white-space: nowrap;
2027 z-index: 2; 2028 z-index: 2;
2028 } 2029 }
2029 2030
2030 #menuPromo::before { 2031 #menuPromo::before {
2031 background: inherit; 2032 background: inherit;
2032 2033
2033 clip-path: polygon(0 105%, 100% 105%, 50% 0); 2034 clip-path: polygon(0 105%, 100% 105%, 50% 0);
2034 content: ''; 2035 content: '';
2035 display: block; 2036 display: block;
2036 left: 10px; 2037 left: 10px;
2037 height: 6px; 2038 height: 6px;
2038 position: absolute; 2039 position: absolute;
2039 top: -6px; 2040 top: -6px;
2040 width: 12px; 2041 width: 12px;
2041 } 2042 }
2042 2043
2043 :host-context([dir=rtl]) #menuPromo::before { 2044 :host-context([dir=rtl]) #menuPromo::before {
(...skipping 256 matching lines...) Expand 10 before | Expand all | Expand 10 after
2300 2301
2301 :host([items-selected_]) { 2302 :host([items-selected_]) {
2302 background: rgb(68, 136, 255); 2303 background: rgb(68, 136, 255);
2303 } 2304 }
2304 2305
2305 #toolbar-container { 2306 #toolbar-container {
2306 height: var(--toolbar-height); 2307 height: var(--toolbar-height);
2307 } 2308 }
2308 2309
2309 cr-toolbar { 2310 cr-toolbar {
2310 --cr-toolbar-field-end-padding: 0; 2311 --cr-toolbar-field-margin: var(--side-bar-width);
2311 --cr-toolbar-field-margin: var(--side-bar-width);
2312 --cr-toolbar-right-content-wide_-_position: absolute; --cr-toolbar-righ t-content-wide_-_right: 0; --cr-toolbar-right-content-wide_-_left: initial;;
2313 }
2314
2315 :host-context([dir=rtl]) cr-toolbar {
2316 --cr-toolbar-right-content-wide_-_position: absolute; --cr-toolbar-right-cont ent-wide_-_left: 0; --cr-toolbar-right-content-wide_-_right: initial;;
2317 } 2312 }
2318 2313
2319 :host([has-drawer]) cr-toolbar { 2314 :host([has-drawer]) cr-toolbar {
2320 --cr-toolbar-field-margin: 0; 2315 --cr-toolbar-field-margin: 0;
2321 } 2316 }
2322 2317
2323 cr-toolbar .more-actions {
2324 -webkit-margin-end: 12px;
2325 }
2326
2327 #info-button { 2318 #info-button {
2328 background: none; 2319 background: none;
2329 border: none; 2320 border: none;
2330 color: inherit; 2321 color: inherit;
2331 height: 32px; 2322 height: 32px;
2332 margin: 6px; 2323 margin: 6px;
2333 outline: none; 2324 outline: none;
2334 padding: 0; 2325 padding: 0;
2335 width: 32px; 2326 width: 32px;
2336 } 2327 }
(...skipping 1434 matching lines...) Expand 10 before | Expand all | Expand 10 after
3771 <history-side-bar id="drawer-side-bar" selected-page="{{selectedPage_}}" show-footer="[[showSidebarFooter]]" drawer=""> 3762 <history-side-bar id="drawer-side-bar" selected-page="{{selectedPage_}}" show-footer="[[showSidebarFooter]]" drawer="">
3772 </history-side-bar> 3763 </history-side-bar>
3773 </app-drawer> 3764 </app-drawer>
3774 </template> 3765 </template>
3775 3766
3776 <iron-media-query query="(max-width: 1023px)" query-matches="{{hasDrawer_}}" > 3767 <iron-media-query query="(max-width: 1023px)" query-matches="{{hasDrawer_}}" >
3777 </iron-media-query> 3768 </iron-media-query>
3778 </template> 3769 </template>
3779 </dom-module> 3770 </dom-module>
3780 <script src="app.crisper.js"></script></body></html> 3771 <script src="app.crisper.js"></script></body></html>
OLDNEW

Powered by Google App Engine
This is Rietveld 408576698