We stand with Ukraine
- Written by Jelmer Prins on Saturday 5 March 2022 with the tags ukraine.
- Be the first to comment
My heart is breaking for the people in Ukraine, I've had the privilege of visiting the beautiful city L'viv twice a couple of years ago. I also have friends in Ukraine. Seeing how Putin is invading Ukraine under false pretenses hurts. But it hurts even more for the people that I know in Ukraine or that have families there.
I know there is a limit to what I can do to help my friends, but one of the things I can do is to try to encourage people to show their support for them as well. We've added a ribbon to our main website, demo, and docs website based on the code found at https://github.com/virae/we-stand-with-ukraine
<script>
var SWU__currentScript = document.currentScript || {};
var SWU__DOMReady = function(callback) {
document.readyState === 'interactive' || document.readyState === 'complete' ? callback() : document.addEventListener('DOMContentLoaded', callback);
};
SWU__DOMReady(function() {
const el = document.createElement('div');
// Options
const url = SWU__currentScript.getAttribute('url');
const title = SWU__currentScript.getAttribute('title');
const position = SWU__currentScript.getAttribute('position');
// Set custom title
el.title = title || 'We stand with Ukraine';
// Set custom URL
if (url) {
el.style.cursor = 'pointer'
el.target = '_blank'
el.addEventListener('click', function() {
window.open(url, '_blank')
})
}
// Set custom position (left, right)
if (position === 'right') {
el.style.right = '-80px'
el.style.bottom = '20px'
el.style.transform = 'rotate(135deg)'
el.style.background = 'linear-gradient(-360deg, #005BBB 50%, #FFD500 50%)'
} else {
el.style.left = '-80px'
el.style.bottom = '20px'
el.style.transform = 'rotate(45deg)'
el.style.background = 'linear-gradient(-180deg, #005BBB 50%, #FFD500 50%)'
}
el.style.width = '300px'
el.style.height = '84px'
el.style.position = 'fixed';
el.style.zIndex = '999';
el.setAttribute('id', 'we-stand-with-ukraine')
document.body.appendChild(el);
});
</script>
If you want to add this to your site as well you can easily add the snippet to the end of body scripts setting in the backend
Slava Ukraini