You are here

ckeditor.admin.css in CKEditor for WYSIWYG Module 8

Same filename and directory in other branches
  1. 7 css/ckeditor.admin.css

Styles for configuration of CKEditor module.

File

css/ckeditor.admin.css
View source
  1. /**
  2. * @file
  3. * Styles for configuration of CKEditor module.
  4. */
  5. .ckeditor-toolbar-active {
  6. border: 1px solid #B6B6B6;
  7. padding: 6px 8px 2px;
  8. box-shadow: 0 1px 0 white inset;
  9. background: #CFD1CF;
  10. background-image: -webkit-gradient(linear, left top, left bottom, from(whiteSmoke), to(#CFD1CF));
  11. background-image: -moz-linear-gradient(top, whiteSmoke, #CFD1CF);
  12. background-image: -o-linear-gradient(top, whiteSmoke, #CFD1CF);
  13. background-image: -ms-linear-gradient(top, whiteSmoke, #CFD1CF);
  14. background-image: linear-gradient(top, whiteSmoke, #CFD1CF);
  15. filter: progid:DXImageTransform.Microsoft.gradient(gradientType=0,startColorstr='#fff5f5f5',endColorstr='#ffcfd1cf');
  16. margin: 5px 0;
  17. overflow: nowrap;
  18. }
  19. .ckeditor-toolbar-disabled {
  20. margin: 5px 0;
  21. }
  22. ul.ckeditor-buttons {
  23. min-height: 26px;
  24. min-width: 26px;
  25. list-style: none;
  26. float: left;
  27. clear: left;
  28. padding: 0;
  29. margin: 0 6px 5px 0;
  30. border: 1px solid #A6A6A6;
  31. border-bottom-color: #979797;
  32. -moz-border-radius: 3px;
  33. -webkit-border-radius: 3px;
  34. border-radius: 3px;
  35. -moz-box-shadow: 0 1px 0 rgba(255,255,255,.5),0 0 2px rgba(255,255,255,.15) inset,0 1px 0 rgba(255,255,255,.15) inset;
  36. -webkit-box-shadow: 0 1px 0 rgba(255, 255, 255, .5),0 0 2px rgba(255, 255, 255, .15) inset,0 1px 0 rgba(255, 255, 255, .15) inset;
  37. box-shadow: 0 1px 0 rgba(255, 255, 255, .5),0 0 2px rgba(255, 255, 255, .15) inset,0 1px 0 rgba(255, 255, 255, .15) inset;
  38. }
  39. ul.ckeditor-buttons li {
  40. display: inline-block;
  41. height: 18px;
  42. padding: 4px 6px;
  43. outline: none;
  44. cursor: move;
  45. float: left;
  46. border: 0;
  47. white-space: nowrap;
  48. background: #E4E4E4;
  49. background-image: -webkit-gradient(linear,left top,left bottom,from(white),to(#E4E4E4));
  50. background-image: -moz-linear-gradient(top,white,#E4E4E4);
  51. background-image: -webkit-linear-gradient(top,white,#E4E4E4);
  52. background-image: -o-linear-gradient(top,white,#E4E4E4);
  53. background-image: -ms-linear-gradient(top,white,#E4E4E4);
  54. background-image: linear-gradient(top,white,#E4E4E4);
  55. filter: progid:DXImageTransform.Microsoft.gradient(gradientType=0,startColorstr='#ffffffff',endColorstr='#ffe4e4e4');
  56. }
  57. ul.ckeditor-buttons li:first-child {
  58. -moz-border-top-left-radius: 2px;
  59. -moz-border-bottom-left-radius: 2px;
  60. -webkit-border-top-left-radius: 2px;
  61. -webkit-border-bottom-left-radius: 2px;
  62. border-top-left-radius: 2px;
  63. border-bottom-left-radius: 2px;
  64. }
  65. ul.ckeditor-buttons li:last-child {
  66. -moz-border-top-right-radius: 2px;
  67. -moz-border-bottom-right-radius: 2px;
  68. -webkit-border-top-right-radius: 2px;
  69. -webkit-border-bottom-right-radius: 2px;
  70. border-top-right-radius: 2px;
  71. border-bottom-right-radius: 2px;
  72. }
  73. ul.ckeditor-buttons li.ckeditor-button-placeholder {
  74. background: #333;
  75. opacity: 0.3;
  76. }
  77. ul.ckeditor-multiple-buttons {
  78. padding: 2px;
  79. margin: 0;
  80. list-style: none;
  81. float: left;
  82. }
  83. ul.ckeditor-multiple-buttons li {
  84. padding: 2px 0;
  85. margin: 0;
  86. display: inline-block;
  87. height: 18px;
  88. cursor: move;
  89. float: left;
  90. }
  91. .ckeditor-multiple-label {
  92. float: left;
  93. padding: 4px;
  94. }
  95. ul.ckeditor-buttons li.ckeditor-group-button-separator,
  96. ul.ckeditor-multiple-buttons li.ckeditor-group-button-separator {
  97. background: url(../images/group-separator.png) no-repeat center center;
  98. width: 13px;
  99. padding: 0;
  100. height: 29px;
  101. margin: -1px -3px -2px;
  102. position: relative;
  103. z-index: 10;
  104. }
  105. ul.ckeditor-buttons li.ckeditor-button-separator {
  106. width: 2px;
  107. padding: 0 4px;
  108. height: 26px;
  109. margin: 0 -4px;
  110. position: relative;
  111. z-index: 10;
  112. background: #E4E4E4;
  113. background-image: -webkit-gradient(linear,left top,left bottom,from(white),to(#E4E4E4));
  114. background-image: -moz-linear-gradient(top,white,#E4E4E4);
  115. background-image: -webkit-linear-gradient(top,white,#E4E4E4);
  116. background-image: -o-linear-gradient(top,white,#E4E4E4);
  117. background-image: -ms-linear-gradient(top,white,#E4E4E4);
  118. background-image: linear-gradient(top,white,#E4E4E4);
  119. filter: progid:DXImageTransform.Microsoft.gradient(gradientType=0,startColorstr='#ffffffff',endColorstr='#ffe4e4e4');
  120. }
  121. ul.ckeditor-multiple-buttons li.ckeditor-button-separator {
  122. width: 2px;
  123. padding: 0;
  124. height: 26px;
  125. margin: 0 10px;
  126. }
  127. .ckeditor-separator {
  128. background-color: silver;
  129. background-color: rgba(0, 0, 0, .2);
  130. margin: 5px 0;
  131. height: 18px;
  132. width: 1px;
  133. display: block;
  134. -webkit-box-shadow: 1px 0 1px rgba(255, 255, 255, .5);
  135. -moz-box-shadow: 1px 0 1px rgba(255,255,255,.5);
  136. box-shadow: 1px 0 1px rgba(255, 255, 255, .5)
  137. }
  138. .ckeditor-button-arrow {
  139. width: 0;
  140. text-align: center;
  141. border-left: 3px solid transparent;
  142. border-right: 3px solid transparent;
  143. border-top: 3px solid #333;
  144. display: inline-block;
  145. margin: 0 4px 2px;
  146. }
  147. .ckeditor-row-controls {
  148. float: right;
  149. font-size: 18px;
  150. width: 40px;
  151. text-align: right;
  152. }
  153. .ckeditor-row-controls a {
  154. display: inline-block;
  155. padding: 6px 2px;
  156. height: 16px;
  157. width: 16px;
  158. line-height: 0.9;
  159. font-weight: bold;
  160. color: #333;
  161. }
  162. .ckeditor-row-controls a:hover {
  163. text-decoration: none;
  164. }