179 lines
		
	
	
		
			4.4 KiB
		
	
	
	
		
			CSS
		
	
	
	
		
		
			
		
	
	
			179 lines
		
	
	
		
			4.4 KiB
		
	
	
	
		
			CSS
		
	
	
	
| 
								 | 
							
								/*
							 | 
						||
| 
								 | 
							
								Copyright (c) 2003-2018, CKSource - Frederico Knabben. All rights reserved.
							 | 
						||
| 
								 | 
							
								For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
							 | 
						||
| 
								 | 
							
								*/
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
								/*
							 | 
						||
| 
								 | 
							
								richcombo.css (part of editor.css)
							 | 
						||
| 
								 | 
							
								=================================
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
								This file holds the style set of the "Rich Combo" widget which is commonly used
							 | 
						||
| 
								 | 
							
								in the toolbar. It doesn't, however, styles the panel that is displayed when
							 | 
						||
| 
								 | 
							
								clicking on the combo, which is instead styled by panel.css.
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
								The visual representation of a rich combo widget looks as follows:
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
								+-- .cke_combo----------------------------------------------------------------------+
							 | 
						||
| 
								 | 
							
								| +-- .cke_combo_label --+ +-- .cke_combo_button ---------------------------------+ |
							 | 
						||
| 
								 | 
							
								| |                      | | +-- .cke_combo_text --+ +-- .cke_combo_open -------+ | |
							 | 
						||
| 
								 | 
							
								| |                      | | |                     | | +-- .cke_combo_arrow --+ | | |
							 | 
						||
| 
								 | 
							
								| |                      | | |                     | | |                      | | | |
							 | 
						||
| 
								 | 
							
								| |                      | | |                     | | +----------------------+ | | |
							 | 
						||
| 
								 | 
							
								| |                      | | +---------------------+ +--------------------------+ | |
							 | 
						||
| 
								 | 
							
								| +----------------------+ +------------------------------------------------------+ |
							 | 
						||
| 
								 | 
							
								+-----------------------------------------------------------------------------------+
							 | 
						||
| 
								 | 
							
								*/
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
								/* The box that hold the entire combo widget */
							 | 
						||
| 
								 | 
							
								.cke_combo
							 | 
						||
| 
								 | 
							
								{
							 | 
						||
| 
								 | 
							
									display: inline-block;
							 | 
						||
| 
								 | 
							
									float: left;
							 | 
						||
| 
								 | 
							
								}
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
								.cke_rtl .cke_combo
							 | 
						||
| 
								 | 
							
								{
							 | 
						||
| 
								 | 
							
									float: right;
							 | 
						||
| 
								 | 
							
								}
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
								/* The label of the combo widget. It is invisible by default, yet
							 | 
						||
| 
								 | 
							
								   it's important for semantics and accessibility. */
							 | 
						||
| 
								 | 
							
								.cke_combo_label
							 | 
						||
| 
								 | 
							
								{
							 | 
						||
| 
								 | 
							
									display: none;
							 | 
						||
| 
								 | 
							
									float: left;
							 | 
						||
| 
								 | 
							
									line-height: 26px;
							 | 
						||
| 
								 | 
							
									vertical-align: top;
							 | 
						||
| 
								 | 
							
									margin-right: 5px;
							 | 
						||
| 
								 | 
							
									filter: alpha(opacity = 70); /* IE */
							 | 
						||
| 
								 | 
							
									opacity: 0.7; /* Safari, Opera and Mozilla */
							 | 
						||
| 
								 | 
							
								}
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
								.cke_rtl .cke_combo_label
							 | 
						||
| 
								 | 
							
								{
							 | 
						||
| 
								 | 
							
									float: right;
							 | 
						||
| 
								 | 
							
									margin-left: 5px;
							 | 
						||
| 
								 | 
							
									margin-right: 0;
							 | 
						||
| 
								 | 
							
								}
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
								/* The container for combo text and arrow. */
							 | 
						||
| 
								 | 
							
								a.cke_combo_button
							 | 
						||
