Change skin and add video button

[perso/Immae/Projets/packagist/ludivine-ckeditor-component.git] / sources / skins / moonocolor / notification.css

diff --git a/sources/skins/moonocolor/notification.css b/sources/skins/moonocolor/notification.css
new file mode 100644 (file)
index 0000000..c6292d3
--- /dev/null
+++ b/sources/skins/moonocolor/notification.css
@@ -0,0 +1,168 @@
+/*\r
+Copyright (c) 2003-2015, CKSource - Frederico Knabben. All rights reserved.\r
+For licensing, see LICENSE.md or http://ckeditor.com/license\r
+*/\r
+\r
+/**\r
+ * Progress notification structure:\r
+ *\r
+ * +---div.cke_notification cke_notification_info--------------------------+\r
+ * |                                                                       |\r
+ * | +---div.cke_notification_progress-----------------------------------+ |\r
+ * | |                                                                   | |\r
+ * | +-------------------------------------------------------------------+ |\r
+ * |                                                                       |\r
+ * | +---p.cke_notification_message--------------------------------------+ |\r
+ * | | Foo                                                               | |\r
+ * | +-------------------------------------------------------------------+ |\r
+ * |                                                                       |\r
+ * | +---a.cke_notification_close----------------------------------------+ |\r
+ * | | +---span.cke_label----------------------------------------------+ | |\r
+ * | | | X                                                             | | |\r
+ * | | +---------------------------------------------------------------+ | |\r
+ * | +-------------------------------------------------------------------+ |\r
+ * |                                                                       |\r
+ * +-----------------------------------------------------------------------+\r
+ *\r
+ *\r
+ * Warning notification structure:\r
+ *\r
+ * +---div.cke_notification cke_notification_warning-----------------------+\r
+ * |                                                                       |\r
+ * | +---p.cke_notification_message--------------------------------------+ |\r
+ * | | Foo                                                               | |\r
+ * | +-------------------------------------------------------------------+ |\r
+ * |                                                                       |\r
+ * | +---a.cke_notification_close----------------------------------------+ |\r
+ * | | +---span.cke_label----------------------------------------------+ | |\r
+ * | | | X                                                             | | |\r
+ * | | +---------------------------------------------------------------+ | |\r
+ * | +-------------------------------------------------------------------+ |\r
+ * |                                                                       |\r
+ * +-----------------------------------------------------------------------+\r
+ *\r
+ * Success and info notifications have the same structure as warning, but use\r
+ * `cke_notification_success` and `cke_notification_info` instead of `cke_notification_warning`.\r
+ */\r
+.cke_notifications_area\r
+{\r
+       /* Prevent notification margin capture clicking. */\r
+       pointer-events: none;\r
+}\r
+.cke_notification\r
+{\r
+       pointer-events: auto;\r
+       position: relative;\r
+       margin: 10px;\r
+       width: 300px;\r
+       color: white;\r
+       border-radius: 3px;\r
+       text-align: center;\r
+       opacity: 0.95;\r
+       filter: alpha(opacity = 95);\r
+       box-shadow: 2px 2px 3px 0px rgba(50, 50, 50, 0.3);\r
+\r
+       -webkit-animation: fadeIn 0.7s;\r
+       animation: fadeIn 0.7s;\r
+}\r
+\r
+.cke_notification_message a\r
+{\r
+       color: #12306F;\r
+}\r
+\r
+@-webkit-keyframes fadeIn\r
+{\r
+       from { opacity: 0.4; }\r
+       to { opacity: 0.95; }\r
+}\r
+\r
+@keyframes fadeIn\r
+{\r
+       from { opacity: 0.4; }\r
+       to { opacity: 0.95; }\r
+}\r
+\r
+.cke_notification_success\r
+{\r
+       background: #72B572;\r
+       border: 1px solid #63A563;\r
+}\r
+\r
+.cke_notification_warning\r
+{\r
+       background: #C83939;\r
+       border: 1px solid #902B2B;\r
+}\r
+\r
+.cke_notification_info\r
+{\r
+       background: #2E9AD0;\r
+       border: 1px solid #0F74A8;\r
+}\r
+\r
+.cke_notification_info span.cke_notification_progress\r
+{\r
+       background-color: #0F74A8;\r
+       display: block;\r
+       padding: 0;\r
+       margin: 0;\r
+       height: 100%;\r
+       overflow: hidden;\r
+       position: absolute;\r
+       z-index: 1;\r
+}\r
+\r
+.cke_notification_message\r
+{\r
+       position: relative;\r
+       margin: 4px 23px 3px;\r
+       font-family: Arial, Helvetica, sans-serif;\r
+       font-size: 12px;\r
+       line-height: 18px;\r
+       z-index: 4;\r
+       text-overflow: ellipsis;\r
+       overflow: hidden;\r
+}\r
+\r
+.cke_notification_close\r
+{\r
+       background-image: url(images/close.png);\r
+       background-repeat: no-repeat;\r
+       background-position: 50%;\r
+       position: absolute;\r
+       cursor: pointer;\r
+       text-align: center;\r
+       height: 20px;\r
+       width: 20px;\r
+       top: 1px;\r
+       right: 1px;\r
+       padding: 0;\r
+       margin: 0;\r
+       z-index: 5;\r
+       opacity: 0.6;\r
+       filter: alpha(opacity = 60);\r
+}\r
+\r
+.cke_notification_close:hover\r
+{\r
+       opacity: 1;\r
+       filter: alpha(opacity = 100);\r
+}\r
+\r
+.cke_notification_close span\r
+{\r
+       display: none;\r
+}\r
+\r
+.cke_notification_warning a.cke_notification_close\r
+{\r
+       opacity: 0.8;\r
+       filter: alpha(opacity = 80);\r
+}\r
+\r
+.cke_notification_warning a.cke_notification_close:hover\r
+{\r
+       opacity: 1;\r
+       filter: alpha(opacity = 100);\r
+}\r