Changes for page EditSheet
Last modified by superadmin on 2025/10/09 09:51
Summary
-
Objects (2 modified, 0 added, 0 removed)
Details
- XWiki.JavaScriptExtension[2]
-
- Code
-
... ... @@ -10,9 +10,7 @@ 10 10 container.find('.ckeditor-textarea').each(function() { 11 11 // Wrap in try/catch so that a failure to load one editor doesn't affect the other editors. 12 12 try { 13 - createEditor(ckeditor, this).then(() => { 14 - this.classList.remove('loading'); 15 - }); 13 + createEditor(ckeditor, this); 16 16 } catch(e) { 17 17 console.log(e); 18 18 }
- XWiki.StyleSheetExtension[0]
-
- Code
-
... ... @@ -12,13 +12,6 @@ 12 12 resize: none; 13 13 } 14 14 15 -/* Hide the form action bar while the editor is loading in order to avoid UI flickering (because the editor may enhance 16 - or replace the form action bar). */ 17 -main > div:has(.ckeditor-textarea.loading) ~ .bottom-editor, 18 -#xwikicontent.loading ~ form#inplace-editing { 19 - visibility: hidden; 20 -} 21 - 22 22 /* Show the modal above the CKEditor dialogs */ 23 23 body > .modal-backdrop { 24 24 z-index: 10040; ... ... @@ -179,25 +179,6 @@ 179 179 } 180 180 181 181 /** 182 - * Handle the layout and display of the warning message for headerless tables. 183 - * This message is added by the xwiki-table plugin. 184 - * Some of the default styles are just overridden by the CKEditor reset. 185 - */ 186 -.cke_dialog_container span.box.warningmessage { 187 - .alert-warning; 188 - /* Default warning boxes are not meant to be used in a strict layout like the one of this table dialog. 189 - * We need an extra customization to avoid breaking this layout. */ 190 - white-space: break-spaces; 191 - /* By default, the warning is not shown. */ 192 - display: none; 193 -} 194 - 195 -/* When the value of the previous field is the one we want to avoid, we show the warning. */ 196 -.cke_dialog_container tr:has(select [value=""]:checked) + tr span.box.warningmessage { 197 - display: unset; 198 -} 199 - 200 -/** 201 201 * Link Options Toggle 202 202 */ 203 203 ... ... @@ -389,89 +389,29 @@ 389 389 } 390 390 391 391 .cke_contents > textarea.cke_source.cke_editable_inline { 366 + border: 1px solid transparent; 367 + border-radius: 0; 392 392 box-shadow: none; 369 + margin-top: -1px; 370 + margin-left: -1px; 371 + 372 + .form-control-focus(); 393 393 } 394 394 375 +.cke_contents.fake { 376 + /* We need this to have the box shadow visible when the source area is focused. */ 377 + overflow: visible; 378 +} 379 + 395 395 #xwikicontent + .cke_contents > textarea.cke_source.cke_editable_inline { 396 396 /* Don't take the padding and the margin into account when computing the 100% width. */ 397 397 box-sizing: content-box; 398 398 /* Make sure the Source area has the same width as the WYSIWYG area. */ 399 - margin-left: -@grid-gutter-width / 2; 400 - margin-right: -@grid-gutter-width / 2; 384 + margin-left: -@grid-gutter-width / 2 - 1px; 385 + margin-right: -@grid-gutter-width / 2 - 1px; 401 401 } 402 402 403 403 /** 404 - * Custom styles to match XWiki's Look & Feel 405 - */ 406 -.cke_chrome, 407 -.cke_chrome > .cke_inner { 408 - border-radius: @border-radius-base; 409 -} 410 - 411 -.cke_chrome > .cke_inner > .cke_top { 412 - border-top-right-radius: @border-radius-base; 413 - border-top-left-radius: @border-radius-base; 414 -} 415 - 416 -.cke_chrome > .cke_inner > .cke_bottom { 417 - border-bottom-right-radius: @border-radius-base; 418 - border-bottom-left-radius: @border-radius-base; 419 -} 420 - 421 -/* The standalone WYSIWYG edit mode shows the form action toolbar right below the CKEditor instance used to edit the 422 - document content. We make the bottom border rounded on the form action toolbar instead. */ 423 -#xwikieditcontent > .cke_chrome, 424 -#xwikieditcontent > .cke_chrome > .cke_inner, 425 -#xwikieditcontent > .cke_chrome > .cke_inner > .cke_bottom { 426 - border-bottom-right-radius: 0; 427 - border-bottom-left-radius: 0; 428 -} 429 - 430 -a.cke_button, 431 -a.cke_combo_button { 432 - border-radius: @border-radius-small; 433 -} 434 - 435 -.cke_panel, 436 -.cke_dialog_body, 437 -.cke_dialog a.cke_dialog_ui_button, 438 -.cke_dialog input.cke_dialog_ui_input_text, 439 -.cke_dialog select.cke_dialog_ui_input_select, 440 -.cke_dialog fieldset.cke_dialog_ui_fieldset, 441 -.cke_notification { 442 - border-radius: @border-radius-base; 443 -} 444 - 445 -.cke_panel.cke_menu_panel, 446 -.cke_panel.cke_combopanel { 447 - margin: 2px 0; 448 -} 449 - 450 -.cke_dialog_title, 451 -.cke_dialog a.cke_dialog_tab { 452 - border-top-right-radius: @border-radius-base; 453 - border-top-left-radius: @border-radius-base; 454 -} 455 - 456 -.cke_dialog_contents, 457 -.cke_dialog_footer { 458 - border-bottom-right-radius: @border-radius-base; 459 - border-bottom-left-radius: @border-radius-base; 460 -} 461 - 462 -/** 463 - * Custom styles for the in-line editor 464 - */ 465 -.viewbody > .cke_float { 466 - /* Shift the floating toolbar in order to match the content padding. */ 467 - margin-right: floor((@grid-gutter-width / 2)); 468 - margin-left: ceil((@grid-gutter-width / 2)); 469 -} 470 -.cke_float .cke_top { 471 - border-radius: @border-radius-base; 472 -} 473 - 474 -/** 475 475 * Full-screen styles for the in-line editor 476 476 */ 477 477 body[data-maximized="true"] { ... ... @@ -507,6 +507,12 @@ 507 507 margin: 0 !important; 508 508 overflow-y: auto !important; 509 509 z-index: 9995; 424 + 425 + &:focus { 426 + /* Remove the focus border. */ 427 + border-color: transparent !important; 428 + box-shadow: none !important; 429 + } 510 510 } 511 511 .cke_maximize_backdrop { 512 512 top: 0;