| 
								 | 
							
								{
							 | 
						||
| 
								 | 
							
									display: inline-block;
							 | 
						||
| 
								 | 
							
									border-radius: 5px;
							 | 
						||
| 
								 | 
							
									background: url(images/sprites.png) 0 -100px repeat-x;	/* For backwards compatibility. */
							 | 
						||
| 
								 | 
							
									float: left;
							 | 
						||
| 
								 | 
							
									padding: 2px 4px 2px 6px;
							 | 
						||
| 
								 | 
							
									height: 22px;
							 | 
						||
| 
								 | 
							
									margin: 0 5px 5px 0;
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
									background: linear-gradient(to top, #fff, #d3d3d3 100px);
							 | 
						||
| 
								 | 
							
								}
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
								/* Different states of the container. */
							 | 
						||
| 
								 | 
							
								.cke_combo_off .cke_combo_button:hover,
							 | 
						||
| 
								 | 
							
								.cke_combo_off .cke_combo_button:focus,
							 | 
						||
| 
								 | 
							
								.cke_combo_off .cke_combo_button:active
							 | 
						||
| 
								 | 
							
								{
							 | 
						||
| 
								 | 
							
									background: #DFF1FF;
							 | 
						||
| 
								 | 
							
									outline: none;
							 | 
						||
| 
								 | 
							
								}
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
								.cke_rtl .cke_combo_button
							 | 
						||
| 
								 | 
							
								{
							 | 
						||
| 
								 | 
							
									float: right;
							 | 
						||
| 
								 | 
							
									margin-left: 5px;
							 | 
						||
| 
								 | 
							
									margin-right: 0;
							 | 
						||
| 
								 | 
							
								}
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
								/* A basic support for the high-contrast mode to enhance the readability. */
							 | 
						||
| 
								 | 
							
								.cke_hc .cke_combo_button
							 | 
						||
| 
								 | 
							
								{
							 | 
						||
| 
								 | 
							
									border: 1px solid black;
							 | 
						||
| 
								 | 
							
									padding: 1px 3px 1px 3px;
							 | 
						||
| 
								 | 
							
								}
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
								.cke_hc .cke_rtl .cke_combo_button
							 | 
						||
| 
								 | 
							
								{
							 | 
						||
| 
								 | 
							
									border: 1px solid black;
							 | 
						||
| 
								 | 
							
								}
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
								/* The label that shows the current value of the rich combo.
							 | 
						||
| 
								 | 
							
								   By default, it holds the name of the property.
							 | 
						||
| 
								 | 
							
								   See: .cke_combo_inlinelabel */
							 | 
						||
| 
								 | 
							
								.cke_combo_text
							 | 
						||
| 
								 | 
							
								{
							 | 
						||
| 
								 | 
							
									line-height: 24px;
							 | 
						||
| 
								 | 
							
									text-overflow: ellipsis;
							 | 
						||
| 
								 | 
							
									overflow: hidden;
							 | 
						||
| 
								 | 
							
									color: #666666;
							 | 
						||
| 
								 | 
							
									float: left;
							 | 
						||
| 
								 | 
							
									cursor: default;
							 | 
						||
| 
								 | 
							
									width: 60px;
							 | 
						||
| 
								 | 
							
								}
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
								.cke_rtl .cke_combo_text
							 | 
						||
| 
								 | 
							
								{
							 | 
						||
| 
								 | 
							
									float: right;
							 | 
						||
| 
								 | 
							
									text-align: right;
							 | 
						||
| 
								 | 
							
								}
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
								/* The label of the combo whose value hasn't been changed (it's default).
							 | 
						||
| 
								 | 
							
								   It displays the name of the property the combo is responsible for. */
							 | 
						||
| 
								 | 
							
								.cke_combo_inlinelabel
							 | 
						||
| 
								 | 
							
								{
							 | 
						||
| 
								 | 
							
									font-style: italic;
							 | 
						||
| 
								 | 
							
									opacity: 0.70;
							 | 
						||
| 
								 | 
							
								}
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
								.cke_combo_off .cke_combo_button:hover .cke_combo_inlinelabel,
							 | 
						||
| 
								 | 
							
								.cke_combo_off .cke_combo_button:active .cke_combo_inlinelabel,
							 | 
						||
| 
								 | 
							
								.cke_combo_off .cke_combo_button:focus .cke_combo_inlinelabel
							 | 
						||
| 
								 | 
							
								{
							 | 
						||
| 
								 | 
							
									opacity: 1;
							 | 
						||
| 
								 | 
							
								}
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
								/* The handler which opens the panel of rich combo properties.
							 | 
						||
| 
								 | 
							
								   It holds an arrow as a visual indicator. */
							 | 
						||
| 
								 | 
							
								.cke_combo_open
							 | 
						||
| 
								 | 
							
								{
							 | 
						||
| 
								 | 
							
								    cursor: default;
							 | 
						||
| 
								 | 
							
								    display: inline-block;
							 | 
						||
| 
								 | 
							
								    font-size: 0;
							 | 
						||
| 
								 | 
							
								    height: 19px;
							 | 
						||
| 
								 | 
							
								    line-height: 17px;
							 | 
						||
| 
								 | 
							
								    margin: 1px 3px;
							 | 
						||
| 
								 | 
							
								    width: 5px;
							 | 
						||
| 
								 | 
							
								}
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
								/* The arrow which is displayed inside of the .cke_combo_open handler. */
							 | 
						||
| 
								 | 
							
								.cke_combo_arrow
							 | 
						||
| 
								 | 
							
								{
							 | 
						||
| 
								 | 
							
									margin: 9px 0 0;
							 | 
						||
| 
								 | 
							
									float: left;
							 | 
						||
| 
								 | 
							
									opacity: 0.70;
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
									/* Pure CSS Arrow */
							 | 
						||
| 
								 | 
							
									height: 0;
							 | 
						||
| 
								 | 
							
									width: 0;
							 | 
						||
| 
								 | 
							
									font-size: 0;
							 | 
						||
| 
								 | 
							
									border-left: 3px solid transparent;
							 | 
						||
| 
								 | 
							
									border-right: 3px solid transparent;
							 | 
						||
| 
								 | 
							
									border-top: 3px solid #2f2f2f;
							 | 
						||
| 
								 | 
							
								}
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
								.cke_hc .cke_combo_arrow
							 | 
						||
| 
								 | 
							
								{
							 | 
						||
| 
								 | 
							
									font-size: 10px;
							 | 
						||
| 
								 | 
							
									width: auto;
							 | 
						||
| 
								 | 
							
									border: 0;
							 | 
						||
| 
								 | 
							
									margin-top: 4px;
							 | 
						||
| 
								 | 
							
								}
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
								/* Disabled combo button styles. */
							 | 
						||
| 
								 | 
							
								.cke_combo_disabled .cke_combo_inlinelabel,
							 | 
						||
| 
								 | 
							
								.cke_combo_disabled .cke_combo_open
							 | 
						||
| 
								 | 
							
								{
							 | 
						||
| 
								 | 
							
									opacity: 0.3;
							 | 
						||
| 
								 | 
							
								}
							 |