2014-04-11 20:07:18 +00:00
|
|
|
/*
|
2018-06-17 16:07:19 +00:00
|
|
|
Copyright (c) 2003-2018, CKSource - Frederico Knabben. All rights reserved.
|
|
|
|
For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
|
2014-04-11 20:07:18 +00:00
|
|
|
*/
|
2018-06-17 16:07:19 +00:00
|
|
|
|
|
|
|
/*
|
|
|
|
dialog.css
|
|
|
|
============
|
|
|
|
|
|
|
|
This file styles dialogs and all widgets available inside of it (tabs, buttons,
|
|
|
|
fields, etc.).
|
|
|
|
|
|
|
|
Dialogs are a complex system because they're very flexible. The CKEditor API
|
|
|
|
makes it easy to create and customize dialogs by code, by making use of several
|
|
|
|
different widgets inside its contents.
|
|
|
|
|
|
|
|
All dialogs share a main dialog strucuture, which can be visually represented
|
|
|
|
as follows:
|
|
|
|
|
|
|
|
+-- .cke_dialog -------------------------------------------------+
|
|
|
|
| +-- .cke_dialog_body ----------------------------------------+ |
|
|
|
|
| | +-- .cke_dialog_title --+ +-- .cke_dialog_close_button --+ | |
|
|
|
|
| | | | | | | |
|
|
|
|
| | +-----------------------+ +------------------------------+ | |
|
|
|
|
| | +-- .cke_dialog_tabs ------------------------------------+ | |
|
|
|
|
| | | | | |
|
|
|
|
| | +--------------------------------------------------------+ | |
|
|
|
|
| | +-- .cke_dialog_contents --------------------------------+ | |
|
|
|
|
| | | +-- .cke_dialog_contents_body -----------------------+ | | |
|
|
|
|
| | | | | | | |
|
|
|
|
| | | +----------------------------------------------------+ | | |
|
|
|
|
| | | +-- .cke_dialog_footer ------------------------------+ | | |
|
|
|
|
| | | | | | | |
|
|
|
|
| | | +----------------------------------------------------+ | | |
|
|
|
|
| | +--------------------------------------------------------+ | |
|
|
|
|
| +------------------------------------------------------------+ |
|
|
|
|
+----------------------------------------------------------------+
|
|
|
|
|
|
|
|
Comments in this file will give more details about each of the above blocks.
|
|
|
|
*/
|
|
|
|
|
|
|
|
/* The outer container of the dialog. */
|
|
|
|
.cke_dialog
|
|
|
|
{
|
|
|
|
/* Mandatory: Because the dialog.css file is loaded on demand, we avoid
|
|
|
|
showing an unstyled dialog by hidding it. Here, we restore its visibility. */
|
|
|
|
visibility: visible;
|
|
|
|
}
|
|
|
|
|
|
|
|
/* The inner boundary container. */
|
|
|
|
.cke_dialog_body
|
|
|
|
{
|
|
|
|
z-index: 1;
|
|
|
|
border: solid 1px #ddd;
|
|
|
|
padding: 5px;
|
|
|
|
background-color: #fff;
|
|
|
|
border-radius: 5px;
|
|
|
|
}
|
|
|
|
|
|
|
|
/* Due to our reset we have to recover the styles of some elements. */
|
|
|
|
.cke_dialog strong
|
|
|
|
{
|
|
|
|
font-weight: bold;
|
|
|
|
}
|
|
|
|
|
|
|
|
/* The dialog title. */
|
|
|
|
.cke_dialog_title
|
|
|
|
{
|
|
|
|
font-weight: bold;
|
|
|
|
font-size: 14px;
|
|
|
|
padding: 3px 3px 8px;
|
|
|
|
cursor: move;
|
|
|
|
position: relative;
|
|
|
|
border-bottom: 1px solid #eee;
|
|
|
|
}
|
|
|
|
|
|
|
|
.cke_dialog_spinner
|
|
|
|
{
|
|
|
|
border-radius: 50%;
|
|
|
|
|
|
|
|
width: 12px;
|
|
|
|
height: 12px;
|
|
|
|
overflow: hidden;
|
|
|
|
|
|
|
|
text-indent: -9999em;
|
|
|
|
|
|
|
|
border-top: 2px solid rgba(102, 102, 102, 0.2);
|
|
|
|
border-right: 2px solid rgba(102, 102, 102, 0.2);
|
|
|
|
border-bottom: 2px solid rgba(102, 102, 102, 0.2);
|
|
|
|
border-left: 2px solid rgba(102, 102, 102, 1);
|
|
|
|
|
|
|
|
-webkit-animation: dialog_spinner 1s infinite linear;
|
|
|
|
animation: dialog_spinner 1s infinite linear;
|
|
|
|
}
|
|
|
|
|
|
|
|
/* A GIF fallback for IE8 and IE9 which does not support CSS animations. */
|
|
|
|
.cke_browser_ie8 .cke_dialog_spinner,
|
|
|
|
.cke_browser_ie9 .cke_dialog_spinner
|
|
|
|
{
|
|
|
|
background: url(images/spinner.gif) center top no-repeat;
|
|
|
|
width: 16px;
|
|
|
|
height: 16px;
|
|
|
|
border: 0;
|
|
|
|
}
|
|
|
|
|
|
|
|
@-webkit-keyframes dialog_spinner
|
|
|
|
{
|
|
|
|
0% {
|
|
|
|
-webkit-transform: rotate(0deg);
|
|
|
|
transform: rotate(0deg);
|
|
|
|
}
|
|
|
|
100% {
|
|
|
|
-webkit-transform: rotate(360deg);
|
|
|
|
transform: rotate(360deg);
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
@keyframes dialog_spinner
|
|
|
|
{
|
|
|
|
0% {
|
|
|
|
-webkit-transform: rotate(0deg);
|
|
|
|
transform: rotate(0deg);
|
|
|
|
}
|
|
|
|
100% {
|
|
|
|
-webkit-transform: rotate(360deg);
|
|
|
|
transform: rotate(360deg);
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
/* The outer part of the dialog contants, which contains the contents body
|
|
|
|
and the footer. */
|
|
|
|
.cke_dialog_contents
|
|
|
|
{
|
|
|
|
background-color: #ebebeb;
|
|
|
|
border: solid 1px #fff;
|
|
|
|
border-bottom: none;
|
|
|
|
overflow: auto;
|
|
|
|
padding: 17px 10px 5px 10px;
|
|
|
|
border-top-left-radius: 5px;
|
|
|
|
border-top-right-radius: 5px;
|
|
|
|
margin-top: 22px;
|
|
|
|
}
|
|
|
|
|
|
|
|
/* The contents body part, which will hold all elements available in the dialog. */
|
|
|
|
.cke_dialog_contents_body
|
|
|
|
{
|
|
|
|
overflow: auto;
|
|
|
|
padding: 17px 10px 5px 10px;
|
|
|
|
margin-top: 22px;
|
|
|
|
}
|
|
|
|
|
|
|
|
/* The dialog footer, which usually contains the "Ok" and "Cancel" buttons as
|
|
|
|
well as a rsizer handle. */
|
|
|
|
.cke_dialog_footer
|
|
|
|
{
|
|
|
|
text-align: right;
|
|
|
|
background-color: #ebebeb;
|
|
|
|
border: solid 1px #fff;
|
|
|
|
border-bottom: none;
|
|
|
|
border-bottom-left-radius: 5px;
|
|
|
|
border-bottom-right-radius: 5px;
|
|
|
|
}
|
|
|
|
|
|
|
|
.cke_rtl .cke_dialog_footer
|
|
|
|
{
|
|
|
|
text-align: left;
|
|
|
|
}
|
|
|
|
|
|
|
|
.cke_dialog_footer .cke_resizer
|
|
|
|
{
|
|
|
|
margin-top: 24px;
|
|
|
|
}
|
|
|
|
|
|
|
|
.cke_dialog_footer .cke_resizer_ltr
|
|
|
|
{
|
|
|
|
border-right-color: #ccc;
|
|
|
|
}
|
|
|
|
|
|
|
|
.cke_dialog_footer .cke_resizer_rtl
|
|
|
|
{
|
|
|
|
border-left-color: #ccc;
|
|
|
|
}
|
|
|
|
|
|
|
|
.cke_hc .cke_dialog_footer .cke_resizer
|
|
|
|
{
|
|
|
|
margin-bottom: 1px;
|
|
|
|
}
|
|
|
|
|
|
|
|
.cke_hc .cke_dialog_footer .cke_resizer_ltr
|
|
|
|
{
|
|
|
|
margin-right: 1px;
|
|
|
|
}
|
|
|
|
|
|
|
|
.cke_hc .cke_dialog_footer .cke_resizer_rtl
|
|
|
|
{
|
|
|
|
margin-left: 1px;
|
|
|
|
}
|
|
|
|
|
|
|
|
/*
|
|
|
|
Dialog tabs
|
|
|
|
-------------
|
|
|
|
|
|
|
|
Tabs are presented on some of the dialogs to make it possible to have its
|
|
|
|
contents split on different groups, visible one after the other.
|
|
|
|
|
|
|
|
The main element that holds the tabs can be made hidden, in case of no tabs
|
|
|
|
available.
|
|
|
|
|
|
|
|
The following is the visual representation of the tabs block:
|
|
|
|
|
|
|
|
+-- .cke_dialog_tabs ------------------------------------+
|
|
|
|
| +-- .cke_dialog_tab --+ +-- .cke_dialog_tab --+ ... |
|
|
|
|
| | | | | |
|
|
|
|
| +---------------------+ +---------------------+ |
|
|
|
|
+--------------------------------------------------------+
|
|
|
|
|
|
|
|
The .cke_dialog_tab_selected class is appended to the active tab.
|
|
|
|
*/
|
|
|
|
|
|
|
|
/* The main tabs container. */
|
|
|
|
.cke_dialog_tabs
|
|
|
|
{
|
|
|
|
height: 23px;
|
|
|
|
display: inline-block;
|
|
|
|
margin-left:10px;
|
|
|
|
margin-right:10px;
|
|
|
|
margin-top: 11px;
|
|
|
|
position: absolute;
|
|
|
|
z-index: 2;
|
|
|
|
}
|
|
|
|
|
|
|
|
.cke_rtl .cke_dialog_tabs
|
|
|
|
{
|
|
|
|
right: 10px;
|
|
|
|
}
|
|
|
|
|
|
|
|
/* A single tab (an <a> element). */
|
|
|
|
a.cke_dialog_tab
|
|
|
|
{
|
|
|
|
background-image: url(images/sprites.png);
|
|
|
|
background-repeat: repeat-x;
|
|
|
|
background-position: 0 -1323px;
|
|
|
|
|
|
|
|
background-color: #ebebeb;
|
|
|
|
height: 14px;
|
|
|
|
padding: 4px 8px;
|
|
|
|
display: inline-block;
|
|
|
|
cursor: pointer;
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
a.cke_dialog_tab:hover
|
|
|
|
{
|
|
|
|
background-color: #f1f1e3;
|
|
|
|
}
|
|
|
|
|
|
|
|
.cke_hc a.cke_dialog_tab:hover
|
|
|
|
{
|
|
|
|
padding: 2px 6px !important;
|
|
|
|
border-width: 3px;
|
|
|
|
}
|
|
|
|
|
|
|
|
a.cke_dialog_tab_selected
|
|
|
|
{
|
|
|
|
background-position: 0 -1279px;
|
|
|
|
cursor: default;
|
|
|
|
}
|
|
|
|
|
|
|
|
.cke_hc a.cke_dialog_tab_selected
|
|
|
|
{
|
|
|
|
padding: 2px 6px !important;
|
|
|
|
border-width: 3px;
|
|
|
|
}
|
|
|
|
|
|
|
|
a.cke_dialog_tab_disabled
|
|
|
|
{
|
|
|
|
color: #bababa;
|
|
|
|
cursor: default;
|
|
|
|
}
|
|
|
|
|
|
|
|
/* The .cke_single_page class is appended to the dialog outer element in case
|
|
|
|
of dialogs that has no tabs. */
|
|
|
|
.cke_single_page .cke_dialog_tabs
|
|
|
|
{
|
|
|
|
display: none;
|
|
|
|
}
|
|
|
|
|
|
|
|
.cke_single_page .cke_dialog_contents
|
|
|
|
{
|
|
|
|
padding-top: 5px;
|
|
|
|
margin-top: 10px;
|
|
|
|
}
|
|
|
|
|
|
|
|
/* The close button at the top of the dialog. */
|
|
|
|
|
|
|
|
a.cke_dialog_close_button
|
|
|
|
{
|
|
|
|
background-image: url(images/sprites.png);
|
|
|
|
background-repeat: no-repeat;
|
|
|
|
background-position: 0 -1022px;
|
|
|
|
position: absolute;
|
|
|
|
cursor: pointer;
|
|
|
|
text-align: center;
|
|
|
|
height: 20px;
|
|
|
|
width: 20px;
|
|
|
|
top: 5px;
|
|
|
|
}
|
|
|
|
|
|
|
|
.cke_dialog_close_button span
|
|
|
|
{
|
|
|
|
display: none;
|
|
|
|
}
|
|
|
|
|
|
|
|
.cke_dialog_close_button:hover
|
|
|
|
{
|
|
|
|
background-position: 0 -1045px;
|
|
|
|
}
|
|
|
|
|
|
|
|
.cke_ltr .cke_dialog_close_button
|
|
|
|
{
|
|
|
|
right: 10px;
|
|
|
|
}
|
|
|
|
|
|
|
|
.cke_rtl .cke_dialog_close_button
|
|
|
|
{
|
|
|
|
left: 10px;
|
|
|
|
}
|
|
|
|
|
|
|
|
.cke_dialog_close_button
|
|
|
|
{
|
|
|
|
top: 7px;
|
|
|
|
}
|
|
|
|
|
|
|
|
/*
|
|
|
|
Dialog UI Elements
|
|
|
|
--------------------
|
|
|
|
|
|
|
|
The remaining styles define the UI elements that can be used inside dialog
|
|
|
|
contents.
|
|
|
|
|
|
|
|
Most of the UI elements on dialogs contain a textual label. All of them share
|
|
|
|
the same labelling structure, having the label text inside an element with
|
|
|
|
.cke_dialog_ui_labeled_label and the element specific part inside the
|
|
|
|
.cke_dialog_ui_labeled_content class.
|
|
|
|
*/
|
|
|
|
|
|
|
|
/* If an element is supposed to be disabled, the .cke_disabled class is
|
|
|
|
appended to it. */
|
|
|
|
div.cke_disabled .cke_dialog_ui_labeled_content *
|
|
|
|
{
|
|
|
|
background-color : #a0a0a0;
|
|
|
|
cursor : default;
|
|
|
|
}
|
|
|
|
|
|
|
|
/*
|
|
|
|
Horizontal-Box and Vertical-Box
|
|
|
|
---------------------------------
|
|
|
|
|
|
|
|
There are basic layou element used by the editor to properly align elements in
|
|
|
|
the dialog. They're basically tables that have each cell filled by UI elements.
|
|
|
|
|
|
|
|
The following is the visual representation of a H-Box:
|
|
|
|
|
|
|
|
+-- .cke_dialog_ui_hbox --------------------------------------------------------------------------------+
|
|
|
|
| +-- .cke_dialog_ui_hbox_first --+ +-- .cke_dialog_ui_hbox_child --+ +-- .cke_dialog_ui_hbox_last --+ |
|
|
|
|
| + + + + + + |
|
|
|
|
| +-------------------------------+ +-------------------------------+ +------------------------------+ |
|
|
|
|
+-------------------------------------------------------------------------------------------------------+
|
|
|
|
|
|
|
|
It is possible to have nested V/H-Boxes.
|
|
|
|
*/
|
|
|
|
|
|
|
|
.cke_dialog_ui_vbox table,
|
|
|
|
.cke_dialog_ui_hbox table
|
|
|
|
{
|
|
|
|
margin: auto;
|
|
|
|
}
|
|
|
|
|
|
|
|
.cke_dialog_ui_vbox_child
|
|
|
|
{
|
|
|
|
padding: 5px 0px;
|
|
|
|
}
|
|
|
|
|
|
|
|
.cke_dialog_ui_hbox
|
|
|
|
{
|
|
|
|
width: 100%;
|
|
|
|
}
|
|
|
|
|
|
|
|
.cke_dialog_ui_hbox_first,
|
|
|
|
.cke_dialog_ui_hbox_child,
|
|
|
|
.cke_dialog_ui_hbox_last
|
|
|
|
{
|
|
|
|
vertical-align: top;
|
|
|
|
}
|
|
|
|
|
|
|
|
.cke_ltr .cke_dialog_ui_hbox_first,
|
|
|
|
.cke_ltr .cke_dialog_ui_hbox_child
|
|
|
|
{
|
|
|
|
padding-right: 10px;
|
|
|
|
}
|
|
|
|
|
|
|
|
.cke_rtl .cke_dialog_ui_hbox_first,
|
|
|
|
.cke_rtl .cke_dialog_ui_hbox_child
|
|
|
|
{
|
|
|
|
padding-left: 10px;
|
|
|
|
}
|
|
|
|
|
|
|
|
/*
|
|
|
|
Text Input
|
|
|
|
------------
|
|
|
|
|
|
|
|
The basic text field to input text.
|
|
|
|
|
|
|
|
+-- .cke_dialog_ui_text --------------------------+
|
|
|
|
| +-- .cke_dialog_ui_labeled_label ------------+ |
|
|
|
|
| | | |
|
|
|
|
| +--------------------------------------------+ |
|
|
|
|
| +-- .cke_dialog_ui_labeled_content ----------+ |
|
|
|
|
| | +-- div.cke_dialog_ui_input_text --------+ | |
|
|
|
|
| | | +-- input.cke_dialog_ui_input_text --+ | | |
|
|
|
|
| | | | | | | |
|
|
|
|
| | | +------------------------------------+ | | |
|
|
|
|
| | +----------------------------------------+ | |
|
|
|
|
| +--------------------------------------------+ |
|
|
|
|
+-------------------------------------------------+
|
|
|
|
*/
|
|
|
|
|
|
|
|
input.cke_dialog_ui_input_text,
|
|
|
|
input.cke_dialog_ui_input_password
|
|
|
|
{
|
|
|
|
background-color: white;
|
|
|
|
border: none;
|
|
|
|
padding: 0px;
|
|
|
|
width: 100%;
|
|
|
|
height: 14px;
|
|
|
|
}
|
|
|
|
|
|
|
|
div.cke_dialog_ui_input_text,
|
|
|
|
div.cke_dialog_ui_input_password
|
|
|
|
{
|
|
|
|
background-color: white;
|
|
|
|
border: 1px solid #a0a0a0;
|
|
|
|
padding: 1px 0px;
|
|
|
|
}
|
|
|
|
|
|
|
|
/*
|
|
|
|
Textarea
|
|
|
|
----------
|
|
|
|
|
|
|
|
The textarea field to input larger text.
|
|
|
|
|
|
|
|
+-- .cke_dialog_ui_textarea --------------------------+
|
|
|
|
| +-- .cke_dialog_ui_labeled_label ----------------+ |
|
|
|
|
| | | |
|
|
|
|
| +------------------------------------------------+ |
|
|
|
|
| +-- .cke_dialog_ui_labeled_content --------------+ |
|
|
|
|
| | +-- div.cke_dialog_ui_input_textarea --------+ | |
|
|
|
|
| | | +-- input.cke_dialog_ui_input_textarea --+ | | |
|
|
|
|
| | | | | | | |
|
|
|
|
| | | +----------------------------------------+ | | |
|
|
|
|
| | +--------------------------------------------+ | |
|
|
|
|
| +------------------------------------------------+ |
|
|
|
|
+-----------------------------------------------------+
|
|
|
|
*/
|
|
|
|
|
|
|
|
textarea.cke_dialog_ui_input_textarea
|
|
|
|
{
|
|
|
|
background-color: white;
|
|
|
|
border: none;
|
|
|
|
padding: 0px;
|
|
|
|
width: 100%;
|
|
|
|
overflow: auto;
|
|
|
|
resize: none;
|
|
|
|
}
|
|
|
|
|
|
|
|
div.cke_dialog_ui_input_textarea
|
|
|
|
{
|
|
|
|
background-color: white;
|
|
|
|
border: 1px solid #a0a0a0;
|
|
|
|
padding: 1px 0px;
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
/*
|
|
|
|
Button
|
|
|
|
--------
|
|
|
|
|
|
|
|
The buttons used in the dialog footer or inside the contents.
|
|
|
|
|
|
|
|
+-- a.cke_dialog_ui_button -----------+
|
|
|
|
| +-- span.cke_dialog_ui_button --+ |
|
|
|
|
| | | |
|
|
|
|
| +-------------------------------+ |
|
|
|
|
+-------------------------------------+
|
|
|
|
*/
|
|
|
|
|
|
|
|
/* The outer part of the button. */
|
|
|
|
a.cke_dialog_ui_button
|
|
|
|
{
|
|
|
|
border-collapse: separate;
|
|
|
|
cursor: default;
|
|
|
|
|
|
|
|
border-radius: 5px;
|
|
|
|
background: transparent url(images/sprites.png) repeat-x scroll 0 -1069px;
|
|
|
|
text-align: center;
|
|
|
|
display: inline-block;
|
|
|
|
}
|
|
|
|
|
|
|
|
/* The inner part of the button (dialog footer buttons only). */
|
|
|
|
.cke_dialog_footer_buttons a.cke_dialog_ui_button span
|
|
|
|
{
|
|
|
|
width: 60px;
|
|
|
|
padding: 5px 20px 5px;
|
|
|
|
display: inline-block;
|
|
|
|
}
|
|
|
|
|
|
|
|
/* Special class appended to the Ok button. */
|
|
|
|
a.cke_dialog_ui_button_ok
|
|
|
|
{
|
|
|
|
background-position: 0 -1144px;
|
|
|
|
}
|
|
|
|
|
|
|
|
a.cke_dialog_ui_button_ok span
|
|
|
|
{
|
|
|
|
background: transparent url(images/sprites.png) no-repeat scroll right -1216px;
|
|
|
|
}
|
|
|
|
|
|
|
|
.cke_rtl a.cke_dialog_ui_button_ok span
|
|
|
|
{
|
|
|
|
background-position: left -1216px;
|
|
|
|
}
|
|
|
|
|
|
|
|
/* Special class appended to the Cancel button. */
|
|
|
|
a.cke_dialog_ui_button_cancel
|
|
|
|
{
|
|
|
|
background-position: 0 -1105px;
|
|
|
|
}
|
|
|
|
|
|
|
|
a.cke_dialog_ui_button_cancel span
|
|
|
|
{
|
|
|
|
background: transparent url(images/sprites.png) no-repeat scroll right -1242px;
|
|
|
|
}
|
|
|
|
|
|
|
|
.cke_rtl a.cke_dialog_ui_button_cancel span
|
|
|
|
{
|
|
|
|
background-position: left -1242px;
|
|
|
|
}
|
|
|
|
|
|
|
|
span.cke_dialog_ui_button
|
|
|
|
{
|
|
|
|
padding: 2px 10px;
|
|
|
|
text-align: center;
|
|
|
|
color: #222;
|
|
|
|
display: inline-block;
|
|
|
|
cursor: default;
|
|
|
|
min-width: 60px;
|
|
|
|
}
|
|
|
|
|
|
|
|
/* .cke_disabled is appended to disabled buttons */
|
|
|
|
a.cke_dialog_ui_button span.cke_disabled
|
|
|
|
{
|
|
|
|
border: #898980 1px solid;
|
|
|
|
color: #5e5e55;
|
|
|
|
background-color: #c5c5b3;
|
|
|
|
}
|
|
|
|
|
|
|
|
a.cke_dialog_ui_button:hover,
|
|
|
|
a.cke_dialog_ui_button:focus,
|
|
|
|
a.cke_dialog_ui_button:active
|
|
|
|
{
|
|
|
|
background-position: 0 -1180px;
|
|
|
|
}
|
|
|
|
|
|
|
|
.cke_hc a.cke_dialog_ui_button:hover,
|
|
|
|
.cke_hc a.cke_dialog_ui_button:focus,
|
|
|
|
.cke_hc a.cke_dialog_ui_button:active
|
|
|
|
{
|
|
|
|
border-width: 2px;
|
|
|
|
}
|
|
|
|
|
|
|
|
/* A special container that holds the footer buttons. */
|
|
|
|
.cke_dialog_footer_buttons
|
|
|
|
{
|
|
|
|
display: inline-table;
|
|
|
|
margin: 6px 12px 0 12px;
|
|
|
|
width: auto;
|
|
|
|
position: relative;
|
|
|
|
}
|
|
|
|
|
|
|
|
.cke_dialog_footer_buttons span.cke_dialog_ui_button
|
|
|
|
{
|
|
|
|
text-align: center;
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
/*
|
|
|
|
Styles for other dialog element types.
|
|
|
|
*/
|
|
|
|
select.cke_dialog_ui_input_select
|
|
|
|
{
|
|
|
|
border: 1px solid #a0a0a0;
|
|
|
|
background-color: white;
|
|
|
|
}
|
|
|
|
|
|
|
|
.cke_dialog_ui_input_file
|
|
|
|
{
|
|
|
|
width: 100%;
|
|
|
|
height: 25px;
|
|
|
|
}
|
|
|
|
|
|
|
|
/*
|
|
|
|
* Some utility CSS classes for dialog authors.
|
|
|
|
*/
|
|
|
|
.cke_dialog .cke_dark_background
|
|
|
|
{
|
|
|
|
background-color: #eaead1;
|
|
|
|
}
|
|
|
|
|
|
|
|
.cke_dialog .cke_light_background
|
|
|
|
{
|
|
|
|
background-color: #ffffbe;
|
|
|
|
}
|
|
|
|
|
|
|
|
.cke_dialog .cke_centered
|
|
|
|
{
|
|
|
|
text-align: center;
|
|
|
|
}
|
|
|
|
|
|
|
|
.cke_dialog a.cke_btn_reset
|
|
|
|
{
|
|
|
|
float: right;
|
|
|
|
background-position: 0 -32px;
|
|
|
|
background-image: url(images/mini.gif);
|
|
|
|
width: 16px;
|
|
|
|
height: 16px;
|
|
|
|
background-repeat: no-repeat;
|
|
|
|
border: 1px none;
|
|
|
|
font-size: 1px;
|
|
|
|
}
|
|
|
|
|
|
|
|
.cke_rtl .cke_dialog a.cke_btn_reset
|
|
|
|
{
|
|
|
|
float: left;
|
|
|
|
}
|
|
|
|
|
|
|
|
.cke_dialog a.cke_btn_locked,
|
|
|
|
.cke_dialog a.cke_btn_unlocked
|
|
|
|
{
|
|
|
|
float: left;
|
|
|
|
background-position: 0 0;
|
|
|
|
background-image: url(images/mini.gif);
|
|
|
|
width: 16px;
|
|
|
|
height: 16px;
|
|
|
|
background-repeat: no-repeat;
|
|
|
|
border: none 1px;
|
|
|
|
font-size: 1px;
|
|
|
|
}
|
|
|
|
.cke_dialog a.cke_btn_locked .cke_icon
|
|
|
|
{
|
|
|
|
display:none;
|
|
|
|
}
|
|
|
|
|
|
|
|
.cke_rtl .cke_dialog a.cke_btn_locked,
|
|
|
|
.cke_rtl .cke_dialog a.cke_btn_unlocked
|
|
|
|
{
|
|
|
|
float: right;
|
|
|
|
}
|
|
|
|
|
|
|
|
.cke_dialog a.cke_btn_unlocked
|
|
|
|
{
|
|
|
|
background-position: 0 -16px;
|
|
|
|
background-image: url(images/mini.gif);
|
|
|
|
}
|
|
|
|
|
|
|
|
.cke_dialog .cke_btn_over
|
|
|
|
{
|
|
|
|
border: outset 1px;
|
|
|
|
cursor: pointer;
|
|
|
|
}
|
|
|
|
|
|
|
|
/*
|
|
|
|
The rest of the file contains style used on several common plugins. There is a
|
|
|
|
tendency that these will be moved to the plugins code in the future.
|
|
|
|
*/
|
|
|
|
|
|
|
|
.cke_dialog .ImagePreviewBox
|
|
|
|
{
|
|
|
|
border : 2px ridge black;
|
|
|
|
overflow : scroll;
|
|
|
|
height : 200px;
|
|
|
|
width : 300px;
|
|
|
|
padding : 2px;
|
|
|
|
background-color : white;
|
|
|
|
}
|
|
|
|
|
|
|
|
.cke_dialog .ImagePreviewBox table td {
|
|
|
|
white-space: normal;
|
|
|
|
}
|
|
|
|
|
|
|
|
.cke_dialog .ImagePreviewLoader
|
|
|
|
{
|
|
|
|
position: absolute;
|
|
|
|
white-space : normal;
|
|
|
|
overflow : hidden;
|
|
|
|
height : 160px;
|
|
|
|
width : 230px;
|
|
|
|
margin : 2px;
|
|
|
|
padding : 2px;
|
|
|
|
opacity : 0.9;
|
|
|
|
filter : alpha(opacity=90);
|
|
|
|
|
|
|
|
background-color : #e4e4e4;
|
|
|
|
}
|
|
|
|
|
|
|
|
.cke_dialog .FlashPreviewBox
|
|
|
|
{
|
|
|
|
white-space : normal;
|
|
|
|
border : 2px ridge black;
|
|
|
|
overflow : auto;
|
|
|
|
height : 160px;
|
|
|
|
width : 390px;
|
|
|
|
padding : 2px;
|
|
|
|
background-color : white;
|
|
|
|
}
|
|
|
|
|
|
|
|
.cke_dialog .cke_pastetext
|
|
|
|
{
|
|
|
|
width: 346px;
|
|
|
|
height: 170px;
|
|
|
|
}
|
|
|
|
|
|
|
|
.cke_dialog .cke_pastetext textarea
|
|
|
|
{
|
|
|
|
width: 340px;
|
|
|
|
height: 170px;
|
|
|
|
resize: none;
|
|
|
|
}
|
|
|
|
|
|
|
|
.cke_dialog iframe.cke_pasteframe
|
|
|
|
{
|
|
|
|
width: 346px;
|
|
|
|
height: 130px;
|
|
|
|
background-color: white;
|
|
|
|
border: 1px solid black;
|
|
|
|
}
|
|
|
|
|
|
|
|
.cke_dialog .cke_hand
|
|
|
|
{
|
|
|
|
cursor: pointer;
|
|
|
|
}
|
|
|
|
|
|
|
|
.cke_disabled
|
|
|
|
{
|
|
|
|
color: #a0a0a0;
|
|
|
|
}
|
|
|
|
|
|
|
|
/*
|
|
|
|
High Contrast Mode.
|
|
|
|
*/
|
|
|
|
|
|
|
|
.cke_hc .cke_dialog_title,
|
|
|
|
.cke_hc .cke_dialog_tabs,
|
|
|
|
.cke_hc .cke_dialog_contents,
|
|
|
|
.cke_hc .cke_dialog_footer
|
|
|
|
{
|
|
|
|
border-left: 1px solid;
|
|
|
|
border-right: 1px solid;
|
|
|
|
}
|
|
|
|
|
|
|
|
.cke_hc .cke_dialog_title
|
|
|
|
{
|
|
|
|
border-top: 1px solid;
|
|
|
|
}
|
|
|
|
|
|
|
|
.cke_hc .cke_dialog_footer
|
|
|
|
{
|
|
|
|
border-bottom: 1px solid;
|
|
|
|
}
|
|
|
|
|
|
|
|
.cke_hc .cke_dialog_close_button span
|
|
|
|
{
|
|
|
|
display: inline;
|
|
|
|
cursor: pointer;
|
|
|
|
font-weight: bold;
|
|
|
|
position: relative;
|
|
|
|
top: 3px;
|
|
|
|
}
|
|
|
|
|
|
|
|
.cke_dialog_body .cke_label
|
|
|
|
{
|
|
|
|
display: none;
|
|
|
|
}
|
|
|
|
|
|
|
|
.cke_dialog_body label
|
|
|
|
{
|
|
|
|
display: inline;
|
|
|
|
margin-bottom: auto;
|
|
|
|
cursor: default;
|
|
|
|
}
|
|
|
|
|
|
|
|
.cke_dialog_body label.cke_required
|
|
|
|
{
|
|
|
|
font-weight: bold;
|
|
|
|
}
|
|
|
|
|
|
|
|
.cke_hc .cke_dialog_body .cke_label
|
|
|
|
{
|
|
|
|
display: inline;
|
|
|
|
cursor: inherit;
|
|
|
|
}
|
|
|
|
|
|
|
|
.cke_hc a.cke_btn_locked,
|
|
|
|
.cke_hc a.cke_btn_unlocked,
|
|
|
|
.cke_hc a.cke_btn_reset
|
|
|
|
{
|
|
|
|
border-style: solid;
|
|
|
|
float: left;
|
|
|
|
width: auto;
|
|
|
|
height: auto;
|
|
|
|
padding: 0 2px;
|
|
|
|
}
|
|
|
|
|
|
|
|
.cke_rtl.cke_hc a.cke_btn_locked,
|
|
|
|
.cke_rtl.cke_hc a.cke_btn_unlocked,
|
|
|
|
.cke_rtl.cke_hc a.cke_btn_reset
|
|
|
|
{
|
|
|
|
float: right;
|
|
|
|
}
|
|
|
|
.cke_hc a.cke_btn_locked .cke_icon
|
|
|
|
{
|
|
|
|
display:inline;
|
|
|
|
}
|
|
|
|
|
|
|
|
a.cke_smile img
|
|
|
|
{
|
|
|
|
/* IE6 does not support transparent borders */
|
|
|
|
border: 2px solid #eaead1;
|
|
|
|
}
|
|
|
|
|
|
|
|
a.cke_smile:focus img,
|
|
|
|
a.cke_smile:active img,
|
|
|
|
a.cke_smile:hover img
|
|
|
|
{
|
|
|
|
border-color: #C7C78F;
|
|
|
|
}
|
|
|
|
|
|
|
|
.cke_hc .cke_dialog_tabs a,
|
|
|
|
.cke_hc .cke_dialog_footer a
|
|
|
|
{
|
|
|
|
opacity: 1.0;
|
|
|
|
filter: alpha(opacity=100);
|
|
|
|
border: 1px solid white;
|
|
|
|
}
|
|
|
|
|
|
|
|
.cke_hc .ImagePreviewBox
|
|
|
|
{
|
|
|
|
width: 260px;
|
|
|
|
}
|
|
|
|
|
|
|
|
/**
|
|
|
|
* Styles specific to "cellProperties" dialog.
|
|
|
|
*/
|
|
|
|
|
|
|
|
.cke_dialog_contents a.colorChooser
|
|
|
|
{
|
|
|
|
display:block;
|
|
|
|
margin-top:6px;
|
|
|
|
margin-left: 10px;
|
|
|
|
width: 80px;
|
|
|
|
}
|
|
|
|
|
|
|
|
.cke_rtl .cke_dialog_contents a.colorChooser
|
|
|
|
{
|
|
|
|
margin-right: 10px;
|
|
|
|
}
|
|
|
|
|
|
|
|
/* Compensate focus outline for some input elements. (#6200) */
|
|
|
|
.cke_dialog_ui_checkbox_input:focus,
|
|
|
|
.cke_dialog_ui_radio_input:focus,
|
|
|
|
.cke_dialog_ui_input_select:focus,
|
|
|
|
.cke_btn_over
|
|
|
|
{
|
|
|
|
outline: 1px dotted #696969;
|
|
|
|
}
|
|
|
|
|
|
|
|
.cke_iframe_shim
|
|
|
|
{
|
|
|
|
display:block;
|
|
|
|
position:absolute;
|
|
|
|
top:0;
|
|
|
|
left:0;
|
|
|
|
z-index:-1;
|
|
|
|
filter:alpha(opacity=0);
|
|
|
|
width:100%;
|
|
|
|
height:100%;
|
|
|
|
}
|