From 7183f6a6a21ad9124e70c997e0168459f377a9f2 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Isma=C3=ABl=20Bouya?= Date: Thu, 26 Jan 2017 15:34:32 +0100 Subject: Change skin and add video button --- sources/skins/moonocolor/panel.css | 237 +++++++++++++++++++++++++++++++++++++ 1 file changed, 237 insertions(+) create mode 100644 sources/skins/moonocolor/panel.css (limited to 'sources/skins/moonocolor/panel.css') diff --git a/sources/skins/moonocolor/panel.css b/sources/skins/moonocolor/panel.css new file mode 100644 index 0000000..8743d19 --- /dev/null +++ b/sources/skins/moonocolor/panel.css @@ -0,0 +1,237 @@ +/* +Copyright (c) 2003-2015, CKSource - Frederico Knabben. All rights reserved. +For licensing, see LICENSE.md or http://ckeditor.com/license +*/ + +/* +panel.css (part of editor.css) +================================ + +Panels are floating elements that can hold different types of contents. +The following are common uses of it: + + - The element that toolbar combos display when opening them. + - The context menu. + - The list of items displayed by "menu buttons" (e.g. scayt). + - The panel shown when opening "panel buttons" (e.g. color buttons). + +Panel contents are wrapped into an iframe, so it is possible to have additional +CSS loaded inside them (e.g. to have more accurate preview on the styles combo). + +The following is a visual representation of the outer elements of a panel: + ++-- .cke_panel(*) ---------------------+ +| +-- IFRAME.cke_panel_frame --------+ | +| | +-- HTML.cke_panel_container --+ | | +| | | +-- .cke_panel_block ------+ | | | +| | | | | | | | +| | | | (contents here) | | | | +| | | | | | | | +| | | +--------------------------+ | | | +| | +------------------------------+ | | +| +----------------------------------+ | ++--------------------------------------+ + +(*) All kinds of panel share the above structure. Menu panels adds the + .cke_menu_panel class to the outer element, while toolbar combos add the + .cke_combopanel class. + +This file also defines styles for panel lists (used by combos). For menu-like +panel contents and color panels check menu.css and colorpanel.css. +*/ + +/* The box that holds an IFRAME. It's inserted into a host document and positioned + absolutely by the application. It floats above the host document/editor. */ +.cke_panel +{ + /* Restore the loading hide */ + visibility: visible; + width: 120px; + height: 100px; + overflow: hidden; + + background-color: #fff; + border: 1px solid #b6b6b6; + border-bottom-color: #999; + + border-radius: 3px; + + box-shadow: 0 0 3px rgba(0,0,0,.15); +} + +/* This class represents panels which are used as context menus. */ +.cke_menu_panel +{ + padding: 0; + margin: 0; +} + +/* This class represents panels which are used by rich combos. */ +.cke_combopanel +{ + width: 150px; + height: 170px; +} + +/* The IFRAME the panel is wrapped into. */ +.cke_panel_frame +{ + width: 100%; + height: 100%; + font-size: 12px; + + overflow: auto; + overflow-x: hidden; +} + +/* The HTML document which is a direct descendant of the IFRAME */ +.cke_panel_container +{ + overflow-y: auto; + overflow-x: hidden; +} + +/* +Here we start the definition of panel lists (e.g. combo panels). The following +is its visual representation: + ++-- .cke_panel_block -----------------+ +| +-- .cke_panel_grouptitle --------+ | +| | | | +| +---------------------------------+ | +| +-- .cke_panel_list --------------+ | +| | +-- .cke_panel_listItem ------+ | | +| | | +-- a --------------------+ | | | +| | | | +-- span -------------+ | | | | +| | | | | | | | | | +| | | | +---------------------+ | | | | +| | | +-------------------------+ | | | +| | +-----------------------------+ | | +| | +-- .cke_panel_listItem ------+ | | +| | | +-- a --------------------+ | | | +| | | | +-- span -------------+ | | | | +| | | | | | | | | | +| | | | +---------------------+ | | | | +| | | +-------------------------+ | | | +| | +-----------------------------+ | | +| | ... | | +| +---------------------------------+ | ++-------------------------------------+ +*/ + + +/* The list of panel items. */ +.cke_panel_list +{ + list-style-type: none; + margin: 3px; + padding: 0; + white-space: nowrap; +} + +/* The item of .cke_panel_list */ +.cke_panel_listItem +{ + margin: 0; + padding-bottom: 1px; +} + +/* The child of .cke_panel_listItem. These elements contain spans which are + to display a real name of the property which is visible for an end-user. */ +.cke_panel_listItem a +{ + padding: 3px 4px; + display: block; + border: 1px solid #fff; + color: inherit !important; + text-decoration: none; + overflow: hidden; + text-overflow: ellipsis; + + border-radius: 2px; +} + +/* IE6 */ +* html .cke_panel_listItem a +{ + width : 100%; + + /* IE is not able to inherit the color, so we must force it to black */ + color: #000; +} + +/* IE7 */ +*:first-child+html .cke_panel_listItem a +{ + /* IE is not able to inherit the color, so we must force it to black */ + color: #000; +} + +.cke_panel_listItem.cke_selected a +{ + border: 1px solid #dedede; + background-color: #f2f2f2; + + box-shadow: 0 0 2px rgba(0,0,0,.1) inset; +} + +.cke_panel_listItem a:hover, +.cke_panel_listItem a:focus, +.cke_panel_listItem a:active +{ + border-color: #dedede; + background-color: #f2f2f2; + + box-shadow: 0 0 2px rgba(0,0,0,.1) inset; +} + +.cke_hc .cke_panel_listItem a +{ + border-style: none; +} + +.cke_hc .cke_panel_listItem a:hover, +.cke_hc .cke_panel_listItem a:focus, +.cke_hc .cke_panel_listItem a:active +{ + border: 2px solid; + padding: 1px 2px; +} + +/* The title of the entire panel which is visible on top of the list. */ +.cke_panel_grouptitle +{ + cursor: default; + font-size: 11px; + font-weight: bold; + white-space: nowrap; + margin: 0; + padding: 4px 6px; + + color: #474747; + text-shadow: 0 1px 0 rgba(255,255,255,.75); + border-bottom: 1px solid #b6b6b6; + + border-radius: 2px 2px 0 0; + + box-shadow: 0 1px 0 #fff inset; + + background: #cfd1cf; + background-image: linear-gradient(to bottom, #f5f5f5, #cfd1cf); + filter: progid:DXImageTransform.Microsoft.gradient(gradientType=0, startColorstr='#f5f5f5', endColorstr='#cfd1cf'); +} + +/* The following styles set defaults of the elements used by the Paragraph + Format panel. */ +.cke_panel_listItem p, +.cke_panel_listItem h1, +.cke_panel_listItem h2, +.cke_panel_listItem h3, +.cke_panel_listItem h4, +.cke_panel_listItem h5, +.cke_panel_listItem h6, +.cke_panel_listItem pre +{ + margin-top: 0px; + margin-bottom: 0px; +} -- cgit v1.2.3