Skip to content

Commit

Permalink
Renamed CSS classes in order to match the code style guide.
Browse files Browse the repository at this point in the history
  • Loading branch information
pomek committed Oct 21, 2020
1 parent 14e13fa commit e89b76e
Show file tree
Hide file tree
Showing 3 changed files with 13 additions and 13 deletions.
6 changes: 3 additions & 3 deletions packages/ckeditor5-html-embed/src/htmlembedediting.js
Original file line number Diff line number Diff line change
Expand Up @@ -20,7 +20,7 @@ import eyeIcon from '../theme/icons/eye.svg';

import '../theme/htmlembed.css';

const DISPLAY_PREVIEW_CLASS = 'raw-html--display-preview';
const DISPLAY_PREVIEW_CLASS = 'raw-html_preview_visible';

/**
* The HTML embed editing feature.
Expand Down Expand Up @@ -160,7 +160,7 @@ export default class HtmlEmbedEditing extends Plugin {
} );

const buttonAttributes = {
class: 'ck ck-button ck-on raw-html__switch-mode'
class: 'ck ck-button ck-on raw-html__mode-toggle-button'
};

// The switch button between preview and editing HTML.
Expand Down Expand Up @@ -201,7 +201,7 @@ export default class HtmlEmbedEditing extends Plugin {

// The container that renders the HTML should be created only when `htmlEmbed.showPreviews=true` in the config.
if ( htmlEmbedConfig.showPreviews ) {
writer.addClass( [ 'raw-html--preview-enabled', DISPLAY_PREVIEW_CLASS ], widgetView );
writer.addClass( [ 'raw-html_preview_enabled', DISPLAY_PREVIEW_CLASS ], widgetView );

const previewContainer = writer.createRawElement( 'div', { class: 'raw-html__preview' }, function( domElement ) {
writer.setCustomProperty( 'domElement', domElement, previewContainer );
Expand Down
10 changes: 5 additions & 5 deletions packages/ckeditor5-html-embed/tests/htmlembedediting.js
Original file line number Diff line number Diff line change
Expand Up @@ -247,7 +247,7 @@ describe( 'HtmlEmbedEditing', () => {

const widget = viewDocument.getRoot().getChild( 0 );

expect( widget.hasClass( 'raw-html--preview-enabled' ) ).to.equal( false );
expect( widget.hasClass( 'raw-html_preview_enabled' ) ).to.equal( false );
} );

it( 'should render the toggle button and edit source elements', () => {
Expand Down Expand Up @@ -474,7 +474,7 @@ describe( 'HtmlEmbedEditing', () => {

const widget = viewDocument.getRoot().getChild( 0 );

expect( widget.hasClass( 'raw-html--preview-enabled' ) ).to.equal( true );
expect( widget.hasClass( 'raw-html_preview_enabled' ) ).to.equal( true );
} );

it( 'should render the toggle button, edit source and preview container elements', () => {
Expand Down Expand Up @@ -526,7 +526,7 @@ describe( 'HtmlEmbedEditing', () => {

const widget = viewDocument.getRoot().getChild( 0 );

expect( widget.hasClass( 'raw-html--display-preview' ) ).to.equal( true );
expect( widget.hasClass( 'raw-html_preview_visible' ) ).to.equal( true );

const viewHtmlContainer = widget.getChild( 0 );
const sourceElement = viewHtmlContainer.getChild( 1 );
Expand Down Expand Up @@ -603,7 +603,7 @@ describe( 'HtmlEmbedEditing', () => {

expect( sourceElement.getCustomProperty( 'domElement' ).disabled ).to.equal( false );

expect( widget.hasClass( 'raw-html--display-preview' ) ).to.equal( false );
expect( widget.hasClass( 'raw-html_preview_visible' ) ).to.equal( false );
} );

it( 'should display preview element after clicking the toggle button when displaying edit source mode', () => {
Expand All @@ -620,7 +620,7 @@ describe( 'HtmlEmbedEditing', () => {
// Switch to preview mode.
toggleButton.click();

expect( widget.hasClass( 'raw-html--display-preview' ) ).to.equal( true );
expect( widget.hasClass( 'raw-html_preview_visible' ) ).to.equal( true );
expect( viewHtmlContainer.getChild( 1 ).getCustomProperty( 'domElement' ).disabled ).to.equal( true );
} );
} );
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -11,7 +11,7 @@
padding: var(--ck-spacing-standard);

/* The switch mode button. */
& .raw-html__switch-mode {
& .raw-html__mode-toggle-button {
position: absolute;
top: var(--ck-spacing-standard);
right: var(--ck-spacing-standard);
Expand All @@ -31,7 +31,7 @@
}

/* Using the feature with enabled previews in data. */
& .raw-html--preview-enabled {
& .raw-html_preview_enabled {
/* The preview data container. */
& .raw-html__preview {
box-sizing: border-box;
Expand All @@ -45,7 +45,7 @@
}

/* Mode: preview the HTML. */
&.raw-html--display-preview {
&.raw-html_preview_visible {
background-color: var(--ck-color-base-foreground);
background-image: url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMzAiIGhlaWdodD0iMzAiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PHBhdGggZD0iTTcuNDI0IDkuNzc3YS4yMi4yMiAwIDAgMCAuMTYuMDc0Yy4wNTggMCAuMTEtLjAyNS4xNTktLjA3NGEuMjI4LjIyOCAwIDAgMCAuMDY2LS4xNTguNzIxLjcyMSAwIDAgMC0uMDUyLS4yNTNsLS45NTQtMi41ODggMi41NzguOTY0YS42OC42OCAwIDAgMCAuMjUuMDU1LjIzMi4yMzIgMCAwIDAgLjE2MS0uMDcuMjEuMjEgMCAwIDAgLjA3LS4xNTMuMjI4LjIyOCAwIDAgMC0uMDc3LS4xNTguNDE0LjQxNCAwIDAgMC0uMDkzLS4wNjYgMS4wNDggMS4wNDggMCAwIDAtLjE1Ni0uMDY3bC0yLjgwMy0xLjA0Yy0uMDEtLjAwMi0uMDI1LS4wMDctLjA0NC0uMDE0LS4yMS0uMDgtLjM1NC0uMDgtLjQzNSAwLS4wOC4wODEtLjA4LjIzIDAgLjQ0NS4wMDUuMDE1LjAxLjAyNi4wMTQuMDM0bDEuMDI1IDIuODE4Yy4wMjYuMDc0LjA0OS4xMjkuMDY4LjE2NC4wMi4wMzYuMDQuMDY1LjA2My4wODd6bTEuMTYgMS44NDJjLjExNC4xMTQuMi4xNzYuMjYuMTg1LjA1OC4wMDkuMTItLjAyLjE4Ny0uMDg2LjA2LS4wNi4wODMtLjEyMi4wNy0uMTg2LS4wMTMtLjA2NC0uMDY3LS4xNDQtLjE2Mi0uMjRsLS4xNjItLjE2MSAxLjAwNi0xLjAwNiAxLjE1NyAxLjE1OC0xLjAwNSAxLjAwNS0uMTE5LS4xMThjLS4xMTctLjExOC0uMjA5LS4xODUtLjI3NS0uMjAzLS4wNjYtLjAxOC0uMTMuMDA1LS4xOTMuMDY4LS4wNjYuMDY2LS4wOTQuMTI5LS4wODQuMTkuMDEuMDYuMDgxLjE1NS4yMTIuMjg2bC41LjVjLjEyMi4xMjMuMjEzLjE4OC4yNzIuMTk3LjA1OS4wMDkuMTIxLS4wMi4xODctLjA4Ni4wNjEtLjA2LjA4Ny0uMTIyLjA3Ni0uMTgyLS4wMS0uMDYtLjA2NC0uMTQtLjE2LS4yMzZsLS4wNC0uMDM4IDIuMTc4LTIuMTc4LjA1OS4wNThjLjA4Ny4wODcuMTYuMTM0LjIyLjE0MS4wNjEuMDA4LjEyMy0uMDIuMTg2LS4wODMuMDU4LS4wNTguMDg2LS4xMTYuMDg1LS4xNzUgMC0uMDYtLjAzLS4xMTgtLjA4OC0uMTc2bC0uNTktLjU5Yy0uMTQxLS4xNDEtLjI0My0uMjE4LS4zMDQtLjIyOS0uMDYxLS4wMTEtLjEyNS4wMTYtLjE5MS4wODItLjA2MS4wNjItLjA4Ni4xMjYtLjA3NC4xOTIuMDEyLjA2Ny4wNjQuMTQ3LjE1Ni4yMzlsLjE2NC4xNjQtLjg0Ljg0MS0xLjE1OC0xLjE1OC44NC0uODQuMTEuMTA4Yy4xMi4xMi4yMTUuMTkuMjg1LjIwOC4wNjkuMDE4LjEzNi0uMDA2LjItLjA3LjA2Ni0uMDY2LjA5NS0uMTMuMDg1LS4xODktLjAxLS4wNi0uMDc5LS4xNTQtLjIwOC0uMjgzbC0uNjA5LS42MDljLS4wNjMtLjA2Mi0uMTIzLS4wOTUtLjE4MS0uMDk2LS4wNTgtLjAwMi0uMTE3LjAyNy0uMTc3LjA4Ny0uMDY0LjA2NC0uMDkxLjEyNy0uMDguMTkuMDEuMDYxLjA2My4xNC4xNi4yMzhsLjAzOS4wMzhMOC40IDEwLjc1NGwtLjA0My0uMDQ0Yy0uMDk3LS4wOTYtLjE3NS0uMTUtLjIzNC0uMTYtLjA1OC0uMDEtLjEyLjAxNS0uMTgyLjA3OC0uMDU4LjA1OC0uMDg3LjExNy0uMDg2LjE3NS4wMDEuMDYuMDMxLjExOC4wOS4xNzhsLjYzOS42Mzh6bTQuMDggNC4wOGMuMDU0LjA1NC4xMTEuMDgxLjE3LjA4LjA1OSAwIC4xMTYtLjAyOS4xNzMtLjA4NS4wNTgtLjA1OC4wODUtLjExNi4wOC0uMTczLS4wMDMtLjA1Ny0uMDQtLjEyLS4xMDctLjE4N2wtLjQ2Ni0uNDY3IDIuMTc3LTIuMTc3LjY5NC42OTMtLjYwNC42NTNjLS4xMTguMTI0LS4xODEuMjE1LS4xOS4yNzItLjAwOS4wNTcuMDE5LjExOC4wODMuMTgyLjA2Mi4wNjEuMTIyLjA5My4xOC4wOTYuMDYuMDAyLjExOC0uMDI2LjE3Ni0uMDg0YTEuOTcyIDEuOTcyIDAgMCAxIC4xMTMtLjEyM2wuNzcxLS44MjRjLjA1OC0uMDYxLjA4Ni0uMTIuMDg0LS4xNzUtLjAwMy0uMDU2LS4wMzUtLjExNC0uMDk2LS4xNzZsLTIuMS0yLjFjLS4wNjEtLjA2MS0uMTItLjA5My0uMTc1LS4wOTUtLjA1Ni0uMDAzLS4xMTUuMDI0LS4xNzguMDhsLS44MjIuNzc0LS4wNzguMDc0LS4wNC4wMzVjLS4wNTguMDU4LS4wODguMTE2LS4wOS4xNzQtLjAwMS4wNTguMDI2LjExNS4wODMuMTcxLjA3Mi4wNzMuMTM3LjEwNS4xOTUuMDk3LjA1OC0uMDA4LjE1LS4wNy4yNzMtLjE4OGwuNjUzLS42MDUuNjk0LjY5NC0yLjE3OCAyLjE3OC0uNDUyLS40NTJjLS4wNzYtLjA3Ni0uMTQyLS4xMTctLjItLjEyMi0uMDU2LS4wMDYtLjExNS4wMjEtLjE3NS4wOC0uMDU2LjA1Ny0uMDg1LjExNS0uMDg1LjE3My0uMDAxLjA2LjAyNi4xMTYuMDguMTdsMS4zNTcgMS4zNTd6bTEuNjgyIDEuNjgyYy4wOTUuMDk1LjE3Mi4xNDYuMjMyLjE1NS4wNi4wMDguMTIxLS4wMi4xODYtLjA4NS4wNi0uMDYuMDgzLS4xMjIuMDctLjE4Ni0uMDEzLS4wNjUtLjA2Ny0uMTQ0LS4xNjItLjI0bC0uMTYyLS4xNjEgMi4xMjItMi4wMzUtLjkwNCAxLjg3NWEuNC40IDAgMCAwLS4wNTIuMjI2LjM2LjM2IDAgMCAwIC4xMTUuMTk1Yy4wNy4wNy4xMzcuMTEuMTk4LjEyYS40MDguNDA4IDAgMCAwIC4yMy0uMDVsMS44NjgtLjkxMS0yLjAyOCAyLjEyOS0uMTA0LS4xMDRjLS4xMTQtLjExNC0uMjA0LS4xOC0uMjY4LS4xOTYtLjA2NC0uMDE2LS4xMjguMDA3LS4xOS4wNy0uMDY1LjA2NS0uMDk0LjEyNy0uMDg2LjE4Ni4wMDkuMDYuMDYuMTM2LjE1My4yM2wuNjc5LjY4Yy4wNTUuMDU0LjExMS4wOC4xNy4wOC4wNiAwIC4xMTctLjAzLjE3My0uMDg2LjA2NS0uMDY0LjA5LS4xMjYuMDc5LS4xODUtLjAxMi0uMDU4LS4wNy0uMTQtLjE3Ni0uMjQ1bC0uMDU1LS4wNTYgMi4xMzItMi4yNjcuMDM4LjA0Yy4wODkuMDg4LjE2MS4xMzcuMjE4LjE0Ny4wNTYuMDEuMTE1LS4wMTcuMTc2LS4wNzguMDUzLS4wNTMuMDgtLjEwNy4wODItLjE2Mi4wMDItLjA1NS0uMDIzLS4xMDgtLjA3NS0uMTZsLS4zOTYtLjM5NmEuNDQxLjQ0MSAwIDAgMC0uMjEtLjEzMS4zNTguMzU4IDAgMCAwLS4yMTguMDMybC0yLjAzMi45OTQuOTgzLTIuMDQzYS4zNDEuMzQxIDAgMCAwIC4wMzUtLjIxNi40NDEuNDQxIDAgMCAwLS4xMzEtLjIwOWwtLjM5Ny0uMzk2Yy0uMDUxLS4wNTItLjEwNS0uMDc3LS4xNi0uMDc3LS4wNTYuMDAxLS4xMS4wMjgtLjE2NC4wODEtLjA2LjA2Mi0uMDg2LjEyLS4wNzYuMTc4LjAxLjA1Ny4wNi4xMy4xNDkuMjE5bC4wMzkuMDM5LTIuMjcgMi4xMjktLjA1My0uMDUzYy0uMTA1LS4xMDUtLjE4Ny0uMTY0LS4yNDUtLjE3Ni0uMDYtLjAxMi0uMTIuMDE0LS4xODUuMDc5LS4wNTguMDU4LS4wODguMTE2LS4wODguMTczLS4wMDEuMDU3LjAyNy4xMTQuMDgzLjE3bC42NzcuNjc3em00LjY2NCA0LjY2NGEuMjQxLjI0MSAwIDAgMCAuMTc1LjA4MWMuMDYyIDAgLjEyMi0uMDI5LjE3OC0uMDg1bC45LS45Yy4wNjItLjA2Mi4wOTQtLjEyMy4wOTUtLjE4MiAwLS4wNTktLjAyOC0uMTE3LS4wODYtLjE3NS0uMDY4LS4wNjgtLjEzMi0uMDk2LS4xOTEtLjA4NS0uMDYuMDExLS4xNS4wNzgtLjI3LjE5OGwtLjYzNC42MzQtMS4yODYtMS4yODYgMi4xNzgtMi4xNzguNDA2LjQwNmMuMTIyLjEyMy4yMTQuMTkuMjc1LjIuMDYyLjAxMi4xMjUtLjAxNS4xOTEtLjA4MS4wNTgtLjA1OC4wODYtLjExNy4wODUtLjE3Ny0uMDAyLS4wNi0uMDMyLS4xMTgtLjA5LS4xNzZMMTkuNjMgMTYuOTNjLS4wNjMtLjA2My0uMTIzLS4wOTUtLjE4MS0uMDk2LS4wNTgtLjAwMi0uMTE3LjAyNy0uMTc3LjA4Ny0uMDY2LjA2Ni0uMDkzLjEzLS4wODIuMTkuMDExLjA2Mi4wNzcuMTUyLjE5Ni4yNzFsLjMwMi4zMDItMi4xNzggMi4xNzgtLjMwMi0uMzAyYy0uMTIyLS4xMjMtLjIxMi0uMTktLjI3LS4yLS4wNTgtLjAxMi0uMTIuMDE1LS4xODQuMDc5LS4wNTguMDU4LS4wODcuMTE2LS4wODcuMTc0IDAgLjA1OC4wMjkuMTE2LjA4Ny4xNzRsMi4yNTcgMi4yNTd6bTEuMDU5LjM3N2EuNzQ3Ljc0NyAwIDAgMCAuMjQuMTI5bC4wMTQuMDA0IDIuODE4IDEuMDI1Yy4wMS4wMDMuMDI1LjAxLjA0OC4wMi4yMDguMDc1LjM1MS4wNzQuNDMtLjAwNS4wOC0uMDgxLjA4LS4yMjYgMC0uNDM1bC0uMDA4LS4wMjYtLjAwNi0uMDE4LTEuMDQtMi44MDRhMS4yMjMgMS4yMjMgMCAwIDAtLjA2Ny0uMTU3LjQwNi40MDYgMCAwIDAtLjA2OC0uMDk0LjIyMy4yMjMgMCAwIDAtLjE1Ni0uMDc0LjIxLjIxIDAgMCAwLS4xNTMuMDcuMjI4LjIyOCAwIDAgMC0uMDY3LjE1OC43MS43MSAwIDAgMCAuMDU3LjI1N2wuOTYgMi41NzQtMi41ODQtLjk1YS43MS43MSAwIDAgMC0uMjU3LS4wNTcuMjI4LjIyOCAwIDAgMC0uMTU5LjA2Ny4yMjUuMjI1IDAgMCAwLS4wNzQuMTU4YzAgLjA1Ny4wMjMuMTEuMDcyLjE1OHoiIG9wYWNpdHk9Ii4wNDYiLz48L3N2Zz4=");
background-repeat: repeat;
Expand All @@ -61,13 +61,13 @@
}

/* Mode: edit the HTML source. */
&:not(.raw-html--display-preview) .raw-html__preview {
&:not(.raw-html_preview_visible) .raw-html__preview {
display: none;
}
}

/* Disable all mouse interaction as long as the editor is not read–only. */
&:not(.ck-read-only) .raw-html--preview-enabled .raw-html__preview {
&:not(.ck-read-only) .raw-html_preview_enabled .raw-html__preview {
pointer-events: none;
}
}

0 comments on commit e89b76e

Please sign in to comment.