Browse Source

Added fade-in on load

main
Anxhelo Lushka 6 years ago
parent
commit
8cc05b30b3
No known key found for this signature in database GPG Key ID: 1FDB240321304A01
  1. 2
      _layouts/default.html
  2. 38
      _sass/_layout.scss

2
_layouts/default.html

@ -1,7 +1,7 @@
<!DOCTYPE html> <!DOCTYPE html>
<html> <html>
{% include head.html %} {% include head.html %}
<body> <body class="fade-in">
{% include header.html %} {% include header.html %}
<div class="page-content"> <div class="page-content">
<div class="wrapper"> <div class="wrapper">

38
_sass/_layout.scss

@ -398,3 +398,41 @@ input[type=text], input[type=textarea], input[type=number] {
border: 2px solid #D8D8D8; border: 2px solid #D8D8D8;
border-radius: 4px; border-radius: 4px;
} }
.fade-in {
-webkit-animation: fadein 2s; /* Safari, Chrome and Opera > 12.1 */
-moz-animation: fadein 2s; /* Firefox < 16 */
-ms-animation: fadein 2s; /* Internet Explorer */
-o-animation: fadein 2s; /* Opera < 12.1 */
animation: fadein 2s;
}
@keyframes fadein {
from { opacity: 0; }
to { opacity: 1; }
}
/* Firefox < 16 */
@-moz-keyframes fadein {
from { opacity: 0; }
to { opacity: 1; }
}
/* Safari, Chrome and Opera > 12.1 */
@-webkit-keyframes fadein {
from { opacity: 0; }
to { opacity: 1; }
}
/* Internet Explorer */
@-ms-keyframes fadein {
from { opacity: 0; }
to { opacity: 1; }
}
/* Opera < 12.1 */
@-o-keyframes fadein {
from { opacity: 0; }
to { opacity: 1; }
}
Loading…
Cancel
Save