diff --git a/modules/wri_admin/templates/ckeditor5_template.json b/modules/wri_admin/templates/ckeditor5_template.json index b413f30ee..a129d913b 100644 --- a/modules/wri_admin/templates/ckeditor5_template.json +++ b/modules/wri_admin/templates/ckeditor5_template.json @@ -28,5 +28,11 @@ "icon": "", "description": "", "html": "
" + }, + { + "title": "Podcast: Listen On...", + "icon": "", + "description": "", + "html": "
Or listen on:
" } ] diff --git a/themes/custom/ts_wrin/sass/ckeditor.scss b/themes/custom/ts_wrin/sass/ckeditor.scss index d16c2f1c9..3884b1856 100644 --- a/themes/custom/ts_wrin/sass/ckeditor.scss +++ b/themes/custom/ts_wrin/sass/ckeditor.scss @@ -40,4 +40,54 @@ -webkit-font-smoothing: antialiased; color: $black; } + + // Podcast icons. + .icons-container { + display: flex; + flex-wrap: wrap; + } + .icons-container > .icons-div { + margin: 10px; + padding: 12px; + border: 1px solid #000; + width: 155px; + height: 25px; + } + .icons-container > .icons-div:hover { + background-color: #fafafa !important; + } + .icons-container > .icons-div img { + vertical-align: middle; + } + .icons-container a { + text-decoration: none; + align-items: center; + color: #000; + } + .apple-podcasts-button { + background-image: url('https://files.wri.org/d8/s3fs-public/2024-07/apple-podcasts-icon.png'); + } + .youtube-podcasts-button { + background-image: url('https://files.wri.org/d8/s3fs-public/2024-07/youtube-icon.png'); + } + .spotify-podcasts-button { + background-image: url('https://files.wri.org/d8/s3fs-public/2024-07/spotify-icon.png'); + } + .icons-div { + background-position: 10px 50%; + background-repeat: no-repeat; + background-size: 30px auto; + } + .podcast-social-icon { + margin-left: 40px; + font-size: 1rem; + } + + .icons-container div a { + text-decoration: none !important; + } + + .icons-div a { + display: block; + } }