florida

Dependencies

https://github.com/busyloop/lolcat

florida

<div class="image-container" data-large="https://assets.imgix.net/unsplash/bear.jpg?w=1000">
  <img class="placeholder" src="https://assets.imgix.net/unsplash/bear.jpg?w=50" class="img-small">
</div>

florida

.image-container {
  position: relative;
  overflow: hidden;
}

.placeholder {
  position: relative;
  width: 100%;
  filter: blur(10px);
  transform: scale(1);

florida

window.onload = function() {
  var largePicture = document.querySelector('.image-container')
  
  // Load large image
  var imgLarge = new Image();
  imgLarge.src = largePicture.dataset.large; 
  imgLarge.onload = function () {
    imgLarge.classList.add('loaded');  
  };
    imgLarge.classList.add('picture');

florida

"editor.tokenColorCustomizations": {
  "textMateRules": [
    {
      "name": "Comment",
      "scope": [
        "comment",
        "punctuation.definition.comment"
      ],
      "settings": {
        "fontStyle": "italic",