]> git.immae.eu Git - perso/Immae/Projets/packagist/piedsjaloux-ckeditor-component.git/blame - sources/skins/moono/menu.css
Add oembed
[perso/Immae/Projets/packagist/piedsjaloux-ckeditor-component.git] / sources / skins / moono / menu.css
CommitLineData
3332bebe 1/*\r
317f8f8f 2Copyright (c) 2003-2017, CKSource - Frederico Knabben. All rights reserved.\r
3332bebe
IB
3For licensing, see LICENSE.md or http://ckeditor.com/license\r
4*/\r
5\r
6/*\r
7menu.css (part of editor.css)\r
8===============================\r
9\r
10This file styles menus used in the editor UI. These menus are the list of\r
11options available inside some "floating panels", like menu buttons of the\r
12toolbar or the context menu.\r
13\r
14Note that the menu itself doesn't include the floating element that holds it.\r
15That element is styles in the panel.css file.\r
16\r
17The following is a visual representation of the main elements of a menu:\r
18\r
19+-- .cke_menu -----------------+\r
20| +-- .cke_menuitem --------+ |\r
21| | +-- .cke_menubutton ---+ | |\r
22| | | | | |\r
23| | +----------------------+ | |\r
24| +--------------------------+ |\r
25| +-- .cke_menuseparator ----+ |\r
26| ... |\r
27+------------------------------+\r
28\r
29This is the .cke_menubutton structure:\r
30(Note that the menu button icon shares with toolbar button the common class .cke_button_icon to achieve the same outlook.)\r
31\r
32+-- .cke_menubutton -------------------------------------------------------------------------+\r
33| +-- .cke_menubutton_inner ---------------------------------------------------------------+ |\r
34| | +-- .cke_menubutton_icon ---+ +-- .cke_menubutton_label --+ +-- .cke_cke_menuarrow --+ | |\r
35| | | +-- .cke_button_icon ---+ | | | | | | |\r
36| | | | | | | | | | | |\r
37| | | +-----------------------+ | | | | | | |\r
38| | +---------------------------+ +---------------------------+ +------------------------+ | |\r
39| +----------------------------------------------------------------------------------------+ |\r
40+--------------------------------------------------------------------------------------------+\r
41\r
42Special outer level classes used in this file:\r
43\r
44 .cke_hc: Available when the editor is rendered on "High Contrast".\r
45 .cke_rtl: Available when the editor UI is on RTL.\r
46*/\r
47\r
48/* .cke_menuitem is the element that holds the entire structure of each of the\r
49 menu items. */\r
50\r
51.cke_menubutton\r
52{\r
53 /* The "button" inside a menu item is a <a> element.\r
54 Transforms it into a block. */\r
55 display: block;\r
56}\r
57\r
58.cke_menuitem span\r
59{\r
60 /* Avoid the text selection cursor inside menu items. */\r
61 cursor: default;\r
62}\r
63\r
64.cke_menubutton:hover,\r
65.cke_menubutton:focus,\r
66.cke_menubutton:active\r
67{\r
68 background-color: #D3D3D3;\r
69 display: block;\r
70}\r
71\r
72.cke_hc .cke_menubutton\r
73{\r
74 padding: 2px;\r
75}\r
76\r
77.cke_hc .cke_menubutton:hover,\r
78.cke_hc .cke_menubutton:focus,\r
79.cke_hc .cke_menubutton:active\r
80{\r
81 border: 2px solid;\r
82 padding: 0;\r
83}\r
84\r
85.cke_menubutton_inner {\r
86 display: table-row;\r
87}\r
88\r
89.cke_menubutton_icon,\r
90.cke_menubutton_label,\r
91.cke_menuarrow {\r
92 display: table-cell;\r
93}\r
94\r
95/* The menu item icon. */\r
96.cke_menubutton_icon\r
97{\r
98 background-color: #D7D8D7;\r
99 opacity: 0.70; /* Safari, Opera and Mozilla */\r
100 filter: alpha(opacity=70); /* IE */\r
101 padding: 4px;\r
102}\r
103\r
104.cke_hc .cke_menubutton_icon\r
105{\r
106 height: 16px;\r
107 width: 0;\r
108 padding: 4px 0;\r
109}\r
110\r
111.cke_menubutton:hover .cke_menubutton_icon,\r
112.cke_menubutton:focus .cke_menubutton_icon,\r
113.cke_menubutton:active .cke_menubutton_icon\r
114{\r
115 background-color: #D0D2D0;\r
116}\r
117\r
118.cke_menubutton_disabled:hover .cke_menubutton_icon,\r
119.cke_menubutton_disabled:focus .cke_menubutton_icon,\r
120.cke_menubutton_disabled:active .cke_menubutton_icon\r
121{\r
122 /* The icon will get opacity as well when hovered. */\r
123 opacity: 0.3;\r
124 filter: alpha(opacity=30);\r
125}\r
126\r
127/* The textual part of each menu item. */\r
128.cke_menubutton_label\r
129{\r
130 padding: 0 5px;\r
131 background-color: transparent;\r
132 width: 100%;\r
133 vertical-align: middle;\r
134}\r
135\r
317f8f8f
IB
136/* Keyboard shortcut placed next to the label. */\r
137.cke_menubutton_shortcut\r
138{\r
139 color: #979797;\r
140}\r
141\r
3332bebe
IB
142.cke_menubutton_disabled .cke_menubutton_label\r
143{\r
144 /* Greyed label text indicates a disabled menu item. */\r
145 opacity: 0.3;\r
146 filter: alpha(opacity=30);\r
147}\r
148\r
149.cke_menubutton_on\r
150{\r
151 border: 1px solid #dedede;\r
152 background-color: #f2f2f2;\r
153\r
154 box-shadow: 0 0 2px rgba(0,0,0,.1) inset;\r
155}\r
156\r
157.cke_menubutton_on .cke_menubutton_icon\r
158{\r
159 padding-right: 3px;\r
160}\r
161\r
162.cke_menubutton:hover,\r
163.cke_menubutton:focus,\r
164.cke_menubutton:active\r
165{\r
166 background-color: #EFF0EF;\r
167}\r
168\r
169.cke_panel_frame .cke_menubutton_label\r
170{\r
171 display: none;\r
172}\r
173\r
174/* The separator used to separate menu item groups. */\r
175.cke_menuseparator\r
176{\r
177 background-color: #D3D3D3;\r
178 height: 1px;\r
179 filter: alpha(opacity=70); /* IE */\r
180 opacity: 0.70; /* Safari, Opera and Mozilla */\r
181}\r
182\r
183/* The small arrow shown for item with sub-menus. */\r
184.cke_menuarrow\r
185{\r
186 background-image: url(images/arrow.png);\r
187 background-position: 0 10px;\r
188 background-repeat: no-repeat;\r
189 padding: 0 5px;\r
190}\r
191\r
192.cke_rtl .cke_menuarrow\r
193{\r
194 background-position: 5px -13px;\r
195 background-repeat: no-repeat;\r
196}\r
197\r
198.cke_menuarrow span\r
199{\r
200 display: none;\r
201}\r
202\r
203.cke_hc .cke_menuarrow span\r
204{\r
205 vertical-align: middle;\r
206 display: inline;\r
207}\r