| 1 |
addEventListener( 'DOMContentLoaded', () => { |
| 2 |
const notices = document.getElementsByClassName( 'jetpack-deprecate-dismissible' ); |
| 3 |
for ( let i = 0; i < notices.length; ++i ) { |
| 4 |
if ( ! notices[ i ].hasAttribute( 'id' ) ) { |
| 5 |
continue; |
| 6 |
} |
| 7 |
|
| 8 |
notices[ i ].addEventListener( 'click', event => { |
| 9 |
if ( event.target.classList.contains( 'notice-dismiss' ) ) { |
| 10 |
document.cookie = |
| 11 |
'jetpack_deprecate_dismissed[' + |
| 12 |
notices[ i ].getAttribute( 'id' ) + |
| 13 |
']=1; expires=Fri, 31 Dec 9999 23:59:59 GMT; SameSite=None; Secure'; |
| 14 |
} |
| 15 |
} ); |
| 16 |
} |
| 17 |
|
| 18 |
var styleSheet = document.createElement( 'style' ); |
| 19 |
|
| 20 |
// Define the CSS rules for placing the admin notice. |
| 21 |
styleSheet.innerHTML = ` |
| 22 |
/* Clear the default Dashicon content */ |
| 23 |
.jetpack-deprecate-dismissible .notice-dismiss::before { |
| 24 |
content: ''; |
| 25 |
} |
| 26 |
|
| 27 |
/* Customize the .notice-dismiss button */ |
| 28 |
.jetpack-deprecate-dismissible .notice-dismiss { |
| 29 |
position: absolute; |
| 30 |
width: 24px; |
| 31 |
height: 24px; |
| 32 |
top: 24px; |
| 33 |
right:12px; |
| 34 |
} |
| 35 |
|
| 36 |
.jetpack-deprecate-dismissible .notice-dismiss::after { |
| 37 |
background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="24" height="24"><path fill="%23555" d="M12 10.586L6.343 4.93 4.93 6.343 10.586 12l-5.657 5.657 1.414 1.414L12 13.414l5.657 5.657 1.414-1.414L13.414 12l5.657-5.657-1.414-1.414L12 10.586z"/></svg>'); /* Inline SVG as background image */ |
| 38 |
background-repeat: no-repeat; |
| 39 |
background-size: contain; |
| 40 |
content: ''; |
| 41 |
display: block; |
| 42 |
position: absolute; |
| 43 |
top: 6px; |
| 44 |
left: 6px; |
| 45 |
width: 20px; |
| 46 |
height: 20px; |
| 47 |
transform: translate(-50%, -50%); |
| 48 |
} |
| 49 |
|
| 50 |
/* Customize the styling of content within the notice container */ |
| 51 |
.jetpack-deprecation-notice-container { |
| 52 |
align-items: flex-start; |
| 53 |
display: flex; |
| 54 |
padding-bottom: 24px; |
| 55 |
padding-left: 12px; |
| 56 |
padding-top: 14px; |
| 57 |
} |
| 58 |
|
| 59 |
.jetpack-deprecation-notice-svg { |
| 60 |
margin-right: 10px; |
| 61 |
padding-top:10px; |
| 62 |
} |
| 63 |
|
| 64 |
.jetpack-deprecation-notice-icon { |
| 65 |
margin-right: 10px; |
| 66 |
} |
| 67 |
|
| 68 |
.jetpack-deprecation-notice-text { |
| 69 |
display: block; |
| 70 |
} |
| 71 |
|
| 72 |
.jetpack-deprecation-notice-title { |
| 73 |
font-weight: 600; |
| 74 |
} |
| 75 |
|
| 76 |
.jetpack-deprecation-notice-link { |
| 77 |
font-weight: 600; |
| 78 |
color: #000000; |
| 79 |
} |
| 80 |
|
| 81 |
`; |
| 82 |
|
| 83 |
// Append the style element to the document's head |
| 84 |
document.head.appendChild( styleSheet ); |
| 85 |
} ); |
| 86 |
|
