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

Side by Side Diff: chrome/browser/resources/file_manager/css/file_manager.css

Issue 14348017: Restyled the auto-completion box for Files.app's new UI. (Closed) Base URL: svn://svn.chromium.org/chrome/trunk/src
Patch Set: Added missing files. Created 7 years, 8 months 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 | Annotate | Revision Log
OLDNEW
1 /* Copyright (c) 2012 The Chromium Authors. All rights reserved. 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 2 * Use of this source code is governed by a BSD-style license that can be
3 * found in the LICENSE file. */ 3 * found in the LICENSE file. */
4 4
5 html { 5 html {
6 height: 100%; 6 height: 100%;
7 } 7 }
8 8
9 html.col-resize * { 9 html.col-resize * {
10 cursor: col-resize !important; 10 cursor: col-resize !important;
(...skipping 657 matching lines...) Expand 10 before | Expand all | Expand 10 after
668 color: #333; 668 color: #333;
669 display: -webkit-box; 669 display: -webkit-box;
670 height: 29px; 670 height: 29px;
671 line-height: 27px; 671 line-height: 27px;
672 margin-right: 10px; 672 margin-right: 10px;
673 padding: 1px 6px 2px 23px; 673 padding: 1px 6px 2px 23px;
674 width: 150px; 674 width: 150px;
675 } 675 }
676 676
677 body[new-ui] #search-box { 677 body[new-ui] #search-box {
678 background: -webkit-image-set(
679 url('../images/files/ui/new-ui/search_icon_active.png') 1x,
680 url('../images/files/ui/new-ui/2x/search_icon_active.png') 2x);
681 background-position: center left;
682 background-repeat: no-repeat;
678 border-color: white; 683 border-color: white;
684 padding: 0 0 0 30px;
679 } 685 }
680 686
681 #search-box:hover { 687 #search-box:hover {
682 border: 1px solid #b9b9b9; 688 border: 1px solid #b9b9b9;
683 border-top: 1px solid #a0a0a0; 689 border-top: 1px solid #a0a0a0;
684 box-shadow: inset 0 1px 2px rgba(0,0,0,0.1); 690 box-shadow: inset 0 1px 2px rgba(0,0,0,0.1);
685 } 691 }
686 692
687 body[new-ui] #search-box:hover { 693 body[new-ui] #search-box:hover {
688 border-color: white; 694 border-color: white;
(...skipping 1290 matching lines...) Expand 10 before | Expand all | Expand 10 after
1979 #default-action-dialog { 1985 #default-action-dialog {
1980 min-width: 300px; 1986 min-width: 300px;
1981 width: auto; 1987 width: auto;
1982 } 1988 }
1983 1989
1984 .drive-welcome-wrapper { 1990 .drive-welcome-wrapper {
1985 /* drive_welcome.css will override it once loaded. */ 1991 /* drive_welcome.css will override it once loaded. */
1986 display: none; 1992 display: none;
1987 } 1993 }
1988 1994
1989 list.autocomplete-suggestions { 1995 body:not([new-ui]) list.autocomplete-suggestions {
1990 -webkit-border-radius: 2px; 1996 -webkit-border-radius: 2px;
1991 background-color: white; 1997 background-color: white;
1992 border: 1px solid #aaa; 1998 border: 1px solid #aaa;
1993 box-sizing: border-box; /* To match the width with the search box's. */ 1999 box-sizing: border-box; /* To match the width with the search box's. */
1994 min-height: 0; 2000 min-height: 0;
1995 position: fixed; 2001 position: fixed;
1996 z-index: 3; 2002 z-index: 3;
1997 } 2003 }
1998 2004
2005 body[new-ui] list.autocomplete-suggestions {
2006 -webkit-box-shadow: 0 1px 4px 0 rgba(0, 0, 0, .5);
2007 background-color: rgb(250, 250, 250);
2008 border: 1px solid rgb(255, 255, 255);
2009 border-radius: 3px;
2010 box-sizing: border-box; /* To match the width with the search box's. */
2011 color: rgb(34, 34, 34);
2012 overflow: hidden;
2013 padding: 5px 0;
2014 position: fixed;
2015 z-index: 3;
2016 }
2017
1999 list.autocomplete-suggestions > li { 2018 list.autocomplete-suggestions > li {
2000 -webkit-border-radius: 0; 2019 -webkit-border-radius: 0;
2001 -webkit-box-align: center; 2020 -webkit-box-align: center;
2002 display: -webkit-box; 2021 display: -webkit-box;
2003 margin: 0; /* To prevent vertical overflow. */ 2022 margin: 0; /* To prevent vertical overflow. */
2004 padding: 3px 0; 2023 padding: 3px 0;
2005 } 2024 }
2006 2025
2007 list.autocomplete-suggestions > li:hover { 2026 body:not([new-ui]) list.autocomplete-suggestions > li:hover {
2008 background-color: white; 2027 background-color: white;
2009 border: 1px solid white; 2028 border: 1px solid white;
2010 } 2029 }
2011 2030
2031 body[new-ui] list.autocomplete-suggestions > li,
2032 body[new-ui] list.autocomplete-suggestions > li:hover {
2033 background-color: transparent;
2034 border: none;
2035 }
2036
2012 list.autocomplete-suggestions > li > div.detail-text { 2037 list.autocomplete-suggestions > li > div.detail-text {
2013 -webkit-box-flex: 1; 2038 -webkit-box-flex: 1;
2014 overflow-x: hidden; 2039 overflow-x: hidden;
2015 text-overflow: ellipsis; 2040 text-overflow: ellipsis;
2016 } 2041 }
2017 2042
2018 list.autocomplete-suggestions > li > div[search-icon] { 2043 list.autocomplete-suggestions > li > div.detail-text em {
2044 font-style: normal;
2045 }
2046
2047 body[new-ui] list.autocomplete-suggestions > li > div.detail-text em {
2048 color: rgb(150, 150, 150);
2049 }
2050
2051 body:not([new-ui]) list.autocomplete-suggestions > li > div[search-icon] {
2019 background: -webkit-image-set( 2052 background: -webkit-image-set(
2020 url('../images/files/ui/icon_search.png') 1x, 2053 url('../images/files/ui/icon_search.png') 1x,
2021 url('../images/files/ui/2x/icon_search.png') 2x); 2054 url('../images/files/ui/2x/icon_search.png') 2x);
2022 background-position: center; 2055 background-position: center;
2023 background-repeat: no-repeat; 2056 background-repeat: no-repeat;
2024 } 2057 }
2025 2058
2026 list.autocomplete-suggestions[hasElementFocus] > [selected], 2059 body[new-ui] list.autocomplete-suggestions > li > div[search-icon] {
2027 list.autocomplete-suggestions[hasElementFocus] > [lead], 2060 background: -webkit-image-set(
2028 list.autocomplete-suggestions:not([hasElementFocus]) > [selected], 2061 url('../images/files/ui/new-ui/search_icon_active.png') 1x,
2029 list.autocomplete-suggestions:not([hasElementFocus]) > [lead] { 2062 url('../images/files/ui/new-ui/2x/search_icon_active.png') 2x);
2063 background-position: center;
2064 background-repeat: no-repeat;
2065 }
2066
2067 body:not([new-ui]) list.autocomplete-suggestions[hasElementFocus] > [selected],
2068 body:not([new-ui]) list.autocomplete-suggestions[hasElementFocus] > [lead],
2069 body:not([new-ui]) list.autocomplete-suggestions:not([hasElementFocus]) >
2070 [selected],
2071 body:not([new-ui]) list.autocomplete-suggestions:not([hasElementFocus]) >
2072 [lead] {
2030 background-color: rgb(238, 238, 238); 2073 background-color: rgb(238, 238, 238);
2031 background-image: none; 2074 background-image: none;
2032 border: 1px solid white; 2075 border: 1px solid white;
2033 } 2076 }
2034 2077
2078 body[new-ui] list.autocomplete-suggestions[hasElementFocus] > [selected],
2079 body[new-ui] list.autocomplete-suggestions[hasElementFocus] > [lead],
2080 body[new-ui] list.autocomplete-suggestions:not([hasElementFocus]) > [selected],
2081 body[new-ui] list.autocomplete-suggestions:not([hasElementFocus]) > [lead] {
2082 background-color: rgb(235, 235, 235);
2083 background-image: none;
2084 border: none;
2085 }
2086
2035 body[new-ui] #gear-menu > menuitem:not(.menuitem-button) { 2087 body[new-ui] #gear-menu > menuitem:not(.menuitem-button) {
2036 margin-right: 50px; 2088 margin-right: 50px;
2037 } 2089 }
2038 2090
2039 /* View buttons in the gear menu. */ 2091 /* View buttons in the gear menu. */
2040 2092
2041 body[new-ui] menuitem#detail-view { 2093 body[new-ui] menuitem#detail-view {
2042 background-image: -webkit-image-set( 2094 background-image: -webkit-image-set(
2043 url('../images/files/ui/new-ui/button_list_view.png') 1x, 2095 url('../images/files/ui/new-ui/button_list_view.png') 1x,
2044 url('../images/files/ui/new-ui/2x/button_list_view.png') 2x); 2096 url('../images/files/ui/new-ui/2x/button_list_view.png') 2x);
2045 } 2097 }
2046 2098
2047 body[new-ui] menuitem#thumbnail-view { 2099 body[new-ui] menuitem#thumbnail-view {
2048 background-image: -webkit-image-set( 2100 background-image: -webkit-image-set(
2049 url('../images/files/ui/new-ui/button_mosaic_view.png') 1x, 2101 url('../images/files/ui/new-ui/button_mosaic_view.png') 1x,
2050 url('../images/files/ui/new-ui/2x/button_mosaic_view.png') 2x); 2102 url('../images/files/ui/new-ui/2x/button_mosaic_view.png') 2x);
2051 } 2103 }
OLDNEW

Powered by Google App Engine
This is Rietveld 408576698