www.aleph1.co.uk Git - yaffs-website/blob - web/core/modules/ckeditor/css/ckeditor.admin.css

   1 /**
   2  * @file
   3  * Styles for configuration of CKEditor module.
   4  *
   5  * Many of these styles are adapted directly from the default CKEditor theme
   6  * "moono".
   7  */
   8
   9 .ckeditor-toolbar {
  10   border: 1px solid #b6b6b6;
  11   padding: 0.1667em 0.1667em 0.08em;
  12   box-shadow: 0 1px 0 white inset;
  13   background: #cfd1cf;
  14   background-image: -webkit-linear-gradient(top, whiteSmoke, #cfd1cf);
  15   background-image: linear-gradient(top, whiteSmoke, #cfd1cf);
  16   margin: 5px 0;
  17   /* Disallow any user selections in the drag-and-drop toolbar config UI. */
  18   -webkit-user-select: none;
  19   -moz-user-select:    none;
  20   -ms-user-select:     none;
  21   user-select:         none;
  22 }
  23 .ckeditor-toolbar-active {
  24   margin-top: 0.25em;
  25 }
  26 .ckeditor-toolbar-disabled {
  27   margin-bottom: 0.5em;
  28 }
  29 .ckeditor-toolbar ul,
  30 .ckeditor-toolbar-disabled ul {
  31   list-style: none;
  32   margin: 0;
  33   padding: 0;
  34 }
  35 /* This is required to win over specificity of [dir="rtl"] ul */
  36 [dir="rtl"] .ckeditor-toolbar ul,
  37 [dir="rtl"] .ckeditor-toolbar-disabled ul {
  38   margin-right: 0;
  39 }
  40
  41 .ckeditor-row {
  42   padding: 2px 0 3px;
  43   border-radius: 3px;
  44 }
  45 .ckeditor-group-names-are-visible .ckeditor-row {
  46   border: 1px solid whitesmoke;
  47 }
  48 .ckeditor-row + .ckeditor-row {
  49   margin-top: 0.25em;
  50 }
  51 .ckeditor-toolbar-group,
  52 .ckeditor-toolbar-group-placeholder,
  53 .ckeditor-add-new-group {
  54   float: left; /* LTR */
  55 }
  56 [dir="rtl"] .ckeditor-toolbar-group,
  57 [dir="rtl"] .ckeditor-toolbar-group-placeholder,
  58 [dir="rtl"] .ckeditor-add-new-group {
  59   float: right;
  60 }
  61 .ckeditor-toolbar-groups {
  62   min-height: 2em;
  63 }
  64 .ckeditor-toolbar-group {
  65   margin: 0 0.3333em;
  66   cursor: move;
  67 }
  68 .ckeditor-group-names-are-visible .ckeditor-toolbar-group,
  69 .ckeditor-add-new-group {
  70   border: 1px dotted #a6a6a6;
  71   border-radius: 3px;
  72   padding: 0.2em 0.4em;
  73 }
  74 .ckeditor-toolbar-group.placeholder,
  75 .ckeditor-toolbar-group.placeholder .ckeditor-toolbar-group-name {
  76   cursor: not-allowed;
  77 }
  78 .ckeditor-toolbar-group.placeholder .ckeditor-toolbar-group-name {
  79   font-style: italic;
  80 }
  81 .ckeditor-toolbar-group-name {
  82   display: none;
  83   font-size: 1em;
  84   font-weight: normal;
  85   margin: 0.25em 0;
  86 }
  87 .ckeditor-group-names-are-visible .ckeditor-toolbar-group-name {
  88   display: block;
  89   cursor: pointer;
  90 }
  91 .ckeditor-toolbar-active .placeholder,
  92 .ckeditor-toolbar-active .ckeditor-add-new-group {
  93   display: none;
  94 }
  95 .ckeditor-group-names-are-visible .placeholder,
  96 .ckeditor-group-names-are-visible .ckeditor-add-new-group {
  97   display: block;
  98 }
  99 .ckeditor-toolbar-group-buttons {
 100   float: left; /* LTR */
 101 }
 102 [dir="rtl"] .ckeditor-toolbar-group-buttons {
 103   float: right;
 104 }
 105 .ckeditor-groupnames-toggle {
 106   cursor: pointer;
 107   float: right; /* LTR */
 108 }
 109 [dir="rtl"] .ckeditor-groupnames-toggle {
 110   float: left;
 111 }
 112 .ckeditor-toolbar .ckeditor-toolbar-group > li {
 113   border: 1px solid white;
 114   border-radius: 5px;
 115   background-image: -webkit-linear-gradient(transparent 60%, rgba(0, 0, 0, 0.1));
 116   background-image: linear-gradient(transparent 60%, rgba(0, 0, 0, 0.1));
 117   margin: 3px 6px;
 118   padding: 3px;
 119 }
 120 .ckeditor-toolbar-configuration .fieldset-description {
 121   margin-bottom: 1em;
 122 }
 123 .ckeditor-toolbar-disabled .ckeditor-toolbar-available,
 124 .ckeditor-toolbar-disabled .ckeditor-toolbar-dividers {
 125   box-sizing: border-box;
 126 }
 127 .ckeditor-toolbar-disabled .ckeditor-toolbar-available {
 128   float: left; /* LTR */
 129   width: 80%;
 130 }
 131 [dir="rtl"] .ckeditor-toolbar-disabled .ckeditor-toolbar-available {
 132   float: right;
 133 }
 134 .ckeditor-toolbar-disabled .ckeditor-toolbar-dividers {
 135   float: right; /* LTR */
 136   width: 20%;
 137 }
 138 [dir="rtl"] .ckeditor-toolbar-disabled .ckeditor-toolbar-dividers {
 139   float: left;
 140 }
 141 .ckeditor-toolbar-disabled .ckeditor-buttons li a,
 142 .ckeditor-toolbar .ckeditor-buttons,
 143 .ckeditor-add-new-group button {
 144   border: 1px solid #a6a6a6;
 145   border-bottom-color: #979797;
 146   border-radius: 3px;
 147   box-shadow: 0 1px 0 rgba(255, 255, 255, 0.5), 0 0 2px rgba(255, 255, 255, 0.15) inset, 0 1px 0 rgba(255, 255, 255, 0.15) inset;
 148 }
 149 .ckeditor-toolbar-disabled .ckeditor-buttons {
 150   border: 0;
 151 }
 152 .ckeditor-toolbar-disabled .ckeditor-buttons li {
 153   margin: 2px;
 154 }
 155 .ckeditor-buttons {
 156   min-height: 26px;
 157   min-width: 26px;
 158 }
 159 .ckeditor-buttons li {
 160   padding: 0;
 161   margin: 0;
 162   float: left; /* LTR */
 163 }
 164 [dir="rtl"] .ckeditor-buttons li {
 165   float: right;
 166 }
 167 .ckeditor-buttons li a,
 168 .ckeditor-add-new-group button {
 169   background: #e4e4e4;
 170   background-image: -webkit-linear-gradient(top, white, #e4e4e4);
 171   background-image: linear-gradient(top, white, #e4e4e4);
 172   color: #474747;
 173 }
 174 .ckeditor-buttons li a {
 175   border: 0;
 176   cursor: move;
 177   display: block;
 178   min-height: 18px;
 179   line-height: 1.4;
 180   padding: 4px 6px;
 181   position: relative;
 182   text-decoration: none;
 183   text-shadow: 0 1px 0 rgba(255,255,255,.5);
 184   white-space: nowrap;
 185 }
 186 .ckeditor-toolbar-dividers {
 187   float: right; /* LTR */
 188 }
 189 [dir="rtl"] .ckeditor-toolbar-dividers {
 190   float: left;
 191 }
 192 .ckeditor-buttons li .cke-icon-only {
 193   text-indent: -9999px;
 194   width: 16px;
 195   /* Firefox includes the offscreen text in the focus indicator, resulting in a
 196      far too wide focus indicator. This fixes that. */
 197   overflow: hidden;
 198 }
 199 .ckeditor-buttons .cke_button_icon img {
 200   width: 16px;
 201   height: 16px;
 202 }
 203 .ckeditor-buttons li .cke_ltr {
 204   direction: ltr;
 205 }
 206 .ckeditor-buttons li .cke_rtl {
 207   direction: rtl;
 208 }
 209 .ckeditor-buttons li a:focus,
 210 .ckeditor-buttons li a:active,
 211 .ckeditor-multiple-buttons li a:focus {
 212   z-index: 11; /* Ensure focused buttons show their outline on all sides. */
 213 }
 214 .ckeditor-buttons li:first-child a {
 215   border-top-left-radius: 2px; /* LTR */
 216   border-bottom-left-radius: 2px; /* LTR */
 217 }
 218 [dir="rtl"] .ckeditor-buttons li:first-child a {
 219   border-top-right-radius: 2px;
 220   border-bottom-right-radius: 2px;
 221 }
 222 .ckeditor-buttons li:last-child a {
 223   border-top-right-radius: 2px; /* LTR */
 224   border-bottom-right-radius: 2px; /* LTR */
 225 }
 226 [dir="rtl"] .ckeditor-buttons li:last-child a {
 227   border-top-left-radius: 2px;
 228   border-bottom-left-radius: 2px;
 229 }
 230 .ckeditor-button-placeholder,
 231 .ckeditor-toolbar-group-placeholder {
 232   background: #9dcae7;
 233 }
 234 .ckeditor-toolbar-group-placeholder {
 235   border-radius: 4px;
 236 }
 237 .ckeditor-multiple-buttons {
 238   padding: 1px 2px;
 239   margin: 5px;
 240   list-style: none;
 241   float: left; /* LTR */
 242 }
 243 [dir="rtl"] .ckeditor-multiple-buttons {
 244   float: right;
 245 }
 246 .ckeditor-multiple-buttons li {
 247   float: left; /* LTR */
 248   margin: 0;
 249   padding: 0;
 250 }
 251 [dir="rtl"] .ckeditor-multiple-buttons li {
 252   float: right;
 253 }
 254 .ckeditor-multiple-buttons li a {
 255   cursor: move;
 256   display: inline-block;
 257   min-height: 18px;
 258   line-height: 1.4;
 259   margin: 0;
 260   padding: 2px 0;
 261 }
 262 .ckeditor-buttons .ckeditor-group-button-separator,
 263 .ckeditor-multiple-buttons .ckeditor-group-button-separator {
 264   margin: -1px -3px -2px;
 265 }
 266 .ckeditor-buttons .ckeditor-group-button-separator a,
 267 .ckeditor-multiple-buttons .ckeditor-group-button-separator a {
 268   background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAA0AAAAdCAMAAABG4xbVAAAAhFBMVEUAAACmpqampqampqb////l5eX////5+fmmpqatra2urq6vr6+1tbW2tra4uLi6urq8vLzb29ve3t7i4uLl5eXn5+fo6Ojp6enq6urr6+vs7Ozt7e3u7u7v7+/w8PDx8fHy8vLz8/P09PT19fX29vb39/f4+Pj5+fn6+vr7+/v8/Pz+/v7qIQO+AAAACHRSTlMATVmAi8XM29MuWToAAABjSURBVBiVrc5BCoAwDETRMKhtRBduev9LKm1xjItWRBBE6Nt9QkIwOTcUzk0Imi8aoMssxbgoTHMtqsFMLta0vPh2N49HyfdelPg6k9uvX/a+Bmggt1qJRNzQFVgjEnkUZDoBmH57VSypjg4AAAAASUVORK5CYII=) no-repeat center center;
 269   width: 13px;
 270   padding: 0;
 271   height: 29px;
 272   position: relative;
 273   z-index: 10;
 274 }
 275 ul.ckeditor-buttons li.ckeditor-button-separator a {
 276   background: #e4e4e4;
 277   background-image: -webkit-linear-gradient(#e4e4e4, #b4b4b4);
 278   background-image: linear-gradient(#e4e4e4, #b4b4b4);
 279   height: 24px;
 280   margin: 1px 0 0;
 281   padding: 0;
 282   position: relative;
 283   width: 1px;
 284   z-index: 10;
 285 }
 286 .ckeditor-multiple-buttons .ckeditor-button-separator a {
 287   width: 2px;
 288   padding: 0;
 289   height: 26px;
 290   margin: 0 10px;
 291 }
 292 .ckeditor-separator {
 293   background-color: silver;
 294   background-color: rgba(0, 0, 0, 0.2);
 295   margin: 5px 0;
 296   height: 18px;
 297   width: 1px;
 298   display: block;
 299   box-shadow: 1px 0 1px rgba(255, 255, 255, 0.5)
 300 }
 301 .ckeditor-button-arrow {
 302   width: 0;
 303   text-align: center;
 304   border-left: 3px solid transparent;
 305   border-right: 3px solid transparent;
 306   border-top: 3px solid #333;
 307   display: inline-block;
 308   margin: 0 4px 2px;
 309 }
 310 .ckeditor-row-controls {
 311   float: right; /* LTR */
 312   font-size: 18px;
 313   width: 40px;
 314   text-align: right; /* LTR */
 315 }
 316 [dir="rtl"] .ckeditor-row-controls {
 317   float: left;
 318   text-align: left;
 319 }
 320 .ckeditor-row-controls a {
 321   display: inline-block;
 322   box-sizing: border-box;
 323   padding: 6px 2px;
 324   height: 28px;
 325   width: 20px;
 326   line-height: 0.9;
 327   font-weight: bold;
 328   color: #333;
 329   text-decoration: none;
 330 }