diff --git a/core/modules/media/css/plugins/drupalmedia/ckeditor.drupalmedia.css b/core/modules/media/css/plugins/drupalmedia/ckeditor.drupalmedia.css index 82923ff63e..e5813d943d 100644 --- a/core/modules/media/css/plugins/drupalmedia/ckeditor.drupalmedia.css +++ b/core/modules/media/css/plugins/drupalmedia/ckeditor.drupalmedia.css @@ -21,14 +21,6 @@ drupal-media { text-align: center; } -/** - * Fix positioning without delete button. Can be removed with this issue: - * @see https://www.drupal.org/project/drupal/issues/3074859 - */ -drupal-media .media-library-item__edit { - right: 10px; -} - /** * Allow alignment to display in CKEditor. */ diff --git a/core/themes/classy/classy.info.yml b/core/themes/classy/classy.info.yml index 5f46a6eaa6..a8d1d707c4 100644 --- a/core/themes/classy/classy.info.yml +++ b/core/themes/classy/classy.info.yml @@ -32,3 +32,4 @@ libraries-extend: ckeditor_stylesheets: - css/components/media-embed-error.css + - css/components/media-embed-edit-button.css diff --git a/core/themes/classy/css/components/media-embed-edit-button.css b/core/themes/classy/css/components/media-embed-edit-button.css new file mode 100644 index 0000000000..e09f00b7e3 --- /dev/null +++ b/core/themes/classy/css/components/media-embed-edit-button.css @@ -0,0 +1,38 @@ +/** + * @file drupal-media.css + + * Styling for drupal media CKEditor plugin. + */ + +/** + * Embedded media edit button styles. + * + * We have to override the .button styles since buttons make heavy use of + * background and border property changes. + */ +drupal-media .media-library-item__edit, +drupal-media .media-library-item__edit:hover, +drupal-media .media-library-item__edit:focus, +drupal-media .media-library-item__remove { + position: absolute; + z-index: 1; + top: 10px; + overflow: hidden; + width: 21px; + height: 21px; + margin: 5px; + padding: 0; + transition: 0.2s border-color; + color: transparent; + border: 2px solid #ccc; + border-radius: 20px; + background-size: 13px; + text-shadow: none; + font-size: 0; +} + +drupal-media .media-library-item__edit { + right: 10px; + background: url("../../../../misc/icons/787878/pencil.svg") #fff center no-repeat; + background-size: 13px; +} diff --git a/core/themes/seven/seven.info.yml b/core/themes/seven/seven.info.yml index 43f9c048e4..5f5763d03f 100644 --- a/core/themes/seven/seven.info.yml +++ b/core/themes/seven/seven.info.yml @@ -19,8 +19,6 @@ alt text: 'Default administration theme for Drupal 8 with simple blocks and clea package: Core version: VERSION core: 8.x -ckeditor_stylesheets: - - css/theme/media-library.css libraries: - seven/global-styling libraries-override: