html: Inline css animation

YuriGor commented 5 years ago

keyframes and piece of css below remains uncolored:

<html>
<head>
  <style type="text/css">
    @-moz-keyframes blinkframes {
      0% {
        opacity: 1;
      }
      50% {
        opacity: 0.5;
      }
      100% {
        opacity: 1;
      }
    }
    @-webkit-keyframes blinkframes {
      0% {
        opacity: 1;
      }
      50% {
        opacity: 0.5;
      }
      100% {
        opacity: 1;
      }
    }
    @keyframes blinkframes {
      0% {
        opacity: 1;
      }
      50% {
        opacity: 0.5;
      }
      100% {
        opacity: 1;
      }
    }
    .blink {
      -moz-animation: blinkframes 1s linear 0s infinite alternate;
      -webkit-animation: blinkframes 1s linear 0s infinite alternate;
      animation: blinkframes 1s linear 0s infinite alternate;
    }
    html{
      height: 100vh;
      position: fixed;
      overflow: hidden;
      margin: 0;
      padding: 0;
      border: 0 none;
      width: 100%;
    }
    body {
      min-height: 100vh;
      overflow: visible;
      margin: 0;
      padding: 0;
      border: 0 none;
      position: static;
      color: #000;
      font-size: 12px;
      font-family: tahoma, arial, verdana, sans-serif;
    }
    #loading-screen {
      position: absolute;
      left:0;
      right:0;
      top:0;
      bottom:0;
      z-index: 20000;
    }
    #loading-screen-left {
      position: absolute;
      left:0;
      top:0;
      bottom:0;
      width: 320px;
      background: #f0f0f0;
    }
    .start-left-bottom-logo{
      position:absolute;
      bottom:5px;
      text-align:center;
      width:100%;
      overflow: visible;
      font-weight: normal;
      font-family: tahoma, arial, verdana, sans-serif;
      font-size: 11px;
    }
    .start-left-bottom-logo img{
      height:50px;
      position: relative;
      left:-15px;
    }

    .login-pad {
      background-color: #4F81BD;
      background-image: url('themes/css/img/login-bg.png');
      background-repeat: no-repeat;
      background-position: bottom right;
      background-size: 500px;
    }

  </style>
</head>
<body>
</body>
</html>

Native HTML syntax fails too.

borela commented 5 years ago

Vendor prefixes were missing, fixed in https://github.com/borela/naomi/releases/tag/v4.2.9

YuriGor commented 5 years ago

Thank you! Looks like sublime updated Naomi from github by himself, now this case work correctly without any git pull

borela / naomi

html: Inline css animation #182