html: Inline css animation #182

YuriGor · 2018-10-18T21:23:31Z

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 · 2018-10-18T22:27:50Z

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

YuriGor · 2018-10-19T17:25:00Z

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

borela added the bug label Oct 18, 2018

YuriGor closed this as completed Oct 19, 2018

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

html: Inline css animation #182

html: Inline css animation #182

YuriGor commented Oct 18, 2018

borela commented Oct 18, 2018 •

edited

Loading

YuriGor commented Oct 19, 2018

html: Inline css animation #182

html: Inline css animation #182

Comments

YuriGor commented Oct 18, 2018

borela commented Oct 18, 2018 • edited Loading

YuriGor commented Oct 19, 2018

borela commented Oct 18, 2018 •

edited

Loading