OLD | NEW |
| (Empty) |
1 /* Copyright 2014 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 */ | |
5 | |
6 #context-menu { | |
7 position: fixed; | |
8 bottom: 0; /* The vertical position is controlled by context_menu_dom.js */ | |
9 left: -48px; | |
10 background-color: #c4c4c4; | |
11 border: 1px solid #a6a6a6; | |
12 z-index: 101; | |
13 transition-property: left; | |
14 transition-duration: 0.3s; | |
15 box-shadow: 1px 1px 10px rgba(0, 0, 0, 0.5); | |
16 opacity: 0.8; | |
17 } | |
18 | |
19 #context-menu:hover, | |
20 #context-menu.opened, | |
21 #context-menu.menu-opened { | |
22 left: 0; | |
23 opacity: 1; | |
24 } | |
25 | |
26 .no-gaps { | |
27 font-size: 0; | |
28 } | |
29 | |
30 .context-menu-icon { | |
31 margin-top: 2px; | |
32 } | |
33 | |
34 .context-menu-icon:hover, | |
35 .context-menu-stub:hover { | |
36 background-color: #d5d5d5; | |
37 } | |
38 | |
39 #context-menu.opened .context-menu-stub, | |
40 .context-menu-icon:active { | |
41 background-color: #a6a6a6; | |
42 } | |
43 | |
44 .context-menu-stub { | |
45 display: inline-block; | |
46 width: 12px; | |
47 height: 50px; | |
48 background: url("drag.webp"); | |
49 cursor: move; | |
50 } | |
51 | |
52 .etched { | |
53 position: relative; | |
54 } | |
55 | |
56 .etched:after { | |
57 content: ""; | |
58 width: 100%; | |
59 height: 100%; | |
60 position: absolute; | |
61 top: 0; | |
62 left: 0; | |
63 border-left: 1px solid rgba(255, 255, 255, 0.2); | |
64 border-top: 1px solid rgba(255, 255, 255, 0.2); | |
65 } | |
66 | |
67 #context-menu ul { | |
68 visibility: hidden; | |
69 position: absolute; | |
70 left: 24px; | |
71 padding: 0; | |
72 margin: 0; | |
73 list-style-type: none; | |
74 background: white; | |
75 outline: 1px solid rgba(0, 0, 0, 0.2); | |
76 padding: 0 0 6px; | |
77 box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.2); | |
78 z-index: 102; | |
79 } | |
80 | |
81 #context-menu ul.menu-align-bottom { | |
82 bottom: 24px; | |
83 } | |
84 | |
85 #context-menu ul:not(.menu-align-bottom) { | |
86 top: 24px; | |
87 } | |
88 | |
89 #context-menu ul.opened { | |
90 visibility: visible; | |
91 } | |
92 | |
93 #context-menu li { | |
94 padding: 6px 44px 6px 30px; | |
95 white-space: nowrap; | |
96 } | |
97 | |
98 #context-menu li:hover { | |
99 background-color: #EEE; | |
100 } | |
101 | |
102 #context-menu li.selected { | |
103 background-image: url('tick.webp'); | |
104 background-position: left center; | |
105 background-repeat: no-repeat; | |
106 } | |
107 | |
108 #context-menu li.menu-group-header { | |
109 pointer-events: none; | |
110 font-style: italic; | |
111 color: gray; | |
112 } | |
113 | |
114 #context-menu li.menu-group-item { | |
115 margin-left: 16px; | |
116 } | |
117 | |
118 .context-menu-screen { | |
119 width: 100%; | |
120 height: 100%; | |
121 position: fixed; | |
122 top: 0; | |
123 left: 0; | |
124 z-index: 100; | |
125 } | |
OLD | NEW |